.header-top {
    background-color: var(--color-neutral);
}

#header .header-top li,
#top-bar .top-bar-nav a {
    font-size: var(--font-size-sm);
    color: var(--color-white);
}

#top-bar .top-bar-nav a:hover {
    color: var(--color-link-hover);
}

.header-main {
    min-height: 5rem !important;
    background-color: var(--color-primary);
    border-bottom: .0625rem solid var(--color-border-base);
}

.header-main #logo {
    width: max-content;
}

.header-main #logo img {
    width: 11.25rem;
}

.header-main .logo, .header-main .header-nav-main li {
    margin: 0;
}

.header-main .header-nav-main a {
    font-size: var(--font-size-md);
    font-weight: 500;
    color: var(--color-menu);
}

.header-wrapper.stuck {
    box-shadow: unset;
}

.header-main .header-nav-main a:hover {
    color: var(--color-link-hover);
}

@media (min-width: 53.125rem) {
    header#header .header-inner .flex-col.hide-for-medium, header#header .header-nav.header-nav-main, header#header .header-nav.header-nav-main > li {
        height: 100%;
        justify-content: center;
        align-items: center;
        gap: 1.875rem
    }

    header#header .header-nav.header-nav-main > li.custom {
        display: flex;
        align-items: center
    }

    header#header .header-nav.header-nav-main > li > a {
        height: 100%;
        padding-top: 0;
        padding-bottom: 0;
        color: var(--color-heading)
    }

    header#header .header-nav.header-nav-main > li > a:hover, header#header .header-nav.header-nav-main > li.active > a {
        color: var(--color-link-hover)
    }

    header#header .header-nav.header-nav-main > li.active > a {
        border-bottom: .1875rem solid var(--color-border-base)
    }

    header#header ul.sub-menu, header#header .nav-dropdown {
        position: absolute;
        left: 0;
        right: 0;
        top: auto;
        margin: 0;
        padding: 0;
        display: none !important;
        min-width: 13.4375rem;
        background: var(--color-white);
        text-align: left;
        -webkit-box-shadow: none;
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        box-shadow: 0 .625rem .9375rem 0 rgba(var(--neutral), .1);
        border-radius: 0 0 var(--border-radius-md) var(--border-radius-md)
    }

    header#header .nav-right .nav-dropdown {
        left: auto;
        right: auto;
        -webkit-transition: opacity .25s, visibility .25s;
        -o-transition: opacity .25s, visibility .25s;
        transition: opacity .25s, visibility .25s
    }

    header#header .header-search-dropdown .header-search-form {
        padding: .6em .8em !important
    }

    header#header .nav-right .current-dropdown .nav-dropdown {
        -webkit-transition-property: opacity, -webkit-transform;
        transition-property: opacity, -webkit-transform;
        -o-transition-property: opacity, transform;
        transition-property: opacity, transform;
        transition-property: opacity, transform, -webkit-transform
    }

    header#header .current-dropdown > .nav-dropdown, header#header .nav-dropdown li:hover > ul.sub-menu {
        display: block !important;
        -webkit-animation: -menu-fade-up .45s linear;
        animation: -menu-fade-up .45s linear
    }

    @-webkit-keyframes -menu-fade-up {
        0% {
            opacity: 0;
            -webkit-transform: translateY(.625rem);
            transform: translateY(.625rem);
            visibility: hidden
        }
        100% {
            opacity: 1;
            -webkit-transform: translateY(0);
            transform: translateY(0);
            visibility: visible
        }
    }@keyframes -menu-fade-up {
         0% {
             opacity: 0;
             -webkit-transform: translateY(.625rem);
             transform: translateY(.625rem);
             visibility: hidden
         }
         100% {
             opacity: 1;
             -webkit-transform: translateY(0);
             transform: translateY(0);
             visibility: visible
         }
     }header#header .nav-dropdown ul.sub-menu {
          position: absolute;
          border-radius: var(--border-radius-md);
          left: 100%;
          top: -.0625rem;
          min-width: 11.25rem
      }

    header#header .nav-dropdown li {
        white-space: normal;
        display: block;
        position: relative;
        margin: 0 !important;
        border: none;
        width: auto
    }

    header#header .nav-dropdown li:hover {
        color: var(--color-link-hover)
    }

    header#header .nav-dropdown a {
        display: block;
        padding: .8rem 1.6rem;
        margin: 0 !important;
        text-transform: unset;
        font-size: var(--font-size-md);
        line-height: 1.4;
        -webkit-transition: all .4s ease-out 0s;
        -o-transition: all .4s ease-out 0s;
        transition: all .4s ease-out 0s;
        position: relative;
        border-radius: 0;
        border: none;
        border-bottom: .0625rem solid rgba(13, 23, 32, .0784313725);
        color: var(--color-heading)
    }

    header#header .nav-dropdown a::before {
        content: '';
        position: absolute;
        bottom: -.0625rem;
        left: 0;
        background: -webkit-gradient(linear, left top, right top, from(#fff), color-stop(var(--color-neutral)), to(#fff));
        background: -o-linear-gradient(left, #fff, var(--color-neutral), #fff);
        background: linear-gradient(90deg, #fff, var(--color-neutral), #fff);
        width: 100%;
        height: .0625rem;
        -webkit-transform: scaleX(0);
        -ms-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: left;
        -ms-transform-origin: left;
        transform-origin: left;
        -webkit-transition: .4s ease-in;
        -o-transition: .4s ease-in;
        transition: .4s ease-in;
        z-index: 1
    }

    header#header .nav-dropdown a:hover::before {
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1)
    }

    header#header .nav-dropdown li.menu-item-has-children > a {
        text-transform: unset;
        padding-right: 2.2rem
    }

    header#header .nav-dropdown li.menu-item-has-children > a::after {
        font-family: var(--font-awesome);
        content: '\f105';
        position: absolute;
        right: .625rem;
        top: 50%;
        -webkit-transform: translateY(-44%);
        -ms-transform: translateY(-44%);
        transform: translateY(-44%);
        font-weight: lighter
    }

    header#header ul.sub-menu a:hover, header#header .nav-dropdown li.active > a {
        text-transform: none;
        color: var(--color-link-hover)
    }
}

.nav-vertical li li.menu-item-has-children > a, .nav-vertical li .children > li > a {
    font-weight: bold;
}

.off-canvas-left .mfp-content, .off-canvas-right .mfp-content {
    background: #fff;
    border-right: .0625rem solid #eee;
    -webkit-transition: -webkit-transform .3s ease-in;
    transition: -webkit-transform .3s ease-in;
    -o-transition: transform .3s ease-in;
    transition: transform .3s ease-in;
    transition: transform .3s ease-in, -webkit-transform .3s ease-in;
    -webkit-box-shadow: 0 .125rem 1.25rem rgba(0, 0, 0, .03);
    box-shadow: 0 .125rem 1.25rem rgba(0, 0, 0, .03);
}

.mfp-wrap.off-canvas-left .mfp-close {
    border-radius: 50%;
    opacity: 1;
    right: 1rem;
    top: 1rem;
    background: var(--obelix-header-color, black);
}

.mfp-wrap.off-canvas-left .mfp-close svg {
    stroke-width: .0625rem;
}

@media screen and (max-width: 53.0625rem) {
    .off-canvas-left .mfp-content {
        -ms-overflow-style: none;
        scrollbar-width: none
    }

    .off-canvas-left .mfp-content::-webkit-scrollbar {
        display: none
    }

    .mobile-sidebar .nav-sidebar.nav-vertical > li.menu-item.active, .mobile-sidebar .nav-sidebar.nav-vertical > li.menu-item:hover {
        background-color: unset
    }

    .mobile-sidebar .nav-sidebar.nav-vertical > li + li {
        border: none
    }

    .mobile-sidebar .nav-sidebar.nav-vertical .children {
        padding-bottom: .4rem;
        padding-right: 1.25rem;
        margin-top: -.4rem
    }

    .mobile-sidebar .sidebar-menu a {
        color: var(--obelix-header-color);
        font-size: 1.05rem
    }

    .mobile-sidebar .sidebar-menu li li.menu-item-has-children > .sub-menu li:last-child a::before, .mobile-sidebar .sidebar-menu li li.menu-item-has-children > .sub-menu li:first-child a::before {
        content: '';
        position: absolute;
        bottom: -.0625rem;
        left: 0;
        background: -webkit-gradient(linear, left top, right top, from(#fff), color-stop(var(--fs-color-primary)), to(#fff));
        background: -o-linear-gradient(left, #fff, var(--fs-color-primary), #fff);
        background: linear-gradient(90deg, #fff, var(--fs-color-primary), #fff);
        width: 100%;
        height: .0625rem;
        -webkit-transform: scaleX(0);
        -ms-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: left;
        -ms-transform-origin: left;
        transform-origin: left;
        -webkit-transition: .4s ease-in;
        -o-transition: .4s ease-in;
        transition: .4s ease-in;
        -webkit-transition-delay: .1s;
        -o-transition-delay: .1s;
        transition-delay: .1s;
        z-index: 1
    }

    .mobile-sidebar .sidebar-menu li.menu-item-has-children > .sub-menu li:first-child a::before {
        top: 0
    }

    .mobile-sidebar .sidebar-menu .active > a {
        color: var(--fs-color-primary);
        border-color: transparent
    }

    .mobile-sidebar .sidebar-menu .active > .sub-menu a::before {
        -webkit-transform: scaleX(1) !important;
        -ms-transform: scaleX(1) !important;
        transform: scaleX(1) !important
    }

    .mobile-sidebar .sidebar-menu .toggle {
        --toggle-line-width: .6875rem;
        --toggle-color: var(--obelix-header-color, #161618)
    }

    .mobile-sidebar .sidebar-menu .active > .toggle {
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
        --toggle-color: var(--fs-color-primary)
    }

    .mobile-sidebar .sidebar-menu .toggle i {
        position: relative
    }

    .mobile-sidebar .sidebar-menu .toggle i::before, .sidebar-menu .toggle i::after {
        content: '';
        position: absolute;
        height: var(--toggle-line-width);
        width: .125rem;
        top: calc(50% - var(--toggle-line-width) / 2);
        left: calc(50% - .0625rem);
        border-radius: .125rem;
        background-color: var(--toggle-color);
        -webkit-transition: -webkit-transform .3s ease;
        transition: -webkit-transform .3s ease;
        -o-transition: transform .3s ease;
        transition: transform .3s ease;
        transition: transform .3s ease, -webkit-transform .3s ease
    }

    .mobile-sidebar .sidebar-menu .toggle i::after {
        width: var(--toggle-line-width);
        height: .125rem;
        top: calc(50% - .0625rem);
        left: calc(50% - var(--toggle-line-width) / 2)
    }

    .mobile-sidebar .sidebar-menu .active > .toggle i::before {
        -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg)
    }

    .mobile-sidebar li li.menu-item-has-children:not(:first-child) {
        margin-top: 0
    }

    .off-canvas:not(.off-canvas-center) .nav-vertical li li {
        padding-left: 1rem;
        margin: 0;
        position: relative
    }

    s.off-canvas:not(.off-canvas-center) .nav-vertical li a {
        padding-left: 0;
        padding-right: 0
    }

    .mobile-sidebar .nav-vertical li li.menu-item-has-children > a {
        letter-spacing: 0;
        text-transform: unset
    }

    .mobile-sidebar .nav-vertical > li > ul li a {
        display: block;
        padding-top: .8rem;
        padding-bottom: .8rem;
        padding-left: 0 !important;
        margin: 0 0 0 1rem !important;
        text-transform: unset;
        font-size: .9rem;
        line-height: 1.4;
        -webkit-transition: all .4s ease-out 0s;
        -o-transition: all .4s ease-out 0s;
        transition: all .4s ease-out 0s;
        position: relative;
        border-radius: 0;
        border: none;
        border-bottom: .0625rem solid rgba(13, 23, 32, .0784313725)
    }

    .mobile-sidebar .nav-vertical li li:last-child a {
        border: none
    }

    .mobile-sidebar .nav-vertical .obelix-mobile-has-toggle {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-flow: row wrap;
        flex-flow: row wrap
    }

    .mobile-sidebar .nav-vertical .obelix-mobile-has-toggle .toggle {
        margin: 0;
        right: -1rem;
        position: absolute;
        top: 0;
        height: 2.875rem;
        opacity: 1
    }

    .mobile-sidebar .nav-vertical li li li a::after {
        content: '';
        display: inline-block;
        position: absolute;
        bottom: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        left: -.7em;
        background: black;
        width: .25rem;
        height: .0625rem;
        -webkit-transition: .4s ease-in;
        -o-transition: .4s ease-in;
        transition: .4s ease-in;
        z-index: 1
    }

    .mobile-sidebar .nav-vertical li li li.active > a::after {
        background: var(--fs-color-primary)
    }
}