/* 
*,
*::before,
*::after {
	padding: 0;
	margin: 0;
	border: 0;
	box-sizing: border-box;
}
*/

section#listalka {
border:0px solid #eeeeee;
margin-top:0%;
width:100%;
max-width:2560px;
min-width:0;
margin-left: auto;
margin-right: auto;
}

section#listalka .pic_panel{
margin-top:4%;
display:flex;
flex-wrap:wrap;
justify-content: center;
align-items: center;
border:0px solid #eeeeee;
}

section#listalka .pic_panel div{
width:40px;
margin:3px;
cursor:pointer;
border:1px solid #dfdfdf;
opacity:0.6;
transition:all 0.8s;
}


section#listalka .pic_panel div.pct_on{
opacity:1;
border:1px solid #ff0000;
}
/*
<div class="pic_panel">
<div class="pct">      
    <img src="$file4" style="width:100%" class="pict">                      
</div> 
</div>
*/


section#listalka .swiper-button-next::after,
section#listalka .swiper-button-prev::after {
color: #c51a1b;
font-size:30px;
border: 1px solid #ededed;
padding:5px;
}
section#listalka div.img_slider .swiper-pagination-bullet{
width:15px;
height:15px;
background-color: #c4161c;
}

section#listalka div.img_slider .swiper {
      width: 100%;
      position:relative;     
      /* height: 100%; */
    }

section#listalka div.img_slider .swiper-slide {
      text-align: center;
      font-size: calc(16px + 10 * ((100vw - 320px) / (2050 - 320)));
      background: #fff;
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 22px;
    }

section#listalka div.img_slider .swiper-slide img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
      opacity:0;
      transition:all 0.8s;
    }

section#listalka div.img_slider .swiper-slide img.opasity_full {
      opacity:1;
    }

    
section#listalka div.img_slider .swiper-slide video {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: contain;
    }
/* ====================================================== */   



.text-slider3{
width:100%;
min-width:0;
opacity: 1.0;
border: 0px solid #aaf;
}

section#listalka div.text_slider > .text-slider3 > div.swiper-wrapper > div.swiper-slide > div.txt_blok{
border: 0px solid #ff0000;
height:100%;
display: flex;
justify-content: center;
align-items: center;
}

section#listalka a{
text-decoration:none;
color:#434f55;
}

section#listalka .hdr{
      text-align: center;
      font-size: calc(18px + 8 * ((100vw - 320px) / (2050 - 320)));
      color:  #434f55;
      line-height: 110%;
      display: flex;
      justify-content: center;
      align-items: center;
    }






/* ============================ PLAYER ========================== */
 div#tabs_listalka{
display:flex;
align-items:left;
justify-content:center;
align-items:center;
border:1px solid #aaa;
width:320px; 
height:50px; 
padding:10px;
padding-left:0px;
margin: auto;
}

section#listalka div#play_listalka{
display:flex;
align-items:center;
border:0px solid #ededed;
width:20px; 
margin-left:auto; 
margin-right:auto;
}
  
section#listalka div.nav{
width:30px; 
height:30px;
border:1px solid #ebebeb; 
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
padding: 5px 14px;
text-align: center;
font-weight: 500;
font-size: 14px;
border-radius: 50%;
transition: background 0.1s, color 0.1s;
background: #fff;
}    


/* border of dots */
section#listalka div.ddd{
margin-top:2px;
height:25px;
border:1px solid #fff;
border-radius:10px;
background:#fff;
display:flex;
justify-content:center; 
align-items:center;
margin-left:10px; 
margin-right:10px;
}

section#listalka div.nav:hover {
color: #888;
background: #eee;
}    
    
section#listalka div.nav > img{
display: block;
width:10px;
height:10px;
opacity:0.6;
}  

section#listalka div.dot{
width:10px; 
height:10px; 
border:1px solid #aaa;
background: #fff;
margin:2px;
border-radius:50%;
transition: 0.5s ease-in; /* linear ease-in ease-out ease-in-out */
} 
    
section#listalka div.dot_sel{
width:10px; height:10px;
margin:2px;
border-radius:50%;
background: #8f9ca2;
border:1px solid #8f9ca2;
transition: 0.5s ease-in; /* linear ease-in ease-out ease-in-out */
} 
     
section#listalka img.play{
width:20px; 
height:22px;
margin-top:3px;
cursor:pointer;
}    


section#listalka div.hid{
opacity:0;
}

/* ============================ PLAYER ========================== */  





div.text_slider .text-slider3{
width:100%;
height:5vw; 
opacity: 1;
}


section#listalka div.for_text {
background:#fff; 
/*flex-basis:40%;  */
min-width:0; /* Пипец, как важно - иначе слайдер сойдет с ума */ 
flex-basis:100%;
}


.swiper-lazy:not(.swiper-lazy-loaded) {
display: none;
}

#model_head{
flex-direction:row;
}


/*---------------------------------------------*/

@media only screen and (max-width: 768px)  {

section#listalka {
width:100%; 
padding: 0%;
}

section#listalka .hdr{
      position:relative;
      text-align: center;
      font-size: calc(17px + 12 * ((100vw - 320px) / (2050 - 320)));
}


section#listalka div.for_text {
	flex-basis:100%;
}

section#listalka div#flx{
flex-direction:column;
}

section#listalka .text-slider3{
width:100%;
}

#model_head{
border:0px solid #ffaaaa;
flex-direction:column;
}


}