/* ==========================================================================
   Стили, необходимые для блока .product-categories (главное меню каталога)
   Выборка из общего файла темы.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Базовое — только внутри .product-categories, наружу ничего не течёт
   -------------------------------------------------------------------------- */
.product-categories,
.product-categories *,
.product-categories *:after,
.product-categories *:before {
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

.product-categories ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.product-categories a {
    cursor: pointer;
    color: #4c4c4c;
    text-decoration: none;
}

.product-categories a:hover { text-decoration: none; outline: none; }
.product-categories a:visited,
.product-categories a:focus,
.product-categories a:active { color: inherit; text-decoration: none; outline: none; }

.product-categories svg {
    width: 1px;
    height: 1px;
    fill: #4c4c4c;
}

.product-categories img { vertical-align: middle; border: 0; }

.product-categories a,
.product-categories a i,
.product-categories a:after,
.product-categories a:before,
.product-categories li:after,
.product-categories li:before,
.main-menu .product-categories ul > li ul {
    -webkit-transition: visibility .15s linear, opacity .15s linear, color .15s linear, border-color .15s linear, background-color .15s linear;
    transition: visibility .15s linear, opacity .15s linear, color .15s linear, border-color .15s linear, background-color .15s linear;
}

.product-categories a svg {
    -webkit-transition: fill .15s linear;
    transition: fill .15s linear;
}

/* --------------------------------------------------------------------------
   2. Общее для всех разрешений
   -------------------------------------------------------------------------- */
#header .mobile-menu,
#header .mobile-menu-close,
#header .mobile-menu-back,
.product-categories .auth,
.menu-shadow {
    display: none;
}

.main-menu .product-categories > ul > li {
    font-family: 'Montserrat', sans-serif;
    -ms-word-wrap: break-word;
    word-wrap: break-word;
}

/* шрифт-переопределение темы */
.main-menu .product-categories > ul > li {
    font-family: "Rubik", sans-serif !important;
}

.product-categories .mobile-search svg,
.product-categories .mobile-wishlist svg {
    display: none;
}

/* стрелка "есть подпункты" (общая, base64-иконка) */
.main-menu .product-categories > ul li.has-children:after,
.main-menu .product-categories > ul li.menu-item-has-children:after {
    background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOSIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDkgMTMiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcuMzc3IDUuODM4YS45MTYuOTE2IDAgMCAxIDAgMS4yOTVsLTQuNjA5IDQuNjA4YS45MTYuOTE2IDAgMCAxLTEuMjk1LTEuMjk1bDQuNjA4LTQuNjA4djEuMjk1bC00LjU3LTQuNTdhLjkxNi45MTYgMCAwIDEgMS4yOTYtMS4yOTVsNC41NyA0LjU3eiIgc3Ryb2tlPSIjNGM0YzRjIiBmaWxsPSIjNGM0YzRjIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=') no-repeat;
    background-size: 7px 11px;
}

/* затемнение позади мобильного меню */
.menu-shadow {
    display: block;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(58, 76, 105, .93);
    z-index: 1000;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: visibility .5s cubic-bezier(.86,0,.07,1), opacity .5s cubic-bezier(.86,0,.07,1);
    transition: visibility .5s cubic-bezier(.86,0,.07,1), opacity .5s cubic-bezier(.86,0,.07,1);
}

/* цветовые переопределения темы */
.main-menu .product-categories > ul > li:after { border-bottom-color: #11aa53; }
.main-menu .product-categories > ul > li.ltr > ul > li ul:after { border-right-color: #11aa53; }
.main-menu .product-categories > ul > li.rtl > ul > li ul:after { border-left-color: #11aa53; }

/* --------------------------------------------------------------------------
   3. Десктоп (min-width: 992px)
   -------------------------------------------------------------------------- */
@media (min-width: 992px) {

    #header .mobile-menu { display: none; }

    .main-menu .product-categories .menu-item,
    .main-menu .product-categories .space-item { display: none; }

    .header-type-1 .main-menu .product-categories > ul,
    .header-type-2.sticky .main-menu .product-categories > ul {
        position: absolute;
        left: 50%;
        top: 45px;
        width: 66%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        list-style: none;
        padding: 0;
        margin: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    /* вариант "только текст" */
    .header-type-1 .main-menu .product-categories ul.main-menu-text-only {
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    .header-type-1 .main-menu .product-categories ul.main-menu-text-only > li,
    .header-type-2 .main-menu .product-categories ul.main-menu-text-only > li,
    .header-type-1.sticky .main-menu .product-categories ul.main-menu-text-only > li,
    .header-type-2.sticky .main-menu .product-categories ul.main-menu-text-only > li {
        width: auto;
        max-width: 105px;
        margin-left: 15px;
        margin-right: 15px;
    }

    .header-type-1:not(.sticky) .main-menu .product-categories .main-menu-text-only > li span {
        padding-top: 15px;
    }

    .header-type-2:not(.sticky) .main-menu .product-categories > ul {
        position: relative;
        text-align: center;
        display: block;
        width: 100%;
        padding: 0 0 20px 0;
        margin: 0;
        list-style: none;
    }

    .woocommerce-off.header-type-2:not(.sticky) .main-menu .product-categories > ul { display: none; }

    /* пункты первого уровня */
    .main-menu .product-categories > ul > li {
        display: inline-block;
        vertical-align: top;
        margin: 0 2px;
        position: relative;
        text-align: center;
        width: 105px !important;
    }

    .main-menu .product-categories > ul > li:after {
        content: '';
        position: absolute;
        left: 50%;
        margin-left: -10px;
        bottom: 0;
        border: 10px solid transparent;
        border-bottom: 10px solid #11aa53;
        visibility: hidden;
        opacity: 0;
        z-index: 101;
        display: none;
    }

    .main-menu .product-categories > ul > li.ltr:after,
    .main-menu .product-categories > ul > li.rtl:after { display: block; }

    .main-menu.initialized .product-categories > ul > li.has-children:hover:after,
    .main-menu.initialized .product-categories > ul > li.menu-item-has-children:hover:after {
        visibility: visible;
        opacity: 1;
    }

    .main-menu .product-categories > ul > li svg {
        display: inline-block;
        height: 53px;
        width: 53px;
    }

    .main-menu .product-categories > ul > li img {
        display: inline-block;
        height: 53px;
        width: auto;
        margin-bottom: 6px;
    }

    .main-menu .product-categories > ul > li span {
        display: block;
        font-weight: 700;
        font-size: 12px !important;
        line-height: 1.3;
        letter-spacing: 1px;
        text-transform: uppercase;
        padding-bottom: 15px;
    }

    /* анимация подпрыгивания иконки */
    @-webkit-keyframes menujump {
        0%, 20%, 60%, 100% { -webkit-transform: translateY(0); }
        40% { -webkit-transform: translateY(-10px); }
        80% { -webkit-transform: translateY(-2px); }
    }

    @keyframes menujump {
        0%, 20%, 60%, 100% { -webkit-transform: translateY(0); transform: translateY(0); }
        40% { -webkit-transform: translateY(-10px); transform: translateY(-10px); }
        80% { -webkit-transform: translateY(-2px); transform: translateY(-2px); }
    }

    .main-menu .product-categories > ul > li:hover > a > svg,
    .main-menu .product-categories > ul > li:hover img {
        -webkit-animation: menujump 1s;
        animation: menujump 1s;
    }

    /* выпадающие списки */
    .main-menu .product-categories ul > li ul {
        opacity: 0;
        visibility: hidden;
        position: absolute;
        background: #11aa53;
        border-radius: 8px;
        list-style: none;
        text-align: left;
        padding: 15px 0;
        margin: 0;
        width: 215px;
        z-index: 101;
        left: -15px;
        box-shadow: 0 5px 20px rgba(0, 0, 0, .3);
    }

    .main-menu .product-categories ul > li > ul { display: none; }

    .main-menu .product-categories ul > li.rtl > ul,
    .main-menu .product-categories ul > li.ltr > ul { display: block; }

    .main-menu .product-categories ul > li.rtl ul {
        left: auto;
        right: -15px;
    }

    /* раскрытие вправо */
    .main-menu .product-categories ul > li.ltr ul li ul,
    .main-menu .product-categories ul > li.col-2 > ul > li:nth-child(2n+1) > ul > li ul,
    .main-menu .product-categories ul > li.col-3 > ul > li:nth-child(3n+1) > ul > li ul,
    .main-menu .product-categories ul > li.col-3 > ul > li:nth-child(3n+2) > ul > li ul,
    .main-menu .product-categories ul > li.col-4 > ul > li:nth-child(4n+1) > ul > li ul,
    .main-menu .product-categories ul > li.col-4 > ul > li:nth-child(4n+2) > ul > li ul {
        display: block;
        left: auto;
        right: -245px;
        top: -15px;
    }

    .main-menu .product-categories ul > li.ltr ul li ul:before,
    .main-menu .product-categories ul > li.col-2 > ul > li:nth-child(2n+1) > ul > li ul:before,
    .main-menu .product-categories ul > li.col-3 > ul > li:nth-child(3n+1) > ul > li ul:before,
    .main-menu .product-categories ul > li.col-3 > ul > li:nth-child(3n+2) > ul > li ul:before,
    .main-menu .product-categories ul > li.col-4 > ul > li:nth-child(4n+1) > ul > li ul:before,
    .main-menu .product-categories ul > li.col-4 > ul > li:nth-child(4n+2) > ul > li ul:before {
        content: '';
        display: block;
        position: absolute;
        left: -30px;
        top: 0;
        bottom: 0;
        width: 30px;
    }

    .main-menu .product-categories ul > li.ltr ul li ul:after,
    .main-menu .product-categories ul > li.col-2 > ul > li:nth-child(2n+1) > ul > li ul:after,
    .main-menu .product-categories ul > li.col-3 > ul > li:nth-child(3n+1) > ul > li ul:after,
    .main-menu .product-categories ul > li.col-3 > ul > li:nth-child(3n+2) > ul > li ul:after,
    .main-menu .product-categories ul > li.col-4 > ul > li:nth-child(4n+1) > ul > li ul:after,
    .main-menu .product-categories ul > li.col-4 > ul > li:nth-child(4n+2) > ul > li ul:after {
        left: -20px;
        right: auto;
        top: 25px;
        border: 10px solid transparent;
        border-right: 10px solid #11aa53;
    }

    /* раскрытие влево */
    .main-menu .product-categories ul > li.rtl ul li ul,
    .main-menu .product-categories ul > li.col-2 > ul > li:nth-child(2n+2) > ul > li ul,
    .main-menu .product-categories ul > li.col-3 > ul > li:nth-child(3n+3) > ul > li ul,
    .main-menu .product-categories ul > li.col-4 > ul > li:nth-child(4n+3) > ul > li ul,
    .main-menu .product-categories ul > li.col-4 > ul > li:nth-child(4n+4) > ul > li ul {
        display: block;
        right: auto;
        left: -245px;
        top: -15px;
    }

    .main-menu .product-categories ul > li.rtl ul li ul:before,
    .main-menu .product-categories ul > li.col-2 > ul > li:nth-child(2n+2) > ul > li ul:before,
    .main-menu .product-categories ul > li.col-3 > ul > li:nth-child(3n+3) > ul > li ul:before,
    .main-menu .product-categories ul > li.col-4 > ul > li:nth-child(4n+3) > ul > li ul:before,
    .main-menu .product-categories ul > li.col-4 > ul > li:nth-child(4n+4) > ul > li ul:before {
        content: '';
        display: block;
        position: absolute;
        left: auto;
        right: -30px;
        top: 0;
        bottom: 0;
        width: 30px;
    }

    .main-menu .product-categories ul > li.rtl ul li ul:after,
    .main-menu .product-categories ul > li.col-2 > ul > li:nth-child(2n+2) > ul > li ul:after,
    .main-menu .product-categories ul > li.col-3 > ul > li:nth-child(3n+3) > ul > li ul:after,
    .main-menu .product-categories ul > li.col-4 > ul > li:nth-child(4n+3) > ul > li ul:after,
    .main-menu .product-categories ul > li.col-4 > ul > li:nth-child(4n+4) > ul > li ul:after {
        left: auto;
        right: -20px;
        top: 25px;
        border: 10px solid transparent;
        border-left-color: #11aa53;
    }

    .main-menu .product-categories ul > li > ul > li > ul:after {
        content: '';
        position: absolute;
    }

    .main-menu .product-categories ul > li ul li {
        margin: 0 20px;
        padding: 11px 0;
        font: 700 15px 'Open Sans', sans-serif;
        color: #FFF;
        position: relative;
    }

    /* многоколоночные мега-меню (col-2 / col-3 / col-4) */
    .main-menu .product-categories ul > li.col-2 > ul > li > ul > li,
    .main-menu .product-categories ul > li.col-3 > ul > li > ul > li,
    .main-menu .product-categories ul > li.col-4 > ul > li > ul > li {
        padding: 11px 0 0 0;
    }

    .main-menu .product-categories ul > li.col-2 > ul { width: 430px; }
    .main-menu .product-categories ul > li.col-3 > ul { width: 645px; }
    .main-menu .product-categories ul > li.col-4 > ul { width: 860px; }

    .main-menu .product-categories ul > li.col-2 > ul > li,
    .main-menu .product-categories ul > li.col-3 > ul > li,
    .main-menu .product-categories ul > li.col-4 > ul > li {
        width: 175px;
        border-bottom: none;
    }

    .main-menu .product-categories ul > li.col-2 > ul > li:nth-child(2n+3) { clear: both; }
    .main-menu .product-categories ul > li.col-3 > ul > li:nth-child(3n+4) { clear: both; }
    .main-menu .product-categories ul > li.col-4 > ul > li:nth-child(4n+5) { clear: both; }

    .main-menu .product-categories ul > li.col-2 > ul > li.menu-item-has-children > a,
    .main-menu .product-categories ul > li.col-3 > ul > li.menu-item-has-children > a,
    .main-menu .product-categories ul > li.col-4 > ul > li.menu-item-has-children > a {
        text-transform: uppercase;
        display: block;
        padding-bottom: 5px;
    }

    .main-menu .product-categories .js-more { display: none !important; }

    .main-menu .product-categories ul > li.col-2 > ul > li > ul,
    .main-menu .product-categories ul > li.col-3 > ul > li > ul,
    .main-menu .product-categories ul > li.col-4 > ul > li > ul {
        position: static !important;
        display: block !important;
        left: auto;
        right: auto;
        top: auto;
        box-shadow: none;
        margin: 0;
        padding: 0;
        border-radius: 0;
        width: 100%;
    }

    .main-menu .product-categories ul > li.col-2:hover > ul > li > ul,
    .main-menu .product-categories ul > li.col-3:hover > ul > li > ul,
    .main-menu .product-categories ul > li.col-4:hover > ul > li > ul {
        visibility: visible;
        opacity: 1;
    }

    .main-menu .product-categories ul > li.col-2 > ul > li > ul:after,
    .main-menu .product-categories ul > li.col-3 > ul > li > ul:after,
    .main-menu .product-categories ul > li.col-4 > ul > li > ul:after { display: none; }

    .main-menu .product-categories ul > li.col-2 > ul > li > ul > li,
    .main-menu .product-categories ul > li.col-3 > ul > li > ul > li,
    .main-menu .product-categories ul > li.col-4 > ul > li > ul > li {
        margin: 0;
        font-weight: 400;
    }

    .main-menu .product-categories ul > li.col-2 > ul > li > ul > li ul,
    .main-menu .product-categories ul > li.col-3 > ul > li > ul > li ul,
    .main-menu .product-categories ul > li.col-4 > ul > li > ul > li ul {
        background: #FFF;
    }

    .main-menu .product-categories ul > li.col-2 > ul > li > ul > li ul > li > a,
    .main-menu .product-categories ul > li.col-3 > ul > li > ul > li ul > li > a,
    .main-menu .product-categories ul > li.col-4 > ul > li > ul > li ul > li > a {
        color: #4c4c4c;
    }

    .main-menu .product-categories ul > li.col-2 > ul > li:nth-child(2n+1) > ul li > ul:after,
    .main-menu .product-categories ul > li.col-3 > ul > li:nth-child(3n+1) > ul li > ul:after,
    .main-menu .product-categories ul > li.col-3 > ul > li:nth-child(3n+2) > ul li > ul:after,
    .main-menu .product-categories ul > li.col-4 > ul > li:nth-child(4n+1) > ul li > ul:after,
    .main-menu .product-categories ul > li.col-4 > ul > li:nth-child(4n+2) > ul li > ul:after {
        border-right-color: #FFF;
    }

    .main-menu .product-categories ul > li.col-2 > ul > li:nth-child(2n+2) > ul li > ul:after,
    .main-menu .product-categories ul > li.col-3 > ul > li:nth-child(3n+3) > ul li > ul:after,
    .main-menu .product-categories ul > li.col-4 > ul > li:nth-child(4n+3) > ul li > ul:after,
    .main-menu .product-categories ul > li.col-4 > ul > li:nth-child(4n+4) > ul li > ul:after {
        border-left-color: #FFF;
    }

    .main-menu .product-categories ul > li ul li a {
        color: #FFF;
        display: block;
        width: 100%;
    }

    .main-menu .product-categories ul > li ul li:last-child { border-bottom: none; }

    .main-menu.initialized .product-categories ul > li:hover > ul,
    .main-menu.initialized .product-categories ul > li > ul li:hover > ul {
        opacity: 1;
        visibility: visible;
    }

    .main-menu .sub-menu {
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    /* прилипшая шапка */
    .sticky .main-menu .product-categories > ul > li span { padding-top: 15px; }

    .sticky .main-menu .product-categories > ul,
    .sticky.header-type-2 .main-menu .product-categories > ul {
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    .sticky.sticky-type-2.header-type-2 .main-menu .product-categories > ul > li:nth-child(n+7) { display: none; }
    .sticky.sticky-type-1.header-type-2 .main-menu .product-categories > ul > li:nth-child(n+13) { display: none; }

    .sticky.sticky-type-1 #header .main-menu .product-categories > ul > li.with-icon span { display: none; }
    .sticky.sticky-type-1 #header .main-menu .product-categories > ul > li.without-icon svg { display: none; }

    .sticky.sticky-type-2 #header .main-menu .product-categories > ul > li { vertical-align: middle; }

    .sticky.sticky-type-1 #header .main-menu .product-categories > ul > li svg,
    .sticky.sticky-type-1 #header .main-menu .product-categories > ul > li img {
        margin-top: 10px;
        margin-bottom: 10px;
        vertical-align: middle;
    }

    .sticky.sticky-type-2 #header .main-menu .product-categories > ul > li svg,
    .sticky.sticky-type-2 #header .main-menu .product-categories > ul > li img { display: none; }

    /* ширины пунктов в sticky (items-7 … items-12) */
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-7,
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-8,
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-9,
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-10,
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-11,
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-12 {
        display: block;
        float: left;
        margin-left: 0;
        margin-right: 0;
    }

    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-7 { width: 14.2857%; }
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-7 svg,
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-7 img { width: 55.2%; }

    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-8 { width: 12.5%; }
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-8 svg,
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-8 img { width: 55.2%; }

    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-9 { width: 11.11111111%; }
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-9 svg,
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-9 img { width: 61.77%; }

    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-10 { width: 10%; }
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-10 svg,
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-10 img { width: 68.64%; }

    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-11 { width: 9.090909%; }
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-11 svg,
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-11 img { width: 75.5%; }

    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-12 { width: 8.333333%; }
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-12 svg,
    .header-type-2.sticky.sticky-type-1 .main-menu .product-categories > ul > li.items-12 img { width: 82.37%; }

    /* ховеры */
    .main-menu .product-categories > ul > li:hover span { color: #11aa53; }
}

/* --------------------------------------------------------------------------
   4. Мобильная версия (max-width: 991px)
   -------------------------------------------------------------------------- */
@media (max-width: 991px) {

    #header .mobile-menu,
    .menu-shadow,
    .product-categories .auth,
    #header .mobile-menu-close,
    #header .mobile-menu-back {
        display: block;
    }

    /* выезжающая панель меню */
    #header .product-categories {
        position: fixed;
        display: block;
        z-index: 1010;
        left: 0;
        top: 0;
        bottom: 0;
        width: 300px;
        background: #FFF;
        list-style: none;
        overflow: hidden;
        -webkit-transition: -webkit-transform .5s cubic-bezier(.86,0,.07,1);
        transition: transform .5s cubic-bezier(.86,0,.07,1), -webkit-transform .5s cubic-bezier(.86,0,.07,1);
        -webkit-transform: translate3d(-301px, 0, 0);
        transform: translate3d(-301px, 0, 0);
    }

    .menu-open #header .product-categories {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    .menu-open #header .menu { display: block; }

    .menu-open .menu-shadow,
    .sidebar-open .menu-shadow {
        visibility: visible;
        opacity: 1;
    }

    /* списки */
    .main-menu .product-categories > ul,
    .main-menu .product-categories > ul > li ul {
        padding: 0;
        margin: 0;
        text-align: left;
        background: #FFF;
        width: 300px;
        bottom: 40px;
        display: block;
        position: absolute;
        left: 0;
        top: 55px;
        overflow-x: visible;
        overflow-y: scroll;
        -webkit-overflow-scrolling: touch;
        -webkit-transition: -webkit-transform .5s cubic-bezier(.86,0,.07,1);
        transition: transform .5s cubic-bezier(.86,0,.07,1), -webkit-transform .5s cubic-bezier(.86,0,.07,1);
    }

    .main-menu .product-categories > ul > li ul {
        position: fixed;
        top: 55px;
        opacity: 1;
        padding-top: 10px;
        left: 0;
        z-index: 101;
        -webkit-transform: translate3d(-301px, 0, 0);
        transform: translate3d(-301px, 0, 0);
    }

    .main-menu .product-categories > ul > li > ul li > ul { top: 0; }
    .main-menu .product-categories > ul > li > ul li > ul.sub-menu { height: 150%; }

    .product-categories li.selected > ul {
        -webkit-transform: translate3d(0, 0, 0) !important;
        transform: translate3d(0, 0, 0) !important;
    }

    .main-menu .product-categories > ul > li img,
    .main-menu .product-categories > ul > li svg {
        width: 35px;
        height: 35px;
        display: inline-block;
        position: absolute;
        left: 25px;
        top: 50%;
        margin-top: -17px;
    }

    .main-menu .product-categories ul li {
        display: block;
        position: relative;
        padding: 0;
        margin: 0;
        width: 100% !important;
    }

    /* стрелки подпунктов */
    .main-menu .product-categories > ul li.has-children:after,
    .main-menu .product-categories > ul li.menu-item-has-children:after {
        content: '';
        display: block;
        position: absolute;
        right: 25px;
        top: 50%;
        margin-top: -6px;
        width: 7px;
        height: 11px;
        background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOSIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDkgMTMiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcuMzc3IDUuODM4YS45MTYuOTE2IDAgMCAxIDAgMS4yOTVsLTQuNjA5IDQuNjA4YS45MTYuOTE2IDAgMCAxLTEuMjk1LTEuMjk1bDQuNjA4LTQuNjA4djEuMjk1bC00LjU3LTQuNTdhLjkxNi45MTYgMCAwIDEgMS4yOTYtMS4yOTVsNC41NyA0LjU3eiIgc3Ryb2tlPSIjM0E0QzY5IiBmaWxsPSIjM0E0QzY5IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=) no-repeat;
        background-size: 7px 11px;
    }

    .main-menu .product-categories > ul li.menu-item.has-children:after,
    .main-menu .product-categories > ul li.menu-item.menu-item-has-children:after {
        background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOSIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDkgMTMiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcuMzc3IDUuODM4YS45MTYuOTE2IDAgMCAxIDAgMS4yOTVsLTQuNjA5IDQuNjA4YS45MTYuOTE2IDAgMCAxLTEuMjk1LTEuMjk1bDQuNjA4LTQuNjA4djEuMjk1bC00LjU3LTQuNTdhLjkxNi45MTYgMCAwIDEgMS4yOTYtMS4yOTVsNC41NyA0LjU3eiIgc3Ryb2tlPSIjMTFhYTUzIiBmaWxsPSIjMTFhYTUzIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=') no-repeat;
        background-size: 7px 11px;
    }

    .main-menu .product-categories > ul > li > a:not(.js-more),
    .main-menu .product-categories > ul > li > span {
        display: block;
        padding: 25px 0 25px 70px;
        margin-right: 60px;
        font-weight: 700;
        font-size: 13px;
        line-height: 15px;
        text-transform: uppercase;
    }

    .main-menu .product-categories .more {
        display: block;
        position: absolute;
        right: 0;
        top: 0;
        bottom: 0;
        width: 60px;
        z-index: 10;
    }

    .main-menu .product-categories > ul > li.menu-item > a,
    .main-menu .product-categories > ul > li.menu-item > ul li a {
        color: #11aa53;
    }

    .main-menu .product-categories > ul > li.menu-item > a:not(.js-more),
    .main-menu .product-categories > ul > li.pagenav > a:not(.js-more),
    .main-menu .product-categories > ul > li.categories > a:not(.js-more),
    .main-menu .product-categories > ul > li.pagenav > span,
    .main-menu .product-categories > ul > li.categories > span {
        padding: 15px 30px;
    }

    .woocommerce-on .main-menu .product-categories > ul > li.space-item { height: 30px; }

    .main-menu .product-categories > ul > li > ul li.menu-item-has-children { padding-right: 60px; }

    .main-menu .product-categories > ul > li > ul > li a:not(.js-more) {
        display: block;
        width: 100%;
        padding: 15px 0 15px 30px;
        font-weight: 700;
        font-size: 13px;
        line-height: 15px;
        text-transform: uppercase;
    }

    /* кнопка Login внизу панели */
    .product-categories .auth {
        display: block;
        width: 100%;
        height: 40px;
        vertical-align: middle;
        position: absolute;
        left: 0;
        bottom: 0;
        font-size: 14px;
        background: #11aa53;
        color: #FFF;
        text-align: left;
        line-height: 40px;
        padding-left: 18px;
    }

    .product-categories .auth svg {
        width: 17px;
        height: 14px;
        vertical-align: middle;
        fill: #FFF;
        margin-right: 3px;
    }

    .product-categories .auth span {
        color: #FFF;
        font-weight: 700;
    }

    /* кнопка закрытия */
    .mobile-menu-close svg {
        position: absolute;
        right: 25px;
        top: 24px;
        width: 15px;
        height: 15px;
    }

    /* кнопка "Назад" */
    #header .mobile-menu-back {
        position: absolute;
        left: 25px;
        top: 26px;
        color: #11aa53;
        fill: #11aa53;
        font: 700 14px/14px 'Open Sans', sans-serif;
        -webkit-transition: -webkit-transform .5s cubic-bezier(.86,0,.07,1);
        transition: transform .5s cubic-bezier(.86,0,.07,1), -webkit-transform .5s cubic-bezier(.86,0,.07,1);
        -webkit-transform: translate3d(-301px, 0, 0);
        transform: translate3d(-301px, 0, 0);
    }

    .submenu-open #header .mobile-menu-back {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    #header .mobile-menu-back svg {
        display: inline-block;
        vertical-align: middle;
        width: 7px;
        height: 11px;
        fill: #11aa53;
        margin-right: 3px;
        margin-bottom: 2px;
    }
}

/* --------------------------------------------------------------------------
   5. Мобильный поиск в панели меню
   -------------------------------------------------------------------------- */
@media (max-width: 475px) {
    .product-categories .mobile-wishlist svg {
        position: absolute;
        display: inline-block;
        right: 25px;
        bottom: 11px;
        width: 21px;
        height: 18px;
        fill: #FFF;
    }
}

@media (max-width: 320px) {
    .product-categories .mobile-search svg {
        position: absolute;
        display: inline-block;
        right: 25px;
        bottom: 11px;
        width: 20px;
        height: 20px;
        fill: #FFF;
    }

    .product-categories .mobile-wishlist svg { right: 75px; }
}