@charset "utf-8";
body{margin:0 0 0 0;background-color:#f7f6fb;font-family:Verdana;}

html, body{height:100%;}
p{margin-top: 5px; margin-bottom:5px;text-indent: 11px;}
a, a visited, a hover{text-decoration:none;color:black;}
h1{font-size:1.5em;font-weight:normal;}
h2{font-size:1.27em;font-weight:normal; display:block; margin-top:25px;}
h3{font-size:1.19em;font-weight:normal;margin-bottom:11px;margin-top:15px;}
h4{font-size:1em;font-weight:normal;font-style:italic;}
h5{font-size:1em;font-weight:normal;margin-top: 11px; margin-bottom:7px;}
.alternativah2{font-size:1.4em;font-weight:normal;}
.alternativah3{font-size:1.3em;font-weight:normal;}
.alternativah4{font-size:1.19em;font-weight:normal;font-style:italic;display:inline;}

img{display:block;border:none;max-width:100%;max-height:100%;}
#headercontainer{width:100%;display:flex;align-items:center;justify-content:center;overflow:auto;background:url(header.png) repeat-x;}
#header{width:87%;min-width:860px;display:flex;align-items:center;justify-content:space-between;overflow:hidden;}
.logoobertka{display:flex;width:9%;min-width:120px;margin-top:1%;align-items:center;justify-content:center;margin-left:1%;margin-right:1%;}
.logo{display:block;overflow:hidden;}
.logo img{max-width:100%;max-height:100%;}
.logotelephonemobile{display:none;}
.logotelephonemobile a{color:#686868;}
.telobertka{display:flex;width:100%;justify-content:center;margin-top:5px;margin-bottom:5px;}
.buttonobertka{display:flex;justify-content:space-between;width:55%;}
.catologbutton, .voprosybutton, .contactybutton {background-color:white;border: 1px solid; border-radius:5px;border-color:#e8e8e8;width:17%;min-width:170px;text-align:center;height:39px; display: flex;font-size:0.6em;}
.telephone{display: flex;font-size:1.1em;color:#686868;flex-direction:column;}
.telephone a{color:#686868;}
.telephone p{margin-top: 3px; margin-bottom:3px;text-align: center;}
.textbutton{display:block;margin: auto;font-size:1.7em;color:#686868;}
.textbutton a, a visited, a hover{color:#686868;}
#allpage{display:flex;flex-direction:column;height:100%;align-items:center;}
.content{flex:1 0 auto;display: flex;width:96%;margin-top:1%;justify-content:space-between;}
.leftblock{display: flex;flex-direction:column;width:15%;margin-top:15px;color:#686868;height:100%;font-size:0.9em;margin-left:3%;}
.leftblock a, a visited{color:#686868;}
.leftblock a hover{text-decoration:underline;color:#686868;}
.leftblock p{margin-top: 9px; margin-bottom:9px;text-indent: 0px;}
.leftblockunderline{border-bottom: 1px solid #e8e8e8;margin-right:11%;margin-top:15px;}
.leftblockbezline{border-bottom: 0px;margin-right:11%;margin-top:15px;}

.centerblock{display: flex;flex-direction:column;width:63%;height:100%;}
.main{width:100%;display:flex;margin-top:9px;background-color:white;border: 1px solid #e8e8e8;}
.main a, a visited, a hover{color:black;}







.maintextmobilgroups{display:none;}
.maintextgroupsdzag{display:block; margin-right:1%;margin-left:3%;margin-bottom:25px;}
.maintextgroupsdlin{display:block; margin-right:1%;margin-left:3%;line-height: 1.4;font-size:0.9em;}
.maintextgroupsdlin p{text-indent: 0px;}
.mainobertka{min-width:250px;display: flex;flex-direction:column;width:96%;justify-content:center;}
.obertka2{display: flex;justify-content:center;width:250px;}
.mainpicturedlin{height:250px;width:250px;}
.mainimageposition{display:block;margin:0 auto;float:none;}
.podrobnee{font-size:0.8em;text-decoration:underline;margin-top:15px;margin-bottom:5px;}
.obertka1{margin:11px 11px 11px 19px;}
.obertkahleb{margin:11px 11px 11px 19px;display:inline-flex;flex-direction:row; flex-wrap: wrap;justify-content:flex-start;}
.hlebniekroshki{width:100%;display:flex;margin-top:9px;background-color:white;border: 1px solid #e8e8e8;}
.opisaniegruppi{width:100%;display:flex;margin-top:9px;background-color:white;border: 1px solid #e8e8e8;flex-direction:column;line-height: 1.4;font-size:0.9em;}
.opisaniegruppi p{text-indent: 11px;}
.grupprice{margin-top: 11px; margin-bottom:5px;font-size:1.1em;font-weight:normal;}
.pictureblock{width:100%;display:flex;margin-top:9px;background-color:white;border: 1px solid #e8e8e8;}
.imgblockopis{width:96%;max-width:1600px;display:flex;align-items:center;justify-content:space-around;margin-bottom:5px;}
.imgblockopispics{width:30%;height:100%;}
.price, .knopkisoc, .osnovnie_parametry{width:100%;display:flex;margin-top:9px;background-color:white;border: 1px solid #e8e8e8;flex-direction:column;line-height: 1.4;font-size:0.9em;}
.osnovnie_parametry  a, a visited, a hover{text-decoration:underline;color:#686868;}

.faq, .rekvizity, .contacty {width:100%;display:flex;margin-top:9px;background-color:white;border: 1px solid #e8e8e8;flex-direction:column;line-height: 1.4;font-size:0.9em;}
.faq  a, a visited, a hover{text-decoration:underline;color:#686868;}
.contacty a, a visited, a hover{text-decoration:underline;color:#686868;}


.hide,
.hide + label ~ div {display: none;}

/* вид текста label */
.hide + label { margin: 0;padding: 0;display: inline-block;cursor: pointer;}
/* вид текста label при активном переключателе */
.hide:checked + label {border-bottom: 0;cursor: pointer;}
/* когда чекбокс активен показываем блоки с содержанием  */
.hide:checked + label + div {display: block;}
.hide + label:before{content: "\002B";font-size:1.3em; display: inline;margin-right:19px;text-align: center;}
.hide:checked + label:before {content: "\2212";}

.hide1,
.hide1 + label {display: none;}
/* вид текста label */
.hide1 + label { margin: 0;padding: 0;display: inline-block;cursor: pointer;}
/* вид текста label при активном переключателе */
.hide1:checked + label {border-bottom: 0;cursor: pointer;}
/* когда чекбокс активен, скрываем блоки с содержанием  */
.hide1:checked + label + div {display: none;}
.hide1 + label:before{content: "\2212" ;font-size:1.3em; display: inline;margin-right:19px;text-align: center;}
.hide1:checked + label:before {content: "\002B";}

.hide2,
.hide2 + label ~ div {display: none;}
/* вид текста label */
.hide2 + label { margin: 0;padding: 0;display: inline-block;cursor: pointer;}
/* вид текста label при активном переключателе */
.hide2:checked + label {border-bottom: 0;cursor: pointer;}
/* когда чекбокс активен, скрываем блоки с содержанием  */
.hide2:checked + label + div {display: block;}
.hide2 + label:after{content: "\25BC" ;font-size:0.8em; display: inline;margin-right:19px;text-align: center;color:#a6a6a6;}
.hide2:checked + label:after {content: "\25B2";}

.podch {text-decoration:underline;color:#686868;}



.alternativa, .garantiya, .skidki, .ssilki, .aksessuary, .podrobnoe_opisanie, .opros, .dopcontent, .tehnoinfo, .dostavka, .finalzakaz{width:100%;display:flex;margin-top:5px;background-color:white;border: 1px solid #e8e8e8;flex-direction:column;line-height: 1.4;font-size:0.9em;}
.podrobnoe_opisanie a{text-decoration:underline;color:#686868;}
.skidki a{text-decoration:underline;color:#686868;}
.alternativablock{width:100%;display:flex;justify-content:space-between;}
.alternativapic{width:19%;}
.alternativatext{width:79%;display:flex;flex-direction:column;margin: auto 0;}
.alternativaproduct{text-decoration:underline;font-size:1.19em;font-weight:normal;margin-top: 11px; margin-bottom:7px;}
.alternativazagol{font-size:1.19em;font-weight:normal;font-style:italic;}

.oprosblock{width:100%;display:flex;flex-direction:column;}
.oprostext{margin-top:19px;}
.dopcontenttext{margin-top:31px;}
.dopcontenttext a{text-decoration:underline;color:#686868;}
.dopcontentpicture{display:flex;justify-content:center;align-content:space-between; align-items: center;flex-direction:column;}

#oprospicture{margin:9px auto;width:74%;}
#vk_poll{width:100%;}
.oprostelo{margin:9px auto;width:64%;}

iframe {display:block;width:100%;border:none;min-height:315px;}
.svernut{margin-top:19px;}
.svernutspan{margin: 0;padding: 0;display: inline-block;cursor: pointer;font-size:0.8em; color:#a6a6a6;}
.dostavketext{margin-top:17px;width:100%;}

.aksessuaryzakaz{width:100%;display:flex;flex-direction:column;margin-bottom:9px;margin-top:17px;}
.aksessuaryzakazitem{width:100%;display:flex;justify-content:space-between;align-items:center;margin-bottom:9px;margin-top:9px;}
.aksessuaryzakazcheck{width:5%;}
.aksessuaryzakazpic{width:11%;}
.aksessuaryzakaztext{width:81%;}
.aksessuaryzakaztext h6{text-decoration:underline;font-size:1.1em;font-weight:normal;}

.zakazadress{width:100%;margin-top:27px;}
.zakazadress  a, a visited, a hover{text-decoration:underline;color:#686868;}
.zakazinfo{width:100%;margin-top:27px;}
.deliverytext {width:100%;margin-top:17px;}
.itogcena {width:100%;margin-top:19px;font-size:1.1em;}
input#addresszakaz {border:1px solid black;border-radius:5px;width:100%;}
input#addresszakaz1 {border:1px solid black;border-radius:5px;width:100%;}
input#address {border:1px solid black;border-radius:5px;width:100%;}
.ya-share2{margin-top:13px;}

.obertka3{display: flex;justify-content:center;width:100%;align-items:center;margin-top:9px; margin-bottom:9px;text-align:center;}
.zakazbutton{border:1px solid #e8e8e8;border-radius:5px;font-size:1.1em;width:78%;cursor:pointer;background-color:#ccd1e4;margin-bottom:19px;margin-top:19px;}
.zakazbutton a{ display: block;text-align: center;height: 100%;}
#box{min-height:35px;width:100%;text-align:justify;}
#box1{min-height:35px;width:100%;text-align:justify;}
img{display:block;border:none;max-width:100%;max-height:100%;}
input[type="text"]{border:1px solid black;border-radius:5px;font-size:1.1em;width:39%;min-width:235px;}
input.button{border:1px solid #e8e8e8;border-radius:5px;font-size:1.1em;width:29%;cursor:pointer;min-width:99px;background-color:#ccd1e4;height:35px}
textarea{border-radius:5px;border:1px solid black;overflow:auto;width:39%;font-size:1.5em;min-width:235px;}
.shiftbigger{font-size:1.1em;font-weight:bolder;}



.rightblock{display: flex;flex-direction:column;width:21%;margin-top:15px;font-size:0.9em;margin-left:1%;}
.rightblockcontent{width:100%;display:flex;margin-top:5px;background-color:white;border: 1px solid #e8e8e8;margin-left:1%;flex-direction:column;}
.rightblockcontentzag{width:88%;margin-top:15px;margin-left:6%;}
.rightblockcontentpick{width:88%;margin-top:15px;margin-left:6%;}
.rightblockcontentpick img{width:100%;height:100%;}
.rightblockcontenttext{width:88%;margin-top:5px;margin-left:6%;font-size:0.9em;}
.rightblockcontentssilka{width:88%;margin-top:15px;margin-bottom:15px;margin-left:6%;color:#686868;font-size:0.8em;}

.karta{width:96%;max-width:600px;}
.karta img{max-width:100%;max-height:100%;}
.karta a{text-decoration:none;border-bottom:0px solid currentColor;}

#footer{flex:0 0 auto;justify-content:space-between;display:flex;align-items:center;background:url(footer.png) repeat-x;height:100px;width:100%;}
.footercontent{margin-left:5%;margin-right:5%;color:#686868;font-size:0.8em;}
.footercontentmobil{display:flex;margin-left:5%;margin-right:5%;color:#686868;font-size:0.8em;align-content:center;flex-direction:column;}
.footercontentmobilhren{display:flex;margin-left:5%;margin-right:5%;color:#686868;font-size:0.8em;align-content:center;flex-direction:column;}
.footercontentmobil a{color:#686868;}


.picturetoleft{float:left; margin: 7px 7px 7px 0;}
.picturetoright{float:right; margin: 7px 0 7px 7px;}
.picturetocenter{float:center; margin: 7px 7px 7px 7px;}

.articlezag{display:block; margin-right:1%;margin-left:3%;margin-bottom:15px;margin-top:15px;}
.articleopisanie{display:block; margin-right:1%;margin-left:3%;line-height: 1.4;font-size:0.9em;}
.articleopisanie p{text-indent: 0px;}
.articleread{font-size:0.8em;text-decoration:underline;margin-top:15px;margin-bottom:15px;}
.articlecenterpicture{display:flex;justify-content:center;align-content:space-between; align-items: center;flex-direction:column;margin-bottom:15px;}

.obertkaarticle{margin:11px 11px 11px 19px;}
.obertkaarticle a, a visited, a hover{text-decoration:underline;color:#686868;}

.ssilkastat{font-size:0.8em;text-decoration:underline;margin-right:1%;margin-left:3%;margin-bottom:13px;margin-top:13px;}

.spisok ol {
/* убираем стандартную нумерацию */
list-style: none; 
/* Идентифицируем счетчик и даем ему имя li. Значение счетчика не указано - по умолчанию оно равно 0 */ 
counter-reset: li; 
line-height: 1.9;
}
.spisok li:before {
/* Определяем элемент, который будет нумероваться — li. Псевдоэлемент before указывает, что содержимое, вставляемое при помощи свойства content, будет располагаться перед пунктами списка. Здесь же устанавливается значение приращения счетчика (по умолчанию равно 1). */
counter-increment: li; 
/* С помощью свойства content выводится номер пункта списка. counters() означает, что генерируемый текст представляет собой значения всех счетчиков с таким именем. Точка в кавычках добавляет разделяющую точку между цифрами, а точка с пробелом добавляется перед содержимым каждого пункта списка */
content: counters(li,".") ". "; 
line-height: 1.4;
}


.filtrcontainer{display:flex;margin-top:9px;background-color:white;border: 1px solid #e8e8e8;width:100%;}
.obertkafiltr{margin:11px 11px 11px 19px;width:100%;}
.filtrspisok{display:flex;width:100%;flex-wrap:wrap;font-size:0.9em;}
.harak{display:flex;flex-direction:column;width:30%;margin-right:3%;}
.harakzag{font-size:1em;font-weight:bold;margin-top:9px;margin-bottom:9px;}
.group{ display:flex;font-size:0.8em;align-items:center;}
.filtrspan{display: inline-block;cursor: pointer;font-size:1.1em; margin-bottom:11px;margin-top:11px;}
.hide_filtr,
.hide_filtr + label  {display: none;}
.hide_filtr + div {display: block;}
/* вид текста label */
.hide_filtr + label { margin: 0;padding: 0;display: inline-block;cursor: pointer;}
/* вид текста label при активном переключателе */
.hide_filtr:checked + label {border-bottom: 0;cursor: pointer;}
/* когда чекбокс активен, скрываем блоки с содержанием  */
.hide_filtr:checked + label + div {display: block;}
.hide_filtr + label:after{content: "\25BC" ;font-size:0.8em; display: inline;margin-left:19px;text-align: center;color:#a6a6a6;}
.hide_filtr:checked + label:after {content: "\25B2";color:#a6a6a6;}
input.buttonfiltr{border:1px solid #e8e8e8;border-radius:5px;font-size:1em;cursor:pointer;min-width:99px;background-color:#ccd1e4;height:35px;margin-top:11px;margin-left:3%;margin-right:3%;}
.filtrbuttons{display:flex;flex-direction:row;width:100%;}

.sortcontainer{display:flex;margin-top:9px;background-color:white;border: 1px solid #e8e8e8;width:100%;}
.obertkasort{margin:11px 11px 11px 19px;width:100%;display:flex;}
.sortbuttons{display:flex;flex-direction:row;width:100%;}
input.buttonsort{border:1px solid #e8e8e8;border-radius:5px;font-size:1em;cursor:pointer;min-width:99px;background-color:#ccd1e4;height:35px;margin-left:11px;margin-right:11px;}
.sortcontainermob{display:none;}


@media screen and (min-device-width:120px)
and (max-device-width:599px) and (orientation:portrait)
{
#header{width:98%;min-width:130px;flex-direction:column;justify-content:center;}	
.logoobertka{width:98%;justify-content:space-around;}
.logo{width:19%;}
.logotelephonemobile{display:flex;width:71%;font-size:1.19em;align-content:center;flex-direction:column; }
.buttonobertka{flex-direction:column;margin-top:5px;width:100%;justify-content:center;}
.catologbutton, .voprosybutton, .contactybutton {margin:auto;font-size:0.7em;}
.telephone{display: none;}
.leftblock{display:none;}
.rightblock{display:none;}
.content{width:96%;justify-content:center;}
.centerblock{width:100%;justify-content:center;}
.main{flex-direction:column;}
.maintextmobilgroups{min-width:250px;display:block; margin-right:1%;margin-left:3%;margin-top:3%;}
.maintextgroupsdzag{display:none;}
.obertka1{margin-right:1%;margin-left:3%;font-size:1.1em;}
.obertka1 p{text-indent: 0px;}
.obertka2{width:100%}
.leftblock{display:none;}
.footercontent{display:none;}
.footercontentmobil{font-size:1.3em;}
.footercontentmobilhren{display:none;}
.podrobnee{font-size:1em;}
#oprospicture{width:100%;}
.oprostelo{width:100%;}
.aksessuaryzakazpic{display: none;}
.aksessuaryzakaztext{font-size:0.9em;width:91%;}
.alternativablock{margin-top:9px;margin-bottom:9px;}
input[type="text"]{font-size:18px;width:79%;box-sizing:border-box;min-width:199px;}
input.button{width:94%;min-width:131px;}
textarea{width:94%;min-width:199px;font-size:16px;}	

ol, ul {margin: 0;padding: 0;list-style: none;counter-reset: li;}
li:before {
/* Определяем элемент, который будет нумероваться — li. Псевдоэлемент before указывает, что содержимое, вставляемое при помощи свойства content, будет располагаться перед пунктами списка. Здесь же устанавливается значение приращения счетчика (по умолчанию равно 1). */
counter-increment: li; 
/* С помощью свойства content выводится номер пункта списка. counters() означает, что генерируемый текст представляет собой значения всех счетчиков с таким именем. Точка в кавычках добавляет разделяющую точку между цифрами, а точка с пробелом добавляется перед содержимым каждого пункта списка */
content: counters(li,".") ". "; 
}

.harak{width:49%;margin-right:0;}
.filtrbuttons{flex-direction:column;}
input.buttonfiltr{width:74%;margin-left:11%;margin-right:0;}


.sortcontainer{display:none;}
.sortcontainermob{display:flex;margin-top:9px;background-color:white;border: 1px solid #e8e8e8;width:100%;}
.obertkasort{margin:5px 5px 5px 9px;width:100%;display:flex;}
.sortbuttons{display:flex;flex-direction:row;width:100%;justify-content: space-around;}
input.buttonsort{border:1px solid #e8e8e8;border-radius:5px;font-size:1em;cursor:pointer;min-width:49px;background-color:#ccd1e4;height:35px;}

}

@media screen and (min-device-width:120px)
and (max-device-width:799px) and (orientation:landscape)

{
#header{width:98%;min-width:130px;flex-direction:column;justify-content:center;}	
.logoobertka{width:98%;justify-content:space-around;}
.logo{width:19%;}
.logotelephonemobile{display:flex;width:71%;font-size:1.19em;align-content:center;flex-direction:column; }
.buttonobertka{flex-direction:row;margin-top:5px;width:100%;justify-content:center;}
.catologbutton, .voprosybutton, .contactybutton {margin:auto;font-size:0.7em;}
.telephone{display: none;}
.leftblock{display:none;}
.rightblock{display:none;}
.content{width:94%;justify-content:center;}
.centerblock{width:100%;justify-content:center;}
.main{flex-direction:row;}
.maintextmobilgroups{display:none;}
.maintextgroupsdzag{display:block;}
.obertka2{width:100%}
.footercontentmobil{font-size:1.3em;}
.footercontent{display:none;}
.podrobnee{font-size:1em;}
.aksessuaryzakazpic{display: block;}
.aksessuaryzakaztext{font-size:1em;width:81%;}
.footercontentmobilhren{display:block;}
input[type="text"]{font-size:18px;width:79%;box-sizing:border-box;min-width:199px;overflow: hidden;display: block;}
input.button{width:94%;min-width:131px;}
textarea{width:94%;min-width:199px;font-size:16px;}	
.sortcontainer{display:none;}
.sortcontainermob{display:flex;margin-top:9px;background-color:white;border: 1px solid #e8e8e8;width:100%;}	
.obertkasort{margin:5px 5px 5px 9px;width:100%;display:flex;}
.sortbuttons{display:flex;flex-direction:row;width:100%;justify-content: space-around;}
input.buttonsort{border:1px solid #e8e8e8;border-radius:5px;font-size:1em;cursor:pointer;min-width:49px;background-color:#ccd1e4;height:35px;}
	
	
}