@charset "utf-8";

 @media only screen  {
	 :root {
/*--widthA: 100%*/
--widthA: 100vmax

}



html { background-image:none; width:100% !important; background-color:#FFF !important} 
body  { width:100% !important; height:auto;   margin: 0 auto; overflow:auto; font-size:12px}
 h1 { font-size:16px;  line-height:1.1; margin:20px 0 20px 1%; width:98%}
 header h1 { position:absolute; top:calc(12px + 9 * var(--widthA) / 40); font-size: calc(1.7*35*var(--widthA)/(21*100));  margin:0 !important;
  white-space: nowrap; overflow: hidden;  text-overflow: ellipsis}


div.header{ float:left; width:100%; position:relative; height:110px;/* border:1px solid #0000A0;*//* background: url(img/fon-img-portret.png) right top no-repeat, #585858; background-size: auto 100%; margin: 0 0 15px 0; color:#FFF; */font-size:14px; line-height:1.5; padding:0 0 0 0; margin-top:calc(var(--widthA) / 10) ; margin-bottom:calc(var(--widthA) / 20); height:calc(var(--widthA) /8) !important ; font-size: calc(1.7*35*var(--widthA)/(18*100)) !important; font-weight:bolder !important
line-height:calc(var(--widthA)/26) !important;
        }
		
		#razmer_4_content{font-size: calc(1.7*35*var(--widthA)/(24*100)) !important; top:-5px; font-weight:normal !important}
#header div ul{ float:left; margin: 0 0 0 30%;}
#header div ul{ float:left; margin: 0 0 0 30%;}
#header div ul{ float:left; margin: 0 0 0 2%; width:100%}
#header .glob { display:block !important}
#header .mobil { display:none !important}
.header li:first-child{font-size: calc(1.7*35*var(--widthA)/(24*100)) !important; margin-top:calc(1.7*35*var(--widthA)/(2*21*100)) !important;}
 .header #razmer_4 li:first-child{margin-top:0 !important;}
#top-blue_buttons-mobil, #blue_buttons-mobil{ display:block}
#top-blue_buttons-mobil{ display:block}
/*.glob_strana{ display:none}*/

.breadcrumbs .breadcrumbs__item, .breadcrumbs__link { margin-top: 0px;}
#group2{ background: url(img/fon-img-portret.png) right top no-repeat, #585858; background-size: auto calc(var(--widthA)/3); }




 h1 span { display:none}
main h1, div.main h1{ font-size:16px; display:none}
main h1, div.main h1{ margin-left:0; width:98%}

main, div.main {width:96% ; margin:0 2% 0 2%}
main > img, div.main > img { margin-top:0}

main{ margin-top:calc(1.7*35*var(--widthA)/(21*100))}
#skidki_dostavka{ width:60%; margin-left:10%; height:auto}
header{  position:relative}
.no_margin_top{ margin-top:0}
.grid{ width:100%}
article.katalog{width:100%}
.coment, .coment details {width:100%;margin:0 0 0 0 }
.pokaz_img_div { display: block !important; }
.li_menu:hover .ul_menu{display:none}

.div_header_close{ background:url(img/close.png) right 10px top 5px no-repeat}
div.main.page-main{ width:95%}
.product {width: 33.3%}
.li_menu {margin:0 auto; padding: 0px; float:none; height:auto; }
nav {white-space:normal}
.photolink{ width:50%}
.svg_tel_none{ display:none !important}
.svg_tel_a{ position:absolute; z-index:1; top:0; bottom:0; left:17%; height: calc(var(--widthA)/10); display:none; width:35%; font-size: calc(1.7*35*var(--widthA)/(21*100)); text-decoration:none }
.svg_tel_a+a{left:52%; }
.svg_tel_a:link{color:#008ED7}
.svg_tel_a img { width:100%; height:auto;}
#a1{ float:left; width:100%}
.navigasiya{width:100%;  }
	 #blue_buttons {height:auto;}

.poiski{ float:left; margin: 0 0 0 2% !important; height:50px;  width:10%}
#poiski{ float:left; margin:5px 0 0 2%; }
.poiski_mobil{ width:80%; height:auto;  padding-top:5px !important}
.select.dc{ width:14%}
.svg_tel_a_{ font-size:16px}
.telef{ float:left; width:90%; margin:5px 0 0 0; color:#F00 }

#poisk{ float:right; margin:0 3% 20px 0}
#glavnaya{float:left;  margin: 0 0 0 2%;   }
	#glavnaya img { float:left; border:none;  }
input[type="button"] {
  white-space: normal;
}	
  
#jcart{ width: 7%; top:0; right:2%;  height:calc(var(--widthA)/10)}
#jcart table{ height:100%}
#jcart table th {/* height: 50px;*/ height:auto !important; }
 
.otpusk_jcart{  width:80% !important;  top:0 !important  } 
.otpusk_jcart table thead tr th{ background:none!important; border:1px solid #000 !important; border-bottom:none !important;  }
.otpusk_jcart table thead tr th span{ margin-top:10px !important; color:#000 !important; display:inline-block !important }

.card{ display:none}
.card_block{ display:block}


#jcart table thead tr th {
  background:url(img/cart.svg) no-repeat center  ;
  background-repeat: 100% ;
   background-size: 100% auto;
  font-weight: normal;
  cursor: pointer;
  position: relative;
}
.korzina_pusto th span::before { content:none }
#jcart-title{font-size:14px; float:right; margin-right:32%; top:-5px !important ; position:relative; color:#0080FF;  }

.jcart_title {
  position: absolute !important;
  right: 0 !important;
}
.otpusk_jcart .jcart_title {position: relative !important;}
.jcart_title_absolute{position:absolute !important; right:0 !important}





.jcart_title{ display:inline-block}

.jcart_title span {display:none}

.nontovar{ display:block !important;width: 80% !important; height:30px !important; 
 animation-duration: 1.5s;
 animation-timing-function: ease-in;
  animation-iteration-count: 1;
animation-name: anim;
 }
 /*
.svg_tel_a_block{  display:inline; vertical-align:middle ;
	animation-delay: 4s;
 animation-duration: 1s;
 animation-timing-function: ease-in;
  animation-iteration-count: 1;
animation-name: tel;
  }
 */ 
.svg_tel_a_block{  
  padding: 5px;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  flex-flow: row nowrap;
  animation-delay: 4s;
 animation-duration: 1s;
 animation-timing-function: ease-in;
  animation-iteration-count: 1;
animation-name: tel;
  }
  
 
.nontovar  table thead tr th{height:30px !important; background:none !important }
.nontovar  table thead tr th span{ margin-top:10px !important; color:#000 !important}
.noncart{ display:none}
 
 @keyframes anim {
    0% {width: 80%; opacity:1; }
    95% {width: 80%; opacity:0; }
    100% {width: 10%; opacity:0; }
}
 @keyframes tel {
    0% { opacity:1; }
	50%{opacity:0.5}
    100% {opacity:0; }
}

	 /*------------------Анимационное меню-----------------------------------------------*/
	 .close_drop{
	 height:50px; background:url(img/close_icon.png) no-repeat #FFF; background-size:40px;
   background-position: 5px 5px; 
	 
	 }
	 .dropbtn, .svg_tel {  fill:currentColor; color:#008ED7; height:auto; width:6%; display:block;  position:absolute !important; left:0;  margin:0 auto;  height:calc(var(--widthA)/10) ;   }
.svg_tel{ width:3.0%; margin:0 auto; left:12%; }

.country{ float:left; margin:3px 1% 0 0; background-color:#FFF  ; color:#008ED7;
position:absolute; right:14%; top:calc(var(--widthA)/40);  font-size:12px; z-index:0;
border: 2px solid #008ED7; font-weight:bold; 
padding: 3px;
border-radius: 5px;
outline: none;
cursor: pointer;
clear: none !important;
width:auto !important;
left:auto !important;
}

#block_knopok{ float:none; width:auto}

nav {
    display: none;
    position: absolute;
	
	    top: 0px;
    left: 0 ;
 background-color: #f1f1f1;      
 
   
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1000;
	  height:auto;
    width: 70%;
	 overflow-x: hidden;
}
/*-------------------------------------------*/
.div_header {
    float: left;
    border: 1px solid #ccc;
    background-color: #f1f1f1;
    width: 30%;
  /*  height:66px;*/
      clear:left;
	  margin: 1px 6px 1px 0px !important;
}


/* Style the buttons inside the div_header */
.div_header button, .div_header a, .div_header span  {
    display: block;
    background-color: inherit;
    color: black;
   padding: 18px 0 18px 16px;
    width: 100%;
    border: none;
    outline: none;
    text-align: left;
    cursor: pointer;
    transition: 0.3s;
    font-size: 17px;
	
}

/* Change background color of buttons on hover */
.div_header button:hover {
    background-color: #ddd;
}

/* Create an active/current "div_header button" class */
.div_header button.active {
    background-color: #ccc;
}

/* Style the div_header content */
.li_home a{  border-bottom:none;cursor:pointer;  }

.ul_menu li{ border:1px solid #ccc; border-top:none; color:black;/* background-color: #f1f1f1 */}
.ul_menu li a:link, .ul_menu li a:visited, .ul_menu li:hover a:link,.ul_menu li:hover a:visited  {color: black; }
.ul_menu li a {	font-size:14px; line-height:3; padding: 0 8px 0 8px; text-decoration: none; color:black }
.ul_menu  a {text-decoration: none;}


div#slide_4 li.slide_mobil, div#slide_5 li.slide_mobil, div#slide_6 li.slide_mobil, div#slide_7 li.slide_mobil{ opacity:0}
#mobinon { display:none}

 /*-------------------------------АВЕНТОС----------------------------------------------------------------------------------------------*/
 span#cena_hl{font-size: 14px;}
	
	 div.tabl_left { display:none}


div#header div { width:100%; margin:0 0 0 0;  }

  div.asoortiment_kargo div{ float:left; width:33.3%; padding:0 0.8% 0 0.8%;  }
  div.asoortiment_kargo div.double{width:66.6%;}
  div.asoortiment_kargo div.petli_blum{width:100%;}
div.asoortiment_kargo div p span { display:none}
 
 a.stat span { display:none}
#coment0 span, #coment1 span, #coment2 span, #coment3 span, #coment4 span, #coment5 span{ display:none}



.li_menu:first-child+li.li_menu  {display:block}
.span_title {font-size:14px; background-color: #777;}


	 br#mobil { display:block}
/*main h2 { font-size:15px; line-height: 1.4; margin:10px 0 10px 0}*/
 
	 
form#mobil{ display:block}

div.gamet table tr td p { line-height:1.3;  font-size:11px; }
div.gamet table tr td a {  font-size:11px; }

aside, article { float:right; width:98%;   clear:both; margin-left:2%  }
div.left_end { float:right; width:98%;   clear:both; margin-left:2%  }

table.asssort tr td h2 span { display:none}

tbody#sql_konsol_tb tr td:first-child+td+td+td div{white-space:nowrap; }
 div.vizitka { margin:0 0 0 1%; width:95%}
 span.mobil{ display:none}
/*#pokaz, #skrit { color:#000; float:right ; margin-right:10%}*/
 
/*---------------------------------------------------*/
/*Поиск*/
div#ya-site-form0{ width:70%; margin:0 0 20px 0}

/*---------------------------------------------------*/
main table, div.main table{ width:98%}


/*-------------новые стили для таблиц---------------*/

 div.zagolovok {width:96%; margin:10px 3% 10px 1%;  }
div.zagolovok span { display:none}

 div.top_content { width:98%; margin: 10px 0 20px 0 }
 div.top_content img:nth-last-child(1) { width:96%; float:left; margin: 10px 2% 0 2%  }


 #zagluhka p {  width:20%}
 div.non_imag table{ margin: 0 0 0 0}
 div.non_imag p{ margin: 5px 0 5px 0 }

p.ramka span:nth-child(1){ display:none}
/*footer p:first-child { margin-top:50px}*/
/*Кнопка на скидку BLUM*/
a.a-btn-3{ float:left;         width:90%; margin: 0 5% 0 5%}
a.a-btn-3 span span{ display:none}


div#zagluhka span.selectbox { width:40%; margin-bottom:10px}
    div.imaginfo table tr.petli td span.selectbox {width:70%;}
 
 form#otpravka_korzinki   div#kontakt_strit span.selectbox { width:35%; margin:6px 2% 0 0}
form#otpravka_korzinki   div#kontakt_strit input[name='ulisa'] { width:60%; clear:right  }
form#otpravka_korzinki   div#kontakt_strit input[name='n_dom'] { width:50%; float:left; text-align:left; clear:both}
form#otpravka_korzinki   div#kontakt_oplata span.selectbox, form#otpravka_korzinki   div#kontakt_dostavka span.selectbox { width:90%; margin:6px 0 0 2%}

form#otpravka_korzinki   div#kontakt_strit span.selectbox { width:35%; margin:6px 2% 0 0}
form#otpravka_korzinki   div#kontakt_strit input[name='ulisa'] { width:60%; clear:right  }
form#otpravka_korzinki   div#kontakt_strit input[name='n_dom'] { width:32%; float:left; text-align:left; clear:both; margin:10px 2% 0 0 }
form#otpravka_korzinki   div#kontakt_strit input[name='n_kor'] { width:32%; margin:10px 2% 0 0}
form#otpravka_korzinki   div#kontakt_strit input[name='n_kv'] { width:30%; margin:10px 0 0 0}
form#otpravka_korzinki   div#kontakt_oplata span.selectbox, form#otpravka_korzinki   div#kontakt_dostavka span.selectbox  { width:90%; margin:6px 0 0 2%}

	 div.imaginfo div img { width:100%}
ul.header{  width:100% !important; background:none;
    top:0;
    left:0   }
	ul.header li:first-child {
    font-size: 16px;
    margin: 5px 0 0 2%;
}
#vizitka{ display:none}








}
 @media only screen and  (orientation : portrait){
	 :root {
/*--widthA: 100%*/
--widthA: 100vmin
}
.imaginfo table tr:nth-child(1) td:nth-child(1) { padding:10px 3px 10px 3px}
.imaginfo table {}
.imaginfo p{ width:100% !important; margin-bottom:0 !important}
.imaginfo div.slide{ width:100%}
.imaginfo div.slide img { width:31% !important; margin:10px 0 5px 0 !important}
 .imaginfo details.p_content{width:100%; margin-bottom: 0px;}

.imaginfo div.slide div { width:67%; margin:0 0 0 2%; float:left}

.imaginfo div.slide div img{ width:50% !important; }

#skidki_dostavka{ width:90%; margin-left:5%; height:auto}

#header{ margin-top:calc(var(--widthA)/ 6) ; height:calc(var(--widthA) / 3) !important ;  margin-bottom:calc(var(--widthA) / 10); font-size: calc(var(--widthA)/18) !important; line-height:calc(var(--widthA)/12) !important;  }
.header li:first-child{font-size: calc(var(--widthA)/16) !important; margin-top:calc(1.7*35*var(--widthA)/(18*100)) !important;}
 header h1 { position:absolute; top:calc(10px + 10 * var(--widthA) / 20); font-size: calc(1.7*35*var(--widthA)/(21*100));  margin:0 !important;
 font-size: calc(1.8*50*var(--widthA)/(20*100))}
#razmer_0_content, #razmer_1_content, #razmer_2_content, #razmer_3_content, #razmer_4_content, #razmer_5_content{ color:#3E1000; margin-left:12%; background-size:auto 40px; background-position: 4% 25px}
		#razmer_4_content{font-size: calc(var(--widthA)/16) !important; top:-5px; font-weight:normal !important;background-size:auto 40px; background-position:0 0px; line-height: calc(var(--widthA)/12) !important;}
#razmer_0_content, #razmer_1_content, #razmer_2_content, #razmer_3_content{ margin-left:0px !important}		
#razmer_4_content ul li, #razmer_5_content ul li, #razmer_6_content ul li{font-size: calc(var(--widthA)/18) !important; margin-left:2% !important}
#group1, #group2{height: calc(var(--widthA) / 3) !important;}
/* #razmer_4_content li:first-child{margin-top:calc(1.7*35*var(--widthA)/(18*100)) !important; margin-left:25% !important}*/
 
#razmer_0_content ul li, #razmer_1_content ul li, #razmer_2_content ul li, #razmer_3_content ul li, #razmer_4_content ul li, #razmer_5_content ul li{ color:#3E1000; margin-left:18%;  color:#272727; font-weight:bold}
/* 
#header{ margin-top:calc(var(--widthA)/ 6) ; height:calc(var(--widthA) / 4) !important ;  margin-bottom:calc(var(--widthA) / 10);
 font-size: calc(1.7*35*var(--widthA)/(21*100)); } 
*/ 
#header ul li { display:block !important}
 
 div#header div, div#header div ul { margin-top:0 !important}

nav { width:90%}

.svg_tel_a{ top:0; bottom:0; left:13%; height: calc(var(--widthA)/6); width:42%; font-size: calc(1.8*42*var(--widthA)/(20*100)); white-space: nowrap; font-weight:bold }
.svg_tel_a+a{left:57.5%; width:42%; z-index:1000; background:#FFF}
.country{ right:26%; }



	 .sel_data_harakteristiki{ flex-direction:column !important;}
main > p, div.main > p{ font-size:12px !important; line-height:1.4 !important;}
/*main > img, div.main > img { display:none}*/
/*main >details, div.main >details{display:none}*/

	 	 .video_aventos video{width:96%; margin:10px 2% 10px 2%}

	/* main>img, div.main>img{ display:none}*/

	 .photolink{ width:90%}

	 .imaginfo summary { margin:10px 0 0 0} 
      .imaginfo details img{margin:0; width:96%}
	 .imaginfo table { clear:both; width:98%; float:left; margin: 5px 0 2% 0 }
	/* div.imaginfo table tr td:nth-last-child(2) { font-size:14px}*/
	 .select.dc{ width:24%}

	 #jcart table tr td, .jcart-item-name{ font-size:12px !important}

	 .otpusk_jcart{  width:97% !important; right:2% !important  } 

	 #jcart{  width:12%; height:calc(var(--widthA)/6) }

/*.svg_tel{ width:12%;   }*/
	 	 .dropbtn{ width:12%; height:calc(var(--widthA)/ 6) }
         .svg_tel {width:6.0%;  margin:0 auto; height: calc(var(--widthA)/ 6); left:18% }
	/* .svg_tel{  margin:11px 0 0 7%;  }*/


	  div.top_content img{ width:30%; }
      .top_content details{  width:96%;  }

	 .telef{ width:99%}
ul.header  li:first-child{ font-size:15px; margin:10px 0 0 2%; }

ul.header{ background: #585858; font-size:14px   }

#slide_1 li:first-child span { display:none}
#slide_1 li:first-child+li  br { display:block}
	 
	 .select.petli{ width:90% !important; margin:3px 0 3px 0 !important }

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

.select.tbl{ width:65%}
	/*#home{ left:57px;}*/

#pokaz, #skrit {  margin-right:14%}
#jcart #skrit:before{ content:""}

div#slide_1 div ul li span{ float:left}
skidka-3-mobil.png
div#slide_4 li.slide_mobil, div#slide_5 li.slide_mobil, div#slide_6 li.slide_mobil, div#slide_7 li.slide_mobil{ opacity:0}

	 
  div.asoortiment_kargo div{ float:left; width:49%; padding:0 0.8% 0 0.8%;  }
  div.asoortiment_kargo div.double{width:98%;}
 
 .modal .popup {width:600px;}
select#ruchka{ float:left; margin:5px 0 0 3%}
/*Поиск*/
div#ya-site-form0{ float:left;  width:100%; margin:120px 0 0 0;  }
/*Видео*/

/*-------------новые стили для таблиц---------------*/
main div.imaginfo a, div.main div.imaginfo a { width:96%; padding: 0; margin:0 2% 0 0;}

 div#skidka_blum{ width:100%; margin-left:0}
 div#skidka_blum a.a-btn-3{ width:100%; margin-left:0; }
 div#skidka_blum .a-btn-3-text{ font-size:16px}
 a-btn-3-text
   .selectbox .select .text {width: 120%;}
form#otpravka_korzinki   div#kontakt_strit span.selectbox { width:35%; margin:6px 2% 0 0}
form#otpravka_korzinki   div#kontakt_strit input[name='ulisa'] { width:60%; clear:right  }
form#otpravka_korzinki   div#kontakt_strit input[name='n_dom'] { width:32%; float:left; text-align:left; clear:both; margin:10px 2% 0 0 }
form#otpravka_korzinki   div#kontakt_strit input[name='n_kor'] { width:32%; margin:10px 2% 0 0}
form#otpravka_korzinki   div#kontakt_strit input[name='n_kv'] { width:30%; margin:10px 0 0 0}
form#otpravka_korzinki   div#kontakt_oplata span.selectbox, form#otpravka_korzinki   div#kontakt_dostavka span.selectbox { width:90%; margin:6px 0 0 2%}
td.aksiya img{width:50% !important; position:absolute !important ; top:-15px !important }


.product {
    width: 49.0%;
}

.harakteristiki{width:99%; margin:50px 0 0 0;  float:left; }


.select.mass {
  width: 90%;
  padding: 3px;
  margin: 0 5% 0 5% !important;
}

}

	.ul_menu {background-color: #f1f1f1; float: left; padding: 0px 12px;  border: 1px solid #ccc; width: 70%; border-left: none;   background:none	}

@media all and (orientation:portrait) {
	.asoortiment_blum div{width:47.0%;}

	.ul_menu { clear:left; width:100%; position:static;}

.div_header { width: 80%;}

.aj_poiski{width:80%; margin:5px 0 5px 2% !important;}

}
@media all and (orientation:landscape) {
.asoortiment_blum div{width:30.6%;}
	.ul_menu {display:none; 
	 clear:left; width:100%;
	 clear:none; position:absolute;/* border:1px solid #720E00; */
	 left:35%; width:65% !important; top:50px ; opacity:1; z-index:1000
}

.div_header { width: 35%;}
.aj_poiski{width:60%; margin:5px 0 5px 30% !important;}
.breadcrumbs .breadcrumbs__item, .breadcrumbs__link { margin-top: 5px;}

#razmer_0_content, #razmer_1_content, #razmer_2_content, #razmer_3_content{background-size:auto 50px; background-position: 2% 5px; font-weight:bold !important}
#razmer_0_content ul li:first-child, #razmer_1_content ul li:first-child, #razmer_2_content ul li:first-child, #razmer_3_content ul li:first-child{ margin-top:0 !important; font-size: calc(1.7*35*var(--widthA)/(20*100)) !important;}
.procent{font-size: calc(1.7*35*var(--widthA)/(12*100)) !important; line-height:1.2}
 #razmer_4_content ul li, #razmer_5_content ul li, #razmer_6_content ul li{font-size: calc(1.7*35*var(--widthA)/(20*100)) !important; line-height:1.2}
 #group1, #group2{height: calc(var(--widthA) /8) !important;}
#group2{ background-size: auto calc(var(--widthA)/3); }
#group2{ background: url(img/fon-img.svg) right top no-repeat, #585858; background-size: auto 100% !important; }

	}