/* CSS Document */
* {margin: 0; padding: 0}
html,body,div,span,applet,object,iframe,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video { border: 0; margin: 0; padding: 0}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display: block}
a {outline: none; text-decoration: none; border-bottom:1px solid #6bacf1; color:#0875e7;}
a:hover {text-decoration: none; border-bottom:0px}
html,textarea { overflow: auto}
input {vertical-align: middle}
input, textarea, select {outline:none; resize: none}
table{ border-collapse: collapse; border-spacing: 0}
img { vertical-align: top; border: none}
/*
*{
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
transition: all 0.3s ease;}
*/
/*****************************************font*****************************************/
@font-face {
font-family: 'circe';
src: url('font/circe.ttf');
}
@font-face {
font-family: 'circe';
src: url('font/circe.eot');
}
@font-face {
font-family: 'nautilus';
src: url('font/nautilus.ttf');
}
@font-face {
font-family: 'nautilus';
src: url('font/nautilus.eot');
}
@font-face {
font-family: 'ptsans';
src: url('font/ptsans.ttf');
}
@font-face {
font-family: 'ptsans';
src: url('font/ptsans.eot');
}
@font-face {
font-family: 'ptsans_bold';
src: url('font/ptsans_bold.ttf');
}
@font-face {
font-family: 'ptsans_bold';
src: url('font/ptsans_bold.eot');
}
/*****************************************font*****************************************/
html, body {
height: 100%;
min-height:100%;
font:14px/21px 'ptsans', Arial,Tahoma sans-serif;
color:#000;
}
h1{
font:20px 'circe', Arial,Tahoma sans-serif;
color:#000;
text-transform:uppercase;
letter-spacing: 0.5px;
font-weight:bold;
}
p{
font:14px/22px 'ptsans', Arial,Tahoma sans-serif;
color:#797b7b;
}
.clear{clear:both;height:0px;}
#content{
width:100%;
background:#fff;
min-height:100%;
overflow:hidden;
}
a.button{
display:block;
height:34px;
border-radius:2px;
background:#0875e7;
width:125px;
font:12px 'circe', Arial,Tahoma sans-serif;
color:#fff;
text-transform:uppercase;
text-align:center;
line-height:36px;
text-decoration:none;
border-bottom:0px;
}
a.button:hover{
background:#076ddb;
}
a.button.w150{
width:150px;
}
a.button.bord{
border:1px solid #f3f3f3;
background:none;
height:32px;
}
h2{
margin: 0 0 70px 0;
font:24px 'circe', Arial,Tahoma sans-serif;
text-align:center;
text-transform:uppercase;
color:#000;
z-index:100;
position:relative;
}
.line{
width:100%;
height:1px;
background:url(img/line_white.jpg) no-repeat center center #b2b2b2;
position:relative;
top:15px;
}
.line.bottom{
top:-20px;
}
.next{
position:relative;
z-index:100;
width:268px;
height:40px;
background:#e8f4ff;
color:#000;
line-height:40px;
text-align:center;
}
.next a{
position:relative;
z-index:101;
font:12px 'circe', Arial,Tahoma sans-serif;
color:#000;
text-transform:uppercase;
border-bottom:1px dashed #000;
}
.next a:hover{
border-bottom:0px dashed #000;
}
/*********************** START ******************************************/
#head{
background:#fff;
width:100%;
max-width:960px;
margin:0 auto;
height:120px;
}
#head .logo_text{
width:388px;
float:left;
padding:34px 0 0 10px;
}
#head .logo_text p{
line-height:14px;
}
#head .mail_skype{
width:148px;
float:left;
padding:36px 0 0 10px;
}
#head .phone{
width:214px;
float:left;
border:0px solid #d9dbdc;
font:23px 'circe', Arial,Tahoma sans-serif;
padding:44px 0 0 24px;
}
#head .call{
width:148px;
float:left;
padding:44px 0 0 5px;
}
/*****************************************************************/
/*****************************************************************/
#slider{
width:100%;
margin:0 auto;
height:518px;
background:url(img/slider_960.jpg) no-repeat center center #000;
overflow:hidden;
}
#slider .text_slider{
width:550px;
margin:0 auto;
padding:140px 0 0 410px;
overflow:hidden;
}
#slider .text_slider p{color:#f3f3f3;}
#slider .text_slider .h_1{
font:36px 'circe', Arial,Tahoma sans-serif;
}
#slider .text_slider .h_2{
font:30px 'circe', Arial,Tahoma sans-serif;
line-height:18px;
}
#slider .text_slider .h_3{
font:43px 'nautilus', Arial,Tahoma sans-serif;
line-height:26px;
margin:44px 0 18px -18px;
}
#slider .text_slider .h_3 span{
font:20px 'circe', Arial,Tahoma sans-serif;
}
#slider .text_slider .h_4{
font:50px 'circe', Arial,Tahoma sans-serif;
float:left;
}
#slider .text_slider .h_4 span{
font:24px 'circe', Arial,Tahoma sans-serif;
}
#slider .text_slider .slider_button{
float:left;
margin: 18px 0 0 20px;
}
#slider .text_slider .slider_button a{
float:left;
margin: 0 10px 0 0;
}
/*****************************************************************/
/*****************************************************************/
.plus_block{
width:960px;
margin:120px auto;
overflow:hidden;
}
.plus_block h2 span{
color:#0875e7;
}
.plus_block .plus{
width:300px;
margin:0 10px;
float:left;
text-align:center;
}
.plus_block .plus img{
width:80px;
margin:0 auto;
}
.plus_block .plus h3{
font:22px 'circe', Arial,Tahoma sans-serif;
margin: 30px 0 10px 0;
}
/*****************************************************************/
/*****************************************************************/
#catalog{
width:960px;
margin:0 auto 0 auto;
overflow:hidden;
}
#catalog .catalog_item{
width:390px;
float:left;
margin:0 45px 60px 45px;
}
#catalog .catalog_item img{
width:389px;
margin-bottom:15px;
}
#catalog .catalog_item .catalog_item_top{
width:235px;
float:left;
}
#catalog .catalog_item .catalog_item_top h3{
font:22px 'circe', Arial,Tahoma sans-serif;
}
#catalog .catalog_item .catalog_item_top h3 span{
font:22px 'nautilus', Arial,Tahoma sans-serif;
}
#catalog .catalog_item .catalog_item_top p{
line-height:18px;
}
#catalog .catalog_item .price{
text-align:right;
float:right;
width:155px;
font:30px/30px 'circe', Arial,Tahoma sans-serif;
margin-bottom:4px;
}
#catalog .catalog_item .button{
float:right;
}
#catalog .next{
margin:40px auto 0 auto;
}
#catalog #big{
display:block;
}
#catalog #small{
display:none;
}
/*****************************************************************/
/*****************************************************************/
.arrow_work{
width:100%;
height:78px;
background:url(img/arrow_work.jpg) no-repeat center center;
}
/*****************************************************************/
/*****************************************************************/
#comment{
width:960px;
margin:0 auto 120px auto;
overflow:hidden;
}
#comment .comment_item{
width:930px;
margin:0 auto;
overflow:hidden;
}
#comment .comment_item img{
float:left;
}
#comment .comment_item .fio{
float:left;
width:160px;
height:139px;
background:#e0f0ff;
padding:44px 0 0 50px;
}
#comment .comment_item .fio h3{
font:20px/26px 'circe', Arial,Tahoma sans-serif;
margin-bottom:5px;
}
#comment .comment_item .fio p{
font:14px Georgia, "Times New Roman", Times, serif;
font-style:italic;
color:#777777;
}
#comment .comment_item .text{
float:left;
width:368px;
height:139px;
background:#eaf5ff;
padding:44px 60px 0 42px;
}
#comment .comment_item .text p{
font:14px/22px Georgia, "Times New Roman", Times, serif;
font-style:italic;
color:#000;
}
#comment .comment_item .kv{
width:100%;
height:17px;
background:url(img/kv.png) no-repeat;
z-index:100;
position:relative;
top:150px;
left:444px;
}
/**/
#comment .comment_item:nth-child(3n) .fio{
background:#f4f6f9;
}
#comment .comment_item:nth-child(3n) .text{
background:#f9fcff;
}
#comment .next{
margin:50px auto 0 auto;
}
/*****************************************************************/
/*****************************************************************/
#form{
width:100%;
margin:0 auto 80px 0;
height:630px;
background:url(img/form_960.jpg) no-repeat center center #000;
overflow:hidden;
}
#form h2{
margin: 70px 0 40px 0;
color:#fff;
}
#form .input_form{
width:640px;
margin:0 auto;
overflow:hidden;
}
#form .input_form .form_item{
float:left;
width:298px;
margin:0 10px 0 10px;
}
#form .input_form .form_item.small{
width:192px;
}
#form .input_form .form_item.small input{
width:182px;
}
#form .input_form .form_item p{
color:#fff;
padding-left:10px;
font:14px/14px 'ptsans', Arial,Tahoma sans-serif;
}
#form .input_form .form_item input{
border:2px solid #fff;
height:36px;
width:288px;
color:#b6b6b6;
font:14px/36px 'ptsans', Arial,Tahoma sans-serif;
margin:15px 0 30px 0;
padding-left:10px;
}
#form .input_form .form_item textarea{
height:80px;
width:610px;
color:#b6b6b6;
font:14px/36px 'ptsans', Arial,Tahoma sans-serif;
margin:15px 0 30px 0;
padding-left:10px;
border:none;
}
#form .input_form .form_item input.blue{
border:2px solid #3dafff;
`}
#form .input_form .button{
margin:20px auto 0 auto;
height:40px;
width:160px;
font-size:16px;
line-height:44px;
}
/*****************************************************************/
/*****************************************************************/
#contact{
width:100%;
margin:0 auto 60px 0;
overflow:hidden;
text-align:center;
}
#contact p{
color:#000;
}
#contact p.h_2{
font:24px 'circe', Arial,Tahoma sans-serif;
text-transform:uppercase;
}
#contact p.h_1{
font:65px 'circe', Arial,Tahoma sans-serif;
}
#contact p.h_3 a{
font:18px 'ptsans', Arial,Tahoma sans-serif;
color:#0072ff;
}
#contact img{
margin:50px auto 0 auto;
}
/*****************************************************************/
/**************************************************/
/*************** 768 640 ******************/
/**************************************************/
@media screen and (max-width:965px){
/*****************************/
#head{
height:160px;
}
#head .logo_text{
float:none;
width:100%;
text-align:center;
padding:20px 0 0 0;
}
#head .header_right{
float:none;
margin:0 auto;
width:640px;
overflow:hidden;
background:url(img/line_silver.jpg) repeat-x;
background-position:0px 20px;
}
#head .mail_skype{
width:140px;
padding:36px 0 0 20px;
}
#head .phone{
width:320px;
text-align:center;
padding:44px 0 0 0;
}
#head .call{
width:160px;
padding:44px 0 0 0;
}
/*****************************/
/*****************************/
#slider{
height:480px;
background:url(img/slider_768.jpg) no-repeat center center #000;
}
#slider .text_slider{
width:390px;
padding:100px 0 0 250px;
}
#slider .text_slider p{color:#f3f3f3;}
#slider .text_slider .h_1{
font-size:30px;
}
#slider .text_slider .h_2{
font-size:24px;
line-height:36px;
}
#slider .text_slider .h_3{
font-size:36px;
line-height:26px;
margin:24px 0 10px -18px;
}
#slider .text_slider .h_3 span{
font-size:18px;
}
#slider .text_slider .h_4{
font-size:36px;
}
#slider .text_slider .h_4 span{
font-size:18px;
}
#slider .text_slider .slider_button{
margin: 18px 0 0 0;
}
#slider .text_slider .slider_button a{
margin: 0 10px 0 0;
}
/*****************************************************************/
/*****************************************************************/
.plus_block{
width:640px;
margin:100px auto;
}
.plus_block h2{
margin: 0 0 60px 0;
}
.plus_block .plus{
width:460px;
margin:0 auto;
float:none;
text-align:left;
overflow:hidden;
}
.plus_block .plus img{
margin:0 50px 0 30px;
float:left;
}
.plus_block .plus .plus_in{
float:left;
width:300px;
min-height:80px;
margin-bottom:60px;
}
.plus_block .plus:nth-child(4n) .plus_in{
margin-bottom:0;
}
.plus_block .plus h3{
margin: 0;
}
/*****************************************************************/
/*****************************************************************/
#catalog{
width:640px;
margin:0 auto 0 auto;
}
#catalog h2{
margin: 0 0 60px 0;
}
#catalog .catalog_item{
width:280px;
margin:0 20px 40px 20px;
}
#catalog .catalog_item img{
width:280px;
margin-bottom:10px;
}
#catalog .catalog_item .catalog_item_top{
width:260px;
float:none;
padding:0 10px 10px 10px;
margin:0 0 10px 0;
background:url(img/line_silver.jpg) repeat-x;
background-position:bottom center;
}
#catalog .catalog_item .price{
text-align:left;
float:left;
font:30px/40px 'circe', Arial,Tahoma sans-serif;
margin-left:10px;
width:135px;
}
#catalog .catalog_item .button{;
margin-right:10px;
}
#catalog .next{
margin:20px auto 0 auto;
}
#catalog #big{
display:block;
}
#catalog #small{
display:none;
}
/*****************************************************************/
/*****************************************************************/
.arrow_work{
display:none;
}
/*****************************************************************/
/*****************************************************************/
#comment{
width:640px;
margin:0 auto 100px auto;
overflow:hidden;
}
#comment h2{
margin: 0 0 60px 0;
}
#comment .comment_item{
width:620px;
margin:0 auto;
overflow:hidden;
}
#comment .comment_item img{
float:left;
}
#comment .comment_item .fio{
float:left;
width:310px;
height:20px;
background:#eaf5ff;
padding:25px 25px 10px 40px;
}
#comment .comment_item .fio h3{
font:20px/20px 'circe', Arial,Tahoma sans-serif;
margin:0px;
}
#comment .comment_item .fio p{
display:none;
}
#comment .comment_item .text{
float:left;
width:310px;
height:128px;
background:#eaf5ff;
padding:0px 25px 0 40px;
}
#comment .comment_item .text p{
font:14px/20px Georgia, "Times New Roman", Times, serif;
font-style:italic;
color:#000;
}
#comment .comment_item .kv{
display:none;
}
/**/
#comment .comment_item:nth-child(3n) .fio{
background:#f9fcff;
}
#comment .comment_item:nth-child(3n) .text{
background:#f9fcff;
}
#comment .next{
margin:40px auto 0 auto;
}
/*****************************************************************/
/*****************************************************************/
#form{
margin:0 auto 60px 0;
height:620px;
background:url(img/form_768.jpg) no-repeat center center #000;
}
#form h2{
margin: 60px 0 40px 0;
}
/*****************************************************************/
}
@media screen and (max-width:767px){}
/**************************************************/
/*************** 480 320 ******************/
/**************************************************/
@media screen and (max-width:639px){
/*****************************/
#head{
height:180px;
}
#head .logo_text{
width:320px;
margin:0 auto;
text-align:center;
padding:10px 0 0 0;
}
#head .header_right{
float:none;
margin:0 auto;
width:320px;
overflow:hidden;
background:url(img/line_silver.jpg) repeat-x;
background-position:0px 18px;
}
#head .mail_skype{
display:none;
}
#head .phone{
float:none;
width:320px;
margin:0 auto;
text-align:center;
padding:28px 0 0 0;
}
#head .call{
float:none;
width:150px;
margin:0 auto;
padding:10px 0 0 0;
position:relative;
z-index:100;
}
/*****************************/
/*****************************/
#slider{
height:420px;
background:url(img/slider_480.jpg) no-repeat center center #000;
margin-top:-40px;
}
#slider .text_slider{
width:320px;
padding:50px 0 0 0;
}
#slider .text_slider p{color:#f3f3f3;text-align:center;}
#slider .text_slider .h_1{
font-size:30px;
line-height:38px;
}
#slider .text_slider .h_2{
font-size:20px;
line-height:32px;
}
#slider .text_slider .h_3{
font-size:36px;
line-height:26px;
margin:24px auto 14px auto;
width:190px;
}
#slider .text_slider .h_3 span{
font-size:14px;
}
#slider .text_slider .h_4{
font-size:36px;
margin: 0 auto;
width:190px;
float:none;
}
#slider .text_slider .h_4 span{
font-size:18px;
}
#slider .text_slider .slider_button{
margin:10px auto 0 auto;
float:none;
width:262px;
overflow:hidden;
}
#slider .text_slider .slider_button a{
margin:0;
}
#slider .text_slider .slider_button a.bord{
margin:0 0 0 10px;
}
/*****************************************************************/
/*****************************************************************/
.plus_block{
width:320px;
margin:80px auto 80px auto;
}
.plus_block h2{
margin: 0 0 40px 0;
}
.plus_block .plus{
width:320px;
}
.plus_block .plus img{
width:60px;
margin:0 20px 0 10px;
float:left;
}
.plus_block .plus .plus_in{
float:left;
width:230px;
min-height:80px;
margin-bottom:40px;
}
/*****************************************************************/
/*****************************************************************/
#catalog{
width:320px;
margin:0 auto 0 auto;
}
#catalog h2{
margin: 0 0 40px 0;
}
#catalog #big{
display:none;
}
#catalog #small{
display:block;
}
/*****************************************************************/
/*****************************************************************/
#comment{
width:320px;
margin:0 auto 80px auto;
}
#comment h2{
margin: 0 0 40px 0;
}
#comment .comment_item{
width:320px;
}
#comment .comment_item img{
display:none;
}
#comment .comment_item .fio{
float:left;
width:260px;
height:20px;
padding:30px 30px 10px 30px;
}
#comment .comment_item .fio h3{
font:18px/18px 'circe', Arial,Tahoma sans-serif;
}
#comment .comment_item .text{
float:left;
width:260px;
height:150px;
background:#eaf5ff;
padding:0px 30px 0 30px;
}
#comment .comment_item .text p{
font:14px/18px Georgia, "Times New Roman", Times, serif;
font-style:italic;
color:#000;
}
#comment .next{
margin:40px auto 0 auto;
}
/*****************************************************************/
/*****************************************************************/
#form{
margin:0 auto 40px 0;
height:880px;
background:url(img/form_480.jpg) no-repeat top center #000;
}
#form h2{
margin: 40px 0 40px 0;
}
#form .input_form{
width:320px;
}
#form .input_form .form_item{
float:left;
width:300px;
margin:0 10px 0 10px;
}
#form .input_form .form_item.small{
width:300px;
}
#form .input_form .form_item.small input{
width:286px;
}
#form .input_form .form_item input{
width:286px;
}
#form .input_form .form_item textarea{
width:290px;
}
/*****************************************************************/
/*****************************************************************/
#contact p.h_2{
font:18px 'circe', Arial,Tahoma sans-serif;
}
#contact p.h_1{
font:36px 'circe', Arial,Tahoma sans-serif;
}
#contact p.h_3 a{
font:14px 'ptsans', Arial,Tahoma sans-serif;
}
/*****************************************************************/
}
@media screen and (max-width:479px){}