#sect1{display:}  /* Amfibia Family */
#sect2{display:}  /* DRYBOX + AQUABOX */
#sect3{display:}  /* WET-JET */
#sect4{display:}  /* РЕЖИМЫ УБОРКИ */
#sect5{display:}  /* ЧИСТЫЙ ДОМ - БЕЗ ХЛОПОТ */
#sect6{display:}  /* КОМПЛЕКТАЦИЯ */
#sect7{display:}  /* ТЕХ.ХАРАКТЕРИСТИКИ */


/* -------------Прелоадер----------------- */
#preload{padding-top:10%}

.spinner, .spinner1, .spinner2, .spinner3
 {
  opacity: 0;
  display: box;
  width: 40px;
  height: 40px;
  margin: 10px auto;
  background-color: #333;
  border-radius: 100%;  
  -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
  animation: sk-scaleout 1.5s infinite ease;
/*
sk-scaleout - имя анимации
1.5s		- длительность анимации
infinite    - Анимация проигрывается бесконечно
ease-in-out - Анимация начинается быстро и плавно замедляется в конце. Соответствует cubic-bezier(0,0,0.58,1)
*/
}

.spinner1 {animation-delay: 0.2s;}
.spinner2 {animation-delay: 0.4s;}
.spinner3 {animation-delay: 0.6s;}

@keyframes sk-scaleout {
  0% { 
   -webkit-transform: scale(0);
   transform: scale(0);
	opacity: 0.9;
  } 100% {
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
    opacity: 0;
  }
}
/* --------------end--------------- */





/* --------------стили--------------- */
div, section{box-sizing: border-box; 
	-webkit-box-sizing: border-box;         /* бордюры и отступы не влияют на размер блока */
	font-family: Verdana, Arial, Helvetica;
	font-size:18px;
}

.my-flex-container {
	border: 0px solid #ff0000;
	max-width: 1920px;
	min-width: 320px;
	display: flex;
	flex-direction: column;                 /* дочерние блоки будут выстраиваться в верикальную колонну */
	margin-bottom: 0px;
}

.my-flex-block, .block_body {
	border: 0px solid #aaaaaa;
	width: 100%;
	min-width: 320px;
	position:relative;
	margin: 0px;
}



.ldr{
display:flex;
width:200px;
border: 0px solid #888888;
}

.ldr1{
display:flex;
width:200px;
}


.hor{
	display: flex;
	-ms-flex-wrap: wrap-reverse;
	flex-wrap: wrap-reverse;        
	margin-bottom: 0%;
	-ms-flex-pack: distribute;
	justify-content: space-around; /* Flex-элементы отображаются с равным интервалом между границами границы контейнера */
	margin-top: 0%;
	border:0px solid #0000ff;
}

.menup{
   font-size: calc(16px + 5 * ((100vw - 320px) / (1920 - 320)));	
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-weight: 400;
	color: #005D7F;
	position:relative;
	padding-left:4%;
	padding-right:7%;
	text-align:justify;  
	width:100%;
	margin-bottom:10px;
	border: 0px solid #999999;
	line-height: 1.4em;
}
.menup-small{
   font-size: calc(14px + 5 * ((100vw - 320px) / (1920 - 320)));	
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-weight: 200;
	color: #515151;
	position:relative;
	padding-left:3%;
	padding-right:5%;
	text-align:justify;  
	width:100%;
	margin-bottom:20px;
	border: 0px solid #999999;
	line-height: 1.8em;
}
.menup1{
   font-size: calc(16px + 5 * ((100vw - 320px) / (1920 - 320)));	
   font-family: Verdana, Arial, Helvetica, sans-serif; font-style: italic;
   font-weight: 200;
	color: #A2BFCC;
	position:relative;
	padding-left:4%;
	padding-right:7%;
	text-align:justify;  
	width:100%;
	margin-bottom:10px;
	border: 0px solid #999999;
	line-height: 2.4em;
}


.anchor{
   font-size: calc(18px + 5 * ((100vw - 320px) / (1920 - 320)));	
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-weight: 400;
	color: #A2BFCC;
	text-decoration: none;
	border-bottom: 1px dashed #688B9B;
   line-height: 2.0em;
}




.menup2{
   font-size: calc(16px + 5 * ((100vw - 320px) / (1920 - 320)));	
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-weight: 100;
	color: #A2BFCC;
	position:relative;
	padding-left:4%;
	padding-right:7%;
	text-align:justify;  
	width:100%;
	margin-bottom:20px;
	border: 0px solid #999999;
	line-height: 1.7em;
}

.cell1{
  width:200px;
  position:relative;
  margin: 3%;
  text-align: center;
  border: 0px solid #aaaaaa;
  text-align:center;
  padding-bottom: 1%;
  padding-top: 2%;
}
.nasadki{
  max-width:180px;
  min-width:100px;
  position:relative;
  text-align: center;
  border: 0px solid #aaaaaa;
  text-align:center;
  margin: 2%;
}
.des {
  text-align:center; 
  font-family: 'Montserrat, Arial, Helvetica,', sans-serif;
  font-size: calc(14px + 5 * ((100vw - 320px) / (1920 - 320)));
  font-weight: 300;
  color: #ffffff;
  padding: 0%;
  padding-top: 1%;
  padding-bottom: 1%;
  margin-top:150px;
  line-height: 24px;   
}

.drb1 {
  display:block;
  font-family: 'Montserrat, Arial, Helvetica,', sans-serif;
  font-size: calc(18px + 5 * ((100vw - 320px) / (1920 - 320)));
  font-weight: 500;
  color: #F16E00;
}


.font-orange {
   font: Roboto, sans-serif;
   font-size: calc(23px + 5 * ((100vw - 320px) / (1920 - 320)));
   font-weight: 400;
   color: #ffffff; 
   margin-bottom: 0%;
   margin-top: 0%; padding: 1%; 
   background-color:#F16E00; 
   line-height: 1.4em;
   text-align: center;
   width:100%;}
   
.font-orange1 {
   font: Roboto, sans-serif;
   font-size: calc(23px + 5 * ((100vw - 320px) / (1920 - 320)));
   font-weight: 400;
   color: #FF6C00; 
   margin-bottom: 0%;
   margin-top: 0%; padding: 1%; 
   background-color:#132229; 
   line-height: 1.4em;
   text-align: center;
   width:100%;}
   
.font-gray {
   font: Roboto, sans-serif;
   font-size: calc(23px + 5 * ((100vw - 320px) / (1920 - 320)));
   font-weight: 400;
   color: #F1F1F1; 
   margin-bottom: 0%;
   margin-top: 0%; padding: 1%; 
   background-color:#005E78; 
   line-height: 1.4em;
   text-align: center;
   width:100%;}



.orang {
   font-family: 'Roboto', sans-serif;
   font-size: calc(22px + 4 * ((100vw - 320px) / (1920 - 320)));
   font-weight: 400;
   color: #F16E00;
   line-height: 1.6em; 
   margin-top: 4%;}
   
.orang-small {
   font-family: 'Roboto', sans-serif;
   font-size: calc(16px + 5 * ((100vw - 320px) / (1920 - 320)));
   font-weight: 400;
   color: #FF9000;
   line-height: 30px; 
   margin-bottom: 1%;
   margin-top: 2%;
   
   text-decoration: none;
	border-bottom: 1px dashed #FF7400;
   line-height: 2.8em;}   
   
.orang-small77 {
   font-family: 'Roboto', sans-serif;
   font-size: calc(14px + 5 * ((100vw - 320px) / (1920 - 320)));
   font-weight: 200;
   color: #FF9000;
   line-height: 30px; 
   margin-bottom: 1%;
   margin-top: 1%;
   letter-spacing: 5px;
   
   text-decoration: none;
	border-bottom: 1px dashed #FF7400;
   line-height: 2.8em;} 

   a {
    color: #FF9000; /* Цвет обычной ссылки */
   } 
   a:hover {
    text-decoration: none; /* Убираем подчеркивание */
    color: #FFC67B; /* Цвет ссылки при наведении на нее курсора мыши */  
   }

.tms-section-7 {
    background-color: #045369;
    padding: 5%;
    width:100%;}
  
.tms-section-77 {
    background-color: #043C4B;
    padding: 1%;
    width:100%;
    word-spacing: 30px;}
  
.section-video {
    background-color: #132229;
    padding: 5%;
    width:100%;}


 
.tms-section-7-header {
    text-align: center; }
        
.tms-section-7-item {
    background-color: #005E78;
    padding: 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 20px; }
    
.tms-section-7-item .tms-p {
    padding-left: 10px;
    min-width: 49%;
    width: calc((485px - 100%) * 1000);
    max-width: 100%;
    text-align: left; }
  
.tms-p {
  font-family: 'Montserrat', sans-serif;
  font-size: calc(17px + 5 * ((100vw - 320px) / (1920 - 320)));
  font-weight: 200;
  color: #D3E5EE;
  line-height: 28px; }
  
  
.tms-wrp {padding: 0 6%; }  
.pict {position:absolute; top:20px; left:40px}  
.lable{max-width:100%; min-width: 100px;}
     
#shapka{background: url(../img/sec1_1920.jpg) left top no-repeat #FFFFFF;}
#shapka1{background: url(../img/secVLAGA_back3.jpg) left top no-repeat #FFFFFF;}
#shapka2{background: url(../img/secVLAGA_back.jpg) left top no-repeat #FFFFFF;}
#shapka2-1{background-color: #045369;}
#shapka2_1{background: url(../img/secVLAGA_back2_1.jpg) left top no-repeat #FFFFFF;}
#shapka3{background: url(../img/secVLAGA_back1.jpg) left top no-repeat #FFFFFF;}
#shapka4{background: url(../img/secVLAGA_back2.jpg) left top no-repeat #FFFFFF;}
#shapka5{background-color: #045369;}
#shapka6{background-color: #045369;}
#shapkaHEPA{background-color: #132229;}

/* --------------end--------------- */


/* -------------медиазапросы--------------- */
@media (max-width: 400px){

/* -----------new----------*/		
	#sec2_back{ background: url(../img/question360.jpg) left top no-repeat #FFFFFF;
   height:60vw;
	}
/* -----------new----------*/		
	
	#sec3_back1{ background: url(../img/sec3_aq_back400.jpg) left top no-repeat #FFFFFF;
	height:60vw;
	}
	#sec4_back{ background: url(../img/sec4_img400.jpg) left top no-repeat #FFFFFF;
	height:60vw;
	}
	#sec6_back{ background: url(../img/sec6_back400.jpg) left top no-repeat #FFFFFF;
	height:60vw;
	}
	#kontk{ background: url(../img/kontakt400.jpg) left top no-repeat #FFFFFF;
	height:55vw;} 
	
	#pay{ background: url(../img/pay400.jpg) left top no-repeat #FFFFFF;
	height:73vw;}
}

@media (min-width: 401px) and (max-width: 768px){
	
	#sec3_back{ background: url(../img/sec3_back768.jpg) left top no-repeat #FFFFFF;
	height:50vw;
	}
	#sec3_back1{ background: url(../img/sec3_aq_back768.jpg) left top no-repeat #FFFFFF;
	height:50vw;
	}
	
/* -----------new----------*/	
	#sec2_back{ background: url(../img/question768.jpg) left top no-repeat #FFFFFF;
	height:50vw;
	}
/* -----------new----------*/	
	
	#sec4_back{ background: url(../img/sec4_img768.jpg) left top no-repeat #FFFFFF;
	height:50vw;
	}
	#sec6_back{ background: url(../img/sec6_back768.jpg) left top no-repeat #FFFFFF;
	height:50vw;
	}
	#kontk{ background: url(../img/kontakt768.jpg) left top no-repeat #FFFFFF; 
	height:38vw;}
	
	#pay{ background: url(../img/pay768.jpg) left top no-repeat #FFFFFF;
	height:42vw;}
}

@media (min-width: 769px) and (max-width: 1920px){
	#sec3_back{ background: url(../img/sec3_back.jpg) left top no-repeat #FFFFFF; 
	height:28vw;
	}


/* -----------new----------*/	
   #sec2_back{ background: url(../img/question1920.jpg) left top no-repeat #FFFFFF; 
	height:28vw;
	}	
/* -----------new----------*/	

	
	#sec3_back1{ background: url(../img/sec3_aq_back.jpg) left top no-repeat #FFFFFF; 
	height:28vw;
	}
	#sec4_back{ background: url(../img/sec4_img.jpg) left top no-repeat #FFFFFF;
	height:28vw;
	}
	#sec6_back{ background: url(../img/sec6_back.jpg) left top no-repeat #FFFFFF;
	height:31vw;
	}
	#kontk{ background: url(../img/kontakt.jpg) left top no-repeat #FFFFFF; 
	height:18vw;}
	
	#pay{ background: url(../img/pay.jpg) left top no-repeat #FFFFFF;
	height:20vw;}
}


@media (min-width: 769px) and (max-width: 1370px) {
   #shapka {background: url(../img/sec1_1366.jpg) left top no-repeat #FFFFFF}
}
@media (min-width: 769px) and (max-width: 1920px) {

}

@media (max-width: 768px) {
	#arleft1 {display: none} /* */
	#arleft {display: none}	/* */
	#arright {display: none}
	#arright1 {display: none}	
	#komplekt {display: none}	
	#wet_back {display: none} 
   #shapka {background: url(../img/sec1_768.jpg) left top no-repeat #FFFFFF}
   #shapka1 {background: url(../img/secVLAGA_back3_small.jpg) left top no-repeat #FFFFFF}
   #shapka2 {background: url(../img/secVLAGA_back_small.jpg) left top no-repeat #FFFFFF}
   #shapka2_1{background: url(../img/secVLAGA_back2_1_sm.jpg) left top no-repeat #FFFFFF;}
   #shapka3 {background: url(../img/secVLAGA_back1_small.jpg) left top no-repeat #FFFFFF}
   #shapka4 {background: url(../img/secVLAGA_back2_small.jpg) left top no-repeat #FFFFFF}
}


@media (max-width: 711px) {

   #shapka {background: #F1F1F1;}
}


/* --------------end--------------- */  



/* ------СТИЛИ СКРИПТА ДЛЯ ВИДЕО---------- */

.ramka{
position:relative;
border: 0px solid #ffffff; 
background:#132229;
width:80vw; 
height:50vw /* */
}

.ifrm{
width:100%; 
display:none
}

.video {
/*   position:absolute; 
  z-index:100; 
  top:0px; 
  left:0px; */
  border: 1px solid #5C646A;
  cursor:pointer;
  display: inline-block;
  box-sizing: border-box;
  vertical-align: top;
  transition: box-shadow 0.5s, transform 0.5s;
  transform: perspective(1px) translateZ(0);
  box-shadow: 0px 0px 0px rgba(0, 0, 0, .1);
}

.video:hover,
.video:focus,
.video:active {
  -webkit-transform: translateY(-3px);
  transform: translateY(-3px);
  box-shadow: 9px 9px 9px rgba(0, 0, 0, .6);
}

.video-container{
position:relative;
padding-bottom:42.25%;
padding-left: 20%;
padding-right: 20%;
height:0;
overflow:hidden;
}

/* ------СТИЛИ СКРИПТА ДЛЯ ВИДЕО---------- */