/* -------------Прелоадер----------------- */
#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--------------- */


/* -------------Корзина----------------- */

.basket1, .basket2, .basket3
 {
  position: absolute;
  opacity: 0;
  display: box;
  width: 130px;
  height: 130px;
/*  margin: 10px auto; */
  border: 4px solid #B9B9B9;
  border-radius: 100%;  
  -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
  animation: sk-scaleout 3.0s infinite ease;
/*
sk-scaleout - имя анимации
1.5s		- длительность анимации
infinite    - Анимация проигрывается бесконечно
ease-in-out - Анимация начинается быстро и плавно замедляется в конце. Соответствует cubic-bezier(0,0,0.58,1)
*/
}

.basket1 {animation-delay: 0.20s;}
.basket2 {animation-delay: 0.60s;}
.basket3 {animation-delay: 0.80s;}

@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;
}

.drb1 {
  display:block;
  font-family: 'Montserrat, Arial, Helvetica,', sans-serif;
  font-size: calc(28px + 5 * ((100vw - 320px) / (1920 - 320)));
  font-weight: 500;
  color: #009BE5;
  margin-bottom: 1%;
  margin-top: 1%;
}

.font-orange {
   font: Roboto, sans-serif;
   font-size: calc(16px + 5 * ((100vw - 320px) / (1920 - 320)));
   font-weight: 400;
   color: #ffffff; 
   margin-bottom: 0%;
   margin-top: 0%; padding: 4%; 
   background-color:#224556; 
   line-height: 1.4em;
   text-align: center;
   width:100%;}


.orang {
   font-family: 'Roboto', sans-serif;
   font-size: calc(15px + 5 * ((100vw - 320px) / (1920 - 320)));
   font-weight: 400;
   text-decoration: dotted underline; 
   color: #56C3FF;
   line-height: 30px; 
   margin-bottom: 1%;
   margin-top: 2%;}
   
.orang-small {
   font-family: 'Roboto', sans-serif;
   font-size: calc(17px + 5 * ((100vw - 320px) / (1920 - 320)));
   font-weight: 400;
   text-decoration: dotted underline;
   color: #BAE8FF;
   line-height: 40px; 
   margin-bottom: 1%;
   margin-top: 2%;}   
   
.tms-section-7 {
    background-color: #2E4E5D;
    padding: 4%;
    width:100%;}
  
.tms-section-7-header {
    text-align: center; }
        
.tms-section-7-item {
    background-color: #405F6E;
    border: px solid #13445D;
    padding: 3%;
    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: 15px; }
    
.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(15px + 5 * ((100vw - 320px) / (1920 - 320)));
  font-weight: 400;
  color: #D3E5EE;
  line-height: 23px; }
  
.tms-section-7-item .tms-p1 {
  font-family: 'Montserrat', sans-serif;
  font-size: calc(15px + 5 * ((100vw - 320px) / (1920 - 320)));
  font-weight: 400;
  color: #E7F7FF;
  line-height: 28px;
  text-align:left;
  font-style: italic;
}  
    
.tms-wrp {padding: 0 3%; }  
.pict {position:absolute; top:20px; left:47px}  
.lable{max-width:100%; min-width: 100px;}
     
.pik-seti {
  margin-left: 19px; 
}
.pik-seti-1 {
  padding-left: 9px;
}

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