/* ==========================================================
   PHONE HEADER ONLY
   DESKTOP IS COMPLETELY UNTOUCHED
   ========================================================== */

#mobile-11s-header {
    display:none;
}


@media screen and (max-width:900px) {

    /*
       Hide only the original top header on phone.
    */

    body > header:first-of-type,
    .site-header,
    header.site-header {
        display:none !important;
    }


    #mobile-11s-header {

        display:block !important;

        width:100% !important;

        position:relative !important;
        z-index:9999 !important;

        background:#020708 !important;

        border-bottom:1px solid #10272d !important;

        box-sizing:border-box !important;

        font-family:inherit !important;
    }


    #mobile-11s-header * {
        box-sizing:border-box !important;
    }


    /* ======================================================
       ROW ONE
       ====================================================== */

    #mobile-11s-header .mobile-11s-top {

        min-height:58px !important;

        display:flex !important;

        align-items:center !important;
        justify-content:space-between !important;

        padding:8px 14px !important;

        gap:12px !important;
    }


    #mobile-11s-header .mobile-11s-brand {

        display:flex !important;

        align-items:center !important;

        min-width:0 !important;

        gap:8px !important;

        color:#ffffff !important;

        text-decoration:none !important;

        font-size:12px !important;

        font-weight:900 !important;

        letter-spacing:.12em !important;

        white-space:nowrap !important;
    }


    #mobile-11s-header .mobile-11s-logo {

        display:block !important;

        width:32px !important;
        height:32px !important;

        min-width:32px !important;
        min-height:32px !important;

        max-width:32px !important;
        max-height:32px !important;

        object-fit:contain !important;

        margin:0 !important;
        padding:0 !important;

        border:0 !important;
    }


    #mobile-11s-header .mobile-11s-cart {

        display:inline-flex !important;

        align-items:center !important;
        justify-content:center !important;

        min-height:36px !important;

        padding:0 13px !important;

        border:1px solid #17343c !important;

        color:#ffffff !important;

        background:#020708 !important;

        text-decoration:none !important;

        font-size:12px !important;

        font-weight:700 !important;

        white-space:nowrap !important;
    }


    /* ======================================================
       ROW TWO
       ====================================================== */

    #mobile-11s-header .mobile-11s-nav {

        display:grid !important;

        grid-template-columns:
            repeat(3,1fr) !important;

        width:100% !important;

        border-top:1px solid #10272d !important;
    }


    #mobile-11s-header .mobile-11s-nav a {

        display:flex !important;

        align-items:center !important;
        justify-content:center !important;

        min-width:0 !important;

        height:44px !important;

        padding:0 4px !important;

        color:#00eaff !important;

        text-decoration:none !important;

        text-align:center !important;

        font-size:11px !important;

        line-height:1 !important;

        font-weight:900 !important;

        letter-spacing:.06em !important;

        white-space:nowrap !important;
    }


    #mobile-11s-header .mobile-11s-nav a + a {

        border-left:1px solid #10272d !important;
    }

}


/* SMALLER PHONES */

@media screen and (max-width:420px) {

    #mobile-11s-header .mobile-11s-top {
        padding-left:10px !important;
        padding-right:10px !important;
    }


    #mobile-11s-header .mobile-11s-logo {

        width:28px !important;
        height:28px !important;

        min-width:28px !important;
        min-height:28px !important;

        max-width:28px !important;
        max-height:28px !important;
    }


    #mobile-11s-header .mobile-11s-brand {

        font-size:10px !important;
    }


    #mobile-11s-header .mobile-11s-nav a {

        font-size:10px !important;
    }

}