
/* defaul style ======================*/
* {margin:0;padding:0;outline:none;}
html, body {font-size: 100%; margin:0; padding:0; width:100%;height:100%;}
a,img,div{display:block;}
ul{list-style:none;}
a{text-decoration:none;}
span,a,b,p,ul li,input,textarea{-webkit-font-smoothing: antialiased;font-weight:normal;}
textarea {resize: none;}
.noselect {-webkit-touch-callout: none;}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder, input::-moz-placeholder, textarea::-moz-placeholder {opacity:1;}
input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder {opacity:0!important;}
input:focus::-moz-placeholder, textarea:focus::-moz-placeholder {opacity:0!important;}
.white{color:#fff!important;}
.black{color:#000!important;}
.screen{display:block;width:100%;height:auto;position:relative;}
.wrapp{display:block;width:100%;max-width:1200px;margin:0 auto;text-align:center;}
.wrapper.fix-site {position:fixed;width:100%;}
.wrapper{height:100%;}
.popups_overflow{display:inline-block;width:100%;height:100%;position:fixed;overflow:hidden;}


/*================================================== Мобильная навигация =====================================================*/
.navigation{
	position:fixed;
	-webkit-backface-visibility: hidden;
	width:100%;
	height:auto;
	left:0px;top:-200px;
	background-color:#333333;
	z-index:15;
	text-align:center;
	padding:10px 0px 20px 0px;
}
.navigation.active{
	top:50px;
}
.navigation a{
	font-family: 'sfui_regular';
	font-size:13px;
	line-height:50px;
	text-decoration:underline;
	cursor:pointer;
	opacity:0.9;
	color:#fff;
}
.navigation a.back_tomain{
	color:#00c0ff;
}
.navigation a:hover{opacity:1;}
/*================================================== header =====================================================*/

#header{
	position:fixed;/*=========================defoult*/
	top:0px;/*================================defoult*/
	-webkit-backface-visibility: hidden;/*====defoult*/
	z-index:16;/*=============================defoult*/
	height:50px;
	color:#fff;	
	background-color:#333333;
}
#header .wrapp{height:94%;max-width:94%;position:relative;}
#footer_calback_box,#calback_box{
	display:inline-block;/*===defoult*/
	float:right;/*============defoult*/
	width:280px;
	height:30px;
	margin-top:10px;		
	text-align:right;
	margin-right:10px;
}
#footer_calback_box div,#calback_box div{
	width:50%;
	height:100%;
	float:left;
	text-align:right;
}
#footer_calback_box a,#calback_box a{
	font-family: 'sfui_light';
	font-size:15px;
	line-height:17px;
	color:#fff;
}
#footer_calback_box p,#calback_box p{
	font-family: 'sfui_regular';
	font-size:10px;
	line-height:12px;
	opacity:0.9;
}
#footer_calback_box span,#calback_box span{
	font-family: 'sfui_regular';
	font-size:13px;
	line-height:30px;
	text-decoration:underline;
	cursor:pointer;
	opacity:0.9;
}
#footer_calback_box span:hover,#calback_box span:hover{opacity:1;}
.logo{
	float:left;/*defoult*/
	display:block;
	position:relative;
	left:10px;top:50%;
	-webkit-transform: translate(-0%, -50%); 
	transform: translate(-0%, -50%);
}
#header_center{
	display:inline-block;
	width:560px;
	height:30px;
	margin-top:10px;
	text-align:left;
	position:absolute;
	left:50%;
	-webkit-transform: translate(-50%, 0%); 
	transform: translate(-50%, 0%);	
}
#header_center img{float:left;}
#header_center span{
	display:inline-block;
	float:left;
	font-family: 'sfui_regular';
	font-size:12px;
	line-height:15px;
	opacity:0.9;
	margin-left:10px;
}

#header_center a{
	color:#fff;
	font-family: 'sfui_regular';
	font-size:13px;
	line-height:30px;
	text-decoration:underline;
	cursor:pointer;
    float: left;
    margin-left: 30px;
	opacity:0.9;
}
#header_center a:hover{opacity:1;}

#header_center a.back_tomain{
	float:right;
	border:2px solid #00c0ff;
	color:#00c0ff;
	border-radius:10px;
	padding:8px 12px;
	font-size:12px;
	line-height:12px;
	text-decoration:none;
	margin-left:0px;
}

/*для мобильных*/
.nav_btn_mobil{
	display:none;
	width:26px;
	height:26px;
	position:relative;
	float:right;
	right:0px;
	top:50%;
	-webkit-transform: translate(0%, -50%); 
	transform: translate(0%, -50%);	
	cursor:pointer;
}
#nbm_1{
	position:relative;
	top:0px;
	width:26px;
	height:2px;
	background-color:#fff;
	margin-bottom:5px;
	-webkit-transform: rotate(0deg); 
	transform: rotate(0deg);
	float:right;
	margin-top:4px;
}
#nbm_2{
	width:26px;
	height:2px;
	background-color:#fff;
	margin-bottom:5px;
	float:right;
	opacity:1;
}
#nbm_3{
	position:relative;
	top:0px;	
	width:26px;
	height:2px;
	background-color:#fff;
	-webkit-transform: rotate(0deg); 
	transform: rotate(0deg);
	float:right;	
}
.nav_btn_mobil.active #nbm_1{-webkit-transform: rotate(225deg); transform: rotate(225deg);top:7px;}
.nav_btn_mobil.active #nbm_2{opacity:0;}
.nav_btn_mobil.active #nbm_3{-webkit-transform: rotate(-225deg); transform: rotate(-225deg);top:-7px;}
.adress_mobil{
	line-height:18px!important;
}

/*================================================== КНОПКИ =====================================================*/
.lp_button{
	color:#55d5ff;
	background-color:rgba(0,0,0,0);
	display:inline-block;
	font-family: 'sfui_regular';
	font-size:16px;
	line-height:16px;
	text-align:center;
	padding:18px 28px;
	border-radius:10px;
	border:2px solid #00c0ff;
	cursor:pointer;
}
.lp_button:hover{
	color:#fff;
	background-color:#00c0ff;
}
.lp_button:active{
	background-color:#01ade6;	
}
.lp_button.invers{
	color:#55d5ff;
	background-color:#fff;
	border:2px solid #fff;
}
.lp_button.invers:hover{
	color:#55d5ff;
	background-color:#fff;
	border:2px solid #74ddff;
}
.lp_button.invers:active{
	background-color:#fff;
	border:2px solid #74ddff;	
}

/*=================================================== Экран 1 =======================================================*/

#s1{
	height:100%;
	min-height:800px;
	background:#fff;
	overflow:visible;
}
#s1 .wrapp{height:100%;position:relative;}

#kroshki{
	width:100%;
	height:20px;
	position:absolute;
	z-index:2;
	top:70px;
	left:0px;
	text-align:left;
}
#kroshki ul li{
	display:inline-block;
	font-family: 'sfui_regular';
	font-size:15px;
	line-height:20px;
}

#kroshki ul li span{color:#888888;}
#kroshki ul li a{color:#333333;}
#kroshki ul li a:hover{text-decoration:underline;}

#s1_content{
	width:380px;
	height:300px;
	position:relative;
	float:right;
	top:50%;
	margin-right:50px;
	-webkit-transform: translate(0%, -50%); 
	transform: translate(0%, -50%);	
}
#s1_content h1{
	font-weight:normal;
	font-family: 'sfui_semibold';
	font-size:52px;
	line-height:58px;
	color:#333333;
}
#s1_content p{
	font-family: 'sfui_light';
	display:block;
	margin:16px 0px 24px 0px;
	font-size:32px;
	line-height:42px;
	color:#333333;	
}
/*картинки*/
#s1_images{
	width:670px;
	height:640px;
	position:absolute;
	top:54%;
	left:0px;
	-webkit-transform: translate(0%, -50%); 
	transform: translate(0%, -50%);
    z-index: 3;	
}
.s1_im{
	position:absolute;
	left:0px;
	width:100%;
	height:auto;
}
#s1 .s1_im{
	top:200px;
	opacity:0;
}
#s1.animated .s1_im{
	top:0px;
	opacity:1;
}


/*=================================================== Экран 2 =======================================================*/

#s2,#s6{
	height:130px;
	background:#fff;
}
#s2 .wrapp,#s6 .wrapp{height:100%;position: relative;letter-spacing: -.4em;overflow:hidden;}

.s2_box{
	width:242px;
	height:130px;
	display:inline-block;
	vertical-align:top;
	position:relative;
	text-align:center;
	letter-spacing: normal;
}
.s2_box img{
	display:inline-block;
}
.s2_box p{
	font-family: 'sfui_light';
	font-size:15px;
	line-height:18px;
	color:#6d6d6d;
	padding-top:10px;
}
.stick{
	width:2px;
	height:100%;
	position:absolute;
	right:0px;
	background-color:#e0e0e0;
}
#s2 .stick.top,#s6 .stick.top{top:-100%;}
#s2 .stick.bottom,#s6 .stick.bottom{top:100%;}


/*=================================================== Экран 3 =======================================================*/

#s3{
	display:inline-block;
	height:auto;
	background:#fff;
	padding:60px 0px;
}
#s3 .wrapp{height:100%;}

.title{
	font-family: 'sfui_semibold';
	font-size:40px;
	line-height:44px;
	color:#333333;
}
.podtitle{
	color:#888888;
	font-family: 'sfui_regular';
	font-size:18px;
	line-height:24px;
	display:block;
	margin:20px 0px;
}
/*обёртки для анимации блоков*/
#s3_obertka{
	display:block;
	position:relative;
	overflow:hidden;
	width:100%;
	height:0px;
}
#s3_obertka.active{height:auto;}

.s3_hidden_box{
	width:100%;
	height:auto;
	position:absolute;
	opacity:0;
	top:40px;
	left:0px;
	z-index:1;
}
.s3_hidden_box.active{
	position:relative;
	opacity:1;
	top:0px;
	z-index:2;
	transition: 0.6s ;
	-webkit-transition:0.6s;
	-moz-transition:0.6s ;
	-o-transition:0.6s ;	
}


/*выбор дивайса*/
#select_device{
	width:800px;
	height:350px;
	margin:0 auto;
	margin-top:50px;
}
#select_device .inner{
	width:400px;
	height:350px;
	float:left;
	cursor:pointer;
	position:relative;
}

#select_device .inner img{
	display:inline-block;
	-moz-transform: scale(1);
	-webkit-transform: scale(1);
	-o-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
}
	#select_device .inner img.del_in320{display:inline-block!important;}
	#select_device .inner img.show_in320{display:none!important;}
#select_device .inner span{
	display:block;
	width:100%;
	position:absolute;
	left:0px;
	bottom:10px;
	color:#333333;
	font-size:24px;
	line-height:24px;
	font-family: 'sfui_semibold';
	margin-top:10px;
	
}
#select_device .inner:hover span{
	color:#00c0ff;
}
#select_device .inner:hover img{
	-moz-transform: scale(1.05);
	-webkit-transform: scale(1.05);
	-o-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);	
}

.select_device{display:none;}
.select_device.active{display:block;}


/*меню навигации по дивайсам*/
.s3_menu{
	width:100%;
	height:48px;
	margin-bottom:40px;
	display:none;
}
.s3_menu.active{
	display:block;	
}

.s3_nav{
	font-family: 'sfui_regular';
	display:inline-block;
	vertical-align:top;
	width:102px;
	height:44px;
	border:2px solid #fff;
	border-radius:10px;
	cursor:pointer;
	font-size:16px;
	line-height:44px;
	color:#333333;
	margin:0px 10px;
}
.s3_nav.active{
	color:#00c0ff;
	border:2px solid #00c0ff;
}

/*меню навигации по моделям*/
.s3_navigation{
	display:none;
	width:100%;
	height:auto;
}
.s3_navigation.active{display:inline-block;}

.s3_navigation .inner{
	display:inline-block;
	vertical-align:top;
	cursor:pointer;
	width:90px;
	height:100px;
	position:relative;
}
.s3_navigation .inner p{
	font-family: 'sfui_light';
	color:#505050;
	font-size:12px;
	line-height:14px;
	display:block;
	width:100%;
	position:absolute;
	top:60px;
	left:0px;
}
.s3_navigation .inner img{
	display:inline-block;
	opacity:0.4;
}
.s3_navigation .inner.active img{opacity:1;}
.s3_navigation .inner.active p{color:#00c0ff;}

/*таблицы*/
.table{
	display:none;
	width:100%;
	height:auto;
	position: relative;
	text-align:left;
	letter-spacing: -.4em;	
}
.table.active{display:inline-block;}

.table .inner{
	display:inline-block;
	letter-spacing: normal;
	vertical-align:top;
	width:298px;	
	margin-top:40px;
	text-align:left;
}

.in_1{height:210px;border-right:2px solid #e0e0e0;}
.in_2{height:210px;border-right:2px solid #e0e0e0;}
.in_3{height:210px;border-right:2px solid #e0e0e0;}
.in_4{height:210px;border-right:0px solid #e0e0e0;}
.in_5{height:150px;border-right:2px solid #e0e0e0;}
.in_6{height:150px;border-right:2px solid #e0e0e0;}
.in_7{height:150px;border-right:2px solid #e0e0e0;}
.in_8{height:150px;border-right:0px solid #e0e0e0;}
.in_9{height:150px;border-right:2px solid #e0e0e0;}
.in_10{height:150px;border-right:0px solid #e0e0e0;}


.table .inner div{
	display:block;
	width:100%;
	height:15px;
	cursor:pointer;
	margin:16px 0px;
}
.t_title{
	display:inline-block;
	font-size:24px;
	line-height:24px;
	font-family: 'sfui_semibold';
	color:#333;	
	padding-left:14px;
}
.need_fix{
	display:inline-block;
	font-family: 'sfui_regular';
	font-size:15px;
	line-height:15px;
	color:#888888;
	text-decoration:underline;
	cursor:pointer;
	float:left;
	margin-left:14px;
	position:relative;
}
.need_fix img{position:absolute;right:-30px;top:-6px;}
.table .inner div:hover .need_fix{
	color:#00c0ff;
}

.price{
	display:none;
	font-family: 'sfui_regular';
	font-size:15px;
	line-height:15px;
	color:#333333;	
	float:right;
	margin-right:14px;
}
.price.active{display:inline-block;}

/*выбор брендов*/
#brend_select{
	display:inline-block;
	width:100%;
	height:auto;
}
#brend_select .big{
	display:inline-block;
	width:100%;
	height:100px;	
	margin-top:20px;
	margin-bottom:40px;
}
#brend_select .small{
	display:inline-block;
	width:100%;
	height:auto;	
}
#brend_select .big a{margin:10px 24px;}
#brend_select .small a{margin:10px 14px;}

#brend_select a{
	display:inline-block;
	opacity:0.3;
	vertical-align:middle;	
}

#brend_select a:hover{opacity:1;}
/*=================================================== Экран 3a =======================================================*/

#s3a{
	height:520px;
	background:#fff;
	position:relative;
	overflow:hidden;
}
#s3a .wrapp{height:100%;}
#s3a{display:none;}
#s3a.active{display:inline-block;}
#s3a_content{
	width:1180px;
	height:400px;
	margin:0 auto;
	position:relative;
	overflow:hidden;
}
.blue_box{
	width:100%;
	height:300px;
	background-color:#00c0ff;
	position:absolute;
	bottom:0px;
	left:0px;
}
.blue_box .inner{
	width:370px;
	height:200px;
	margin-top:40px;
	margin-left:100px;
	color:#fff;
}
.blue_box .inner span{
	font-family: 'sfui_semibold';
	font-size:24px;
	line-height:32px;
}
.blue_box .inner p{
	font-family: 'sfui_regular';
	font-size:18px;
	line-height:24px;
	display:block;
	margin: 14px 0px 26px 0px;
}



.s3a_im{
	position:absolute;
	right:0px;
	bottom:0px;
	display:none;
	-webkit-transform: translate(0px, 0px); 
	transform: translate(0px, 0px);		
}
.s3a_im.move{
	-webkit-transform: translate(0px, 30px); 
	transform: translate(0px, 30px);	
}
.s3a_im.active{display:block;}
.s4b_im1{display:block!important;}



/*=================================================== Экран 4 =======================================================*/

#s4{
	height:510px;
	background:#f5f5f5;
}
#s4 .wrapp{height:100%;position:relative;overflow:hidden;}

#s4_content{
	width:480px;
	height:350px;
	float:right;
	margin-right:60px;
	margin-top:80px;
}
#s4 .wrapp form{margin-top:26px;}
.s4_button{
	width:250px;
	margin-top:30px;
}
.s4_image{
	position:absolute;
	bottom:0px;
	left:0px;
	width:600px;
	height:auto;
}

/*=================================================== Экран 4a =======================================================*/

#s4a{height:430px;-webkit-backface-visibility: hidden;}
#s4a .wrapp{height:100%;position:relative;}

#s4a_content{
	width:480px;
	height:350px;
	float:left;
	margin-left:60px;
	margin-top:160px;
}
.s4a_button{
	width:250px;
	margin-top:10px;
}
.s4a_image{
	position:absolute;
	top:0px;
	right:0px;
	height:630px;
	z-index: 1;
}

/*=================================================== Экран 4b =======================================================*/

#s4b{
	height:520px;
	background:#fff;
	position:relative;
	overflow:hidden;
}
#s4b .wrapp{height:100%;}
#s4b{display:inline-block;}
#s4b_content{
	width:1180px;
	height:480px;
	margin:0 auto;
	position:relative;
	overflow:hidden;
}
#s4b_content .blue_box .inner{width:500px;margin-right:70px;float:right;}
#s4b_content .blue_box .inner span{
	font-family: 'sfui_semibold';
	font-size:40px;
	line-height:44px;
	color:#fff;	
}
.s4b_im1{right:auto;}


/*=================================================== Экран 5 =======================================================*/

#s5{
	height:300px;
	background:#fff;
}
#s5 .wrapp{height:230px;padding-top:70px;}
#s5 .wrapp .podtitle{line-height:34px;}

.s5_podtitle{
	font-family: 'sfui_semibold';
	font-size:24px;
	line-height:24px;
	display:block;
	color:#333333;
	margin:30px 0px 50px 0px;
}

#s6{padding-bottom:80px;padding-top:20px;}

/*=================================================== Экран 7 =======================================================*/

#s7{
	height:610px;
	background:#fff;
}
#s7 .wrapp{height:100%;}

#s7_content{
	width:1180px;
	height:610px;
	margin:0 auto;
}
#s7_content .inner{
	width:50%;
	height:100%;
	float:left;
	position:relative;
}
#s7_content .inner.left{
	background:#ccc;
}
#s7_content .inner.left iframe{border:none;width:100%;height:100%;}
#s7_content .inner.right{
	background:url(../img/map1.jpg)no-repeat center center;
	background-size:cover;
	position:relative;
	overflow:hidden;
}
.map1{
	width:590px;
	height:610px;
	position:absolute;
	right:0px; top:0px;
}
.map2{
	position:absolute;
	right:0px; top:0px;
	height:100%;
	overflow:hidden;
}
.map2 img{
	width:590px;
	height:610px;
	position:absolute;
	right:0px;top:0px;
}
.map3{
	width:590px;
	height:610px;
	position:absolute;
	right:0px; top:0px;
}

/*=================================================== Экран 8 =======================================================*/

#s8{
	height:142px;
	background:#fff;
}
#s8 .wrapp{height:100%;}

.s8_link{
	display:inline-block;
	height:auto;
	padding-left:60px;
	padding-right:20px;
	color:#fff;
	border-radius:10px;
	margin:0px 20px;
	font-family: 'sfui_regular';
	font-size:16px;
	line-height:48px;
	margin-top:46px;
}
.ya{background:#333333 url(../img/yandex.png)no-repeat 6px 0px;}
.ya:hover{background:#333333 url(../img/yandex.png)no-repeat 6px -48px;}
.go{background:#333333 url(../img/google.png)no-repeat 6px 0px;}
.go:hover{background:#333333 url(../img/google.png)no-repeat 6px -48px;}

/*=================================================== footer =======================================================*/

#footer{
	height:64px;
	background-color:#333333;
}
#footer .wrapp{height:94%;max-width:94%;position:relative;overflow:hidden;}

#footer_calback_box{
	float:left;
	color:#fff;
	margin-top:15px;
	margin-left:10px;
}
.policy{
	font-family: 'sfui_light';
	font-size:14px;
	line-height:14px;
	display:inline-block;
	text-decoration:underline;
	color:#fff;
	margin-top:22px;
	position:absolute;
	left:50%;
	-webkit-transform: translate(-50%, 0%); 
	transform: translate(-50%, 0%);	
}
.brainst{
	width:70px;
	height:40px;
	padding-right:90px;
	margin-right:10px;
	float:right;
	margin-top:10px;
	background:url(../img/brainst.png)no-repeat right center;
}
.brainst span{
	color:#fff;
	display:block;
	width:100%;
	text-align:right;
	font-family: 'sfui_regular';
	font-size:11px;
	text-decoration:underline;
	line-height:14px;
	margin-top:8px;
}
















.del_in800{display:block;}
.show_in800{display:none;}
.show_in320{display:none;}