


/* ============================== 
FIXED MENU
============================== */
#main_wrapper .page-menu{
    align-items:flex-start;
    display: flex;
    justify-content: space-between;
    left:0;
    padding-top:20px;
    pointer-events:none;
    position: fixed;
    top:50px;
    transition:250ms top;
    width:100%;
    z-index:2;
}

#main_wrapper.banner-exists .page-menu{
    top:100px;
}

.closed-banner #main_wrapper.banner-exists .page-menu{
    top:50px;
}

#main_wrapper .page-menu.open{
    pointer-events:auto;
}

#main_wrapper .page-menu:before{
    background:#151515;
    content:'';
    height:100%;
    left:0;
    position: absolute;
    top:0;
    transform:translateY(calc(-100% - 20px)) rotate(-3deg);
    transform-origin:0% 100%;
    transition:500ms transform;
    width:100%;
}

#main_wrapper .page-menu.open:before{
    transform:translateY(0%);
}

.nav-menu-open #main_wrapper .page-menu{
    top:99px;
}

.nav-menu-open.closed-banner #main_wrapper.banner-exists .page-menu{
    top:99px;
}

#main_wrapper .page-menu .more-menu-button{
    align-items:center;
    background:#E9E600;
    cursor:pointer;
    display: flex;
    flex:0 0 auto;
    margin-right:10px;
    padding:0.5em 0.5em 0.5em 0;
    pointer-events:auto;
    position: relative;
}

#main_wrapper .page-menu .more-menu-text{
    font-size:1em;
    line-height:1.5em;
    padding-left:25px;
    font-family: 'aktiv-grotesk', sans-serif;
}

#main_wrapper .page-menu .more-menu-button .hamburger-btn{
    display: flex;
    flex-direction:column;
    height:10px;
    margin:auto 5px auto 10px;
    position: relative;
    transform:translateY(-1px);
    width:15px;
}

#main_wrapper .page-menu .more-menu-button .hamburger-btn .line{
    background:black;
    height:2px;
    position: absolute;
    width:100%;
}

#main_wrapper .page-menu .more-menu-button .hamburger-btn .line:nth-child(1){
    top:0;
    transform:rotate(0);
    transform-origin: 50%;
    transition:150ms top, 150ms transform;
}

#main_wrapper .page-menu .more-menu-button .hamburger-btn .line:nth-child(2){
    top:calc(50% - 1px);
}

#main_wrapper .page-menu .more-menu-button .hamburger-btn .line:nth-child(3){
    bottom:0;
    transform:rotate(0);
    transform-origin: 50%;
    transition:150ms bottom, 150ms transform;
}


#main_wrapper .page-menu.open .more-menu-button .hamburger-btn{
    height:15px;
    transform:rotate(45deg) translateX(-1px);
    width:15px;

}

#main_wrapper .page-menu.open .more-menu-button .hamburger-btn .line:nth-child(1){
    bottom:auto;
    top:50%;
    transform:translateX(1px) translateY(-50%);
}

#main_wrapper .page-menu.open .more-menu-button .hamburger-btn .line:nth-child(2){
    display:none;
}

#main_wrapper .page-menu.open .more-menu-button .hamburger-btn .line:nth-child(3){
    bottom:auto;
    top:50%;
    transform: rotate(90deg) translateX(-1px) translateY(-50%) ;
}

#main_wrapper .page-menu .more-menu{
    flex:1 1 auto;
    justify-content: center;
    pointer-events:none;
}

#main_wrapper .page-menu.open .more-menu{
    pointer-events:auto;
}

#main_wrapper .page-menu .more-menu .pill-btn-2{
    margin-bottom:15px;
    margin-right:10px;
    transform:translateY(-2px);
}

#main_wrapper .page-menu .more-menu .section-button{
    margin-left:30px;
    opacity:0;
    transform:translateY(-30px);
    transition:80ms opacity, 80ms transform;
}

#main_wrapper .page-menu.open .more-menu .section-button{
    margin:7px 30px 25px;
    opacity:1;
    transform:translateY(0px);
}

#main_wrapper .page-menu .more-menu .section-button .text-btn-text{
    padding:0;
}

#main_wrapper .page-menu .more-menu .section-button.selected .text-btn-text{
    color:white;
}

#main_wrapper .page-menu .more-menu .section-button:before{
    border-radius:10px;
    background:#E9E600;
    bottom:-2px;
    height:2px;
}

#main_wrapper .page-menu.open .more-menu .section-button:nth-child(1){
    display:none;
    transition:150ms opacity, 150ms transform;
}

#main_wrapper .page-menu.open .more-menu .section-button:nth-child(2){
    transition:150ms opacity 50ms, 150ms transform 50ms;
}

#main_wrapper .page-menu.open .more-menu .section-button:nth-child(3){
    transition:150ms opacity 100ms, 150ms transform 100ms;
}

#main_wrapper .page-menu.open .more-menu .section-button:nth-child(4){
    transition:150ms opacity 150ms, 150ms transform 150ms;
}

#main_wrapper .page-menu.open .more-menu .section-button:nth-child(5){
    transition:150ms opacity 200ms, 150ms transform 200ms;
}

#main_wrapper .page-menu.open .more-menu .section-button:nth-child(6){
    transition:150ms opacity 250ms, 150ms transform 250ms;
}

#main_wrapper .page-menu.open .more-menu .section-button:nth-child(7){
    transition:150ms opacity 300ms, 150ms transform 300ms;
}

#main_wrapper .page-menu.open .more-menu .section-button:nth-child(8){
    transition:150ms opacity 350ms, 150ms transform 350ms;
}

#main_wrapper .page-menu.open .more-menu .section-button:nth-child(9){
    transition:150ms opacity 400ms, 150ms transform 400ms;
}

#main_wrapper .page-menu.open .more-menu .section-button:nth-child(10){
    transition:150ms opacity 450ms, 150ms transform 450ms;
}

#main_wrapper .page-menu.open .more-menu .section-button:last-child{
    display:none;
    transition:150ms opacity 500ms, 150ms transform 500ms;
}

#main_wrapper .page-menu .shop-button{
    flex:0 0 auto;
    margin:0 15px auto 10px;
    pointer-events:auto;
    position: relative;
}




@media (max-width: 768px){
    /* ============================== 
    SUBNAV
    ============================== */
    .nav-menu-open #main_wrapper .page-menu{
        top:50px;
    }

    #main_wrapper .page-menu .shop-button{
        display:none;
    }

    #main_wrapper .page-menu.open .more-menu .section-button:last-child{
        display:inline-flex;
    }

    .nav-menu-open.closed-banner #main_wrapper.banner-exists .page-menu{
        top:50px;
    }
}


@media (max-width: 500px){

    #main_wrapper .page-menu .shop-button{
        display:inline-flex;
    }

    #main_wrapper .page-menu .more-menu{
        align-items:center;
        display: none;
        flex-direction: column;
    }

    #main_wrapper .page-menu.open .more-menu{
        display: flex;
    }

    #main_wrapper .page-menu.open .more-menu-button,
    #main_wrapper .page-menu.open .shop-button{
        display:none;
    }

    #main_wrapper .page-menu .more-menu-button{
        background:black;
        border:2px solid #E9E600;
        color:#E9E600;
        transform:translateX(-2px);
    }

    #main_wrapper .page-menu .more-menu-button .hamburger-btn .line{
        background:#E9E600;
    }

    #main_wrapper .page-menu .more-menu .section-button{
        width:calc(100% - 60px);
    }

    #main_wrapper .page-menu .shop-button span,
    #main_wrapper .page-menu .more-menu .section-button:last-child span{
        display:none;
    }

    #main_wrapper .page-menu.open .more-menu .section-button:nth-child(1){
        display:inline-flex;
        transition:150ms opacity, 150ms transform;
    }
}



@media (max-width: 450px){
    #main_wrapper .page-menu .more-menu .section-button.text-btn{
        width:auto;
    }
}