@font-face {
	font-family: 'icomoon';
	src:url('../fonts/icomoon.eot');
	src:url('../fonts/icomoon.eot?#iefix') format('embedded-opentype'),
		url('../fonts/icomoon.woff?92') format('woff'),
		url('../fonts/icomoon.ttf?92') format('truetype'),
		url('../fonts/icomoon.svg?92#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
[data-icon]:before, [data-icon-after]:after{ font-family: 'icomoon'; content: attr(data-icon); speak: none; font-weight: normal; font-variant: normal; text-transform: none; display:inline-block; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; margin:0 0.3em 0 0;}
[data-icon-after]:after {content: attr(data-icon-after); margin:0 0 0 5px; vertical-align:middle;}
[data-icon-after]{white-space:nowrap; }


*{ padding:0; margin:0;}
body{ font: 14px Inter, Arial, sans-serif; font-weight:500;  }

.clear{ clear:both;}
a { cursor:pointer;}
a img{ border:0;}
a:active, a:focus{ outline:0; }
sup{line-height:0;}

ul{ list-style:none;}
ol{ padding:0 0 0 26px;}

.loading{ opacity:0.5;}
.loading_bg.loading{ background:url(../imgs/loading_s.gif) no-repeat 0 center; opacity:1!important;}
.loading_table.loading{ background:url(../imgs/loading2.gif) no-repeat center center; opacity:1!important; display:block; height:100px; width:100px;}
.display_none{ display:none!important;}
.display_hidden{ visibility:hidden; position:absolute; left:-10000px; top:-10000px;}
.float_clear:after{ content: "."; display: block; height: 0; clear: both; visibility: hidden; }


/*photo-sample*/
.photo-sample{ position:relative; display:inline-block; text-align:center; opacity:0.999; }
.photo-sample:before{ content:""; display:block;  position:absolute; z-index:-1; top:0; left:0; bottom:0; right:0; background:#ccc url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjU2IiBoZWlnaHQ9IjI1NiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtOTAsMTM5YzAsMjAgMTYsMzcgMzcsMzdzMzcsLTE2IDM3LC0zN3MtMTYsLTM3IC0zNywtMzdzLTM3LDE2IC0zNywzN3ptMTE3LC02MmwtNDAsMGMtMiwtMTEgLTUsLTIyIC0xNywtMjJsLTQ1LDBjLTExLDAgLTE0LDExIC0xNywyMmwtNDAsMGMtNiwwIC0xMSw1IC0xMSwxMWwwLDEwMmMwLDYgNSwxMSAxMSwxMWwxNjAsMGM2LDAgMTEsLTUgMTEsLTExbDAsLTEwMmMwLC02IC01LC0xMSAtMTEsLTExem0tODAsMTEzYy0yOCwwIC01MCwtMjIgLTUwLC01MGMwLC0yOCAyMiwtNTAgNTAsLTUwYzI4LDAgNTAsMjIgNTAsNTBjMCwyOCAtMjIsNTAgLTUwLDUwem04MCwtNzlsLTIyLDBsMCwtMTFsMjIsMGwwLDExeiIgb3BhY2l0eT0iMC41IiBmaWxsPSIjZmZmIi8+PC9zdmc+');/*ZmZm=MDAw*/ background-repeat:no-repeat; background-position:center center; background-size:100% 100%; background-size:contain;}

.photo-sample img{ vertical-align:middle; }
.photo-sample.uploading img{opacity:0.5; filter:alpha(opacity=50);}
.photo-sample>span{  position:absolute; z-index:1; bottom:8%; left:8%; display:block; width:80%; height:6px; padding:1px; margin:0 -2px; border:1px solid #555; background:#ccc; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; opacity:0.85; filter:alpha(opacity=85);}
.photo-sample>span span{ display:block; width:0; height:6px; background:#5c0; }
.photo-sample>span span {
	-webkit-transition: width .5s ease-in-out;
	-moz-transition: width .5s ease-in-out;
	-ms-transition: width .5s ease-in-out;
	-o-transition: width .5s ease-in-out;
	transition: width .5s ease-in-out;		
}
.photo-sample i{ position:absolute; right:0; top:0; background:#b00; color:#fff; border-radius:0 0 0 2px; display:none; text-align:center; line-height:16px; width:16px; font-size:16px; z-index:1; cursor:pointer;}
.photo-sample i:hover{ background:#d00;}
.photo-sample i:before{ content:"\D7";}
.photo-sample:hover i{ display:block;}


/*form_base*/
input[type="text"], input[type="password"], textarea{ box-sizing:border-box; width:100%; padding:6px 10px; border:1px solid #bbb; vertical-align:middle;  font-family:inherit; font-size:inherit; color:inherit; margin-bottom:15px; border-radius:var(--radius);}
input[size]{ width:auto; box-sizing:content-box; -moz-box-sizing:content-box; }
.inp_r{ text-align:right; }
.inp_s1[class]{ width:460px; }
dl.select_s1{ max-width:460px; }
.inp_s2[class]{ width:227px; }

.inp_cal[type]{ width:170px;  background:transparent!important; cursor:pointer;  position:relative; }
.inp_cal[show_time]{ width:235px;}
.inp_cal_ico{ display:inline-block; position:relative; }
.inp_cal_ico:before{ content:"t"; font:14px icomoon; position:absolute; top:0.5em; right:0.5em; color:#888;  }

.checkbox{ position:relative; display:inline-block; vertical-align:middle; color:inherit; text-decoration:none; white-space:nowrap;}
.checkbox input{ position:absolute; visibility:hidden; height:1px;}
.checkbox:not(.icon):hover{ color:#000;}
.checkbox:before{ content:""; font:12px/15px icomoon; text-align:center; color:#580; display:inline-block; width:15px; height:15px; position:relative; top:-2px; left:0; border:1px solid #a0a0a0; vertical-align:middle; border-radius:3px; box-shadow:0px -12px 10px 0px rgba(0,0,0,0.15) inset, 1px 1px 2px 0px rgba(0,0,0,0.1);  }
.checkbox:hover:before{ background:#fffaea;}
.checkbox.active:before{ content:";"; background:#9c3; color:#fff;  }
.checkbox.star:before{ content:"5"; font:17px icomoon; background:none; color:#777; top:-4px; left:0; border:0;  box-shadow:none; text-shadow:0px 0px 1px rgba(0,0,0,0.5);  }
.checkbox.star:hover:before{ color:#000;}
.checkbox.star.active:before{content:"X"; color:#FFCC00;  }
.checkbox.icon:before{ content:"Z"; font:20px icomoon; background:none; color:inherit; width:auto; height:auto; border:0; padding:0; margin:0 8px 0 0px; box-shadow:none; text-shadow:none; border-radius:6px; }
.checkbox.icon:hover{ color:inherit;}
.checkbox.icon:hover:before{ box-shadow:0 0 0 3px #4442;}
.checkbox.icon.active:before{content:"V";  color:var(--color); }


.form_base{  } 
.form_base hr{ border:0; border-top:1px solid #ccc; margin-bottom:15px;  }
.form_base label{ display:inline-block; vertical-align:top; font-size:12px; color:#777; white-space:nowrap; text-overflow:ellipsis; line-height:normal; padding:0.6em 0 0.4em 0; }
.form_base label.chb{ width:auto; font-size:inherit; color:inherit; white-space:inherit; text-overflow:inherit; overflow:inherit; padding:0; cursor:pointer;}
.form_base label.chb2{ width:auto; font-size:inherit; color:inherit; white-space:inherit; text-overflow:inherit; overflow:inherit; margin:-10px 0 0 130px;}
.form_base label.chb2 input{ position:relative; top:-1px; margin-right:3px;}
.form_base label.rel{ width:auto!important; padding-right:7px}
.form_base label[required]:after, .form_base label i{ color:#c00; font-style:normal; }
.form_base .suf{ vertical-align:top;  padding:0.6em 0 0.2em 0; display:inline-block;}
.form_base .pref{ position:absolute; margin:-16px 0 0 0; font-size:11px; color:#777;}
.form_base .pref_offset{ height:14px;}

.form_base .hr_label{ position:relative; overflow:hidden;  color:#999; font-weight:bold; padding:15px 0 15px 25px; }
.form_base .hr_label:after{ content:""; display:inline-block; position:absolute; top:50%; width:100%; margin:0 -100% 0 5px; border-top:1px solid #ccc; }
.form_base .hr_label:before{ content:""; display:inline-block; position:absolute; top:50%; width:20px; left:0; border-top:1px solid #ccc; }

.form_base input[type="text"], .form_base input[type="password"], .form_base textarea{ margin-bottom:16px; }
.form_base textarea[cols]{ width:auto;}
.form_base .checkbox.inp_margin{  margin:6px 0 15px 0; }
.form_base .checkbox.inp_margin2{  margin:0px 0 8px 0; }
.form_base input[readonly], .form_base textarea[readonly]{ background:#f2f2f2;}
.form_base input[type='image'], .form_base input[type='checkbox']{  width:auto; padding:0; margin:0; border:0; border-radius:0; }
.form_base .inp_h1[name]{ font-size:20px; line-height:20px; letter-spacing:-0.03em; font-weight:300;  }
.form_base .inp_ss[name]{ font-size:11px; padding:0 10px; }
.form_base input:invalid{ -moz-box-shadow:none; -webkit-box-shadow:none; box-shadow:none; }

.form_base .error input, .form_base .error textarea, .form_base .select.error>dd{ border-color:#FDA29B;}
.form_base span.error{ position:relative; }
.form_base span.error{ display:inline-block;}
.form_base span.error:after{ content:"!"; position:absolute; right:7px; top:5px; color:#c00; font:16px icomoon; z-index:0; background:#fff;}
.form_base .error_s.error:after{ font-size:10px; right:4px; top:3px;}
.form_base .no_error:after{ display:none;}
.form_base .radio_group{ position:relative; display:inline-block; line-height:20px; padding:0 0 0 20px;}
.form_base .radio_group label{ padding-bottom:5px;}
.form_base .radio_group input{ position:absolute; left:0; }
.form_base .radio_group.error{ outline:1px solid #c00;}
.form_base .radio_group.error:after{ right:-20px;}
.form_base .block_error{ display:none; border:1px solid #c00; background:#fea; padding:10px; margin:0 10px 15px 123px; line-height:normal;}
.form_base .block_error.active{ display:block;}
.form_base .block_error.block_error_full{ margin:0 0 15px 0;}
.form_base .block_error.block_error_light{ background:#ffff0033; border-color:#00000033; color:#000000cc; }

.form_base .inp_error{color:#c00; margin:-12px 0 15px 0; display:none;}
.form_base .inp_error.show{ display:block;}
.form_base .inp_error span{ display:inline-block; font-size:11px; width:420px;}
.form_base .inp_hidden{position:absolute; visibility:hidden; left:0; width:1px; height:1px;}

.form_base.loading{ opacity:0.3;}
.form_base .text{ padding:0!important;}
.form_base fieldset{ border:1px solid #ddd; margin:0px -10px 20px 0; padding:6px 9px 0px 9px;}
.form_base fieldset legend{ color:#aaa; margin-left:10px; font-weight:bold;}
.form_base fieldset hr{ border:0; border-top:1px solid #ddd; margin:12px 0;}
.form_base fieldset.params .select>dd{max-width:100px;}
.form_base .line{ display:inline-block; padding-bottom:8px;}
.form_base label.full{ width:auto;}
.form_base .inp_time{ width:16px; font-size:12px; vertical-align:middle;}
.form_base .fl{ float:left; padding-right:30px;}
.form_base .fleft{ float:left; }
.form_base .fright{ float:right; }

.form_base dl.select{ margin-bottom:15px; vertical-align:middle; }
.form_base dl.select dl dd i{ font-size:10px; line-height:8px; padding-bottom:10px; display:block;}
.form_base dl.select dl dd i:before{ content:attr(lang); }

.form_base input.s_p1{ width:24px;}
.form_base input.s_p2{ width:33px;}

.form_base dl.select-flag { margin-right:0px;}
.form_base dl.select-flag>dd { padding:0px 20px 0px 8px; border-right-width:0;}
.form_base dl.select-flag>dd:before { border-width:0;}
.form_base dl.select-flag>dd span{ display:none;}
.form_base dl.select-flag dd{ color:#777;}
.form_base dl.select-flag .flag{ display:inline-block; }
.form_base dl.select-flag .ccode{ line-height:15px; color:#000; padding-left:7px;}
.form_base dl.select-flag dl dd.selected, .form_base dl.select-flag dl dd.selected .ccode{ color:#fff;}

.form_base .link_comm{ position:relative; display:inline-block; left:20px; border-bottom:1px dashed #09c; line-height:12px; font-size:12px; margin-bottom:20px; }
.form_base .link_comm:before{ content:"+"; position:absolute; left:-18px; top:1px; font-size:18px; }
.form_base .link_comm:hover{ border-color:#c00;}

.form_base .photo{ width:275px;}
.form_base .photo .photo-sample{ width:60px; height:auto; margin-right:5px; border:1px solid #ccc; vertical-align:top; margin-top:10px;}
.form_base .photo .photo-sample img{ max-width:100%;}
.form_base .photo .photo-sample-empty{ min-height:60px;}
.form_base .photo>span .photo-sample:first-child{ width:300px; min-height:300px; }
.form_base .photo>span .photo-sample-img:first-child{ min-height:0;  }
.form_base .photo .photo-first{  width:300px; min-height:300px;}

.form_base .col_2_3{ box-sizing:border-box; width:70%; float:left; padding:0 0 0 20px;}
.form_base .col_1_3{ box-sizing:border-box; width:30%; float:left; }

.form_base .multi_item{ margin:-10px 0 5px 123px; }
.form_base .multi_item>span{ display:inline-block; line-height:30px; background:#ddd; padding:0 7px; margin:0 5px 5px 0; }
.form_base .multi_item>span .but_remove{ position:relative; top:2px;}

.form_base .show_password{ position:absolute; vertical-align:middle; font:1.3em icomoon; padding:0.43em; margin-left:-2em; color:#bbb; cursor:pointer; }
.form_base .show_password:hover{ color:#999;}
.form_base .show_password:before{ content:"p";}
.form_base .show_password.active:before{ content:"j";}

.form_base .show_loading{ position:relative; display:inline-block;}
.form_base .show_loading:before{ content:""; display:block; width:20px; height:20px; position:absolute; top:2px; left:-24px; background:#fff url(../imgs/loading_s.gif) no-repeat center center; }

.autocomplete{ position:relative; line-height:normal; margin-right:6px; }
span.autocomplete{ display:inline-block; }
.autocomplete input[readonly]{ font-weight:normal!important; background:#f0f0f0;  }
.autocomplete div{ position:absolute; z-index:2; left:0px; top:30px; background:#ffe; box-shadow:1px 1px 4px 0px rgba(0,0,0,0.5); min-width:130px; text-align:left; line-height:24px; font-size:12px;}
.autocomplete div a{ display:block; padding:0px 11px; min-height:20px; color:#000; text-decoration:none; white-space:nowrap; border-bottom:1px solid #ddc;}
.autocomplete div a:hover, .autocomplete div a.active{ background:#07c; color:#fff; }
.autocomplete .but_clear, .autocomplete .but_enter{ position:absolute; top:1px; right:1px; height:1.3em; display:none; padding:0 0.3em; line-height:1.3em; text-align:center; color:#b33; font-size:1.7em; text-decoration:none; background:rgba(255,255,255,0.8); }
.autocomplete .but_clear:before{ content:"\D7"; }
.autocomplete .but_enter:before{ content:"\21b5"; color:#777; }
.autocomplete.has-value .but_clear{ display:block;}
.autocomplete .but_new{ position:absolute; top:1px; right:1px; z-index:1; display:block; width:26px; line-height:26px; text-align:center; color:#09c; font-size:20px; text-decoration:none; }
.autocomplete .but_new:before{ content:"+"; }
.autocomplete .but_new:hover{ color:#f42; }
.autocomplete.has-value .but_new{ display:none;}
.autocomplete .but_user{ font:16px icomoon; z-index:0; position:absolute; left:1px; top:1px; color:#aaa; display:block; width:26px; line-height:26px; text-align:center; text-decoration:none; }
.autocomplete .but_user:before{  content:"u"; }
.autocomplete.set-value .but_user{ z-index:2; color:#09c; }
.autocomplete .but_user:hover{ color:#c00; }



.calendar{ visibility:hidden;}


/*select*/
dl.select {  display:inline-block;  line-height:26px; position:relative; zheight:28px; overflow:hidden; vertical-align:middle; margin-right:6px; .display:inline; zoom:1; color:#111; font-size:12px; border-color:#bbb; text-align:left;  }
dl.select dd { padding:0px 3.8em 0 0.85em; line-height:inherit; white-space:nowrap;}
dl.select>dd {position:relative; background:#fff; border-width:1px; border-style:solid; border-color:inherit; border-radius:inherit; overflow:hidden; max-width:600px;  cursor:pointer; }
dl.select>dd:before {content:""; position:absolute; top:0px; bottom:0; right:0px;  display:block; width:26px; font-size:24px; text-align:center; background:inherit; border-left-width:inherit; border-left-style:solid; border-color:inherit; }

dl.select>dd:after{ content:""; position:absolute; top:50%; margin-top:-1px; right:10px; width:5px; height:5px; border:1px solid #555; border-right:0; border-bottom:0; transform:rotateZ(-135deg);  transform-origin: 30% 30% 0px; -webkit-transform:rotateZ(-135deg); -webkit-transform-origin: 30% 30% 0px; }
dl.select-active>dd:after{ transform:rotateZ(45deg); -webkit-transform:rotateZ(45deg);  }
dl.select>dd.is_empty:before, dl.select>dd.is_empty:after{ display:none;}
/*dl.select>dd:after {content:"";  position:absolute; top:50%; margin-top:-2px; right:10px; display:block; width:0; height:0;  border:5px solid transparent; border-top-color:#555; }
dl.select-active>dd:after{   margin-top:-7px; border-top-color:transparent; border-bottom-color:#555;  }*/

dl.select dd.default { color:#999; }
dl.select dl { position:absolute; background:#fff;  border-width:1px; border-style:solid; border-color:inherit;  max-height:310px; overflow:auto; overflow-x:hidden; box-shadow: 1px 3px 3px 0px rgba(0,0,0,0.3);  }
dl.select dl dd:hover[value]{ background-color:#5cb7fe; color:#fff;  cursor:pointer; }
dl.select dl dd.hidden{ background-color:#eee; color:#777;  }
dl.select dl dd.selected{ background-color:#1c77fe; color:#fff;  }
dl.select dl dd.selected.hidden{ color:rgba(255,255,255,0.8);  }
dl.select-active { overflow:visible;   }
dl.select-active>dl {  z-index:1; }
dl.select:hover>dd:before { z-index:1; background:transparent; }
dl.select-loading{ opacity:0.5;}


dl.select dd i{ font-style:normal; color:#999;}
dl.select dl dd:hover i, dl.select dl dd.selected i{ color:#cde;  }

dl.select[name$="[]"]>dsd { white-space:nowrap; text-overflow:ellipsis; overflow:hidden; max-width:350px;  }
dl.select[name$="[]"] dl dd { position:relative;  }
dl.select[name$="[]"] dl dd:before { content:""; font:12px icomoon; display:inline-block; border:2px solid #ddd; width:16px; height:16px; border-radius:10px; line-height:16px; text-align:center; vertical-align:middle; color:#fff; position:relative; left:-3px; top:-1px;  }
dl.select[name$="[]"] dl dd:hover:before { background:#fff;  }
dl.select[name$="[]"] dl dd.selected:before { content:";"; background:#790;  }
dl.select[name$="[]"] dl dd.selected { background-color:#eee; color:#333;  background-position:7px -40px;  }
dl.select[name$="[]"] dl dd:hover, dl.select dl dd.hover{ background-color:#5cb7fe; color:#fff;  }
dl.select[name$="[]"] dl dd input{ position:absolute; left:5px; top:3px; display:block; width:20px; height:20px; background:#f00; cursor:pointer; opacity:0;  }
/*dl.select[name$="[]"].select-active>dd:before{ content:"\00D7"; }
dl.select[name$="[]"].select-active>dd:after{ display:none; }*/

dl.select.select-multiline[name$="[]"]>dd{ white-space:normal; max-width:220px;}

dl.select[readonly] dd{ color:#777;}

dl.select-right dl{ right:0px; }
dl.select-up dl{ bottom:30px; box-shadow: 1px -1px 3px 0px rgba(0,0,0,0.3); }

dl.select-color{  border-color:rgba(0,0,0,0.1); color:#fff; }
dl.select-color>dd { background:#aaa; color:inherit!important; }
dl.select-color dd.default { color:#eee; }
dl.select-color>dd:before { display:none; }
dl.select-color>dd:after { border-color:#eee; }
dl.select-color dl dd { }
dl.select-color dl dd:hover[value]{  filter:brightness(1.15);  }

dl.select-save-icon.select-active>dd:after{ border:0; content:";"; font:14px icomoon; right:0; top:0; bottom:0; width:28px; line-height:inherit; margin:0; text-align:center; color:#555; height:auto; transform:none; -webkit-transform:none;   }
dl.select-save-icon.select-active>dd:hover:after{ color:#fff; background:#690;  }

dl.select-hovered{ border-color:transparent;  }
dl.select-hovered:hover{ border-color:#bbb;  }

dl.select-no-max-height dl{ max-height:none;}

dl.select-flag .flag{ display:inline-block; background:url(../imgs/flags.gif) no-repeat 0 100px; height:11px; width:16px; margin:0 6px 0 0; }


dl.select-nolabel:hover{ background:#eee; outline: 5px solid #eee;}
dl.select-nolabel>dd{ background:transparent; color:transparent; border-color:transparent;}
dl.select-nolabel>dd:before { border:1px solid #bbb; }

dl.select dl dd i[lang]{ font-size:10px; line-height:8px; padding-bottom:10px; display:block; font-style:normal; color:#999;}
dl.select dl dd i[lang]:before{ content:attr(lang); }
dl.select dl dd:hover i[lang], dl.select dl dd.selected i[lang]{ color:#cde;  }

dl.select-noborder{ border-color:transparent; }
dl.select-noborder>dd{ background-color:transparent;}
dl.select-noborder dd { padding-right:2.2em;}


/*popup*/
.popup{ display:block; visibility:hidden; height:0; overflow:hidden; position:fixed; z-index:21; top:50%; left:50%; transform: translate(-50%, -50%); width:900px; background:#fff; border:1px solid #ccc; box-shadow:0px 0px 15px 0px rgba(0,0,0,0.5); color:#000; margin-right: -50%;}

.popup.popup-show{ visibility:visible; height:auto;  min-height:50px; max-height:100%; max-width:100%; overflow:auto; }
.popup-modal{display:block; background:rgba(0,0,0,0.5); position:fixed; z-index:20; top:0; left:0; width:100%; height:100%;}
.popup-close{ position:sticky; z-index:31; margin:0 0 -38px 0; float:right; clear:both; top:0; width:24px; height:24px; display:block; padding:7px; text-decoration:none; border:0; font-size:24px; color:#777; cursor:pointer;  }
.popup-close:before{ font-family:'icomoon'; content:"x"; }
.popup-close:hover{ color:#c60; }
.popup-target.loading{ height:100px; background:url(../imgs/loading2.gif) no-repeat center center;}

.popup-full{ width:1260px; }
.popup-small{ width:400px; }
.popup-half{ width:670px; }
.popup-text{width:910px;}

.popup-abs.popup-modal{position:absolute; }
.popup-abs.popup{position:absolute; transform:translate(-50%, 0); top:50px; }

@media screen and (max-width: 1000px){
	.popup-full{ width:auto!important; right:0px; left:0px; margin-left:0px!important; }	
}






img[fs]{ cursor:pointer;}
/*fs*/
.fs-block{ display:none; position:fixed;  z-index:31;  left:50%; top:50%; margin:-50px 0 0 -50px; width:100px; height:100px;  background:#fff url(../imgs/loading.gif) no-repeat center center; box-shadow:0px 0px 15px 0px rgba(0,0,0,0.5); overflow:hidden; transition: all 0.3s cubic-bezier(0.0, 0.0, 0.2, 1.0); outline:20px solid transparent;}
.fs-block img, .fs-block iframe{ position:absolute; top:0; left:0; transition: opacity 0.3s cubic-bezier(0.0, 0.0, 0.2, 1.0); }
.fs-block iframe{ width:100%; height:100%; z-index:1; background:#000 url(../imgs/loading_b.gif) no-repeat center center; }
.fs-block.show{ display:block;}
.fs-block:before, .fs-block:after{ position:absolute; top:50%; margin-top:-40px; display:block; padding:30px; cursor:pointer; color:#fff; font:24px icomoon; text-shadow:0px 0px 4px rgba(0,0,0,1); opacity:0.4; z-index:2; }
.fs-block:hover:before, .fs-block:hover:after{ opacity:0.9; }
.fs-block:before{  content:"{"; left:0px;}
.fs-block:after{  content:"}"; right:0px;}
.fs-modal{display:none; background:rgba(0,0,0,0.6); position:fixed; z-index:30; top:0; left:0; width:100%; height:100%;}
.fs-modal.show{ display:block;}
.fs-close{ position:fixed; z-index:32; right:5px; top:5px; display:none; padding:7px; text-decoration:none; border:0; font-size:24px; color:#fff; cursor:pointer; text-shadow:0px 0px 3px rgba(0,0,0,1); }
.fs-close.show{ display:block;}
@media screen and (max-width: 999px){
.fs-block{ outline-width:10px;}
}
@media screen and (max-width: 767px){	
.fs-close, .fs-block:before, .fs-block:after{  font-size:36px; }

}
.fs-close:before{ font-family:'icomoon'; content:"x"; }
.fs-close:hover{ color:#c60; }

/*auth*/
.vote i:before{ content:"X"; font:16px icomoon; color:#ddd; vertical-align:middle; position:relative; top:-3px;}
.vote_1 i:nth-child(-n+1):before, .vote_2 i:nth-child(-n+2):before, .vote_3 i:nth-child(-n+3):before, .vote_4 i:nth-child(-n+4):before, .vote_5 i:nth-child(-n+5):before{ color:#FC0!important;  content:"X"!important;}
.vote_0, .vote_{ display:none;} 


/*pager*/
.pager span{ display:inline-block; padding:0 40px 0 0;  line-height:28px; }
.pager span a{ display:inline-block; text-decoration:none; color:#777; border:1px solid #aaa; background:#f7f7f7; text-align:center; width:30px; margin:0 5px 0 0; border-radius:3px;}
.pager span a:hover{  background:#fff; }
.pager span a.active{ color:#fff; background:#777; }
.pager span a.dot{ color:#000; background:transparent; border-color:transparent;   }
.pager span a.dot:before{ content:"..."; font-size:18px; line-height:16px; }


/*delivery*/
.delivery_addr{ position:relative; padding:0 0 0 26px;}
.delivery_addr:before{ content:""; display:inline-block; width:20px; height:20px; position:absolute; top:50%; left:0; margin-top:-10px; background:url(../imgs/delivery5.png) no-repeat 0 0px; border-radius:3px; }
.delivery_:before {background:none;}
.delivery_00:before{ background-position:0 0px;}
.delivery_01:before{ background-position:0 -60px;}
.delivery_10:before, .delivery_11:before{ background-position:0 -20px;}
.delivery_20:before, .delivery_21:before{ background-position:0 -80px;}
.delivery_30:before, .delivery_31:before{ background-position:0 -40px;}
.delivery_40:before, .delivery_41:before{ background-position:0 -120px;}
/*.delivery_2:before{ background-position:0 -40px;}
.delivery_4:before{ background-position:0 -60px;}
.delivery_5:before{ background-position:0 -100px;}*/

#block_delivery{}
#block_delivery_city, 
#block_delivery_np_branch, 
#block_delivery_branch_num, 
#block_delivery_zip, 
#block_delivery_address,
#block_delivery_address_raw,
#block_delivery_address_sep,
#block_delivery_dest_type, 
#block_delivery_place, 
#block_delivery_dest_mode, 
#block_delivery_dest_time, 
#block_delivery_dest_time_mess
	{ display:none;}
	
#block_delivery_dest_time_mess{ margin:0 0 15px 3px ; color:#690;}
	
#block_delivery.delivery_0 #block_delivery_city, 
#block_delivery.delivery_0.dest_type_0 #block_delivery_np_branch, 
#block_delivery.delivery_0.dest_type_1 #block_delivery_address_sep, 
#block_delivery.delivery_0.dest_type_1 #block_delivery_address_raw, 
#block_delivery.delivery_1 #block_delivery_city,
#block_delivery.delivery_1.dest_type_0 #block_delivery_zip,
#block_delivery.delivery_1.dest_type_1 #block_delivery_address_sep, 
#block_delivery.delivery_1.dest_type_1 #block_delivery_address_raw,  
#block_delivery.delivery_2 #block_delivery_place, 
#block_delivery.delivery_3 #block_delivery_city,
#block_delivery.delivery_3 #block_delivery_address_sep,
#block_delivery.delivery_3 #block_delivery_address_raw, 
#block_delivery.delivery_3 #block_delivery_dest_time_mess,
#block_delivery.delivery_4 #block_delivery_city,
#block_delivery.delivery_4.dest_type_0 #block_delivery_np_branch,
#block_delivery.delivery_4.dest_type_1 #block_delivery_address_sep, 
#block_delivery.delivery_4.dest_type_1 #block_delivery_address_raw,
#block_delivery.delivery_9 #block_delivery_address, 
#block_delivery.delivery_9 #block_delivery_address_raw
	{ display:block;}
	
#block_delivery.delivery_0 #block_delivery_dest_type, 
#block_delivery.delivery_1 #block_delivery_dest_type, 
#block_delivery.delivery_1 #block_delivery_dest_mode,
#block_delivery.delivery_3 #block_delivery_dest_time, 
#block_delivery.delivery_4 #block_delivery_dest_type
	{ display:inline-block; }



/*hint*/
.hint[label]{ }
.hint[label]:before{ content:attr(label); position:absolute; bottom:35px; left:0px; background:#f7f7f2; padding:10px 14px 12px 14px; width:230px; font-size:12px; font-weight:normal; color:#555; text-align:left; white-space:normal; -webkit-box-shadow:1px 1px 4px 0px rgba(0,0,0,0.5);  box-shadow:1px 1px 4px 0px rgba(0,0,0,0.5);}
.hint[label]:after{ content:""; position:absolute; bottom:30px; left:50%; margin-left:-5px; width:10px; height:10px; overflow:hidden; background:#f7f7f2; transform:rotateZ(45deg); -webkit-transform:rotateZ(45deg);  -webkit-box-shadow:2px 2px 2px -1px rgba(0,0,0,0.5);  box-shadow:2px 2px 2px -1px rgba(0,0,0,0.5); }
.hint[label]:before, .hint[label]:after{ display:block; visibility:hidden; opacity:0; max-width:0px; overflow:hidden;  transition: opacity 0.5s cubic-bezier(0.0, 0.0, 0.2, 1.0); }
.hint[label]:hover:before, .hint[label]:hover:after{ visibility:visible; opacity:1; max-width:none;  }

.hint.icon[label]{ position:relative;  font-size:10px; font-weight:bold; display:inline-block; background:#aaa; color:#fff; border-radius:5px; padding:0 3px; position:relative; top:-1px; left:2px; cursor:pointer; }
.hint.icon[label]:hover{ background:#555; z-index:1; }
.hint.icon[label]:before{  bottom:20px; left:-70px; }
.hint.icon[label]:after{  bottom:15px;  }


/*auth*/
.auth{ background:rgba(0,0,0,0.5); position:fixed; z-index:20; top:0; left:0; width:100%; height:100%; --color:#e00; --color-bg:#1D2939;}
.auth h2{ margin:-50px -50px 50px -50px; padding:20px 0; color:#555; font-size:24px; background:var(--color-bg); border-bottom:5px solid var(--color); color:#fff; text-align:center; border-radius:10px 10px 0 0; }
.auth h2 b{ color:var(--color); }
.auth form{ position:absolute; left:50%; top:50%; margin:-160px 0 0 -215px; width:333px; padding:50px;  background:#f7f7f7;  border-radius:10px; color:#000; box-shadow:0px 0px 15px 0px rgba(0,0,0,0.5); min-height:50px; }
.auth form span{ display:block; position:relative; }
.auth form span:before{ font:32px 'icomoon'; position:absolute; left:20px; top:14px; color:#999; }
.auth input{ padding:10px 17px 10px 60px; font-size:24px; line-height:36px; border-radius:5px;  box-shadow:3px 3px 3px 0px rgba(0,0,0,0.1) inset; margin-bottom:15px;  }
.auth a{ position:relative; display:block; font-size:32px; text-align:center;  padding:10px 0px 10px 0px;  border:2px solid #bbb; border-radius:5px;  box-shadow:-5px -5px 10px 0px rgba(0,0,0,0.1) inset; background:var(--color-bg); color:#eee;  text-decoration:none; }
.auth a:hover{ filter:brightness(1.2);  color:#fff; }
.auth a:active{  -webkit-box-shadow:none;  box-shadow:none; }
.auth a:before{ color:#ddd; }
.auth a.logout:before{ content:"z"; font:32px 'icomoon'; position:absolute; left:15px; top:8px; color:#ccc; }



/*admin*/
.admin_links{ position:absolute; top:30px; left:0; z-index:1; border-radius:0 0 4px 4px; background:#a00; padding:0px 6px 3px 6px; font-size:10px; line-height:14px; -webkit-box-shadow:box-shadow:1px 1px 1px 0px rgba(0,0,0,0.3); box-shadow:1px 1px 1px 0px rgba(0,0,0,0.3);  color:#fff;  }
.admin_links a{ text-decoration:none; color:#fff; padding:0 6px;  }
.admin_links a:hover{ text-decoration:underline;  }
.admin_links a.count_0{ color:#ccc; }
.admin_links.mode_view{ background:#555; opacity:0.5;}

.but_add_product{ display:inline-block; width:200px; border:1px solid #bb8; background:rgba(255, 255, 250, 0.5); padding:10px; margin:0 13px 20px 0;  border-radius:5px;  -webkit-box-shadow:0px 2px 10px 0px rgba(0,0,0,0.3); box-shadow:0px 2px 10px 0px rgba(0,0,0,0.3); text-align:center; vertical-align:top;text-decoration:none;  color:#333; }
.but_add_product:hover{ background:#fff; -webkit-box-shadow:0px 2px 14px 0px rgba(0,0,0,0.7); box-shadow:0px 2px 14px 0px rgba(0,0,0,0.7);  }
.but_add_product  .add{ display:block; margin:48px auto; border:5px solid #ce9; border-radius:5px; color:#790; font-weight:bold; font-size:72px; width:60px; height:60px; line-height:60px; text-align:center;   }




/*nicEdit*/
/*ce*/
.ce { font-family:inherit; font-size:15px; line-height:140%;}
.ce img::selection {background:transparent;}
.ce .photo-sample{ width:200px; height:auto; border:0; background:#eee; -webkit-box-shadow:none; box-shadow:none;}
.ce .photo-sample-empty{ min-height:200px; }
.ce p, .ce h1, .ce h3, .ce ul{ margin:0 0 16px 0; }
.ce img[align=left]{ margin:0 10px 10px 0;}
.ce ul li{ position:relative; padding:0 0 0.2em 1.5em;}
.ce ul li:before{ content:"\2022"; position:absolute; left:5px; font:1.3em/1em Arial, sans-serif; color:var(--color);}
.popup .ce { margin:24px; }

.nicEdit-panelContain { position:sticky; zdisplay:none;}
.nicEdit-panelEnabled { display:block; top:0; z-index:100;}
.panel .nicEdit-panelEnabled{ top:80px; }
.nicEdit-main{ border-top:1px solid #bbb; font-family:inherit; font-size:inherit;}
.nicEdit-pane{ position:fixed; bottom:26px;}



.test_mode{ position:fixed; bottom:0; left:0; right:0; background:#e00; color:#fff; text-align:center; font:11px Arial, Helvetica, sans-serif; padding:4px 10px; z-index:1000;}html{
	height:100%;
	--radius:8px;
	
	--bg:#ffffff;
	--shadow:#0002;
	--color:#1D2939;
	--color2:#475467;
	--color3:#667085;
	--hover:#D92D20;
	--color-g:#98A2B3;
	--color-ok:#039855;
	--color-brown:#C56708;
	--color-gray:#D0D5DD;
	--color-gray2:#EAECF0;
	--color-gray-bg:#F2F4F7;
	--color-gray-bg2:#F9FAFB;
	--color-red:#FDA29B;
	--color-red-bg:#FEF3F2;
	--color-green:#12B76A;
	--color-green-bg:#ECFDF3;
	--color-blue:#0BA5EC;
	--color-blue-bg:#F0F9FF;
	--color-orange:#F79009;
	--color-orange-bg:#FFFAEB;
	--color-yellow:#FEC84B;
	--color-yellow-bg:#FFFAEB;
}


html[theme="dark"]{	
	--bg:#0D1623;
	--shadow:#fff2;
	--color:#d6d8da;
	--color2:#b6b8ba;
	--color3:#a6a8aa;
	--hover:#D92D20;
	--color-g:#a4a7ad;
	--color-ok:#12b76a;
	--color-brown:#FEC84B;
	--color-gray:#313846;
	--color-gray2:#262d3b;
	--color-gray-bg:#262d3b;
	--color-gray-bg2:#192031;
	--color-red:#FDA29B;
	--color-red-bg:#FDA29B44;
	--color-green:#12B76A;
	--color-green-bg:#12B76A44;
	--color-blue:#0BA5EC;
	--color-blue-bg:#0BA5EC44;
	--color-orange:#F79009;
	--color-orange-bg:#F7900944;
	--color-yellow:#FEC84B;
	--color-yellow-bg:#FEC84B44;
}

body{  background:var(--bg); color:var(--color); font:500 17px Gilroy, Arial, sans-serif;  height:100%; min-width:430px;   }

[data-icon]:before{ margin-right:0.5em; font-size: 1.2em; vertical-align:top;}

.wrap{ position:relative; max-width:1180px; margin:0 auto;}


/*common*/
h1, h6{ font-size:30px; line-height:38px; font-weight:600; margin-bottom:16px; }
h2{ margin:10px 0px 10px 0; font-size:24px; line-height:24px; padding:0; font-weight:400;}
h3{ font-size:inherit; font-weight:600; margin-bottom:16px;}

.clear{ clear:both;}

a{ color:var(--color); cursor:pointer;}
a img{ border:0;}
a:hover{ color:var(--hover); }

ul{ list-style:none;}
ol{ padding:0 0 0 26px;}


.but { position:relative; display:inline-block; padding:10px 16px; line-height:140%; min-width:40px; border-radius:var(--radius); background:var(--color); color:var(--bg); vertical-align:middle; text-decoration:none; text-align:center; font-weight:600; }
.but:hover{ background-color:var(--hover); color:var(--bg);}
.but:before{ font-size:24px; line-height:22px; vertical-align:top; margin-right:8px;}

.but_light { background:var(--bg); color:var(--color); border:1px solid var(--color-gray); line-height:22px;}
.but_light:hover { background:var(--color-gray2); color:var(--color);}

.but_disabled { background:var(--color-gray)!important; color:var(--color3)!important; opacity:0.7; }

.but_ico{  padding:10px 2px;}
.but_ico:before{ margin:0;}

.but_red{color:var(--hover);}
.but_blue{background-color:var(--color-blue);}

.but_r{ height:0; text-align:right;}
.but_f{ display:block;}

.but_back:before{ transform: rotate(90deg); }

.color_green{ color:var(--color-ok); }
.color_red{ color:var(--hover); }
.color_blue{ color:var(--color-blue); }

[counter-block]{counter-reset: cc;}
[counter]:before{counter-increment:cc; content:counter(cc);}

.page_auth{height:100%;}
.page_auth:before{ content:""; display:block; background:var(--color); position:fixed; left:0; right:42%; top:0; bottom:0;}
@media screen and (prefers-color-scheme: dark){.page_auth:before{background:var(--color-gray2);}}
.page_auth:after{ content:"";  display:block; background:url(../imgs/logo.svgx?color=white) no-repeat center center; background-size:contain; position:fixed; left:10%; right:52%; top:0; bottom:0;}
.page_auth .pane{ height:100%; position:relative; width:42%; margin:0 0 0 auto; padding:2.5% 6.2% 0px 6.2%; box-sizing:border-box;}

.page_auth h6{  margin:3vh 0 5vh 0; }
.page_auth .but{ display:block;}

.page_auth .hint_mess{ position:fixed; top:24px; right:-600px; border:1px solid var(--color-gray2); border-radius:var(--radius);  background:var(--bg); padding:24px; box-shadow: 0px 0px 24px -4px #1232; transition: right .2s cubic-bezier(0.0, 0.0, 0.2, 1.0); font-size:15px; color:var(--color-g); max-width:500px;}
.page_auth .hint_mess:hover{ box-shadow: 0px 0px 24px -4px #1233; }
.page_auth .hint_mess.active{ right:24px;}
.page_auth .hint_mess>div{ padding:0 12px 0 72px; position:relative;}
.page_auth .hint_mess>div:before{ content:"!"; font:24px icomoon; position:absolute; left:-4px; top:-4px; text-align:center; height:44px; line-height:44px; width:44px; border-radius:100px; color:var(--hover); background:#FEE4E2; border:8px solid #FEF3F2;}
.page_auth .hint_mess.is_ok>div:before{ content:"6"; color:var(--color-ok); background:#D1FADF; border-color:var(--color-green-bg); }
.page_auth .hint_mess b{ font-size:17px; font-weight:600; color:var(--color); display:block; padding-bottom:8px;  }
.page_auth .hint_mess>a:before{ content:"x"; font:12px icomoon; position:absolute; right:0; top:0; line-height:48px; height:48px; width:48px; text-align:center; color:var(--color-g); }
.page_auth .hint_mess>a:hover:before{ color:var(--hover); }

@media screen and (max-width: 700px){
.page_auth .hint_mess{ max-width:334px;}
}


/*FORM*/
.form_base.inload{ opacity:0.6;}
.form_base.inload:after { content:""; position:absolute; top:50%; left:50%; margin:-30px 0 0 -30px; display:block; border:8px solid #8883; border-top-color:var(--color); border-radius: 50%; width: 60px; height: 60px; animation: spin 1.5s linear infinite; z-index:1; }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); }}

.form_base .but{ margin-bottom:16px; }
.form_base[ready="no"] .but_submit{ color:#C0C5CD;  background-color:var(--color-gray2); cursor:default; }
.form_base label{ font-size:15px; line-height:19px; color:inherit; padding:0 0 6px 0;}

.form_base *::placeholder{ color:var(--color-g);}
.form_base .chb{ font-size:15px; line-height:27px; padding:8px 0 24px 0; color:var(--color-g);}
.form_base .chb2{ padding-left:32px; padding-top:2px; position:relative; line-height:inherit;}
.form_base .chb2 .checkbox{ color:var(--color); margin-bottom:4px;}
.form_base .chb2 .checkbox:before{ position:absolute; left:-32px;}

.form_base .sep{ border-bottom:1px solid var(--color-gray2); margin-bottom:16px;}

.form_base input[type="text"], .form_base input[type="password"], .form_base textarea{ box-sizing:border-box; width:100%; padding:10px 12px; border:1px solid var(--color-gray); vertical-align:middle;  font-family:inherit; font-size:inherit; color:inherit; margin-bottom:16px; border-radius:var(--radius); background:var(--bg); line-height:22px; zoom:1; }
.form_base textarea::-webkit-scrollbar { width: var(--radius); }
.form_base textarea::-webkit-scrollbar-button { }
.form_base textarea::-webkit-scrollbar-thumb { background-color: #8883; border-radius:var(--radius); }
.form_base textarea{ border-radius:0;}

.form_base .inp{ position:relative; display:block; }
.form_base .inp_ico input{ padding-left:40px; }
.form_base .inp_ico:before{ content:""; position:absolute; left:12px; top:11px; font:20px icomoon; color:#667085;}
.form_base .inp.inp_email:before{ content:"@"; }
.form_base .inp.inp_name:before{ content:"A"; }
.form_base .inp.inp_pass:before{ content:"/"; }
.form_base .inp.inp_link:before{ content:"H"; }
.form_base .inp.inp_cal{ width:240px; }
.form_base .inp.inp_cal:before{ content:"t"; }
.form_base .inp_s{ display:inline-block; width:100px; }
.form_base .inp_m{ display:inline-block; width:320px; }
.form_base .inp_forgot{ text-align:right; position: relative; top:-4px; margin-bottom:28px; font-size:15px; }
.form_base .inp_sub{ font-size:15px; color:var(--color-g); position:relative; top:-10px; margin-bottom:16px; }
.form_base .inp_flex{ display:flex; column-gap:12px;}
.form_base .inp_flex .inp_flex_1{flex:1;}
.form_base .inp.error input[type="text"], .form_base .inp.error input[type="password"], .form_base .inp.error textarea{ border-color:var(--hover); }
.form_base .inp.error:after{ content:""; }
.form_base label.error:after{ content:"."; font:12px icomoon; display:inline-block; color:var(--hover); cursor:pointer; padding:0 4px; }

.form_base .inp .maxlength{ display:none; position:absolute; right:2px; bottom:19px; font-size:15px; line-height:20px; padding:8px 10px 8px 4px; color:var(--color-gray); background:var(--bg); border-radius:var(--radius); }
.form_base .inp.inp_maxlength_active .maxlength{ display:block;}
.form_base .inp.inp_maxlength_active .maxlength.limit{ color:var(--hover); }
.form_base .inp.inp_maxlength_active input{ padding-right:74px!important;}

.form_base .err_mess{ margin-bottom:20px; color:var(--hover); }

.form_base .inp_phone{}
.form_base .inp_phone dl{ width:60px;}
.form_base .inp_phone dl>dd{ border-color:transparent; border-right-width:1px;  border-right-color:inherit; border-radius:0; background:transparent;}
.form_base .inp_phone input{ margin-left:-60px; padding-left:70px;}

.form_base .suf_icon{ display:none;}
.form_base input:not([value=""])+.suf_icon{ position:absolute; display:block; right:1px; top:50%; margin-top:-18px; background:var(--bg); padding-left:8px;}

.form_base .sub_block{ background:var(--color-gray-bg2); border:1px solid var(--color-gray2); padding:16px 24px; margin:0 0 16px 0; }
.form_base .but_block{ display:flex; justify-content: space-between; position:relative; top:16px; column-gap:24px;}

.to_clipboard{ cursor:pointer; transition: all 1s cubic-bezier(0.1, 0.9, 0.3, 1.0);}
.to_clipboard:active{ background:var(--color); color:var(--bg); transition: none;}

.photo-upload{ width:100%;  min-height:100px; border-radius:var(--radius); margin-bottom:16px; border:1px solid var(--color-gray);}
.photo-upload img{ max-width:100%; max-height:400px; }
.photo-upload.photo-sample-empty{ min-height:100px; padding:16px 30px; padding-top:68px; box-sizing:border-box;  text-align:center; font-size:15px; line-height:normal;}
.photo-upload.photo-sample-empty:hover{ background:var(--color-gray-bg); color:var(--color); }
.photo-upload.photo-sample-empty:before{ content:"="; font:24px icomoon; border:1px solid var(--color-gray); line-height:44px; height:44px; width:44px; position:absolute; left:50%; top:16px; margin-left:-22px; background:none; border-radius:var(--radius);}
.photo-upload.photo-sample-empty small{ font-size:13px; color:var(--color2); display:block; padding-top:4px; }
.photo-upload:not(.photo-sample-empty) .photo-placeholder{ display:none;}
.photo-upload:hover i:before{ content:"d"; font:24px icomoon; border:1px solid var(--color-gray); line-height:44px; height:44px; width:44px; position:absolute; right:16px; top:16px; background:none; border-radius:var(--radius); color:var(--color); background:var(--bg);}
.photo-upload:hover i:hover:before{ color:var(--hover); }
.photo-upload.dragover{ background-color:var(--color-blue-bg);}

dl.select {  line-height:42px; margin-right:0px; color:var(--color); font-size:inherit; border-color:var(--color-gray); text-align:left;  }
dl.select dd { padding:0px 36px 0 12px; }
dl.select>dd { border-radius:var(--radius); background:var(--bg);}
dl.select>dd:before { display:none; }
dl.select>dd:after{  right:12px; width:8px; height:8px; border-width:2px; border-color:var(--color-g); border-radius:2px; }
dl.select dd.default { color:var(--color-g); }
dl.select dl { background:var(--bg);  }
.form_base dl.select{ margin-bottom:16px; }

/*auth_tab*/
.auth_tab{ display:none; }
.auth_tab.active{ display:flex; flex-direction: column; min-height:100%; padding-bottom:24px; box-sizing:border-box;}
.auth_tab .or{ position:relative; color:var(--color-g); overflow:hidden; text-align:center; margin:32px 0; }
.auth_tab .or:before, .auth_tab .or:after{ content:""; display:inline-block; border-top:1px solid var(--color-g); width:50%; margin-left:2%; margin-right:-52%; vertical-align:middle; }
.auth_tab .or:before{ position:absolute; margin-left:-52%; top:12px; }
.auth_tab .block_alt{  text-align:center; color:var(--color-g); line-height:140%; }
.auth_tab .block_alt .sub_hdr{ padding:0px 0 14px 0; }
.auth_tab .bottom{  text-align:center; color:var(--color-g); margin:auto 0 0 0; padding-top:36px; line-height:140%; }
.auth_tab .bottom a{ font-weight:bold; display:inline-block; margin-top:8px; }

.auth_tab .social-block { position:relative; display:flex; column-gap:24px; justify-content: center; }
.auth_tab .social-btn { position:relative; flex:1; overflow:hidden; border:1px solid var(--color-gray); font-weight:600; text-align:center; padding:10px 16px; line-height:24px; border-radius:var(--radius); white-space:nowrap; cursor:pointer; text-decoration:none; }
.auth_tab .social-btn:hover { background:var(--color-gray2);  }
.auth_tab .social-btn:before { content:""; vertical-align:top; display:inline-block; width:24px; height:24px; margin-right:12px;  background-size:cover; background-repeat:no-repeat; background-position: center center; }
.auth_tab .social-btn-telegram:before{ background-image:url(../imgs/ico_telegram.svg);}
.auth_tab .social-btn-google:before{ background-image:url(../imgs/ico_google.svg);}
.auth_tab .social-btn-google>div{ position:absolute; opacity:0.001; left:0; right:0; top:2px; bottom:0;}


@media screen and (max-width: 1500px){
.page_auth:before{  right:50%;}
.page_auth:after{ right:60%; }
.page_auth .pane{ width:50%; }	
}

@media screen and (max-width: 1200px){
.page_auth{ height:auto; min-height:860px;}
.page_auth:before{ position:static; height:250px;  background-image:url(../imgs/logo.svgx?color=white); background-repeat: no-repeat; background-position: center center; background-size:300px;}
.page_auth:after{ display:none; }
.page_auth .pane{  height:auto; width:auto; padding:32px 24px; max-width:620px;  margin:0 auto; }	
.page_auth h6{ margin:0 0 24px 0; }
}

@media screen and (max-width: 700px){
.page_auth:before{  height:200px;  }
}


.page_auth .invite{ background:var(--color-gray-bg2); border:1px solid var(--color-gray2); border-radius:var(--radius); padding:16px; font-size:15px; font-weight:400; margin-bottom:20px;}
.page_auth .invite i{ font-style:normal;}
.page_auth .invite .prod{ display:flex; gap:16px; padding-top:12px;}
.page_auth .invite .prod b{  font-size:19px; line-height:29px; font-weight:600; }
.page_auth .invite .prod span{  color:var(--color-g); font-size:14px; }
.page_auth .invite .prod img{ max-width:94px; border-radius:var(--radius); }

/*table*/
table{ border-collapse:collapse; counter-reset: cc; font-weight:500; width:100%; }
table th{ color:var(--color2); font-size:12px; padding:12px 16px;  border-bottom:1px solid var(--color-gray2); text-align:left; font-weight:500; white-space:nowrap;}
table td{ padding:16px 16px; border-bottom:1px solid var(--color-gray2);}

.table{  overflow:auto;  }
.table table{ border-radius:var(--radius);  }
.table thead tr{position:sticky; top:0px; background:var(--color-gray-bg); z-index:1; border-top-left-radius:var(--radius); border-top-right-radius:var(--radius); }
.table b{ font-weight:600; }
.table small{ display:block; font-size:12px; color:var(--color2); font-weight:400; }
.table tr.is_disabled td{ color:#0006; background:#f3f3f3;}


picture{ border-radius:var(--size); background:var(--color-gray2); border:1px solid var(--color-gray-bg); overflow:hidden; position:relative; padding:0; }
picture:before{ content:"A"; font:calc(var(--size)/2) icomoon; position:absolute; top:0; left:0; bottom:0; right:0; line-height:var(--size); text-align:center; color:var(--color2); }
picture img{ width:var(--size); height:var(--size); min-width:var(--size); min-height:var(--size); position:relative; vertical-align:top; }

.avatar{ display:flex; gap:12px; align-items: center; }
.avatar picture{ --size:40px; }
.avatar small{ color:var(--color2); display:block; }

/******** Main ***********/
main{ display:flex; flex-direction:column; height:100%; line-height:140%;}
main a{ text-decoration:none;}

.notice{ background:var(--color-gray); border:1px solid var(--color); border-radius:var(--radius); font-size:19px; font-weight:600; display:flex; align-items: center; justify-content: space-between; gap:16px 32px; padding:16px 24px; margin-bottom:48px;}
@media screen and (max-width: 1000px){ .notice{flex-wrap: wrap;}}
.notice .but{ white-space:nowrap; min-width:auto;}

.notice_warn{ background:var(--color-yellow-bg); border-color:var(--color-yellow); }
.notice .but_light{border-color:var(--color-yellow); background:rgb(from var(--color-yellow) r g b / 20%);}
.notice_alert{ background:var(--color-red-bg); border-color:var(--color-red); }

.notice_lock{ box-sizing:border-box; padding:30px; text-align:center;}
.notice_lock:before{ content:"`"; font:32px icomoon; display:inline-block; width:68px; height:68px; line-height:68px;  background:var(--color-red-bg); color:var(--hover); margin-bottom:16px; border-radius:100px; }
.notice_lock_pupil:before{ content:"1";}
.notice_lock h3{ font-size:30px; margin-bottom:28px;}
.notice_lock p{ padding-bottom:8px;}
.notice_lock .block_g{ background:var(--color-gray-bg2); border:1px solid var(--color-gray2); border-radius:var(--radius); padding:8px 6px;}

.tabs{ display:flex; gap:4px; background:var(--color-gray-bg); border:1px solid var(--color-gray2); border-radius:var(--radius); padding:4px; margin-bottom:24px; font-size:15px; overflow-x:auto; }
.tabs>*{ color:var(--color3); font-weight:bold; text-align:center; padding:8px 12px; border-radius:var(--radius); flex:1; white-space:nowrap; }
.tabs>*.active{ background:var(--bg); box-shadow: 0px 1px 2px 0px var(--shadow);  color:var(--color); }
.tabs>* span{ padding:2px 6px; font-size:13px; font-weight:500; border:1px solid var(--color-gray); margin:-6px 0 -6px 8px; display:inline-block; border-radius:var(--radius); }
.tabs>* span.color_green{ background:var(--color-green-bg); color:var(--color-green); border-color:rgb(from var(--color-green) r g b / 40%); }
.tabs>* span.color_yellow{ background:var(--color-yellow-bg); color:var(--color-orange); border-color:rgb(from var(--color-yellow) r g b / 40%); }
.tabs>*.item_ico{ flex:0;}
.tabs>*.item_ico>a:before{ margin:0;}
.type_adap .tabs>[name="#tab_homework"], .type_adap .tabs>[name="#tab_reviews"]{ display:none; }
@media screen and (max-width: 700px){
	.tabs{ border-radius:0; margin-right:-24px; margin-left:-24px; padding:4px 24px; }
}

.tab_block{ display:none;}
.tab_block.active{ display:block;}
.tab_block .tab_border{ border:1px solid var(--color-gray2); padding:32px; border-radius:var(--radius); }
@media screen and (max-width: 700px){
	.tab_block .tab_border{ border:0; padding:0px; }
}
.tab_block h2{ font-size:19px; font-weight:600; line-height:29px; margin:0 0 36px 0;}

.tarif_head{ display:flex; justify-content: space-between; font-size:15px; line-height:19px; margin-bottom:24px;}
.tarif_head h2{ font-size:21px; line-height:31px; margin:0; padding:0; font-weight: 600;}
.tarif_head i{ font-style:normal; color:var(--color3);}
.tarif_head .price{ font-size:13px; display:flex; align-items: flex-end;}
.tarif_head .price big{ font-size:48px; line-height:42px; font-weight: 600; padding:0 6px;}
.tarif_head .price big span{ display:none;}
.tarif_head .price big span.active{ display:inline;}
.tarif_head .price b{ font-size:30px; padding-bottom:20px;}

.tarif_desc{border-top:1px solid var(--color-gray2); margin-bottom:24px; padding-top:24px;}
.tarif_desc h3{ font-weight: 600; margin-bottom:12px;}
.tarif_desc ul { display:flex; flex-wrap:wrap; gap:16px 6%; }
.tarif_desc ul li{ display:flex; gap:8px; flex:47%;}
.tarif_desc ul li:before{ content:"V"; font:20px icomoon; }

.tarif_buts a{ display:none; margin-bottom:0!important;}
.tarif_buts a.active{ display:block;}


.top_nav{ padding-bottom:24px; display:flex; justify-content: space-between; gap:16px; }
.top_nav a:first-child{ margin-right:auto;}
@media screen and (max-width: 700px){
	.top_nav .mobile_text_hide{ padding:10px 2px;}
	.top_nav .mobile_text_hide:before{ margin:0;}
	.top_nav .mobile_text_hide span{ display:none;}
}


section{ max-width:1440px; margin:0 auto; padding:0 24px; box-sizing:border-box;}
header{ border-bottom:1px solid var(--color-gray); font-weight:600; position:relative; z-index:2;}
header section{ display:flex; height:64px; column-gap:32px;}
header .logo{ width:130px; background:url(../imgs/logo.svgx?color=%231D2939) no-repeat center center; background-size:contain;} 
html[theme="dark"] header .logo{ background-image:url(../imgs/logo.svgx?color=%23d6d8da);} 
header .but_nav{ display:none; align-items: center;} 
header .but_nav:before{ content:"N"; font:34px icomoon;} 

header nav{ display:flex; flex:1; column-gap:inherit;}
header nav a{ position:relative; display:flex; align-items: center;}
header nav a.active{ color:var(--hover);}
header nav a.active:after{ content:""; background-color:var(--hover); border-radius:var(--radius); display:block; width:var(--radius); height:var(--radius); position:absolute; bottom:4px; left:50%; margin-left:-2px;  } 
header nav _a[href="author/"]{ margin-left:auto;}
header nav:not(.author_biz) a[href="business/"]{ display:none;}


header .profile{ position:relative; display:flex; align-items: center;}
header .profile>a.icon:before{ padding:0; margin:0; }
header .profile>a{ display:flex; align-items: center; }
header .profile>a>img{ border-radius:100px; margin:0 0 0 12px; background:var(--color-gray2);} 

/*dd_block*/
.dd_block{ position:relative; z-index:1;}
.dd{ position:absolute; top:100%; left:-16px; display:none; box-shadow:2px 0px 16px 0px var(--shadow); background:var(--bg); border-radius:var(--radius); font-size:15px; text-align:left; z-index:1; font-weight:600; overflow:hidden;   border:1px solid var(--color-gray);}
.dd_r{ right:0; left:auto;}
.dd_block.active{  z-index:2;}
.dd_block.active .dd, .dd.active{ display:block;}
.dd a{ white-space:nowrap; display:block; padding:10px 16px 10px 16px;  border-bottom:1px solid var(--color-gray);}
.dd a:last-child{ border-bottom:0;}
.dd a.active{ color:var(--hover);}
.dd a:hover{ background:var(--color-gray-bg);}
.dd a:before{  font-size:17px; margin-right:12px;}

.dd .profile_item{ color:var(--color-g); font-size:13px; line-height:19px; font-weight:500; display:flex; align-items: center;  }
.dd .profile_item img{  border-radius:100px; margin:0 12px 0 0; background:var(--color-gray); }
.dd .profile_item span{ color:var(--color-blue); }

html[theme="dark"] a[theme="icon"]:before{content:"(";}
html[theme="light"] a[theme="icon"]:before{content:")";}
html:not([theme]) a[theme="default"], html[theme="light"] a[theme="light"], html[theme="dark"] a[theme="dark"]{ color:var(--hover)}

.hdr{display: flex; flex-wrap: wrap; align-items: flex-start; padding-bottom:24px; gap:8px;}
.hdr *:first-child{ margin:0 auto 0 0;}

/*article*/
article{ padding:48px 0; position:relative; z-index:1; }
article h1{ font-weight:700; margin-bottom:32px; }
article h1 em{ display:inline-block; position:relative; top:2px; background:var(--color-gray-bg); color:var(--color-g); font-size:24px; font-weight:600; vertical-align:top; margin-left:8px; border-radius:var(--radius); font-style:normal; padding:0 10px;}


.progress{ display:flex; align-items: center; margin:0 0 16px 0; padding:4px 0 0 0; font-size:15px; font-weight:600; color:var(--color-g); min-width:150px; }
.progress:before{ content:attr(label); }
.progress span{ flex:1; margin:0 48px 0 12px; position:relative; top:1px; background:var(--color-gray-bg); border-radius:var(--radius); display:inline-block; height:var(--radius);  }
.progress span:before{ content:""; display:block; background:var(--color-ok); border-radius:var(--radius); display:inline-block; width:var(--value); min-width:6px; height:var(--radius); vertical-align:top;  }
.progress span:after{ content:attr(value); position:absolute; left:100%; top:-8px; width:48px; text-align:right;  }

.catalog{ display:flex; flex-direction:row; flex-wrap:wrap; gap:24px;}
.catalog .item{ display:flex; flex-direction:column;  position:relative; width:330px; padding:15px; border:1px solid var(--color-gray); border-radius:var(--radius);  box-sizing:border-box; overflow:hidden; }
.catalog .item img{ width:330px; height:210px; min-width:330px; min-height:210px; border-radius:var(--radius); }
.catalog .item img[data-src=""]{ max-height:160px; min-height:160px;}
.catalog .item .img{ margin:-16px -16px 16px -16px; }
.catalog .item h4{ font-size:15px;  color:var(--color); }
.catalog .item h5{ font-size:15px; font-weight:500; margin: 8px 0 24px 0; color:var(--color-g);  display:-webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow:hidden; }
.catalog .item .bottom{ margin:auto 0 0 0; }
.catalog .item .but{ display:block; font-size:15px; font-weight:500; padding:8px 16px;  }

.catalog3{ }
.catalog3 .item{ width:448px; }
.catalog3 .item img{ width:448px; height:285px; min-width:448px; min-height:285px; }

.catalog .item_new{ border-style:none; color:var(--color-gray); text-align:center; justify-content: center; overflow:hidden;  min-height:200px; }
.catalog .item_new:after{ content:""; position:absolute; left:0; top:0; right:0; bottom:0;  outline: 5px dashed var(--color-gray); outline-offset: -1px; border-radius:var(--radius); }
.catalog .item_new:before{ content:"+"; display:block; font:36px icomoon; display:inline-block; padding-bottom:10px;  }
.catalog .item_new:hover{ background:var(--color-gray-bg); color:var(--color-g);  }

.catalog .state{ display:flex; justify-content: space-around; border-top:1px solid var(--color-gray2); padding:16px 0; font-weight:500; margin:auto -15px -15px -15px;  }
.catalog .state>span{ position:relative; color:var(--color-g);  border-left:1px solid var(--color-gray-bg); line-height:16px; font-size:13px; flex:1; display:flex; justify-content: center;}
.catalog .state>span:first-child{ border:0;}
.catalog .state>span b{ font-size:17px; display:block; color:var(--color); line-height:24px;}
.catalog .state>span span{ position:relative; padding: 0 8px 0 60px;}
.catalog .state>span span:before{ content:""; font:20px/44px icomoon; display:block; width:44px; height:44px; position:absolute; top:0; left:6px; background:#eee; border-radius:50px; text-align:center;}
.catalog .state .icon_1:before{ content:"2"; background:var(--color-green-bg); color:var(--color-green);}
.catalog .state .icon_2:before{ content:"["; background:var(--color-orange-bg); color:var(--color-orange);}
.catalog .state .icon_3:before{ content:"X"; background:var(--color-blue-bg); color:var(--color-blue);}


.product { position:relative;}
.product .nav_back{ display:inline-block; font-weight:600; margin-bottom:24px; color:var(--color-g); }
.product .nav_back:not(:hover){ color:var(--color-g);}
.product .nav_back:before{ content:"l"; font:20px/22px icomoon; margin-right:8px; vertical-align:top;}


.product>aside{ display:flex; gap:32px; margin-bottom:60px;}
.product>aside>div{ flex:1; }
.product>aside>div:first-child{ order:2; flex:0.8; }
.product>aside>div:last-child{ min-width:400px;}
.product>aside img{ max-width:600px; max-height:400px; width:100%; order:2; border:1px solid var(--color-gray); border-radius:var(--radius);}
.product>aside img[data-src=""]{ max-height:100px;}
.product>aside p{ padding-bottom:32px;}
.product>aside .prop{ display:flex; }
.product>aside .prop div{ flex:1; }
.product>aside label{ color:var(--color-g); font-weight:600; display:block; margin-bottom:16px;}
.product>aside .progress{ margin-top:32px; }

.product h1{ font-size:36px; }
.product h2{ text-align:center; font-weight:700; font-size:30px; margin:0 0 32px 0; }
.product .edit{display:flex;  gap:16px; padding-bottom:12px; justify-content: space-between;}

.product .content{ display:flex;}
.product .block_label{ display:flex; flex-direction: column; position:relative; z-index:1; }
.product .block_label a{ border:1px solid transparent; padding:16px; margin-right:-1px; position:relative; }
.product .block_label a.active{border-color:var(--color-gray); border-right-color:var(--bg);  border-top-left-radius:var(--radius); border-bottom-left-radius:var(--radius);}
.product .block_label img{ border:1px solid var(--color-gray); min-width:150px; min-height:100px;  width:150px; height:100px; vertical-align:top; border-radius:var(--radius); background:var(--color-gray);}
.product .block_label div{ display:none; }
.product .block_label a i[data-icon="+"]{ display:flex; flex-direction: column; align-items:center; justify-content: center; width:150px; height:100px; vertical-align:top; color:var(--color-gray); border:1px dashed var(--color-gray); border-radius:var(--radius); font-style:normal; }
.product .block_label a i[data-icon="+"]:before{ font-size:24px; margin:0; display:block;}
.product .block_label a i[data-icon="+"]:hover{ background: var(--color-gray-bg);  color:var(--color2);}

.product .block_contents{ flex:1; display:flex;}
.product .block_item{ visibility:hidden; opacity:0; height:0; overflow:hidden; position:absolute; background:inherit; transition: opacity .3s cubic-bezier(0.0, 0.0, 0.2, 1.0); border:1px solid var(--color-gray); border-radius:var(--radius); padding:32px; flex:1; overflow-wrap: anywhere; }
.product .block_item.active{ visibility:visible; opacity:1; height:auto; overflow:visible; position:relative; }
.product .block_item.active:nth-child(1){  border-top-left-radius:0;}
.product .block_item .desc{ text-align:center; margin-bottom:32px; padding:0 160px 32px 0px; position:relative; }
.product.is_edit .block_item .desc{  padding:0px 32px 0px 32px; }
.product .block_item .desc h3{ font-size:24px;  margin-bottom:8px; }
.product .block_item .desc .progress_state{ position:absolute; right:0; top:0; font-size:15px; }
.product .block_item .desc .progress_state:before{ content:attr(default); background:var(--color-gray-bg); color:var(--color-g); border-radius:var(--radius);  margin-bottom:8px; padding:4px 12px; display:block; }
.product .block_item .desc .progress_state.in_progress:before{ content:attr(in_progress); background:var(--color-orange-bg); color:var(--color-orange); }
.product .block_item .desc .progress_state.finish:before{ content:attr(finish); background:var(--color-green-bg); color:var(--color-green); }
.product .block_item .hdr_m{ display:none; }
@media screen and (max-width: 700px){
	.product .block_item .desc{  padding:0px 32px 0px 32px; }
	.product .block_item .desc .progress_state{ position:relative; margin:12px auto 0 auto; }
	.product .block_item .desc .progress_state:before{display:inline-block; margin:0 8px 0 0; }
}
	
.product .content_empty{ text-align:center; color:var(--color-g); background:url(../imgs/empty_blocks.png) no-repeat center top; padding:200px 0 16px 0;}

.product .list{}
.product .item{ border:1px solid var(--color-gray); border-radius:var(--radius); position:relative; margin-bottom:12px;}
.product .item label{ display:block; position:relative; color:var(--color);  padding:16px 32px 16px 52px; border-radius:inherit;}
.product .item label:hover{ background-color:var(--color-gray-bg); cursor:pointer;}
.product .item label:before{ content:"G";  font:26px icomoon; position:absolute; right:16px; top:50%; margin-top:-15px; __transition: transform .3s cubic-bezier(0.0, 0.0, 0.2, 1.0); color:var(--color); }
.product .item.open label:before{transform: rotate(180deg);}
.product.is_edit .item label:before{ right:auto; left:16px; margin:0; top:16px; transform: rotate(270deg);}
.product.is_edit .item.open label:before{transform: rotate(0deg);}
.product .item label .ico{ position:absolute; left:16px; top:16px;}
.product .item label .ico:not(.checkbox):before{ margin:0; content:"Z"; font:22px icomoon; color:var(--color-gray);}
.product .item label b{ display:block;  color:var(--color-g); padding-bottom:4px; font-weight:500;}
.product .item label .reads_state{ position:absolute; right:60px; top:20px; padding:2px 6px; font-size:14px; font-weight:500; border:1px solid var(--color-gray); margin:-6px 0 -6px 8px; display:inline-block; border-radius:var(--radius); background:var(--color-blue-bg); color:var(--color-blue); border-color:rgb(from var(--color-blue) r g b / 40%); }
.product .item.lock label:before{ right:auto; left:16px; margin:0; top:16px; transform:none; content:"k";}
.product .item.lock .checkbox{ display:none;}
.product .item.lock label .reads_state{ right:16px;}
.product .item aside{ position:relative; padding:0 16px; box-sizing:border-box; max-height:0px; overflow:hidden; transition: max-height .3s cubic-bezier(0.0, 0.0, 0.2, 1.0);}
.product .item aside:before{ content:""; border-top:1px solid var(--color-gray); position:absolute; left:0; right:0; top:0;}
.product .item.open aside{max-height:var(--max-height);}
.product .item aside h3{ font-size:inherit; font-weight:600; padding:16px 0; margin:0;  color:var(--color-g);}
.product .item aside .reads_content{ padding:0; margin:0; }
.product .item aside .video{ padding:16px 0 16px 0; text-align:center;}
.product .item aside .video iframe, .product .item aside .video .iframe{ vertical-align:top; background:#eee url(../imgs/loading_b.gif) no-repeat center center; width:600px; height:350px; margin:0 auto;}
.product .item aside .but{ font-size:15px;  color:var(--color);}
.product .item aside .but:after{ content:attr(label_1); }
.product .item aside ul{  }
.product .item aside ul li{ position:relative; background:var(--color-gray-bg2); border:1px solid var(--color-gray2); border-radius:var(--radius); margin-bottom:8px; }
.product .item aside ul li:before{ position:absolute; right:20px; top:50%; margin-top:-16px; content:"&"; font:32px icomoon; color:var(--color-g); }
.product .item aside ul li:hover:before{ color:var(--color); }
.product .item aside ul li>a{ position:relative; display:block; padding:8px 72px 8px 64px; background-size:32px 32px; background-repeat:no-repeat; background-position:16px 12px; min-height:40px; }
.product .item aside ul li>a>span{ display:block; color:var(--color-g); font-size:15px; }
.product .item aside ul li>a.type_1{ background-image:url(../imgs/source_type_1.png);}
.product .item aside ul li>a.type_2{ background-image:url(../imgs/source_type_2.png);}
.product .item aside ul li>a.type_3{ background-image:url(../imgs/source_type_3.png);}
.product .item aside ul li>a.type_4{ background-image:url(../imgs/source_type_4.png);}

.product .item.learn_done{ border-color:var(--color-ok); }
.product .item.learn_done label .ico:before{ content:"V"; color:var(--color-ok); }
.product .item.learn_done aside .but:after{ content:attr(label_2); }
.product .item.learn_wait{ border-color:var(--color-yellow); }
.product .item.learn_wait label .ico:before{  content:"h"; color:var(--color-orange); }
.product .item.learn_cancel{ border-color:var(--color-red); }
.product .item.learn_cancel label .ico:before{  content:"1"; color:var(--hover); }
.product .item.learn_ok{ border-color:var(--color-green); }
.product .item.learn_ok label .ico:before{  content:"6"; color:var(--color-ok); }

.product .item .dz_info{  background:var(--color-gray-bg2); border:1px solid var(--color-gray2); padding:16px 24px; margin:16px 0; }
.product .item .dz_info .hdr{ line-height:32px; padding-bottom:0; }
.product .item .dz_info .comm{ color:var(--color-g); }
.product .item .state{ display:inline-block; padding:4px 12px; background:var(--color-gray-bg); color:var(--color-gray); border:1px solid #0002; border-radius:var(--radius);  white-space:nowrap;  }
.product .item .state:before{ font:20px icomoon; vertical-align:text-bottom; padding-right:8px; }
.product .item.learn_ok .state{ background:var(--color-green-bg); color:var(--color-ok); border-color:rgb(from var(--color-green) r g b /60%); }
.product .item.learn_ok .state:before{ content:"6"; }
.product .item.learn_cancel .state{ background:var(--color-red-bg); color:var(--hover);  border-color:rgb(from var(--color-red) r g b / 60%); }
.product .item.learn_cancel .state:before{ content:"1"; }
.product .item.learn_wait .state{ background:var(--color-yellow-bg); color:var(--color-brown);  border-color:rgb(from var(--color-orange) r g b / 60%); }
.product .item.learn_wait .state:before{ content:"h"; }

.product .drager{ display:block; position:absolute; right:100%; top:15px;  height:50px; cursor:pointer; padding:0 13px; }
.product .drager:before{ display:none; content:""; border:2px dotted var(--color-gray); border-top:0; border-bottom:0; height:25px; width:5px; }
.product .drager:hover:before{ border-color:var(--color); }
.product .item:hover .drager:before{ display:block;}
.product .item.dragstart{ background:var(--color-blue-bg); }
.product .item.dragstart aside{ display:none; }
.product .item.dragover{border-color:var(--color-blue); }

.product .block_label a .drager{ padding:0 3px; right:auto; left:0; top:52px; }
.product .block_label a:hover .drager:before{ display:block;}
.product .block_label a.dragstart{ background:var(--color-blue-bg); }
.product .block_label a.dragstart aside{ display:none; }
.product .block_label a.dragover{border-color:var(--color-blue); }


.product .reads_empty{ text-align:center; color:var(--color-g); background:url(../imgs/empty_reads.png) no-repeat center top; padding:200px 0 16px 0;}

.product .but_edit{ position:absolute; right:0px; }
.product .bottom{ text-align:center; padding:16px 0;}


.reads_source{border:1px solid var(--color-gray2); background:var(--color-gray-bg); padding:24px 24px 0 24px; margin-bottom:16px; position:relative; border-radius:var(--radius);}
.reads_source .but_delete{ position:absolute; right:12px; top:16px; color:var(--color3);}
.reads_source .but_delete:hover{  color:var(--hover);}

.popup{ border-radius:16px; background:var(--bg); color:var(--color); border-color:var(--color-gray);}
.popup::-webkit-scrollbar { width: var(--radius); }
.popup::-webkit-scrollbar-button { }
.popup::-webkit-scrollbar-thumb { background-color: #8883; border-radius:var(--radius); }
.popup:hover::-webkit-scrollbar-thumb{ background-color: #8888; }
.popup.popup-show{  max-height:95%; }
.popup-modal{ background:#0003; backdrop-filter: blur(2px); filter:saturate(0.5);}
.popup-close{ position:absolute; z-index:31; margin:0; float:none; top:24px; right:16px; width:auto; height:auto; padding:8px; color:var(--color-gray);   }
.popup-close:before{ font:32px icomoon; content:"1"; }

.popup .text, .popup .form_base{ padding:32px;}
.popup h1{ margin-bottom:24px; line-height:30px;}


@media screen and (max-width: 700px){
	.popup.popup-show{  max-height:90%; top:auto; bottom:0; left:0; transform:none; margin:0; width:100%; border-bottom-left-radius:0; border-bottom-right-radius:0; }	
	.popup-close{   top:18px; right:14px; }
	.popup .text, .popup .form_base{ padding:24px;}
}

.popup.popup-show.popup-cond{  max-height:80%; }


section.text{ max-width:900px;}
.text{ font-size:15px;  line-height:140%;}
.text p{ margin:0 0 16px 0;}
.text ul{ margin:0 0 16px 0;}
.text ul li{ position:relative; padding:0 0 0.2em 1.5em;}
.text ul li:before{ content:"\2022"; position:absolute; left:5px; font:1.3em/1em Arial, sans-serif; color:var(--color);}


.author_new form{ max-width:670px; margin:0 auto;}

.invite_inp{ display:flex; flex-wrap: wrap; gap:16px; align-items: flex-end;}
.invite_inp>:nth-child(1){ flex:1;}
.invite_inp input{  }
.invite_mess, .invite_err{ font-weight:400; font-size:15px; color:var(--color2);}
.invite_err{ display:none; color:var(--hover);}
.invite_items{  padding-bottom:22px;}
.invite_item{ display:inline-block; padding:4px 8px; margin:0 8px 8px 0; font-size:15px; border-radius:var(--radius);  border:1px solid var(--color-gray2); background:var(--color-gray-bg);}
.invite_item a{ display:inline-block; padding:0 0 0 8px; cursor:pointer; color:var(--color2);}
.invite_item a:hover{ color:var(--hover);}
.invite_item a:before{ content:"x"; font:8px icomoon; vertical-align:middle;}
.invite_item.invalid{ background:var(--color-red-bg); border-color:rgb(from var(--color-red) r g b / 40%);}

.inp_vote{ display:flex; justify-content: space-between; padding-bottom:24px; font-weight:500;flex-wrap: wrap; gap: 24px; }
.inp_vote .inp_vote_section{ }
.inp_vote label{ display:block; padding-bottom:12px;}
.inp_vote s{ text-decoration:none; padding: 0 4px 0 0; vertical-align:middle; color:var(--color-gray2); cursor:pointer; }
.inp_vote s.active{ color:#FDB022; }
.inp_vote s:before{ content:"S"; font:19px icomoon;}
.inp_vote i{ display:inline-block; width:20px; text-align:right; font-style:normal;}


.rating{ position:relative; display:inline-block; white-space:nowrap;}
.rating:before, .rating:after{ content:"SSSSS"; display:inline-block; font:19px icomoon; color:var(--color-gray2); }
.rating:after{ position:absolute; left:0; top:0; color:#FDB022; width:var(--width); overflow:hidden;}

.review{ position:relative; padding-left:30%; min-height:360px; }
.review_total { width:30%; position:absolute; left:0; top:0; background:url(../imgs/reviews.png) no-repeat center top; padding-top:240px; color:var(--color3); text-align:center; }
.review_total b{ font-size:48px; line-height:60px; font-weight:500; display:block; color:var(--color);  }
.review_total .rating{ margin:12px 0;}
.review_item{ position:relative; padding:16px 24px; border-radius:var(--radius);  border:1px solid var(--color-gray2); margin-bottom:32px; overflow-wrap: break-word; }
.review_item .avatar{ margin-bottom:12px; }
.review_item .rside{position:absolute; right:24px; top:16px;} 
.review_item .but_delete{ color:var(--color3); position:relative; top:-2px; margin:0 -20px 0 10px; }
.review_item .but_delete:hover{ color:var(--hover); }
.review_item_sub{ position:relative; padding:16px 24px; margin:16px 0 0 76px; background:var(--color-gray-bg2); border-radius:var(--radius);  border:1px solid var(--color-gray2); }
.review_item_sub:before{ position:absolute; top:0; left:-60px; display:block; width:48px; height:48px; content:""; display:block; border-bottom-left-radius:24px;  border:1px solid var(--color-gray2); border-top:0; border-right:0;  }
.review_item_sub label{ margin-bottom:12px; display:block; font-weight:600; }

#tab_homework .status{ display:inline-block; padding:2px 8px; background:var(--color-gray-bg); color:var(--color-gray); border:1px solid #0002; border-radius:var(--radius);  white-space:nowrap; font-size:13px; font-weight:500;  }
#tab_homework .status_ok{ background:var(--color-green-bg); color:var(--color-ok); border-color:rgb(from var(--color-green) r g b /60%); }
#tab_homework .status_cancel{ background:var(--color-red-bg); color:var(--hover);  border-color:rgb(from var(--color-red) r g b / 60%); }
#tab_homework .status_wait{ background:var(--color-yellow-bg); color:var(--color-brown);  border-color:rgb(from var(--color-orange) r g b / 60%); }

@media screen and (max-width: 700px){
.review{  padding-left:0; min-height:0; }
.review_total { width:auto; position:relative; left:0; top:0; background:url(../imgs/reviews.png) no-repeat 20px 10px; background-size:150px;  padding:10px 20px 0 180px; height:180px;  }
.review_item_sub{ margin-left:28px; }
.review_item_sub:before{  left:-30px; width:28px; height:28px; border-bottom-left-radius:14px;  }
}


footer { margin:auto 0 0 0;  background:var(--color-gray-bg); border-top:1px solid var(--color-gray2); }
footer section{ display:flex; align-items: center; background:url(../imgs/logo.svgx?color=%2398A2B3) no-repeat 24px center; background-size:130px; color:var(--color-g); padding-top:16px; padding-bottom:16px; font-size:15px;} 
footer section>div{} 
footer a:not(:hover){ color:var(--color-g);}
footer .pay_icons{ padding-top:50px; min-width:182px; }
footer .copy{ max-width:460px; } 
footer .copy p{ padding:3px 0 16px 0;} 
footer .nav{ margin:0 0 0 auto; }
footer .nav a{  display:block; padding:6px 0; white-space:nowrap;  }
footer .soc { padding:24px 32px;  }
footer .soc a{  }
footer .soc a:before{ content:""; font:24px icomoon; margin:0 8px;  }
footer .soc a.soc_insta:before{ content:"v"; }
footer .soc a.soc_tiktok:before{ content:"a"; }
footer .soc a.soc_telegram:before{ content:"c"; }


@media screen and (max-width: 700px){
header .but_nav{ display:flex;} 
header section{ column-gap:16px;}
header .profile>a>span{ display:none;}

header .logo{ margin-right:auto;}
header nav{ display:flex; flex-direction: column-reverse; justify-content: flex-end; visibility:hidden; position:fixed; z-index:11; left:0; top:65px; bottom:0; right:auto;  overflow-y:auto;   box-shadow: 0px 15px 15px 0px var(--shadow); transition: all .2s  cubic-bezier(0.1, 0.5, 0.3, 1.0); transform:translateX(-100%); background-color:var(--bg); max-width:520px; }
header nav.open{ visibility:visible; transform:translateX(0);}
header nav a{ display:block; padding:16px 24px; font-size:21px; font-weight:500; margin:0!important;}
header nav a:first-child{ __border-bottom:1px solid var(--color-gray); }
header nav a.active:after{ display:none;}

main{  min-height: 800px; }
article{ padding:32px 0; }
article section{}

.catalog{ flex-direction:column; flex-wrap:nowrap;  }
.catalog .item{ flex:1; width:auto; }
.catalog .item img{ width:100%; height:auto; min-width:382px; }

.but_r{ height:auto; text-align:center; padding-bottom:24px;}
.but_r.add_module_but{ display:none;}

.product .top_nav{flex-wrap: wrap;}
.product>aside{ margin-bottom:32px;}
.product .content{ display:block;}
.product .block_label{ display:block; }
.product .block_label a{ display:block; border:1px solid var(--color-gray)!important;  border-radius:var(--radius); margin-bottom:24px; }
.product .block_label a.active{ display:block; color:var(--color); }
.product .block_label img{ min-width:100px; min-height:66px;  width:100px; height:66px; }
.product .block_label div{ display:flex; flex-direction: column; justify-content: space-evenly; position:absolute; left:0; right:0; top:0; bottom:0; padding:16px 48px 16px 132px; font-size:15px; font-weight:600; }
.product .block_label div:before{ content:"G";  font:26px icomoon; position:absolute; right:16px; top:50%; margin-top:-15px; transform: rotate(270deg); color:var(--color-gray); }
.product .block_label div span{ font-size:17px;font-weight:600; color:var(--color-gray); }
.product .block_label a i[data-icon="+"]{ display:flex; flex-direction: row; align-items:center; justify-content: center; width:auto; height:auto; border:0; color:var(--color2); }
.product .block_label a i[data-icon="+"]:before{ font-size:24px; margin:0 10px 0 0; display:inline-block; }

.popup .product { padding:24px; }
.popup .product .block_label a{ display:block; margin-bottom:12px; }
.popup .product .block_label a.active{  border-color:var(--color-blue)!important; background:var(--color-blue-bg); }

.product .block_contents{ display:block;}
.product .block_item{  padding:64px 0 0 0; border:0;  }
.product .block_item.active{ visibility:hidden; position:absolute;  }
.product .block_item.open{ visibility:visible; position:relative;   }
.product .block_item.open h3 span{ display:none;  }
.product .block_item .hdr_m{ display:block; position:fixed; top:0; left:0; right:0; height:46px; line-height:46px; padding:9px 24px; text-align:center; border-bottom:1px solid var(--color-gray2); background:var(--bg); z-index:1; }
.product .block_item .hdr_m .but{ position:absolute; left:24px; }
main.open_module header, 
main.open_module .product>aside,
main.open_module .top_nav,
main.open_module .tabs, 
main.open_module .product h2, 
main.open_module .product .block_label
{ display:none;}

.product .content_empty{ background-position:center 80px; min-height:240px;}

.product>aside{ display:block;}
.product>aside>div:last-child{ min-width:0;}
.product>aside img{ margin-bottom:24px;}
.product .item aside .video iframe, .product .item aside .video .iframe{ width:380px; height:210px; margin:0 -16px; }
.product h1{ font-size:30px; }
.product h2{ font-size:24px; }


footer section{ display:block; background-position:center 16px; text-align:center;}
footer .copy{ max-width:none; } 
footer .nav a{  display:inline-block; padding:6px 10px;  }


.popup h1{ font-size:28px;}

.flex_last_in_mob{order:10; flex:100%;}

}


/* Light * /
--bg-accent: #d92d20;
--bg-accent-hover: #b42318;
--bg-accent-pressed: #912018;
--bg-blue: #f0f9ff;
--bg-blue-hover: #f0f9ff;
--bg-caution: #fffaeb;
--bg-caution-hover: #fffaeb;
--bg-caution-secondary: #fffaeb;
--bg-disable: #eaecf0;
--bg-error: #fef3f2;
--bg-error-hover: #fef3f2;
--bg-primary: #ffffff;
--bg-primary-blur: #70747ed9;
--bg-primary-inverse: #1d2939;
--bg-primary-notification: #ffffff;
--bg-secondary: #f2f4f7;
--bg-secondary-inverse: #344054;
--bg-success-secondary: #ecfdf3;
--bg-success-secondary-hover: #ecfdf3;
--bg-yellow: #fef7c3;
--bg-yellow-hover: #fefbe8;
--border-caution: #fec84b;
--border-critical: #d92d20;
--border-critical-disabled: #fef3f2;
--border-critical-secondary: #fda29b;
--border-primary: #d0d5dd;
--border-primary-hover: #98a2b3;
--border-primary-inverse: #344054;
--border-primary-inverse-disable: #f9fafb;
--border-secondary: #eaecf0;
--border-secondary-inverse: #98a2b3;
--border-success: #12b76a;
--border-success-hover: #6ce9a6;
--icon-blue: #0ba5ec;
--icon-caution: #f79009;
--icon-critical: #f04438;
--icon-disabled: #d0d5dd;
--icon-primary: #1d2939;
--icon-primary-color: #ffffff;
--icon-primary-inverse: #ffffff;
--icon-primary-inverse-hover: #ececed;
--icon-secondary: #98a2b3;
--icon-secondary-hover: #667085;
--icon-succsess: #12b76a;
--icon-yellow: #eaaa08;
--text-caution: #dc6803;
--text-critical: #d92d20;
--text-disabled: #d0d5dd;
--text-disabled-hover: #98a2b3;
--text-primary: #1d2939;
--text-primary-color: #ffffff;
--text-primary-hover: #475467;
--text-primary-inverse: #ffffff;
--text-secondary: #98a2b3;
--text-succsess: #039855;

/* Dark * /
--bg-accent: #d92d20;
--bg-accent-hover: #b42318;
--bg-accent-pressed: #912018;
--bg-blue: #0b4a6f;
--bg-blue-hover: #065986;
--bg-caution: #7a2e0e;
--bg-caution-hover: #7a2e0e;
--bg-caution-secondary: #fedf89;
--bg-disable: #262d3b;
--bg-error: #912018;
--bg-error-hover: #7a271a;
--bg-primary: #101828;
--bg-primary-blur: #101828e5;
--bg-primary-inverse: #d6d8da;
--bg-primary-notification: #1d2939;
--bg-secondary: #262d3b;
--bg-secondary-inverse: #a4a7ad;
--bg-success-secondary: #054f31;
--bg-success-secondary-hover: #054f31;
--bg-yellow: #a15c07;
--bg-yellow-hover: #854a0e;
--border-caution: #fdb022;
--border-critical: #d92d20;
--border-critical-disabled: #fecdca;
--border-critical-secondary: #fda29b;
--border-primary: #313846;
--border-primary-hover: #313846;
--border-primary-inverse: #eaecf0;
--border-primary-inverse-disable: #ececed;
--border-secondary: #262d3b;
--border-secondary-inverse: #d6d8da;
--border-success: #12b76a;
--border-success-hover: #6ce9a6;
--icon-blue: #0ba5ec;
--icon-caution: #dc6803;
--icon-critical: #d92d20;
--icon-disabled: #313846;
--icon-primary: #d6d8da;
--icon-primary-color: #ffffff;
--icon-primary-inverse: #1d2939;
--icon-primary-inverse-hover: #101828;
--icon-secondary: #a4a7ad;
--icon-secondary-hover: #70747e;
--icon-succsess: #039855;
--icon-yellow: #ca8504;
--text-caution: #dc6803;
--text-critical: #b42318;
--text-disabled: #70747e;
--text-disabled-hover: #70747e;
--text-primary: #ececed;
--text-primary-color: #ffffff;
--text-primary-hover: #d6d8da;
--text-primary-inverse: #1d2939;
--text-secondary: #a4a7ad;
--text-succsess: #12b76a;
/**/