/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jun 23 2026 | 06:28:24 */
/* Add your CSS code here.

For example:
.example {
    color: red;
}

For brushing up on your CSS knowledge, check out http://www.w3schools.com/css/css_syntax.asp

End of comment */ 

/* Mobile only */
/* Mobile only */
/* Mobile only */
@media (max-width: 991px) {

    .header-menu__inner{
        position: relative;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .main-navigation{
        position: static;
        margin-right: 0;
    }

    .main-navigation ul.primary-menu{
        display: block !important;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: #fff;
        z-index: 999;

        max-height: 0;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;

        opacity: 0;
        visibility: hidden;

        transition: max-height .45s ease,
                    opacity .3s ease;

        box-shadow: 0 8px 20px rgba(0,0,0,.08);
    }

    .main-navigation.toggled ul.primary-menu,
    .main-navigation.menu-open ul.primary-menu{
        max-height: 80vh;
        opacity: 1;
        visibility: visible;
    }

    .main-navigation ul.primary-menu > li{
        width: 100%;
        border-bottom: 1px solid #eee;
        position: relative;
    }

    .main-navigation ul.primary-menu > li > a{
        display: block;
        padding: 18px 25px;
        padding-right: 70px;
    }

    /* Hide original arrow */
    .main-navigation .menu-item-has-children > a::after,
    .main-navigation .page_item_has_children > a::after{
        display: none !important;
    }

    .submenu-toggle{
    position: absolute;
    top: 0;
    right: 0;
    width: 60px;
    height: 58px;
    cursor: pointer;
    z-index: 10;
}

    .submenu-toggle::before{
        content: '+';
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 24px;
    }

    .submenu-open > .submenu-toggle::before{
        content: '−';
    }

    /* Submenus */
    .main-navigation ul.sub-menu{
        display: none !important;
        position: static !important;
        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        background: #f8f8f8 !important;
        box-shadow: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
    }

    .main-navigation li.submenu-open > ul.sub-menu{
        display: block !important;
    }

    .main-navigation ul.sub-menu li{
        border-bottom: 1px solid #e5e5e5;
    }

    .main-navigation ul.sub-menu li a{
        display: block !important;
        padding: 15px 40px !important;
        font-size: 14px;
    }
}