/* ==========================
   SpyX Header
========================== */
/* Where To Buy button */

.spyx-menu .menu-where-to-buy > a{
    height:48px;
    padding:0 22px;
    margin-left:12px;

    background:#e31b23;
    border:2px solid #e31b23;
    border-radius:8px;

    color:#fff;

    transition:.3s ease;
}

.spyx-menu .menu-where-to-buy > a::after{
    display:none;
}

.spyx-menu .menu-where-to-buy > a:hover{
    background:transparent;
    color:#fff;
}
.spyx-header{

    position:absolute;
    top:0;
    left:0;

    width:100%;
    height:auto;

    background:#050505;

    z-index:1000;

    border-bottom:1px solid rgba(255,255,255,.02);

}

.spyx-container {
    max-width: 1400px;
    width: 100%;
    margin: 0 auto;
    padding: 0 24px;
}

.spyx-header .spyx-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.spyx-logo{

    width:180px;

    flex-shrink:0;

}

.spyx-logo img{

    width:130px;

    height:auto;

    display:block;

}

.spyx-navigation{

    flex:1;

    display:flex;

    justify-content:center;

    align-items:center;

}

.spyx-menu{

    list-style:none;

    display:flex;

    align-items:center;

    gap:48px;

    margin:0;

    padding:0;

}

.spyx-menu li{

    margin:0;

}

.spyx-menu a{
    position:relative;

    display:flex;
    align-items:center;
    justify-content:center;

    height:86px;

    padding:0;

    color:#f2f2f2;

    font-family:'Oswald',sans-serif;
    font-size:18px;
    font-weight:500;

    letter-spacing:.3px;
    text-transform:uppercase;
    text-decoration:none;

    transition:.25s ease;
}
.spyx-menu a:hover{

    color:#e31b23;

}

.spyx-menu a::after{

    content:"";

    position:absolute;

    left:0;

    bottom:14px;

    width:0;

    height:2px;

    background:#e31b23;

    transition:width .25s ease;

}

.spyx-menu a:hover::after{

    width:100%;

}

.spyx-menu .current-menu-item > a,
.spyx-menu .current_page_item > a{

    color:#e31b23;

}

.spyx-menu .current-menu-item > a::after,
.spyx-menu .current_page_item > a::after{

    width:100%;

}

.spyx-mobile-toggle{

    display:none;

    width:42px;
    height:42px;

    background:none;
    border:none;

    padding:0;

    cursor:pointer;

    margin-left:auto;

}

.spyx-mobile-toggle span{

    display:block;

    width:26px;

    height:2px;

    margin:6px auto;

    background:#fff;

    transition:.3s;

}
.spyx-menu-overlay{

    position:fixed;

    inset:0;

    background:rgba(0,0,0,.65);

    opacity:0;

    visibility:hidden;

    transition:.3s;

    z-index:9998;

}
.spyx-header .spyx-container{
    min-height:90px;
}
.spyx-menu-overlay.active{

    opacity:1;

    visibility:visible;

}

@media (max-width:991px){

    .spyx-header{

        height:90px;

    }

    .spyx-container{

        height:auto;

        padding:0 20px;

    }

    .spyx-logo{

        width:auto;

    }

    .spyx-logo img{

        width:135px;

    }

    .spyx-navigation{

        display:none;

    }

    .spyx-mobile-toggle{

        display:block;

    }

}

/* ==========================
   Mobile Off Canvas Menu
========================== */

@media (max-width:991px){

    .spyx-navigation{

        position:fixed;

        top:0;

        right:-100%;

        width:300px;

        max-width:85%;

        height:100vh;

        background:#050505;

        z-index:9999;

        transition:right .35s ease;

        display:flex;

        justify-content:flex-start;

        align-items:flex-start;

        padding-top:90px;

        box-shadow:-10px 0 30px rgba(0,0,0,.45);

    }

    .spyx-navigation.active{

        right:0;

    }

    .spyx-menu{

        width:100%;

        display:flex;

        flex-direction:column;

        gap:0;

        margin:0;

        padding:0;

    }

    .spyx-menu li{

        width:100%;

        list-style:none;

    }

    .spyx-menu a{

        display:block;

        width:100%;

        padding:18px 30px;

        color:#fff;

        font-size:18px;

        text-transform:uppercase;

        border-bottom:1px solid rgba(255,255,255,.08);

    }

    .spyx-menu a::after{

        display:none;

    }

    .spyx-mobile-toggle{

        display:flex;

        flex-direction:column;

        justify-content:center;

        align-items:center;

        width:46px;

        height:46px;

        margin-left:auto;

        background:transparent !important;

        border:none !important;

        box-shadow:none !important;

        cursor:pointer;

        z-index:10001;

    }

    .spyx-mobile-toggle span{

        width:26px;

        height:2px;

        margin:4px 0;

        background:#fff;

        transition:.3s;

    }

    .spyx-mobile-toggle.active span:nth-child(1){

        transform:translateY(6px) rotate(45deg);

    }

    .spyx-mobile-toggle.active span:nth-child(2){

        opacity:0;

    }

    .spyx-mobile-toggle.active span:nth-child(3){

        transform:translateY(-6px) rotate(-45deg);

    }

}
@media (max-width:991px){

    .spyx-menu .menu-where-to-buy{
        padding:20px 30px;
    }
        .spyx-menu .menu-where-to-buy{
        display:none;
    }


    .spyx-menu .menu-where-to-buy > a{
        display:flex;
        justify-content:center;
        align-items:center;

        height:52px;
        padding:0;

        background:#e31b23;
        border:2px solid #e31b23;
        border-radius:8px;

        color:#fff;

        text-align:center;

        border-bottom:none;
    }

    .spyx-menu .menu-where-to-buy > a:hover{
        background:transparent;
        color:#fff;
    }
}

/*==================================
Mobile Header Actions
==================================*/

.spyx-mobile-actions{
    display:none;
}

.spyx-mobile-buy-btn{
    display:none;
}

@media (max-width:991px){

    .spyx-mobile-actions{
        display:flex;
        align-items:center;
        gap:12px;
        margin-left:auto;
    }

    .spyx-mobile-buy-btn{
        display:inline-flex;
        align-items:center;
        justify-content:center;

        height:46px;
        padding:0 18px;

        border:2px solid #e31b23;
        border-radius:8px;

        background:#e31b23;

        color:#fff;
        text-decoration:none;

        font-family:'Oswald',sans-serif;
        font-size:14px;
        font-weight:500;
        text-transform:uppercase;
        letter-spacing:.4px;

        transition:.3s ease;
    }

    .spyx-mobile-buy-btn:hover{
        background:transparent;
        color:#fff;
    }

    .spyx-mobile-toggle{
        margin-left:0;
    }

}