@charset "UTF-8";
html { min-height: 100%;}
progress, meter {max-width: 90%}
/*
@media (prefers-dark-interface) { body{ background-color:darkgray;} .ui-widget-content  { background:gray;} }
@media (prefers-color-scheme: dark) { body{ background-color:darkgray;}  .ui-widget-content  { background:gray;} }
*/
 
/*article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block;}*/



body{
    margin:0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
    font-size: 0.88em;
  
   }

mark,.mark{background-color: gold;}


img {max-width:100%; }
article figure img {height: auto;  }

#body{ max-width:1700px; margin:0 auto;}

#main{   margin: 0.5rem; }

@media screen and (min-width: 650px) { 
.blur {
filter: blur(3px); 
overflow: hidden;
overflow: clip;
}


}
.line-disabled{ text-decoration:line-through;}
.tableflex{
display: flex;
flex-flow: row;
flex-wrap: wrap;
flex-direction: row;
justify-content:center;
 /*flex-basis: 100%;*/
 align-items: center;
 position: relative;
 }

.align-items-normal{align-items: normal;}


.trflex{border:1px dotted gray; }



.tdflex0,.tdflex1,.tdflex2,.tdflex3 ,.tdflex4, .tdflex5, .tdflex6{padding:0.1em 0.1rem; box-sizing:border-box; }
.tdflex0{flex: 1 0 1rem; min-width:1rem; text-align:center;}
.tdflex1{flex: 2 0 2rem; min-width:2rem; text-align:center; }
.tdflex2{flex: 3 0 3rem; min-width:3rem; text-align:center; }
.tdflex3{flex: 4 0 4rem; min-width:4rem; text-align:left; }
.tdflex4{flex: 5 0 5rem; min-width:5rem; text-align:left;}
.tdflex5{flex: 6 0 6rem; min-width:6rem; text-align:left;}
.tdflex6{flex: 7 0 7rem; min-width:7rem; text-align:left;}

@media screen and (max-width:34rem) {
.tableflex{ justify-content: space-around; }
.tdflex0,.tdflex1,.tdflex2,.tdflex3,.tdflex4, .tdflex5, .tdflex6{  text-align:center; flex-basis: 100%; /*display:block; width:100%;*/ justify-content: stretch; /*float:none;*/}

.foto_dital img { height:7rem;  }
}

.tab_border, .tab_border td{border-bottom:1pt dotted gray;}

.trwhitetb td, .trwhitetb th{border-bottom:1px solid gray;}

#main{
display: flex;
order: 1;
flex-grow:1;
flex-flow: row;
flex-wrap: wrap;
flex-direction: row;
justify-content:flex-start;
  line-height:1.3rem;
}



.contener_root{flex: 6 1 40rem; order:1; }

.contener_right{flex: 1 1 13rem; order:2; }



@media all and (orientation: portrait), all and (max-width: 53em) {
	.contener_root, .contener_right {  flex-basis:100%; display:block; width:100%; justify-content: stretch;  float:none;}
}



.forumlinrew{ border:0.2em double gray; position: relative; }

.content_1{flex:1 1 10rem; order: 1; margin:0.1em 0.2rem; text-align:center; border-right:1pt dotted gray;}
.content_2{flex:6 1 15rem;  order: 2; margin:0.1em 0.2rem; }



@media  screen and (max-width:34em) {
.content_1, .content_2{justify-content: stretch; flex-basis: 100%; width:100%;}
.content_1{border-right:none;}
.content_2{border-top:dotted gray;}
}


.footer_body { display:block; padding:0.4rem; min-height:3rem;}
.footer_body a{ line-height:2rem;}

.header { margin-top:2rem; padding:0.4rem; box-sizing: content-box; }



.h1{ font-family: 'Roboto',"Helvetica Neue"; font-size:x-large;}



@media screen and (max-width:1000px)  { #main .h1  { font-size:xx-large;} }
@media screen and (max-width:800px)  { #main .h1{ font-size:x-large;} }
@media screen and (max-width:400px)  { #main .h1{ font-size:large;}  }

.heder_left{ display:inline-block;  margin-left:6%;  }
.heder_right{ display:inline-block; margin-right:6%;  }

@media screen and (max-width:60em)
{
.heder_left {margin-left:1%;  }
.heder_right{margin-right:1%;  }
}


.tabsort{height:3rem;}

.space-between { display: flex; justify-content: space-between; align-items: center;}
.space-around{ display: flex;  justify-content: space-around; align-items: center;}
.nowrap {white-space:nowrap;}

.floleft{ float:left;}
.floright{ float:right;}
.nofloat{clear:both; }
.userselect_none{user-select: none;}



.margin1{ margin:1rem; }
.margin05{ margin:0.5rem; }
.padding02 {padding: 0.2rem;}
.padding05 {padding: 0.5rem;}

#butcustgru{
padding:1rem;
position: fixed;
right:0rem;
top: 75%;
z-index:255;
}

#catroot:empty, .adsbygoogle:empty, #butcustgru:empty {display:none; box-shadow:none; background:none; }


#sortbut{
display:none;
opacity:0.85;
position: fixed;
right:2rem;
top:8%;
z-index:1255;
}




.aciya{margin-top:10px; width:380px; padding:2px;}
.aciya legend{font-weight:bold; padding:0.5rem;}


#googleMap img {max-width: inherit;}


.headpanel_fix{
width: 100%;
max-width:1700px;
z-index: 50;
position: fixed;
left:initial;
top:0;
}


/*begin search*/
.search_txt{ font-size:large; margin:0.2rem; padding:0.3rem 0.2rem 0.3rem 1.7rem; width:68%; background-image: url('https://kremchik.ua/img/search.webp'); background-repeat: no-repeat; }

.i-sale::after, .i-new::after, .i-hot::after {
background-image: url('/img/sales_new_hot.png');
background-repeat: no-repeat;
content: " "; width: 55px; height: 55px;  position:absolute; left: 0; top: 0;
}
.i-sale::after { background-position: -0px -0px;}
.i-new::after { background-position: -56px -0px;}
.i-hot::after { background-position: -110px -0px;}



.span_button{
  display: inline-block;
  padding: 0.4rem;
  font-weight:bold;
}

.cusshid, .picadviw {display:block;}
.picadviw::before {content: "📷 ";}
.cusshid::before {content: "👥 "; }
.news_posts::before {content: "📰"; }
.user_external_link::before {content: "🔗"; color:Navy;}
.respect{color:#069;}
.respect::before {content: "👍"; color:OrangeRed;}
.comments::before { content: "💬 ";}


.voting_like1::after ,.voting_like2::after, .voting_like3::after, .voting_like4::after, .voting_like5::after, .voting_like6::after, .voting_like7::after, .voting_like8::after, .voting_like9::after { position:relative; top:-3.8rem; left:-3rem; color: crimson;}
  .voting_like1::after { content: "♥"; }
  .voting_like2::after { content: "♥♥";}
  .voting_like3::after { content: "♥♥♥";}
  .voting_like4::after { content: "♥♥♥♥";}
  .voting_like5::after { content: "♥♥♥♥♥";}
  .voting_like6::after { content: "♥♥♥♥♥♥";}
  .voting_like7::after { content: "♥♥♥♥♥♥♥";}
  .voting_like8::after { content: "♥♥♥♥♥♥♥♥";}
  .voting_like9::after { content: "♥♥♥♥♥♥♥♥♥";}



.product_name_wrap {
    display:block;
    text-overflow: ellipsis;
    outline: none;
    font-weight: bold;
}


.flex{
/*width:100%;*/
display: inline-flex;
display: flex;
flex-wrap: wrap;
justify-content:center;
box-sizing:border-box;
column-gap: 0.5rem;
row-gap: 0.5rem;
}



.flex_Item{flex: 1 0 13rem; /*margin:0.5rem 0.5rem;*/ padding-top: 0.2rem; text-align:center; position:relative;  page-break-inside: avoid; font-size:small;}

@media screen and (max-width:1100px) {
.flex_Item{flex: 1 0 11rem;}

}


@media screen and (max-width:600px) {
.flex_Item{flex: 1 0 9rem;}
}


.flex_Item strong{display:block;}

@media screen and (max-width:30rem) {
  .flex{
justify-content: stretch;
flex-basis: 100%;}
/*.flex_Item{width:100%;}*/
 }

.tv_bimg img {border:0.2em solid #FFFFFF;}
.tv_bimg img:hover{border:0.2em solid #FF8000;}
 
a:link, a:visited{text-decoration:none;}
a:hover, a:active {text-decoration:underline;}

#catroot {  min-width:14rem;  max-width:80%; z-index:75; position:fixed; right:2%; top:2%; box-sizing: border-box; overflow:auto; max-height:98%;  padding:0.2%; overflow-x:hidden; overflow-x:clip; box-shadow:0.2rem 0.2rem 1rem #28313c;}

 .foto_dital {display:inline-block; position:relative;  }
 
.brifprice{color:#b10c0c; font-weight:bold;}

.for_sex27::before, .for_sex28::before, .for_sex29::before{ 
     z-index: 3;
    position: absolute;
    left: -0.2rem;
    top: -0.2rem;
    }

.for_sex27::before { content: "♀"; color:Magenta;  unicode-bidi: bidi-override;}
.for_sex28::before { content: "♂"; color:MediumBlue;  unicode-bidi: bidi-override;}
.for_sex29::before { content: "‍‍♀♂"; unicode-bidi: bidi-override;
  background: linear-gradient(90deg, Magenta 50%,  50%, MediumBlue);
   color:transparent;
  -webkit-background-clip: text;
  }

.comments {clear:both; display:block; margin-top:0.5rem; color:#717171;  }
.comments_legend{padding:0.4rem 0.2rem }
.comments_legend .avatar{margin-top:-.3rem;}
.commlist{clear:both; display:block; position: relative; margin-bottom:1.2rem;}
.commlist legend{  margin-bottom:0.5rem;}

.avatar {max-height:3.5rem;}




blockquote{
margin:0.8rem;
padding:0.5rem;
border:0.1Em solid lightgrey;
}


/* forum  */


.custgroup1::after,.custgroup2::after,.custgroup3::after,.custgroup4::after,.custgroup6::after, .custgroup8::after { /*font-size:large;*/ color:OrangeRed ;  }
.custgroup1::after { content:' 🐧 Администратор'; }
.custgroup2::after { content:' 👩‍⚖️ Модератор';}
.custgroup3::after { content:' 🕵️‍♀️ Cмотритель';}
.custgroup4::after{ float:none; content:' 👸 Модератор темы';}
.custgroup6::after { float:none; content:' 🙊 парится в бане';}
.custgroup8::after { content:' 🍀 контент менеджер'; }

.footered{ text-align:right;
position: absolute;
right: 0;
bottom: -0.5rem;
}

.hedered{
position: absolute;
right: -0.2rem;
top: -0.2rem;
z-index: 78;
}



/* forum End */




div.pclick, img, .headpanel li, blockquote,  nav, .navigation a:link, .navigation i, .navigation a:visited, .navigation a:active, input, textarea {
border-radius: 0.5rem;
}


nav ul  { list-style-type: none; list-style: none; margin-left: 0; padding-left:0;}



.border_radius25{ border-radius:25%;}
.border_radius50{ border-radius:50%;}
.button_reset_style{ border-style:none; background:none; }
.plashka_pop{  position: absolute; z-index: 299; }

.tracking_user{display:inline-block; width:4.6rem; min-height:4.5rem; font-size:x-small; text-align:center; overflow:hidden; overflow: clip;}
.tracking_user p {overflow-x:hidden; overflow-x: clip;}
.tracking_user::after {  font-size:x-small;}

.trwhite1 tr,
.tracking_user,
.transition_duration,
.box_shadow_hover
{
  transition-duration:1.57s;
  transition: all 1.5s;
}

.list_ul { 
  list-style-type: none; 
  list-style: none; 
  margin-left: 0;
  padding-left:0;
 }



/*

 input[type=password]:focus, input[type=text]:focus {background-color: #ffffe1;}
 */
 
 summary:hover, .picadviw:hover, .cusshi:hover, .navigation i:hover,  label:hover, .user_external_link:hover, input[type="range"]:hover, button:hover, .remove:hover, .pclick:hover, input[type=image]:hover, .autocomplete-suggestion:hover
 { cursor:pointer;}

button:disabled { cursor:not-allowed;} /*  показываем курсор запрещения на disabled */


  dl.additional{ margin-block-start: 0; margin-block-end: 0;}
  .additional dt{ display: inline-block; font-weight:bold;  }
  .additional dt::after{ content: ":";}
  .additional dd{ display: inline-block; margin-inline-start:0.5rem; }


/* begin for order */
.inputbox {max-width:90%; padding:0.3rem;  font-size:large;}
.inputboxeror { border:2px solid #FF8080; font-size:large;}
.inputboxoki { border:2px solid #80FF80; font-size:large;}
.inputtextarea { max-width:90%; padding:0.6rem; height:4rem; border:1px solid #b0b0b0; font-size:large;}


/*начало product_reting_blok*/
#durabilitytxt, #looptxt {  font-size:large;  }
#durabilitytxt em, #looptxt em { font-size:small;}
.retingpr div{ width:0.1rem; height: 1rem; background: #ff248a;}
.waiting_r::before, .clslove_r::before, .clshad_r::before, .clswant_r::before, .clshave_r::before, .testwant_r::before, .clslike_r::before, .clsdislike_r::before, .change_parfum_r::before{
  content: "⛔";
    font-size: small;
    position: relative;
    bottom: -0.5rem;
    left: -0.2rem;
} 
ul.similar{ list-style-type: none; list-style: none; margin-left: 0; padding-left:0;}
.similar li{ flex: 1 1 7.3rem; min-width:7.3rem; margin:0.2rem 0.2rem; text-align:center; }
@media screen and (max-width:400px) { .similar li{ width:100%;} }
.similargolos > * { font-size: small;}
/*конец product_reting_blok*/

textarea, input{ padding:0.3rem;}
input:invalid {
animation-duration:1s;
animation-fill-mode: both;
animation-name: rubberBand;
 }

input[type="range"] { width: 95%; padding: 0.2rem; }

.picturecontenerroot
{
  display: inline-grid; 
 /* width:100%;*/
}
.picturecontener{
   max-height: 4.4rem;
   white-space:nowrap;
    overflow-y: hidden;
    overflow-y: clip;
    overflow-x: auto;
    scroll-behavior: smooth; 
}



.link_bold{ font-weight:bold;}

.sales{font-size:large; color:cornflowerblue; font-weight:bold;}
.balplus, .balplus a:link, .balplus a:visited {color:Green;}
.balnul{color:Navy;}
.balminus, .balminus a:link, .balminus a:visited{color:OrangeRed;}

.legendtitle{padding:0.7rem; font-size:large; font-weight:bold;}

.disfoot{
  position: absolute;
  bottom: -2px;
  left: 30%;
  }

.disbox{margin-bottom:2rem; position:relative;}
.box-hide{ overflow:hidden; max-height:18rem;}

.box-hide:before{
  content:''; display:block; position:absolute; bottom:0; right:0; left:0; height:3rem;
  background: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1));
}






@media print {
    .hidden-print{display:none;}
  /*  a[href^=http]:after {content:" <" attr(href) ">";*/
}


.fImgtotop{position:fixed; bottom:0.2rem; right:1px; z-index: 99;}




/* Верхнее горизонтальное меню */
.mobile-navigarion-menu {  text-align: center;}
.mobile-navigarion-menu  span, .mobile-navigarion-menu  a{  margin-left:1.5%;}
.mobile-navigarion-menu  a:hover {  text-decoration: underline; }
.mobile-navigarion-button{ width: 100%}
.mobile-navigarion-button::after {  display: inline-block; content: "🔻";  transform: rotate(-90deg);}
#mobile-navigarion-bar:hover > .mobile-navigarion-button::after, #mobile-navigarion-bar:active > .mobile-navigarion-button::after{ 
 content: "🔻"; 
  animation-duration:1s;
  transform: rotate(0deg);
  animation-fill-mode: both;
  animation-name: rubberBand;
}

@media screen and (min-width: 600px) {
 #mobile-navigarion-bar{  font-size:x-small; }
.mobile-navigarion-menu button { font-size:x-small;  }
}


@media screen and (max-width: 600px) {   /* для мобильных меню скрываем и показываем только по навидеию */


#mobile-navigarion-bar:hover > div.mobile-navigarion-menu, #mobile-navigarion-bar:active > div.mobile-navigarion-menu{ display:block; }
.mobile-navigarion-menu { text-align: left; margin-top:0.5rem; }
.mobile-navigarion-menu span, .mobile-navigarion-menu a { display: block; margin:0.5rem 0.2rem; border-bottom: 1px solid #b8c0a0;}
.mobile-navigarion-menu a { display:block;  margin:0.5rem 0.2rem; }
}

/*конец горизонтального меню */


/*Выпадаеющее меню*/
.ui-menu { 
  font-weight: initial;
  box-shadow: 5px 5px 7px rgba(0,0,0,0.4);
  position: absolute; z-index:299; 
  right: 1rem;
  list-style-type: none;
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}

.ui-menu > li{
cursor: pointer;
position: relative;
padding: .2em;
}

.ui-menu li.submenu > ul  {
   display:none;
   position: absolute;
   top:0.1rem;
    right: 10.5rem;
    min-width:13rem;
    animation-duration:1s;
}
li.submenu:hover> ul, li.submenu:active > ul{    
  display: block;  
  animation-fill-mode: both;
  animation-name: fadeInRight;
 }
/* конец выпадающего меню */



.show{display:block;}
.hidden{display:none;}



.desk-widget-container{
display: flex;
 flex-flow: row;
flex-wrap: wrap;
flex-direction: row;
justify-content:center;
 flex-basis: 100%;
 align-items: center;
 background-color: hsla(1,1%,80%,.85);
position: fixed;  bottom:1.4rem; left:0;
z-index:120;
}

@media screen and (max-width: 600px) {  .desk-widget-container {   position: fixed;  bottom:0; left:0; }}

.desk-widget-container-item { flex: 1 0 1rem; min-width:1rem; text-align:center; margin: 0.2em 0.2rem; white-space: nowrap;}
.desk-widget-container-item img  { transition: all .4s ease-in-out; filter: grayscale(65%);  }
.desk-widget-container-item img:hover {  transform: scale(1.5) translate(10%, -15%); filter: grayscale(0); }

.labelcheckbox-triger input {  display: none;}
.labelcheckbox-triger input:not(:checked) ~ label::before { content: "📲"; font-size:xx-large;   position: relative;  bottom:0; left: 0.1rem;}
.labelcheckbox-triger input:checked ~ label::before { content: "⬅️"; font-size:xx-large; position: relative;  bottom: 0;  left: 0.1rem;}
.labelcheckbox-triger input:not(:checked) ~ span.desk-widget-container-phone { display: none;}



.labelcheckbox input {   position: absolute;  z-index: -1;  opacity: 0;  }
.labelcheckbox label input:not(:checked) ~ span::before { content: "⬜"; margin-right:0.3rem; border: 1px solid #aaa; font-size:large; position: relative;  top: 0.1rem; left: 0.1rem;}
.labelcheckbox label input:checked ~ span::before { content: "☑️"; margin-right:0.3rem; font-size:large; position: relative; top: 0.1rem;  left: 0.1rem;}
.labelcheckbox input:focus + span::before {
  box-shadow: inset 0 2px 3px rgba(0,0,0,.5), 0 0 2px 3px rgba(255,255,0,.7); /* цвет ободка при фокусе на чекбоксе*/
}
 



@media screen and (max-width: 1200px) { .hidden1200 {display:none;}  }
@media screen and (max-width: 1000px) {  .hidden1000 {display:none;}  }
@media screen and (max-width: 900px) { .ui-menu li.submenu > menu{ right:10rem; min-width: 10.5rem;} .hidden900 {display:none;} .show900{ display:inline-block;} }
@media screen and (max-width: 850px) { .hidden850 {display:none;}  }
@media screen and (max-width: 750px) { .hidden750 {display:none;}  }
@media screen and (max-width: 720px) { .hidden720 {display:none;}  }
@media screen and (max-width: 650px) { .hidden650 {display:none;} .show650{ display:block;}}
@media screen and (max-width: 600px) { .hidden600 {display:none;} .show600{ display:block;}}
@media screen and (max-width: 550px) { .hidden550 {display:none;} .show550{ display:block;}}
@media screen and (max-width: 500px) { .hidden500 {display:none;} .show500{ display:block;}}
@media screen and (max-width: 450px) { .hidden450{ display:none;} .show450{ display:block;}}
@media screen and (max-width: 400px) { .hidden400{ display:none;} .show400{ display:block;}}
@media screen and (max-width: 350px) { .hidden350{ display:none;} .show350{ display:block;}}
@media screen and (max-width: 250px) { .hidden250{ display:none;} .show250{ display:block;}}

.red{ color:#FF0000;}
.darkorange{ color:#b1610c;}
.bordflag{background-color:#FFFFFF;}
.bordflag0{ background-color:#FF0000;}
.bordflag1{ background-color:#FF8040;}
.bordflag2{background-color:chartreuse;}
.bordflag3{ background-color:#0080C0;}
.bordflag4{background-color:#008000;}
.bordflag5{ background-color:#80FFFF;}
.bordflag6{ background-color:#FAF4FF;}
.bordflag7{background-color:#C0C0C0;}
.bordflag8{background-color:#BC79FF;}
.bordflag9{background-color:#DBCDCC;}
.bordflag10{background-color:#F77AFF;}
.bordflag11{background-color:#007AFF;}
.bordflag12{background-color:#CC7AFF;}
.bordflag13{background-color:#808040;}
.bordflag14{background-color:#0080C0;}
.bordflag5275{background-color:#A8F48A;}



.elementwidth100{width:100%}
.position-relative{ position: relative;}
.text-aligncenter {text-align:center;}
.text-alignright {text-align:right;}
.text-alignleft {text-align:left;}
.font-size-xx-large{ font-size:xx-large;}
.font-size-x-large{ font-size:x-large;}
h1, .font-size-large{ font-size:large;}
h2,h3,h4,h5, .font-size-medium{ font-size:medium;}
.font-size-small{ font-size:small;}
.font-size-x-small{ font-size:x-small;}
.font-size-xx-small{ font-size:xx-small;}
.smalltxt:hover{ text-shadow: 1px  1px  2px  #b8c0a0; }
.text-item-hover {transition: all .5s ease-in-out;}
.text-item-hover:hover {  transform: scale(1.5) translate(10%, -15%); }
/*
.priceold {
    display: block;
    text-decoration: line-through;
  }
.priceold::before { float:right; font-size: x-large; content: "🦄";}
*/
.autocomplete-category{  font-weight:bold;  margin:.5rem;  }

.autocomplete-category::before { content: "➡️";}

.autocomplete-suggestions {
   text-align: left; cursor: default; border: 1px solid #ccc; border-top: 0; background-color: #fff; box-shadow: -1px 1px 3px rgba(0,0,0,.1);
    position: absolute; display: none; z-index: 9999; max-height: 254px; overflow:hidden; overflow:clip; overflow-y:auto; box-sizing: border-box;
    list-style: none;
    padding: 0;
    margin: 0;
    outline: 0;
}

.autocomplete-suggestion img {
    margin-right: 0.2rem;
}

.autocomplete-suggestion { position: relative; padding: 0.4em; line-height:1.3rem; white-space:nowrap; text-overflow:ellipsis;  color: #333; }
.autocomplete-suggestion.selected { box-shadow: 5px 5px 7px rgba(0,0,0,0.4);  background-color:#65C13E; }


.opacity0 { opacity: 0; }

.rating {
  unicode-bidi: bidi-override;
  color:#b1610c;
/*font-size: x-large;*/
}

.positionfix{
  position:sticky;
  top:2.1rem;
  z-index:25;
}


 details[open] .summary-hide {  display:none; }

/* страница новости оформелние рейтинга*/
 #emotions{ font-size:2em;}
 
#rating {
  direction: rtl;
  font-size: 2em;
  unicode-bidi: bidi-override;
  color:#FFA000;
  display:inline-flex;
}

#rating input{
  opacity: 0;
  width: 0.15em;
}
#rating input:checked ~ label:before 
{
   content: "★";
   position: absolute;
}
/*КОЕН страница новости оформелние рейтинга*/


@keyframes colorAnimation{
   0% { color:blue; }
   10% { color:darkorange ; }
	20% { color:darkorchid; }
	30% { color:gold; }
	40% { color:green; }
	50% { color:orange; }
	60% { color:olive; }
	70% { color:red; }
	80% { color:olive; }
	90% { color:pink; }
	100% { color:lightblue ; }
  }