@import url(reset.css);
body{
background-color:#121212;
}
/* ---- */
#wrapper{
width:940px;
margin:0 auto;
background-color:#ffffff;
}
/* ---- */

/*- topline-*/
#tpoline{
width:940px;
height:10px;
background-image:url(../images/topline.png);
background-repeat:repeat-x;
}
/*-!topline!-*/

/*- header- */
#header{
width:940px;
height:140px;
margin:0 auto;
position:relative;
}
#logo{
width:367px;
height:99px;
outline:0px solid #0000FF;
background-image:url(../images/logo.png);
background-repeat:no-repeat;
position:absolute;
top:20px;
left:10px;
}
#logo a{
display:block;
height:99px;
cursor:pointer;
}
#nav{
width:430px;
height:40px;
position:absolute;
top:40px;
left:500px;
}
#nav li{
float:left;
margin-right:30px;
}
#nav li a{
text-decoration:none;
font:28px verdana;
color:#474747;
}
#nav li a:hover{
color:#E7BE24;
}
/*-!header!- */

/* slider */
.slides {
    height:445px;
    margin:0 auto;
    overflow:hidden;
    position:relative;
    width:940px;
	outline:0px solid #0000FF;
}
.slides ul {
    list-style:none;
    position:relative;
}

/* Кадры анимации #anim_slides */
@-webkit-keyframes anim_slides {
    0% {
        opacity:0;
    }
    6% {
        opacity:1;
    }
    24% {
        opacity:1;
    }
    30% {
        opacity:0;
    }
    100% {
        opacity:0;
    }
}
@-moz-keyframes anim_slides {
    0% {
        opacity:0;
    }
    6% {
        opacity:1;
    }
    24% {
        opacity:1;
    }
    30% {
        opacity:0;
    }
    100% {
        opacity:0;
    }
}

.slides ul li {
    opacity:0;
    position:absolute;
    top:0;

    /* анимация css3 */
    -webkit-animation-name: anim_slides;
    -webkit-animation-duration: 24.0s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;

    -moz-animation-name: anim_slides;
    -moz-animation-duration: 24.0s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;
}

/* Задержки css3 */
.slides ul  li:nth-child(2), .slides ul  li:nth-child(2) div {
    -webkit-animation-delay: 6.0s;
    -moz-animation-delay: 6.0s;
}
.slides ul  li:nth-child(3), .slides ul  li:nth-child(3) div {
    -webkit-animation-delay: 12.0s;
    -moz-animation-delay: 12.0s;
}
.slides ul  li:nth-child(4), .slides ul  li:nth-child(4) div {
    -webkit-animation-delay: 18.0s;
    -moz-animation-delay: 18.0s;
}
.slides ul li img {
    display:block;
}

/* Кадры анимации #anim_titles */
@-webkit-keyframes anim_titles {
    0% {
        left:100%;
        opacity:0;
    }
    5% {
        left:10%;
        opacity:1;
    }
    20% {
        left:10%;
        opacity:1;
    }
    25% {
        left:100%;
        opacity:0;
    }
    100% {
        left:100%;
        opacity:0;
    }
}
@-moz-keyframes anim_titles {
    0% {
        left:100%;
        opacity:0;
    }
    5% {
        left:10%;
        opacity:1;
    }
    20% {
        left:10%;
        opacity:1;
    }
    25% {
        left:100%;
        opacity:0;
    }
    100% {
        left:100%;
        opacity:0;
    }
}

.slides ul li div {
    background-color:#121212;
    border-radius:10px 10px 10px 10px;
    box-shadow:0 0 5px #FFFFFF inset;
    color:#E8BB17;
    font-size:26px;
    left:10%;
    margin:0 auto;
    padding:20px;
    position:absolute;
    top:50%;
    width:200px;

    /* Анимация css3 */
    -webkit-animation-name: anim_titles;
    -webkit-animation-duration: 24.0s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;

    -moz-animation-name: anim_titles;
    -moz-animation-duration: 24.0s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;
}
/* !slider! */

/* vstavka */
#vst1{
width:940px;
height:64px;
background-color:#474747;
border-top:7px solid #515151;
border-bottom:7px solid #515151;
position:relative;
}
#tel1{
width:340px;
height:64px;
background-image:url(../images/tel1.png);
position:absolute;
top:0;
left:65px;
}
#tel2{
width:340px;
height:64px;
background-image:url(../images/tel2.png);
position:absolute;
top:0;
left:525px;
}
#tel3{
width:100px;
height:64px;
background-image:url(../images/tel3.png);
background-repeat:no-repeat;
position:absolute;
top:0;
left:415px;
}
/* !vstavka! */

/* content */
#content{
width:940px;
height:664px;
background-image:url(../images/pattern.png);
background-repeat:no-repeat;
position:relative;
top:0; 
left:0;
}
#content a {
font:bold 12px tahoma;
color:#121212;
text-decoration:none;
text-align:center;
}

#noutb{
width:215px;
height:210px;
background-image:url(../images/noutb.png);
background-repeat:no-repeat;
position:absolute;
top:10px;
left:15px;
text-align:center;
}

#noutb a img{
border:3px solid #C3C3C3;
}

#noutb a:hover img{
border:3px solid #2370FF;
}

#komp{
width:215px;
height:210px;
background-image:url(../images/komp.png);
background-repeat:no-repeat;
position:absolute;
top:10px;
left:244px;
text-align:center;
}
#komp a img{
border:3px solid #C3C3C3;
}

#komp a:hover img{
border:3px solid #2370FF;
}

#print{
width:215px;
height:210px;
background-image:url(../images/printer.png);
background-repeat:no-repeat;
position:absolute;
top:10px;
left:472px;
text-align:center;
}

#print a img{
border:3px solid #C3C3C3;
}

#print a:hover img{
border:3px solid #2370FF;
}

#ustanovka{
width:215px;
height:210px;
background-image:url(../images/ustanovka.png);
background-repeat:no-repeat;
position:absolute;
top:10px;
left:700px;
text-align:center;
}

#ustanovka a img{
border:3px solid #C3C3C3;
}

#ustanovka a:hover img{
border:3px solid #2370FF;
}

#toner{
width:215px;
height:210px;
background-image:url(../images/toner.png);
background-repeat:no-repeat;
position:absolute;
top:227px;
left:15px;
text-align:center;
}
#toner a img{
border:3px solid #C3C3C3;
}
#toner a:hover img{
border:3px solid #2370FF;
}

#lhp{
width:215px;
height:210px;
background-image:url(../images/toner.png);
background-repeat:no-repeat;
position:absolute;
top:227px;
left:244px;
text-align:center;
}
#lhp a img{
border:3px solid #C3C3C3;
}
#lhp a:hover img{
border:3px solid #2370FF;
}

#lsm{
width:215px;
height:210px;
background-image:url(../images/toner.png);
background-repeat:no-repeat;
position:absolute;
top:227px;
left:472px;
text-align:center;
}
#lsm a img{
border:3px solid #C3C3C3;
}
#lsm a:hover img{
border:3px solid #2370FF;
}

#lxer{
width:215px;
height:210px;
background-image:url(../images/toner.png);
background-repeat:no-repeat;
position:absolute;
top:227px;
left:700px;
text-align:center;
}
#lxer a img{
border:3px solid #C3C3C3;
}
#lxer a:hover img{
border:3px solid #2370FF;
}

#lcn{
width:215px;
height:210px;
background-image:url(../images/toner.png);
background-repeat:no-repeat;
position:absolute;
top:445px;
left:15px;
text-align:center;
}
#lcn a img{
border:3px solid #C3C3C3;
}
#lcn a:hover img{
border:3px solid #2370FF;
}

#lshp{
width:215px;
height:210px;
background-image:url(../images/toner.png);
background-repeat:no-repeat;
position:absolute;
top:445px;
left:244px;
text-align:center;
}
#lshp a img{
border:3px solid #C3C3C3;
}
#lshp a:hover img{
border:3px solid #2370FF;
}

#lscn{
width:215px;
height:210px;
background-image:url(../images/toner.png);
background-repeat:no-repeat;
position:absolute;
top:445px;
left:472px;
text-align:center;
}
#lscn a img{
border:3px solid #C3C3C3;
}
#lscn a:hover img{
border:3px solid #2370FF;
}

#lsep{
width:215px;
height:210px;
background-image:url(../images/toner.png);
background-repeat:no-repeat;
position:absolute;
top:445px;
left:700px;
text-align:center;
}
#lsep a img{
border:3px solid #C3C3C3;
}
#lsep a:hover img{
border:3px solid #2370FF;
}
/* !content! */
/* footer */
#footer{
width:940px;
height:100px;
background-color:#474747;
border-top:7px solid #515151;
border-bottom:7px solid #515151;
position:relative;
}
#copir {
width:170px;
text-align:center;
font:12px verdana;
position:absolute;
top:70px;
left:400px;
}
#kontakt{
width:200px;
text-align:left;
font:12px verdana;
position:absolute;
top:10px;
left:20px;
}
#kontakt li a {
text-decoration:none;
font:12px verdana;
color:#FFA500;
}
#kontakt li a:hover {
color:#FF0000;
}
/* !footer! */
/* uslugi */
.vst2{
width:940px;
height:64px;
background-color:#E8BE1F;
}
.vst {
font: bold 26px arial;
color:#121212;
padding:10px 0 0 30px;
margin:5px 0;
}
.tabl{
width:930px;
margin:5px auto;
}
.tab1{
width:720px;
height:30px;
font:16px verdana;
background-color:#C0C0C0;
border:2px solid #FFFFFF;
padding-left:30px;
padding-top:5px;
}


.tab2{
width:200px;
height:30px;
font:16px verdana;
background-color:#C0C0C0;
border:2px solid #FFFFFF;
padding-left:30px;
padding-top:5px;
}
/* !uslugi! */
/* prais */
#content2{
width:940px;
height:200px;
background-color:#E8BE1F;
position:relative;
margin:5px auto;
padding-top:15px;
}
#prais{
width:192px;
height:171px;
outline:0px solid #0000FF;
background-image:url(../images/prais.png);
background-repeat:no-repeat;
position:absolute;
top:20px;
left:70px;
}
#prais a{
display:block;
height:171px;
cursor:pointer;
}
.prais{
font:bold 18px verdana;
color:#121212;
text-align:right;
padding-right:80px;
}
/* !prais! */


.tab3{
width:80px;
height:30px;
font:16px verdana;
background-color:#C0C0C0;
border:2px solid #FFFFFF;
padding-left:30px;
padding-top:5px;
}

.tab4{
width:605px;
height:30px;
font:16px verdana;
background-color:#C0C0C0;
border:2px solid #FFFFFF;
padding-left:15px;
padding-top:5px;
}



.tab5{
width:140px;
height:30px;
font:16px verdana;
background-color:#C0C0C0;
border:2px solid #FFFFFF;
padding-left:15px;
padding-top:5px;
}
.tabl tr td  p{
font-weight:bold;
color:#2370FF;
}

#kontakti, #svz{
width:940px;
height:454px;
background-color:#E8BE1F;
margin:5px 0;
position:relative;
top:0; 
left:0;
}

#nomer{
width:400px;
height:160px;
position:relative;
top:35px; 
left:25px;
font:bold 18px verdana;
color:#121212;
text-align:left;
}

#nomer li {
text-decoration:none;
font:bold 18px verdana;
color:#121212;
}


#live{
width:50px;
height:50px;
position:relative;
top:32px; 
left:850px;
}

#toTop {     
width:45px; 
height:45px;
padding: 5px;     
position: fixed;     
bottom: 50px;     
right: 160px;     
cursor: pointer;     
color: #666666;     
}

#karta{
width:500px; 
height:380px;
position:absolute;
top:30px;
left:380px;
border:6px solid #FFFFFF;
}

.form{
width:940px;
background-color:#C0C0C0;
border-top:7px solid #FFFFFF;
border-bottom:7px solid #FFFFFF;
position:relative;
font:16px verdana;
}
.form p {
margin-top:20px;
margin-bottom:10px;
text-indent:100px;
font:bold 16px verdana;
}
.form ul li {
margin-left:210px;
list-style-type: disc;
}
.form ol li {
margin-left:210px;
list-style-type: square;
}
.form p a{
text-decoration:none;
}
.form  a:hover {
color:#FF0000;
}

#text p{
width:940px;
background-color:#C0C0C0;
font:16px verdana;
text-align:center;
}
#formsvz{
width:500px; 
height:380px;
position:absolute;
top:30px;
left:380px;
border:6px solid #FFFFFF;
}

 #textsvz{
width:340px;
height:160px;
position:relative;
top:35px; 
left:25px;
font:bold 18px verdana;
color:#121212;
text-align:left;
}

#uslugi{
position:fixed;
width:182px;
height:58px;
top:595px;
right:0;
}