#header-menu-overlay {

        pointer-events: none;

        visibility: hidden;

        top: 0px;

        right: 0px;

        left: 0px;

        z-index: 9998;

        max-width: 100%;

        overflow-y: auto;

        padding-bottom: 1.25rem;

        opacity: 0;

        transition-property: opacity,visibility;

        transition-duration: 300ms;

        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
}

@media (max-width: 600px) {

        #header-menu-overlay {

                width: 100vw
        }
}

#header-menu-overlay.is-open {

        pointer-events: auto;

        visibility: visible;

        opacity: 1
}

    body.admin-bar #header-menu-overlay {

        top: 32px
}

    @media screen and (max-width: 782px) {
        body.admin-bar #header-menu-overlay {

                top: 46px
        }
    }

    #header-menu-overlay .container {

        padding-left: 1.25rem;

        padding-right: 1.25rem;

        padding-top: 8.063rem
}

    @media (max-width: 960px) {

        #header-menu-overlay .container {

                padding-top: 6.563rem
        }
}

    #header-menu-overlay .container nav {

        padding-bottom: 2.5rem
}

    #header-menu-overlay .container nav ul {

        flex-direction: column;

        gap: 1.25rem
}

    #header-menu-overlay .container nav ul li {

        border-bottom-width: 1px;

        border-style: solid;

        border-color: rgba(138,133,121,0.2)
}

    #header-menu-overlay .container nav ul li a {

        gap: 2.5rem;

        padding-top: 1.25rem;

        padding-bottom: 1.25rem;

        font-size: 1.25rem;

        font-weight: 500
}

    #header-menu-overlay .container nav ul li a:hover {

        color: #FDC300
}

    #header-menu-overlay .container nav ul li a:hover svg path {

        fill: #FDC300
}

    #header-menu-overlay .container ul {

        list-style-type: none
}

    #header-menu-overlay .container ul li {

        overflow: hidden
}

    #header-menu-overlay .container ul li a {

        line-height: 1
}

    #header-menu-overlay .container > ul {

        flex-direction: column-reverse;

        gap: 1.25rem
}

    #header-menu-overlay .container > ul li a {

        border-radius: 9999px;

        border-width: 1px;

        border-style: solid;

        padding-left: 1.625rem;

        padding-right: 1.625rem;

        padding-top: 1.063rem;

        padding-bottom: 1.063rem;

        font-size: 1rem;

        font-weight: 400;

        transition-duration: 300ms;

        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
}

    #header-menu-overlay .container > ul li a span {

        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;

        transition-duration: 300ms;

        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
}

    #header-menu-overlay .container > ul li:last-of-type a {

        border-color: #FDC300;

        background-color: #FDC300
}

    #header-menu-overlay .container > ul li:last-of-type a:hover {

        border-color: #0C0C0C;

        background-color: #0C0C0C;

        color: #fff
}

    #header-menu-overlay .container > ul li:last-of-type a:hover span {

        background-color: #fff
}

    #header-menu-overlay .container > ul li:first-of-type a {

        border-color: #0C0C0C
}

    #header-menu-overlay .container > ul li:first-of-type a:hover {

        border-color: #FDC300;

        background-color: #FDC300
}

.menu-overlay-backdrop {

        pointer-events: none;

        top: 0px;

        right: 0px;

        bottom: 0px;

        left: 0px;

        z-index: 9997;

        background-color: rgba(0,0,0,.5);

        opacity: 0;

        transition-property: opacity;

        transition-duration: 400ms;

        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
}

.menu-overlay-backdrop.is-visible {

        pointer-events: auto;

        opacity: 1
}
