* {margin: 0; padding: 0; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
::-webkit-scrollbar-track{background-color:var(--sidebar-bg-color);}
::-webkit-scrollbar{width:5px; height: 5px;}
::-webkit-scrollbar-thumb{background: var(--main-color-dark);}
body {background: var(--page-bg)!important; line-height: 1.3!important;}
body.hidden {overflow: hidden;}
.row {margin: 0!important;}
.container-fluid{padding: 0!important;}
.content {width: var(--desktop-content-width); position: relative; height: auto; margin: 0 auto;}

h2 {
    font-size: 33px!important; line-height: 40px!important; font-family: var(--bold-font)!important; color: var(--text-color)!important; margin: 0 0 20px 0!important;
}

.flexStart, .flexCenter, .flexBetween, .flexEnd {
    display: -webkit-flex; display: flex; -webkit-align-content: space-between; align-content: space-between;
}
.flexStart, .flexBetween, .flexEnd {
    -webkit-flex-direction: row; flex-direction: row;
}
.flexCenter {
    -webkit-flex-direction: column; flex-direction: column; -webkit-justify-content: center; justify-content: center;
    -webkit-align-content: center; align-content: center;
}
.flexStart {
    -webkit-justify-content: flex-start; justify-content: flex-start;
}
.flexEnd {
    -webkit-justify-content: flex-end; justify-content: flex-end;
}
.flexBetween {
    -webkit-justify-content: space-between; justify-content: space-between;
}
.flexWrap {
    -webkit-flex-wrap: wrap; flex-wrap: wrap;
}
.flexNoWrap {
    -webkit-flex-wrap: nowrap; flex-wrap: nowrap;
}

form {
    width: 100%; height: auto; position: relative;
}
input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */
input:focus::-moz-placeholder { color:transparent; } /* FF 19+ */
input:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */
input[type="submit"] {
    display: block; text-align: center;
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
}
input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="number"], textarea, .inputView {
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
    width: 100%; font-size: 18px; color: var(--text-color); font-family: var(--light-font);
    border: 1px solid var(--input-border-color); background: #FFFFFF; border-radius: var(--card-border-radius);
    outline: none;
}
input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="number"], .inputView {
    height: var(--def-input-height); padding: 0 20px; line-height: 40px;
}
input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, input[type="tel"]:focus,
input[type="number"]:focus, textarea:focus, .inputView:focus {
    border: 1px solid var(--text-color);
}
input[type="text"]:disabled, input[type="submit"]:disabled, .inputView:disabled {
    background: var(--disabled-btn-bg);
}
input.errorInput, input.errorInput:focus, .inputView.errorInput {
    border: 1px solid var(--error-border);
}
.inputView {
    cursor: pointer;
}
.inputErrorText {
    width: 100%; height: auto; color: var(--error-border); font-size: 12px; font-family: var(--regular-font);
}
.halfInput {
    width: 45%;
}
.smallInputs {
    width: 100px!important; text-align: center;
}
select {
    width: 100%!important; font-size: 16px!important; color: var(--text-color)!important; padding: 0 20px;
    font-family: var(--light-font)!important; height: var(--def-input-height)!important;
    border: 1px solid var(--input-border-color)!important; background: #FFFFFF!important; border-radius: var(--card-border-radius)!important;
}
textarea {
    height: 177px; padding: 20px; line-height: 22px; font-size: 18px!important; font-family: var(--light-font)!important;
}
input[type="checkbox"], input[type="radio"], input[type="file"] {
    display: none;
}
.label_checkbox, .label_radio, .labelCheckbox {
    display: block; position: relative; cursor: pointer;
}
.label_checkbox::after {
    content: ""; width: var(--checkbox-width); height: var(--checkbox-width); background: var(--a-not-checked-color); border-radius: 5px; border: 1px solid var(--input-border-color);
    position: absolute; right: calc(-30px - var(--checkbox-width));
}
.labelCheckbox::before {
    content: ""; width: var(--checkbox-width); height: var(--checkbox-width); background: var(--a-not-checked-color); border-radius: 5px; border: 1px solid var(--input-border-color);
    position: absolute; left: 0;
}
.labelCheckbox {
    padding-left: calc(var(--checkbox-width) + 5px);
}
.labelCheckbox a {
    color: var(--main-color); transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
    font-family: var(--regular-font); border-bottom: 1px dashed var(--main-color); padding-bottom: 1px;
}
.labelCheckbox a:hover, .labelCheckbox a:focus {
    text-decoration: none; color: var(--main-color-dark); border-bottom: none;
}
.addressRadio {
    width: auto; height: auto; border-radius: var(--card-border-radius);
    padding: 5px 15px; display: inline-block; cursor: pointer; color: var(--light-text-color);
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
    font-family: var(--regular-font);
}
.addressRadio:hover, .addressRadio:focus {
    color: var(--main-color);
}
.label_radio {
    font-size: 16px; line-height: 20px; font-family: var(--bold-font); color: var(--text-color);
}
.label_radio::before {
    content: ""; width: 15px; height: 15px; background: #FFFFFF; border-radius: 100%; border: 1px solid var(--input-border-color);
    position: absolute; left: 0; top: 7px;
}
.label_file {
    font-family: var(--regular-font)!important; cursor: pointer; margin-right: 20px!important;
    font-size: 14px!important; line-height: 19px; color: var(--main-color)!important; position: relative; display: inline-block;
    width: 117px; flex: 0 0 117px; -webkit-flex: 0 0 117px; -ms-flex: 0 0 117px;
}
.label_file:after {
    content: ""; width: 100%; height: 1px; border-bottom: 1px dashed var(--main-color);
    position: absolute; left: 0; top: 20px;
}
.fileBlock span {
    font-family: var(--light-font)!important; font-size: 14px!important; line-height: 19px; color: var(--text-color);
}
.snoska {
    font-family: var(--light-font)!important; font-size: 14px!important; font-style: normal;
}
label a {
    color: #000000; text-decoration: none; padding-bottom: 2px; border-bottom: 1px dashed var(--text-color);
}
label a:hover, label a:focus, label a:active {
    color: var(--text-color); text-decoration: none; border-bottom: none;
}
input[type="checkbox"]:checked + label:after {
    background: var(--main-color) url("../img/icon-checked-8x6-white.png") no-repeat center; border: 1px solid var(--main-color);
}
input[type="checkbox"]:checked + label.labelCheckbox:before {
    background: var(--main-color) url("../img/icon-checked-8x6-white.png") no-repeat center; border: 1px solid var(--main-color);
}
input[type="radio"]:checked + label:before {
    border: 4px solid var(--main-color);
}
input[type="radio"]:checked + label.addressRadio {
    color: #FFFFFF; background: var(--main-color);
}
.checkbox-green {
    display: inline-block; height: 20px; line-height: 20px; position: relative; vertical-align: middle;
    font-size: 14px; user-select: none; margin-left: 20px;
}
.checkbox-green .checkbox-green-switch {
    position: relative; display: inline-block; box-sizing: border-box; width: 34px; height: 20px;
    border: 1px solid rgba(0, 0, 0, .1); border-radius: 25%/50%; vertical-align: top; background: #8E8E8F;
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
}
.checkbox-green .checkbox-green-switch:before {
    content: ''; position: absolute; top: 1px; left: 1px; display: inline-block;
    width: 16px; height: 16px; border-radius: 50%; background: #FFFFFF;
    box-shadow: 0 3px 5px rgba(0, 0, 0, .3); transition: .15s; -moz-transition: .15s; -webkit-transition: .15s;
}
.checkbox-green input[type=checkbox] {
    display: block; width: 0; height: 0; position: absolute; z-index: -1; opacity: 0;
}
.checkbox-green input[type=checkbox]:not(:disabled):active + .checkbox-green-switch:before {
    box-shadow: inset 0 0 2px rgba(0, 0, 0, .3);
}
.checkbox-green input[type=checkbox]:checked + .checkbox-green-switch {
    background: #15CF74;
}
.checkbox-green input[type=checkbox]:checked + .checkbox-green-switch:before {
    transform:translateX(14px);
}
.checkbox-green input[type="checkbox"]:not(:disabled) + .checkbox-green-switch {
    cursor: pointer; border-color: rgba(0, 0, 0, .3);
}
.checkbox-green input[type=checkbox]:disabled + .checkbox-green-switch {
    filter: grayscale(70%); border-color: rgba(0, 0, 0, .1);
}
.checkbox-green input[type=checkbox]:disabled + .checkbox-green-switch:before {
    background: #8E8E8F;
}
.checkbox-green.focused .checkbox-green-switch:before {
    box-shadow: inset 0px 0px 4px #ff5623;
}
select {
    -webkit-appearance: none; -moz-appearance: none;
}
.user-input {display: none!important;}
.formGroup {
    width: 100%; height: auto; margin: 0 0 12px 0; position: relative;
}
.formGroup.fg {
    margin: 0 0 30px 0;
}
.formGroup:last-child {
    margin: 30px 0 0 0;
}
.formGroup label, .smallGroup label {
    margin: 0 0 6px 0; display: block; font-size: 12px; line-height: 14px; color: var(--text-color); font-family: var(--light-font);
}
.codeLabel {
    width: 50%;
}
label.noWrap {
    font-size: 18px; display: inline-block; margin: 0 30px 0 0!important; font-family: var(--regular-font);
}
.fg label {
    font-size: 18px; margin: 0 0 20px 0; font-family: var(--regular-font);
}
.smallGroup {
    width: 200px; height: auto; margin: 0 15px 12px 0;
}
.editWrap .formGroup label {
    font-family: var(--bold-font);
}
.smallGroup label {
    font-family: var(--regular-font)!important;
}

.defaultBtn {
    background: var(--admin-btn-bg); border: none; border-radius: var(--card-border-radius); height: var(--def-button-height); width: 100%;
    text-align: center; color: #FFFFFF; cursor: pointer; font-size: 16px; line-height: var(--def-button-height);
    outline: none; -ms-outline: none; -webkit-outline: none; -moz-outline: none; font-family: var(--light-font);
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
}
.defaultBtn:hover, .defaultBtn:focus, .defaultBtn:active {
    background: var(--main-color-dark); text-decoration: none!important; color: #FFFFFF;
}
.defaultBtn:disabled {
    opacity: 0.5; cursor: not-allowed;
}
.saveBtn {
    width: 200px;
}
.btnLink:hover, .btnLink:focus, .btnLink:active {
    text-decoration: none!important;
}
.mobileMenu {
    width: var(--def-button-height); height: var(--def-button-height); border-radius: var(--card-border-radius); cursor: pointer; position: relative;
    background: var(--main-color) url("../img/menuBtnIcon-24x24.png") no-repeat center; border: none; display: none; z-index: 0;
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
}
.mobileMenu:hover, .mobileMenu:focus {
    background: var(--main-color-dark) url("../img/menuBtnIcon-24x24.png") no-repeat center;
}
.mobileMenu.opened {
    background: var(--main-color) url("../img/closeIcon-white-24x24.png") no-repeat center;
}
.mobileMenu.opened:hover, .mobileMenu.opened:focus {
    background: var(--main-color-dark) url("../img/closeIcon-white-24x24.png") no-repeat center;
}
.menuBtn {
    background: var(--main-color) url("../img/menuBtnIcon-24x24.png") no-repeat left 17px center; border: none; border-radius: var(--card-border-radius);
    height: var(--def-button-height); width: auto; text-align: left; color: #FFFFFF; cursor: pointer; font-size: 16px; line-height: var(--def-button-height);
    outline: none; font-family: var(--bold-font); display: inline-block; padding: 0 10px 0 46px;
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
}
.menuBtn:hover, .menuBtn:focus {
    background: var(--main-color-dark) url("../img/menuBtnIcon-24x24.png") no-repeat left 17px center;
}
.menuBtn.opened {
    background: var(--main-color-dark) url("../img/closeIcon-white-24x24.png") no-repeat left 17px center;
}
.authBtn {
    background: #FFFFFF; border: 1px solid var(--input-border-color); border-radius: var(--card-border-radius);
    height: var(--def-button-height); width: auto; text-align: center; color: var(--text-color); cursor: pointer; font-size: 16px; line-height: calc(var(--def-button-height) - 2px);
    outline: none; font-family: var(--light-font); display: inline-block; padding: 0 17px;
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
}
.authBtn:hover, .authBtn:focus {
    background: var(--main-color-dark); color: #FFFFFF; border: 1px solid var(--main-color-dark);
}
.authBtn.hide {
    display: none;
}
.profileBtn {
    background: url("../img/profileIcon-42x42.png") no-repeat center; border: none;
    height: var(--def-button-height); width: var(--def-button-height); cursor: pointer;
    outline: none; display: inline-block;
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
}
.profileBtn:hover, .profileBtn:focus {
    background: url("../img/profileIcon-42x42-hover.png") no-repeat center;
}
.profileBtn.hide {
    display: none;
}
.cartBtn {
    background: var(--main-color) url("../img/cartIcon-24x24.png") no-repeat left 17px center; border: 1px solid var(--input-border-color); border-radius: var(--card-border-radius);
    height: var(--def-button-height); width: auto; cursor: pointer; outline: none; display: inline-block; padding: 0 17px 0 46px;
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
}
.cartBtn p {
    color: #FFFFFF; font-size: 16px; line-height: calc(var(--def-button-height) - 2px); font-family: var(--bold-font); margin: 0; display: inline-block;
}
.cartAddon {
    position: relative; padding: 12px 0 10px 10px; display: none; width: auto; margin: 0 0 0 5px;
}
.cartAddon::before {
    content: ""; width: 1px; height: 24px; border-left: 1px solid #FFFFFF; position: absolute; left: 0; top: 9px;
}
.cartItems {
    color: #FFFFFF; font-size: 16px; line-height: 17px; font-family: var(--bold-font);
}
.cartBtn.addonVisible .cartAddon {
    display: inline-block;
}
.cartBtn:hover, .cartBtn:focus {
    background: var(--main-color-dark) url("../img/cartIcon-24x24.png") no-repeat left 17px center; border: 1px solid var(--main-color-dark);
}
.logOutBtn {
    border: none; height: auto; min-height: 24px; width: 100%; display: inline-block; color: var(--text-color); cursor: pointer; font-size: 16px; line-height: 20px;
    outline: none; font-family: var(--bold-font); padding: 0 0 0 28px; background: url("../img/logOutIcon-24x24.png") no-repeat left center;
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
}
.logOutBtn:hover, .logOutBtn:focus, .defaultBtn:active {
    text-decoration: none!important; color: var(--main-color);
}

.msgContainer {
    display: inline-block; width: auto; height: auto;
}
.msgBlock {
    padding: var(--def-padding) var(--def-padding) var(--def-padding) 35px; border-radius: var(--card-border-radius); min-height: calc(15px + var(--def-padding) * 2);
    background-repeat: no-repeat; background-position: left var(--def-padding) top var(--def-padding); margin-top: var(--def-margin);
    background-size: 20px;
}
.msgBlock p {
    font-size: 16px!important; color: var(--text-color); margin: 0; line-height: normal!important; height: 100%; font-family: var(--regular-font)!important;
}
.msgBlock h6 {
    color: var(--link-color); font-size: 16px!important; margin: 0 0 2px 0; line-height: normal!important; font-family: var(--regular-font)!important;
}
.msgBlock.success-msg {
    background-color: var(--success-bg); background-image: url("../img/successIcon-30x30.png"); border: 1px solid var(--success-border);
}
.msgBlock.warning-msg {
    background-color: var(--warning-bg); background-image: url("../img/warningIcon-30x30.png"); border: 1px solid var(--warning-border);
}
.msgBlock.error-msg {
    background-color: var(--error-bg); background-image: url("../img/errorIcon-30x30.png"); border: 1px solid var(--error-border);
}
.msgBlock.info-msg {
    background-color: var(--info-bg); background-image: url("../img/infoIcon-30x30.png"); border: 1px solid var(--info-border); padding: 17px var(--def-padding) 12px 44px;
}
.pageInfoText {
    padding: var(--def-padding) var(--def-padding) var(--def-padding) 44px; border-radius: var(--card-border-radius); min-height: calc(30px + var(--def-padding) * 2);
    background-repeat: no-repeat; background-position: left var(--def-padding) top var(--def-padding); margin: 0 0 30px 0;
}
.pageInfoText.info {
    background-color: var(--info-bg); background-image: url("../img/infoIcon-30x30.png"); border: 1px solid var(--info-border);
}
.pageInfoText.warning {
    background-color: var(--warning-bg); background-image: url("../img/warningIcon-30x30.png"); border: 1px solid var(--warning-border);
}
.pageInfoText.error {
    background-color: var(--error-bg); background-image: url("../img/errorIcon-30x30.png"); border: 1px solid var(--error-border);
}
.pageInfoText.success {
    background-color: var(--success-bg); background-image: url("../img/successIcon-22x22.png"); border: 1px solid var(--success-border);
}
.pageInfoText p {
    font-size: 16px!important; color: var(--text-color); margin: 0; line-height: normal!important; height: 100%; font-family: var(--regular-font)!important;
}
.pageInfoText h6 {
    color: var(--link-color); font-size: 16px!important; margin: 0 0 2px 0; line-height: normal!important; font-family: var(--regular-font)!important;
}

/* header */
.header__ {
    width: 100%; position: relative; height: 122px; padding: 40px 0;
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
}
.header__.shrink {
    height: 68px; padding: 13px 0; position: fixed; left: 0; top: 0; box-shadow: var(--card-shadow); z-index: 5; background: #FFFFFF;
}
.header__main, .header__menu {
    width: 100%; height: auto; position: relative;
}
.header__menu {
    display: none;
}
.logo {
    width: 118px; height: 42px; background: url("../img/admin-logo-black-118x42.png") no-repeat center;
}
.headerLogo, .header__ .menuBtn, .header__ .authBtn, .header__ .profileBtn {
    margin: 0 20px 0 0;
}
.address__ {
    width: auto; margin: 0; display: inline-block;
}
.cityName {
    width: auto; background: url("../img/addressIcon-19x19.png") no-repeat left top; padding-left: 23px;
    font-family: var(--bold-font); font-size: 16px; line-height: 20px; color: var(--main-color);
}
.address__ p {
    display: inline-block; font-family: var(--bold-font); font-size: 16px; line-height: 20px; color: var(--text-color); margin: 2px 0 0 0;
}
#menu {
    display: inline-block; margin: 0 auto;
}
#menu ul {
    list-style: none; height: var(--def-button-height); line-height: var(--def-button-height);
}
#menu ul li {
    padding: 0 10px;
}
#menu ul li a {
    font-family: var(--bold-font); font-size: 16px; line-height: 20px; color: var(--text-color);
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
}
#menu ul li a:hover, #menu ul li a:focus, #menu ul li a:active, #menu ul li a.active {
    color: var(--main-color); text-decoration: none;
}
.callBack {
    display: inline-block;
}
.callBack a {
    display: block; background: url("../img/phoneIcon-19x19.png") no-repeat left top; padding-left: 23px;
    font-size: 18px; line-height: 22px; color: var(--text-color); font-family: var(--bold-font);
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
}
.callBack a:hover, .callBack a:focus, .callBack a:active {
    text-decoration: none; color: var(--main-color);
}
.callBack p {
    font-family: var(--bold-font); font-size: 14px; line-height: 17px; color: rgba(34, 34, 34, 0.5);; margin: 0; text-align: right;
}
.header__callBack {
    margin: 0 20px 0 0;
}
/* header */

/* footer */
.footer__ {
    width: 100%; position: relative; height: auto; padding: 44px 0 0 0;
}
.footer__wrap {
    width: 100%; height: auto; padding: 0 0 20px; border-bottom: 1px solid var(--input-border-color);
}
.footerLogo {
    margin: 0 57px 0 0;
}
.footer__ .address__ {
    width: auto; margin: 1px 0 0 auto; display: inline-block;
}
#footerMenu {
    display: inline-block; margin: -4px auto 0 0; width: 248px; max-height: 52px;
}
#footerMenu ul {
    list-style: none; height: 100%; width: 100%;
}
#footerMenu ul li {
    display: inline-block; margin: 0 30px 0 0;
}
#footerMenu ul li a {
    font-family: var(--bold-font); font-size: 16px; line-height: 20px; color: var(--text-color);
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
}
#footerMenu ul li a:hover, #footerMenu ul li a:focus, #footerMenu ul li a:active, #footerMenu ul li a.active {
    color: var(--main-color); text-decoration: none;
}
.footer__callBack a {
    background: none; padding-left: 0; text-align: right;
}
.footer__callBack {
    margin: 0 0 0 53px;
}
.social {
    width: 235px; height: 38px; position: relative;
}
.social p {
    font-size: 14px; line-height: 17px; color: #282828; font-family: var(--light-font); margin: 0 15px 0 0;
}
.socialWrap {
    width: 86px; height: 100%; flex: 0 0 86px; -webkit-flex: 0 0 86px; -ms-flex: 0 0 86px;
}
.socialWrap a {
    display: block; background-size: 38px; background-repeat: no-repeat; border-radius: var(--card-border-radius); text-decoration: none;
    width: 38px; height: 38px;
}
.socialInstagram {
    background-image: url("../img/instagramIcon-38x38.png");
}
.socialVk {
    background-image: url("../img/vkIcon-38x38.png");
}
.footer__ .social {
    margin: 7px 0 0 0;
}
.footer__info {
    width: 100%; padding: 5px 0; height: auto;
}
.footer__info p {
    font-size: 12px; line-height: 14px; text-align: center; color: rgba(34, 34, 34, 0.5); font-family: var(--light-font); margin: 0;
}
/* footer */

/* content */
.menu__ {
    width: 100%; height: auto; position: relative; padding: 0 0 80px 0;
}
.groups__, .groupsHeader__ {
    width: 100%; height: auto; position: relative;
}
.groupsHeader__ {
    margin: 10px 0 0 0;
}
.horizontalMenu {
    height: var(--groups-scroll-height); position: relative; width: 100%; overflow: hidden;
    flex-flow: row nowrap!important; -webkit-flex-flow: row nowrap!important; -ms-flex-flow: row nowrap!important;
}
.horizontalMenu #scrolling, .horizontalMenu #scrolling_header{;
    width:100%; overflow: hidden; position: relative; height: 100%;
}
.horizontalMenu #scrolling ul, .horizontalMenu #scrolling_header ul {
    -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;user-select: none; margin: 0; padding: 0; position: absolute; left: 0; height: var(--groups-scroll-height);
    list-style-type: none; white-space: nowrap!important; width: 100%;
}
.horizontalMenu #scrolling ul li {
    counter-increment: cell; margin: 0; padding: 0 10px; position: relative; border-radius: var(--card-border-radius); border: 1px solid transparent;
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
}
.horizontalMenu #scrolling_header ul li {
    counter-increment: cell; margin: 0; padding: 0 10px; position: relative;
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
}
.horizontalMenu #scrolling ul li:hover > p, .horizontalMenu #scrolling ul li:focus > p {
    color: var(--main-color);
}
.horizontalMenu #scrolling_header ul li:hover > p, .horizontalMenu #scrolling_header ul li:focus > p {
    color: var(--main-color);
}
.horizontalMenu .menuLink {
    display: inline-block;
}
#scrolling p, #scrolling_header p {
    font-family: var(--bold-font); font-size: 16px; line-height: calc(var(--groups-scroll-height) - 2px); color: rgba(34, 34, 34, 0.5); cursor: pointer;
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition); margin: 0;
}
.horizontalMenu #scrolling ul li:active, .horizontalMenu #scrolling ul li.active {
    outline: none; border: 1px solid var(--input-border-color); background: var(--main-color);
}
.horizontalMenu #scrolling ul li:active > p, .horizontalMenu #scrolling ul li.active p {
    color: #FFFFFF;
}
.horizontalMenu #scrolling_header ul li:active > p, .horizontalMenu #scrolling_header ul li.active p {
    color: var(--main-color);
}
.horizontalMenu #scrolling p:hover, .horizontalMenu #scrolling p:focus, .horizontalMenu #scrolling p:active {
    color: #FFFFFF;
}
.horizontalMenu #scrolling_header p:hover, .horizontalMenu #scrolling_header p:focus, .horizontalMenu #scrolling_header p:active {
    color: var(--main-color);
}
.menu__content {
    width: 100%; height: auto; margin: 40px auto 0 auto;
}
.menu__wrap {
    width: 100%; height: auto; margin: 0 auto;
}
.menu__wrap .productItem {
    margin: 0 0 20px 0;
}
.menu__wrap .productItem:not(:nth-child(5n)) {margin-right: 22px;}
.loadProducts {
    width: 210px; margin: 40px auto 0 auto;
}
.loadProducts.hide {
    display: none;
}
.params__ {
    position: absolute; display: inline-block; width: auto; right: 0; top: 13px; min-height: 24px;
}
.params__ .dropdown {
    background: url("../img/paramsIcon-24x24.png") no-repeat left center; cursor: pointer; padding: 0 0 0 28px; width: 100%; height: 100%;
}
#dropdownParams {
    font-size: 16px; line-height: 24px; color: var(--text-color); font-family: var(--bold-font);
}
.dropdown-menu {
    border-radius: var(--card-border-radius)!important; background: #FFFFFF!important; padding: 22px 20px!important;
}
.params__ .dropdown-item.active, .params__ .dropdown-item:active {
    color: var(--text-color)!important; background-color: transparent!important;
}
.preLoader {
    width: 100px; height: 100px; background: url("../img/loader.svg") no-repeat center; margin: 40px auto 0 auto;
}
.preLoader.hide {
    width: 0; height: 0; opacity: 0;
}
.apps__ {
    width: 100%; height: 80px; position: relative; background: var(--main-color);
}
.apps__ p {
    display: inline-block; line-height: 80px; color: #FFFFFF; font-size: 22px; font-family: var(--bold-font); margin: 0 auto 0 0;
}
.apps__ a {
    display: inline-block; line-height: 80px; color: transparent; margin: 0 0 0 20px;
}
.often__ {
    width: 100%; position: relative; height: auto; padding: 0 0 80px 0;
}
.often__ h2 {
    margin: 0 0 40px 0!important;
}
.often__wrap {
    width: 100%; height: auto; position: relative;
}
.often__items {
    display: flex; overflow-x: scroll; scroll-behavior: smooth; gap: 20px; scrollbar-color: var(--main-color) var(--text-color);
    scrollbar-width: thin; padding: 0 0 40px 0; position: relative; z-index: 1;
}
.often__items::-webkit-scrollbar {
    height: 4px;
}
.often__items::-webkit-scrollbar-track {
    background-color: rgba(34, 34, 34, 0.1); border-bottom: 3px solid #F9FAFC;
}
.often__items::-webkit-scrollbar-thumb {
    height: 10px; background-color: var(--main-color);
}
.leftGroup, .rightGroup {
    z-index: 0; opacity: 0; visibility: hidden; height: 399px; width: 238px; position: absolute; top: 0;
    transition: var(--short-transition); -webkit-transition: var(--short-transition); -moz-transition: var(--short-transition);
}
.leftGroup.show, .rightGroup.show {
    z-index: 2; opacity: 1; visibility: visible;
}
.leftGroup {
    left: 0;
}
.rightGroup {
    right: 0;
}
.oftenLeftGradient, .oftenRightGradient{
    position: absolute; width: 100%; height: 100%;
}
.oftenLeftGradient{
    left: 0; background-image: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, rgb(249, 250, 252) 100%);
}
.oftenRightGradient{
    right: 0; background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgb(249, 250, 252) 100%);
}
.often__wrap .btnSlide {
    position: absolute; top: 50%; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%);
}
#btnPrev {
    left: 0;
}
#btnNext {
    right: 0;
}
.deliveryInfo__ {
    width: 100%; height: auto; position: relative; padding: 0 0 80px 0;
}
.deliveryInfo__content {
    width: var(--desktop-content-width); height: auto; position: relative; margin: 0 auto;
}
.deliveryInfo__ h2 {
    margin: 0 0 40px 0!important;
}
.deliveryInfo__wrap {
    width: 100%; height: auto; position: relative;
}
.deliveryText {
    width: 403px; flex: 0 0 403px; -webkit-flex: 0 0 403px; -ms-flex: 0 0 403px;
}
.deliveryInfo__items {
    width: 100%; height: auto;
}
.deliveryInfo__item {
    min-height: 72px; height: auto; width: 100%; margin: 0 0 40px 0;
}
.deliveryInfo__item:last-child {
    margin: 0;
}
.deliveryInfo__itemImg {
    width: 72px; height: 72px; background-position: center; background-repeat: no-repeat; margin: 0 20px 0 0;
    background-color: #FFFFFF; border-radius: var(--card-border-radius); box-shadow: 0px 7px 30px rgba(0, 0, 0, 0.05);
    flex: 0 0 72px; -webkit-flex: 0 0 72px; -ms-flex: 0 0 72px;
}
.deliveryInfo__itemImg.dIid {
    background-image: url("../img/deliveryTimeIcon-30x30.png");
}
.deliveryInfo__itemImg.dIif {
    background-image: url("../img/deliveryFreeIcon-30x30.png");
}
.deliveryInfo__itemImg.dIib {
    background-image: url("../img/deliveryBonusIcon-30x30.png");
}
.deliveryInfo__itemText {
    width: calc(100% - 92px); height: auto;
}
.deliveryInfo__itemText h5 {
    font-size: 18px; line-height: 22px; font-family: var(--bold-font); color: var(--text-color); margin: 0 0 12px 0;
}
.deliveryInfo__itemText p {
    font-size: 16px; line-height: 19px; font-family: var(--light-font); color: var(--text-color); margin: 0;
}
.deliveryText .defaultBtn {
    display: block; width: 284px; margin: 40px 0 0 0;
}
#map {
    width: 782px; height: 388px; position: relative; border-radius: var(--card-border-radius); overflow: hidden;
}
#map_contacts {
    width: 100%; height: 388px; position: relative; border-radius: var(--card-border-radius); overflow: hidden;
}
#myMap {
    position: absolute; left: 0; top: 0; width: 100%; height: 100%;
}
.fitSection__ {
    width: 100%; position: relative; height: auto; min-height: calc(100vh - 259px);
}
.payStatus__ {
    width: 300px; height: auto; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);
    background: #FFFFFF; border-radius: var(--card-border-radius); padding: 40px 20px; box-shadow: var(--card-shadow);
}
.payStatus__ img {
    width: 60px; height: 60px; display: block; margin: 0 auto 30px auto;
}
.payStatus__ h3 {
    margin: 0 0 20px 0; text-align: center;
}
.payStatus__ p {
    margin: 0; text-align: center; font-size: 16px; line-height: 19px; font-family: var(--light-font); color: var(--text-color);
}
.additionalPay {
    margin: 20px auto 0 auto;
}
.additionalPay p {
    text-align: center; font-size: 14px; line-height: 17px; font-family: var(--bold-font); margin: 0 0 10px 0;
}
.additionalPay .defaultBtn {
    display: block;
}
.development__ {
    position: relative; width: 100%; height: 100%; min-height: 100vh;
}
.developmentWrap {
    width: 600px; height: auto; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);
}
.developmentWrap p {
    margin: 20px 0 0 0;
}
.pageContainer__ {
    width: 100%; height: auto; min-height: calc(100vh - 259px); position: relative; padding: 22px 0 80px 0;
}
.pageContainer__.wB::before {
    content: ""; width: var(--desktop-content-width); height: 1px; position: absolute; left: 50%; top: 0; border-top: 1px solid var(--input-border-color);
    transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0);
}
.pageContainer__ h1 {
    font-size: 33px; line-height: 40px; font-family: var(--bold-font); color: var(--text-color); margin: 22px 0 40px 0;
}
.promoWrap {
    width: 100%; height: auto;
}
.pageDetail__ {
    width: auto; height: auto; position: relative; margin: 0 auto;
}
.pageDetail__.mdW {
    width: var(--detail-page-content-m);
}
.pageDetail__.smW {
    width: var(--detail-page-content-s);
}
.terms__Wrap {
    width: 100%; height: auto;
}
.terms__Wrap h5 {
    font-family: var(--bold-font); font-size: 22px; line-height: 27px; margin: 20px 0 20px 0; color: var(--text-color);
}
.terms__Wrap p, .terms__Wrap ul li {
    font-family: var(--regular-font); font-size: 16px; line-height: 19px; margin: 0 0 10px 0; color: var(--text-color); padding: 0 0 0 20px;
}
.terms__Wrap ul {
    list-style: none; padding-left: 20px;
}
.pageContainer__ h2 {
    font-size: 33px!important; line-height: 40px!important; font-family: var(--bold-font)!important; color: var(--text-color)!important; margin: 22px 0 40px 0!important;
}
.pageTitle {
    width: 100%; height: auto; position: relative; margin: 22px 0 40px 0;
}
.pageTitle h1 {
    margin: 0;
}
.accountLinks {
    display: inline-block; width: auto; height: auto;
}
.accountLink {
    display: inline-block; width: auto; padding: 7px 10px 9px 10px; font-size: 16px; line-height: 20px; color: var(--text-color); border-radius: var(--card-border-radius);
    transition: var(--short-transition); -webkit-transition: var(--short-transition); -moz-transition: var(--short-transition);
    border: 1px solid transparent; font-family: var(--bold-font);
}
.accountLink.active {
    color: #FFFFFF; text-decoration: none; background: var(--main-color); border: 1px solid var(--input-border-color);
}
.accountLink:hover, .accountLink:focus {
    text-decoration: none; color: var(--main-color);
}
.accountLink.active:hover, .accountLink.active:focus {
    color: #FFFFFF; background: var(--main-color-dark);
}
.accountLogOut {
    margin: 20px 0 0 0;
}
.m20 {
    margin: 20px 0 0 0;
}
.accountMsg {
    margin: 0 0 20px 0;
}
.removeIcon {
    width: 30px; height: 30px; background: url("../img/closeIcon-dark-50x50.png") no-repeat center; background-size: 25px; cursor: pointer; opacity: .5;
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
    position: absolute; right: 0; top: 0;
}
.removeIcon:hover, .removeIcon:focus {
    opacity: 1;
}
/* content */

/* cart */
@keyframes openCart {
    from {
        right: -100%;
    }
    to {
        right: 0;
    }
}
@keyframes closeCart {
    from {
        right: 0;
    }
    to {
        right: -100%;
    }
}
.cart__ {
    width: 100%; height: 100%; position: fixed; opacity: 0; visibility: hidden; z-index: 10; background: transparent;
    transition: var(--long-transition); -webkit-transition: var(--long-transition); -moz-transition: var(--long-transition);
}
.cart__.show {
    opacity: 1; visibility: visible;
}
.cart__wrap {
    top: 0; right: -100%; position: absolute; z-index: 11; animation-duration: 0.4s; animation-timing-function: linear;
    animation-name: closeCart; overflow-y: auto; background: var(--page-bg); width: var(--cart-width); height: 100%;
    flex: 1 1 auto; flex-direction: column; display: flex;
}
.cart__.show .cart__wrap {
    animation-name: openCart; right: 0;
}
.close {
    width: 50px; height: 50px; background-repeat: no-repeat; background-position: center; background-size: 50px;
    cursor: pointer;
}
.close.closeLight {
    background-image: url("../img/closeIcon-50x50.png");
}
.close.closeDark {
    background-image: url("../img/closeIcon-dark-50x50.png");
}
.cart__ .close {
    position: absolute; right: -100%; opacity: 0; visibility: hidden; z-index: 11;
    transition: var(--long-transition); -webkit-transition: var(--long-transition); -moz-transition: var(--long-transition);
}
.cart__.show .close {
    opacity: 1; visibility: visible; right: var(--cart-width);
}
.cart__.show .overlay__ {
    opacity: 1; visibility: visible;
}
.destroyCart {
    display: inline-block; position: absolute; right: 40px; top: 49px; cursor: pointer; padding-left: 28px; min-height: 24px; line-height: 24px;
    font-size: 16px; color: var(--text-color); font-family: var(--bold-font); background: url("../img/trashIcon-24x24.png") no-repeat left center;
    transition: var(--short-transition); -webkit-transition: var(--short-transition); -moz-transition: var(--short-transition);
}
.destroyCart:hover, .destroyCart:focus {
    color: var(--main-color);
}
.cart__empty {
    width: 100%; height: auto; position: absolute; top: 50%; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%);
    text-align: center; padding: 0 40px;
}
.cart__empty h3 {
    font-size: 24px!important; line-height: 30px!important; color: var(--text-color)!important; font-family: var(--bold-font)!important; margin: 0 0 20px 0;
}
.cart__empty p {
    font-size: 18px; line-height: 24px; color: var(--text-color); font-family: var(--light-font); margin: 0;
}
.cart__empty .defaultBtn {
    display: inline-block; width: auto; padding: 0 17px; margin: 20px auto 0 auto;
}
.cartTitle {
    width: auto; height: auto; margin: 0 0 42px 0; padding: 40px 40px 0 40px;
}
.cartTitle h2 {
    font-size: 33px!important; line-height: 40px!important; margin: 0;
}
.cart__wrap .cartItems {
    width: 100%; position: relative; height: auto; flex: 1 0 auto; padding: 0 40px;
}
.cartFooter {
    width: 100%; position: relative; height: auto; margin: 27px 0 0 0; padding: 0 40px 40px 40px;
}
.cartFooter.fixed {
    position: -webkit-sticky; position: sticky; filter: drop-shadow(0px 0px 1px rgba(0, 0, 0, 0.15)); bottom: 0;
    padding: 20px 40px; z-index: 11; background: var(--page-bg); height: calc(var(--def-button-height) + 40px);
}
.cartFooter.fixed .cartInfo {
    display: none;
}
.cartFooter.fixed .cartCheckout p {
    display: inline-block;
}
.cartFooter.fixed .cartCheckout .defaultBtn {
    display: inline-block; width: auto; padding: 0 70px;
}
.couponField {
    width: 100%; height: auto; position: relative; padding: 0 0 5px 0; border-bottom: 1px solid var(--input-border-color);
}
.cartFooter.fixed .couponField {
    display: none;
}
.couponInput {
    border: none!important; border-radius: 0!important; background: transparent!important; padding: 0!important;
}
.applyCoupon {
    margin: 0; font-family: var(--bold-font); font-size: 16px; line-height: var(--def-button-height); color: var(--main-color);
    transition: var(--short-transition); -webkit-transition: var(--short-transition); -moz-transition: var(--short-transition);
    cursor: pointer; display: none; position: absolute; right: 0;
}
.applyCoupon.show {
    display: inline-block;
}
.applyCoupon:hover, .applyCoupon:focus {
    color: var(--main-color-dark);
}
.cartInfo {
    width: 100%; height: auto; margin: 0 0 27px 0;
}
.cartCheckout {
    width: 100%; height: auto;
}
.cartCheckout p {
    font-size: 18px; line-height: var(--def-button-height); color: var(--text-color); font-family: var(--bold-font); margin: 0 20px 0 0;
    width: auto; display: none;
}
.cartCheckout .defaultBtn {
    width: 100%;
}
.marker {
    width: 100%; height: 1px; opacity: 0; visibility: hidden;
}
.cartInfoItem {
    width: 100%; padding: 13px 0; border-bottom: 1px solid var(--input-border-color);
}
.cartInfoItem:last-child {
    border-bottom: none;
}
.cartInfoItem p {
    font-size: 18px; line-height: 22px; margin: 0; color: var(--text-color); font-family: var(--bold-font);
}
/* cart */

/* breadcrumbs */
.breadcrumbs__ {
    width: 100%; height: auto; min-height: 17px; font-family: var(--bold-font); font-size: 14px; line-height: 17px; color: var(--breadcrumbs-color);
}
.breadcrumbs__ ol {
    list-style: none; margin: 0!important;
}
.breadcrumbs__ ol li {
    float: left;
}
.breadcrumbs__ ol li a {
    display: inline-block; padding: 0; color: var(--breadcrumbs-color); text-decoration: none;
    transition: var(--short-transition); -moz-transition: var(--short-transition); -webkit-transition: var(--short-transition);
}
.breadcrumbs__ ol li a:hover, .breadcrumbs__ ol li a:focus, .breadcrumbs__ ol li a:active {
    color: var(--main-color);
}
.breadcrumbs__ ol li p {
    display: inline-block; padding: 0; color: var(--breadcrumbs-color); margin: 0;
}
.breadcrumbs__arrow {
    display: inline-block; float: left; margin: 0 6px; line-height: 19px; color: var(--breadcrumbs-color);
}
/* breadcrumbs */

/* modal */
.modal__, .newAddressModal__ {
    width: 100%; height: 100%; position: fixed; opacity: 0; visibility: hidden; z-index: 10; background: transparent;
    transition: var(--long-transition); -webkit-transition: var(--long-transition); -moz-transition: var(--long-transition);
}
.modal__.show, .newAddressModal__.show {
    opacity: 1; visibility: visible;
}
.modal__content, .newAddress__formWrap {
    top: 50%; left: 50%; position: absolute; z-index: 11; animation-duration: 0.4s; animation-timing-function: linear;
    transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);
    opacity: 0; visibility: hidden;
}
.overlay__ {
    width: 100%; height: 100%; position: absolute; opacity: 0; visibility: hidden; z-index: 10; background: rgba(0, 0, 0, 0.8);
    transition: var(--long-transition); -webkit-transition: var(--long-transition); -moz-transition: var(--long-transition);
}
.modal__.show .overlay__, .newAddressModal__.show .overlay__ {
    opacity: 1; visibility: visible;
}
@keyframes fadeIn {
    from {
        opacity: 0; visibility: hidden;
    }
    to {
        opacity:1; visibility: visible;
    }
}
.modal__.show .modal__content, .newAddressModal__.show .newAddress__formWrap {
    animation-name: fadeIn; opacity: 1; visibility: visible;
}
@keyframes fadeOut {
    from {
        opacity: 1; visibility: visible;
    }
    to {
        opacity:0; visibility: hidden;
    }
}
.modal__ .modal__content, .newAddressModal__ .newAddress__formWrap {
    animation-name: fadeOut; opacity: 0; visibility: hidden;
}
.modalLoader {
    width: 100px; height: 100px; position: absolute; left: 50%; top: 50%; z-index: 11; margin: -50px 0 0 -50px;
    background: url("../img/modal-loader.svg") no-repeat center; opacity: 0; visibility: hidden;
}
.modal__.show .modalLoader{
    opacity: 1; visibility: visible;
}

.menuGroupsDropdown {
    width: var(--desktop-content-width); height: auto; position: fixed; opacity: 0; visibility: hidden; z-index: 9; background: var(--page-bg);
    transition: var(--long-transition); -webkit-transition: var(--long-transition); -moz-transition: var(--long-transition);
    border-radius: var(--card-border-radius); padding: 50px; left: 50%;
    transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0);
}
.menuGroupsDropdown.show {
    opacity: 1; visibility: visible;
}
.overlay__groups {
    position: fixed; opacity: 0; visibility: hidden; z-index: 8; background: rgba(0, 0, 0, 0.8); left: 0; right: 0; bottom: 0; top: 0;
    transition: var(--long-transition); -webkit-transition: var(--long-transition); -moz-transition: var(--long-transition);
}
.overlay__groups.show {
    opacity: 1; visibility: visible;
}
.menuGroupsDropdown h3 {
    font-size: 22px!important; line-height: 27px!important; color: var(--text-color)!important; font-family: var(--bold-font)!important; margin: 0 0 14px 0;
}
.dropDownGroupsWrap {
    width: 100%; height: auto; position: relative;
}
.dropDownGroupsWrap a, .dropDownGroupsWrap a:hover, .dropDownGroupsWrap a:focus {
    text-decoration: none;
}

.mobileMenu-modal__ {
    width: 100%; max-height: 100vh; height: auto; position: fixed; z-index: 5; background: #FFFFFF;
    transition: var(--long-transition); -webkit-transition: var(--long-transition); -moz-transition: var(--long-transition);
    padding: 68px 0 40px 0; left: 0; top: -100vh; overflow-y: auto; box-shadow: var(--card-shadow);
}
.mobileMenu-modal__.opened {
    top: 0;
}
.mobileMenu-modal__.openedShrink {
    top: 108px; max-height: calc(100vh - 108px);
}
.mobileMenu-modal__header {
    width: 100%; height: auto; padding: 0 0 20px 0; border-bottom: 1px solid var(--input-border-color);
}
.mobileMenu-modal__header .address__ {
    margin: 0 auto;
}
.mobileMenu-modal__footer {
    width: 100%; height: auto; padding: 20px 0 0 0; border-top: 1px solid var(--input-border-color);
}
.menu__callBack {
    margin: 0 auto; display: inline-block;
}
.menuSocial {
    margin: 20px auto 0 auto;
}
.mobileMenu-modal__menu {
    width: 100%; height: auto; padding: 40px 0;
}
#mobileMenu {
    display: inline-block; margin: 0 auto;
}
#mobileMenu ul {
    list-style: none;
}
#mobileMenu li, #mobileMenu li a {
    font-size: 22px; line-height: 27px; font-family: var(--bold-font); color: var(--text-color); text-decoration: none; text-align: center;
    transition: var(--short-transition); -webkit-transition: var(--short-transition); -moz-transition: var(--short-transition);
}
#mobileMenu li {
    margin: 0 0 27px 0;
}
#mobileMenu li:last-child {margin: 0;}
#mobileMenu li:hover > a, #mobileMenu li:focus > a {
    color: var(--main-color); text-decoration: none;
}

/* modal */