@font-face {
    font-family: 'ESAllianz';
    src: url('/wp-content/themes/flatsome-child/assets/fonts/ESAllianz-Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'ESAllianz';
    src: url('/wp-content/themes/flatsome-child/assets/fonts/ESAllianz-Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'MinionPro';
    src: url('/wp-content/themes/flatsome-child/assets/fonts/MinionPro-Regular.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

.theme-mode-toggle {
    display: none !important;
}

.home .theme-mode-toggle {
    display: block !important;
}

/* TEMPORARY LOGO */
.home-socceroos-logo {
    text-align: center !important;
    margin: 0 0 15px !important;
}

.home-socceroos-logo img {
    width: 135px !important;
    max-width: 135px !important;
    height: auto;
    margin: 0 auto !important;
}

.stuck .header_logo{
    display: none;
}

.home-dark-mode .stuck .header_logo{
    display: block !important;
}

.stuck .header-logo-dark{
    display: block !important;
}


/*footer css*//*
.is-divider{
    display: none !important;
}

.menu-footer-menu-container ul.menu>li+li, .menu-customer-care-container ul.menu>li+li{ border-top: 0px solid !important; }
    
.footer-widgets .menu-item>a {
    padding:0px !important;
    color: #000000 !important;
}
.footer-widgets .widget-title, .footer-widgets .textwidget p{
    color: #000000 !important;
    margin-bottom: 0;
}
.home-dark-mode .dark .home-dark-mode .widget a, .home-dark-mode .dark a, .home-dark-mode .widget-title{
    color: #ffffff !important;
}

.dark p{
    margin-right: 20px;
}

.copyright,.footer-widgets #media_image-2{
    position: relative; 
    margin:0px;
}

.copyright .textwidget,#media_image-2 .image {
    position: absolute;
    right: 2px;
    bottom: 30px;
    line-height: 1.2;
    white-space: nowrap;
}

.footer-widgets .menu {
    margin-top: 12px !important;
}*/

#media_image-2 .image{
    bottom:0px !important;
}

.header-toggle {
    display: flex;
    align-items: center;
    gap: 18px;
}

.header-toggle .toggle-btn {
    border: 0 !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    color: #000000  !important;
    padding: 0 15px !important;
    border-radius: 20px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 34px !important;
    cursor: pointer;
    margin: 0 !important;
}

/* Selected button */
.header-toggle .toggle-btn.active {
    background: #EB3130 !important;
    color: #fff !important;
}

/* Hover */
.header-toggle .toggle-btn:hover {
    background: #EB3130 !important;
    color: #fff !important;
}

.header-catalogue {
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    text-decoration: none;
}

.header-catalogue:hover {
    color: #fff;
}

.home-dark-mode #dark-mode-toggle{
    color: #ffffff !important;
}

.flickity-page-dots{
    text-align: left !important;
    bottom: 15% !important;
    left: 18% !important;
}

/* =========================================
   Products / Formats Toggle
   ========================================= */

.header-toggle {
    display: flex;
    align-items: center;
    gap: 8px;
}

.header-toggle .toggle-btn.active {
    background: #f5292f;
    border-radius: 25px;
}

.header-toggle .toggle-btn:hover {
    opacity: 0.9;
}

.html_nav_position_text{ display: none !important;}

 .socceroos-red-box {
        position: absolute !important;

        left: 18% !important;
        top: 50% !important;
        right: auto !important;
        bottom: auto !important;

        transform: translateY(-50%) !important;

        width: 48% !important;
        max-width: 550px !important;
        min-height: 560px !important;

        box-sizing: border-box !important;

        padding: 60px !important;

        background: rgba(235, 49, 48, 0.90) !important;
        border-radius: 24px !important;

        z-index: 50 !important;
    }


    /* MAIN HEADING */
    .socceroos-red-box .banner-lt-text {
        font-family: "ES Allianz", Arial, sans-serif !important;

        font-size: 60px !important;
        font-weight: 700 !important;
        line-height: 1.35 !important;

        color: #fff !important;

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

        text-transform: uppercase !important;
    }


    /* ORDER NOW */
    .socceroos-red-box .order-now {
        font-family: "Lato", Arial, sans-serif !important;

        font-size: 35px !important;
        font-weight: 300 !important;
        line-height: 1.2 !important;

        color: #fff !important;

        margin: 30px 0 35px !important;
        padding: 0 !important;
    }


    /* BUY NOW */
    .socceroos-red-box .button {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        margin: 0 !important;
        padding: 8px 22px !important;

        min-height: 40px !important;

        font-size: 16px !important;
        line-height: 1 !important;

        color: #fff !important;
        background: transparent !important;

        border: 1px solid #fff !important;
        border-radius: 24px !important;

        box-shadow: none !important;
    }


    /* SLIDE LOGOS */
    .socceroos-banner .rt-icon-img {
        display: block !important;

        width: 250px !important;
        max-width: 100% !important;
        height: auto !important;

        margin: 0 0 20px auto !important;
    }
.rt-icon-img{
    width: 250px;
    display:block;
    margin-left: auto;
    margin-right: 0;
    margin-bottom: 20px;
}

img.rt-icon-img.brownTrout-logo ,img.rt-icon-img.bluey-logo{
    width: 100px;
}
img.rt-icon-img.socceroos-logo{margin-bottom:0px !important;}

.slider-title h2 {
    font-family: 'ESAllianz', sans-serif !important;
    font-weight: 700 !important;
    font-size: 30px  !important;
    line-height: 1.15  !important;
    margin: 0  !important;
}

.header-wrapper{
    background:#ffffff !important;
}
.header-nav-main.nav > li > a{
    color: #000000 !important;
    font-weight: 700 !important;
    font-size: 12px;
    
}
.nav>li.html{font-size: 12px !important;}
.nav-dark .cart-icon strong:after {
    border-color: var(--fs-color-primary) !important;
}
.nav-dark .cart-icon strong {
    border-color: var(--fs-color-primary) !important;
    color: var(--fs-color-primary) !important;
}


.header-toggle .toggle-btn,
.header-toggle a {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

.html_topbar_left {
    display: flex !important;
    align-items: center;
}

a.stockist{
    color: #000000 !important;
    font-weight: 700;
}

/*dark mode*/
.home-dark-mode a.stockist{
 color: #ffff !important;
}
.home-dark-mode .header-wrapper, .home-dark-mode .stuck .header-main{
    background:#000000 !important;
}
.home-dark-mode .header-nav-main.nav > li > a{
    color: #ffffff !important;
}
.home-dark-mode .header-toggle .toggle-btn{
    color:#ffffff !important;
}

.home-dark-mode .nav-dark .header-logo{ display: block !important; }

#custom_html-2 #menu-social-media li a {
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    overflow: hidden !important;
    /* Hides Facebook / Instagram text */
    font-size: 0 !important;
    line-height: 22px !important;
    margin-top: 12px;
}


/* Keep icon visible */
#custom_html-2 #menu-social-media li a:before {
    display: block !important;
    line-height: 22px !important;
}
/* ===============================
   HOME PAGE DARK/LIGHT MODE TOGGLE
   =============================== */
   
.theme-mode-toggle {
    display: flex;
    align-items: center;
}

#dark-mode-toggle {
    width: 45px;
    height: 45px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    position: relative;
    font-size: 26px;
    color: #000000;
}

#dark-mode-toggle span {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.25s ease;
}

#dark-mode-toggle .mode-sun {
    opacity: 1;
}

#dark-mode-toggle .mode-moon {
    opacity: 0;
}

body:not(.home) .header-logo-dark {
    display: block !important;
}
body:not(.home) .header-logo {
    display: none !important;
}


/* DARK MODE */
body.home.home-dark-mode {
    background: #000000 !important;
    color: #fff !important;
}

body.home.home-dark-mode #main {
    background: #000000 !important;
}

body.home.home-dark-mode #dark-mode-toggle .mode-sun {
    opacity: 0;
}

body.home.home-dark-mode #dark-mode-toggle .mode-moon {
    opacity: 1;
}

body.home.home-dark-mode h1,
body.home.home-dark-mode h2,
body.home.home-dark-mode h3,
body.home.home-dark-mode h4,
body.home.home-dark-mode h5,
body.home.home-dark-mode h6,
body.home.home-dark-mode p {
    color: #fff !important;
}

body.home.home-dark-mode .header-logo-dark{
    display:none !important;
}

/*#footer.footer-wrapper {
    position: relative !important;
    width: 100% !important;
    overflow: visible !important;
}*/

.no-bottom-padding {
    padding-bottom: 0 !important;
}

.our-story a{
    color: #2ea3f2;
}

/* LIGHT FOOTER */
/*
#footer .footer-widgets.footer.footer-2 {
    position: relative !important;

    width: 100% !important;

    margin: 0 !important;
    padding-top: 45px !important;

    background: #ffffff !important;
    color: #000000 !important;

    overflow: visible !important;
}*/


/* =========================================================
   FULL SCREEN WIDTH FOOTER WAVE
   ========================================================= *//*

#footer .footer-widgets.footer.footer-2::before {
    content: "" !important;

    display: block !important;

    position: absolute !important;

    width: 100vw !important;
    max-width: none !important;
    min-width: 100vw !important;

    height: 35px !important;

    top: -34px !important;

    left: 50% !important;
    right: auto !important;

    transform: translateX(-50%) !important;

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

    /*
     * Prevent Flatsome column sizing
     *//*
    flex: none !important;
    flex-basis: auto !important;

    background-color: transparent !important;

    background-image:
        url("../images/BTAUS_HomePage-2026_Wave Footer_White.svg") !important;

    background-repeat: no-repeat !important;

    /*background-position:*/
    /*    center bottom !important;*//*

    background-size: 100% !important;

    z-index: 999 !important;

    pointer-events: none !important;
}


/* =========================================================
   DARK MODE
   ========================================================= *//*

body.home.home-dark-mode
#footer .footer-widgets.footer.footer-2 {
    background: #000000 !important;
    color: #ffffff !important;
}


body.home.home-dark-mode
#footer .footer-widgets.footer.footer-2::before {
    background-image:
        url("../images/BTAUS_HomePage-2026_Wave Footer_Black.svg") !important;
}


/* =========================================================
   MAKE SURE NOTHING CLIPS WAVE
   ========================================================= *//*

#footer,
#footer.footer-wrapper,
#footer .footer-widgets,
#footer .footer-widgets.footer.footer-2 {
    overflow: visible !important;
}
/* =========================================================
   FOOTER CONTENT
   ========================================================= *//*

#footer .footer-widgets.footer.footer-2 > .row {
    position: relative !important;
    z-index: 2 !important;
}


.mobile-search-icon{display: none !important;}

/* ========================================
   SOCCEROOS SLIDER - MOBILE
======================================== */
@media (max-width: 849px) {
  .html_nav_position_text{
    display: block !important;
}  
#main-menu .header-toggle .stockist.stockist-mob{display: none !important; }
#main-menu .nav-sidebar > li > a.desktop-search-icon{display: none !important; }

    /* Give mobile banner more vertical room */
    
    /* Banner */
    .banner-lt-desktop {
        width: 100%;
        height: auto;
        padding: 30px 25px;
        border-radius: 18px;
    }

    /* Banner Main Text */
    .banner-lt-text {
        font-size: 30px;
        line-height: 1.2;
    }

    /* Order Now */
    .banner .order-now {
        font-size: 18px;
        line-height: 1.2;
        margin: 20px 0 15px 0;
    }

    /* Button */
    .banner .button {
        font-size: 14px;
        padding: 2px 18px;
        border-radius: 20px;
    }

    /* Right Icon / Image */
    .rt-icon-img {
        width: 160px;
        margin-left: auto;
        margin-right: 0;
    }

    /* Slider Title */
    .slider-title h2 {
        font-size: 18px !important;
        line-height: 1.15 !important;
        margin: 0 !important;
    }
    
    .socceroos-banner {
        min-height: 650px !important;
    }

    /* RED CONTENT BOX */
    /*.socceroos-banner .socceroos-red-box {*/
    /*    width: 82% !important;*/

    /*    left: 50% !important;*/
    /*    right: auto !important;*/

    /*    top: 45% !important;*/
    /*    bottom: auto !important;*/

    /*    transform: translate(-50%, -50%) !important;*/
    /*}*/

    /* SOCCEROOS LOGO + KICK OFF TEXT */
    /*.socceroos-banner .socceroos-caption {*/
    /*    width: 90% !important;*/
    /*    left: 50% !important;*/
    /*    right: auto !important;*/
    /*    top: 82% !important;*/
    /*    bottom: auto !important;*/
    /*    transform: translate(-50%, -50%) !important;*/
    /*    text-align: center !important;*/
    /*}*/
    
  
   .socceroos-red-box {
        position: absolute !important;

        /* RESET DESKTOP POSITION */
        left: 50% !important;
        right: auto !important;

        top: 15% !important;
        bottom: auto !important;

        transform: translateX(-50%) !important;

        /* BOX SIZE */
        width: 78% !important;
        max-width: 480px !important;

        /* VERY IMPORTANT - RESET DESKTOP HEIGHT */
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        box-sizing: border-box !important;

        padding: 30px 32px 28px !important;

        margin: 0 !important;

        background: rgba(235, 49, 48, 0.90) !important;

        border-radius: 20px !important;

        z-index: 50 !important;

        display: block !important;
    }


    /* INNER WRAPPER */
    .socceroos-red-box .banner-lt-desktop {
        display: block !important;

        width: 100% !important;
        height: auto !important;

        margin: 0 !important;
        /*padding: 0 !important;*/

        text-align: left !important;
    }


    /* =====================================================
       CALENDARS / DIARIES / PLANNERS / DESKPADS
       ===================================================== */

    .socceroos-red-box .banner-lt-text {
        font-family: "ES Allianz", Arial, sans-serif !important;

        font-size: clamp(24px, 6.5vw, 36px) !important;
        font-weight: 700 !important;

        line-height: 1.25 !important;

        color: #fff !important;

        margin: 0 0 22px !important;
        padding: 0 !important;

        text-transform: uppercase !important;
        text-align: left !important;
    }


    /* =====================================================
       ORDER NOW
       ===================================================== */

    .socceroos-red-box .order-now {
        font-family: "Lato", Arial, sans-serif !important;

        font-size: clamp(15px, 4vw, 21px) !important;
        font-weight: 400 !important;

        line-height: 1.2 !important;

        color: #fff !important;

        margin: 0 0 20px !important;
        padding: 0 !important;

        text-align: left !important;

        white-space: nowrap !important;
    }


    /* =====================================================
       BUY NOW
       ===================================================== */

    .socceroos-red-box .button,
    .socceroos-red-box .buy-now-popup {
        display: inline-flex !important;

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

        width: auto !important;
        min-width: 65px !important;

        height: 27px !important;
        min-height: 27px !important;

        margin: 0 !important;
        padding: 0 13px !important;

        font-size: 9px !important;
        font-weight: 700 !important;
        line-height: 1 !important;

        color: #fff !important;
        background: transparent !important;

        border: 1px solid #fff !important;
        border-radius: 20px !important;

        box-shadow: none !important;

        text-transform: uppercase !important;
    }


    /* =====================================================
       SLIDE-SPECIFIC LOGO + TEXT BELOW RED BOX
       ===================================================== */

    .socceroos-banner .socceroos-caption {
        position: absolute !important;

        left: auto !important;
        right: 22px !important;

        top: auto !important;
        bottom: 25px !important;

        transform: none !important;

        width: 55% !important;
        max-width: 230px !important;

        text-align: right !important;

        z-index: 20 !important;
    }


    /* LOGO */
    .socceroos-banner .socceroos-caption .rt-icon-img {
        display: block !important;

        width: auto !important;
        max-width: 125px !important;
        max-height: 60px !important;

        height: auto !important;

        margin: 0 0 10px auto !important;

        object-fit: contain !important;
    }


    /* PROMOTIONAL TEXT */
    .socceroos-banner .socceroos-caption h2 {
        margin: 0 !important;
        padding: 0 !important;

        color: #fff !important;

        font-size: clamp(17px, 4.8vw, 24px) !important;
        font-weight: 700 !important;

        line-height: 1.18 !important;

        text-align: right !important;
    }


    /* Remove empty paragraph below logo */
    .socceroos-banner .socceroos-caption p:empty {
        display: none !important;
    }


.footer-widgets.footer.footer-2::before{
    top:-19px !important;
}

    #footer .footer-widgets.footer.footer-2 {
        padding: 0 !important;
    }

    .footer-widgets.footer-2 > .row {
        display: grid !important;

        grid-template-columns: 1fr 1fr !important;

        grid-template-areas:
            "info customer"
            "about connect"
            "line logo";

        grid-template-rows:
            auto
            auto
            120px;

        column-gap: 48px !important;
        row-gap: 28px !important;
        min-height: 340px !important;
        padding: 28px 32px 0 !important;
        margin: 0 auto !important;
    }


    /* Reset Flatsome columns */
    .footer-widgets.footer-2 > .row > .col {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        flex-basis: auto !important;
        padding: 0 !important;
        margin: 0 !important;
    }


    /* =========================
       GRID POSITIONS
    ========================= */

    #nav_menu-2 {
        grid-area: info;
    }

    #nav_menu-4 {
        grid-area: customer;
    }

    #nav_menu-3 {
        grid-area: about;
    }

    #custom_html-2 {
        grid-area: connect;
    }

    #media_image-2 {
        grid-area: logo;
    }


    /* =========================
       TITLES
    ========================= */

    .footer-widgets.footer-2 .widget-title {
        display: block !important;
        /*color: #fff !important;*/
        font-size: 12px !important;
        line-height: 1.2 !important;
        font-weight: 400 !important;
        text-transform: uppercase !important;
        margin: 0 0 14px !important;
        padding: 0 !important;
    }


    /* Hide divider */
    .footer-widgets.footer-2 .is-divider {
        display: none !important;
    }


    /* =========================
       MENU LINKS
    ========================= */

    .footer-widgets.footer-2 ul.menu {
        margin: 0 !important;
        padding: 0 !important;
    }

    .footer-widgets.footer-2 ul.menu > li {
        border: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .footer-widgets.footer-2 ul.menu > li > a {
        display: block !important;
        /*color: #fff !important;*/
        font-size: 11px !important;
        line-height: 1.35 !important;
        font-weight: 400 !important;
        padding: 0 !important;
        margin: 0 !important;
    }


    /* =========================
       CONNECT
    ========================= */

    #custom_html-2 .menu-social-media-area {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        left: auto !important;
        right: auto !important;
        padding: 0 !important;
        margin: 0 !important;
    }


    #custom_html-2 #menu-social-media {
        display: flex !important;
        align-items: center !important;
        gap: 12px !important;
        margin: 10px 0 0 !important;
        padding: 0 !important;
        list-style: none !important;
    }


    #custom_html-2 #menu-social-media li {
        margin: 0 !important;
        padding: 0 !important;
    }


    /* Social icons only */
    #custom_html-2 #menu-social-media li a {
        display: block !important;
        width: 22px !important;
        height: 22px !important;
        overflow: hidden !important;
        margin:0;
        font-size: 0 !important;
        line-height: 22px !important;
    }


    #custom_html-2 #menu-social-media li a:before {
        color: #fff !important;
        font-size: 20px !important;
        line-height: 22px !important;
    }


    /* =========================
       HIDE COPYRIGHT TEXT
    ========================= */

    #text-7 {
        grid-area: line;
        position: relative !important;
        align-self: end !important;
        min-height: 30px !important;
        padding: 0 0 26px !important;
    }


     #text-7 .textwidget {
        display: block !important;
    }

    #text-7 .textwidget p {
        display: block !important;
        margin: 0 !important;
        /*color: #fff !important;*/
        font-size: 10px !important;
        line-height: 1.3 !important;
        white-space: nowrap !important;
    }

    /* =========================
       BROWN TROUT LOGO
    ========================= */

    #media_image-2 {
        justify-self: end !important;
        align-self: end !important;
        width: 86px !important;
        max-width: 86px !important;
        padding: 0 !important;
        margin: 0 !important;
    }


    #media_image-2 img {
        display: block !important;
        width: 86px !important;
        max-width: 86px !important;
        height: auto !important;
        margin: 0 !important;
    }
    
    
     /* =====================================================
       1. HEADER STRUCTURE
    ===================================================== */

    #header,
    #header .header-wrapper,
    #header #masthead,
    #header .header-main {
        background: #ffffff !important;
    }

    #header #masthead,
    #header .header-inner {
        height: 68px !important;
        min-height: 68px !important;
    }

    #header .header-inner {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        padding: 0 18px !important;
        margin: 0 auto !important;

        overflow: visible !important;
    }

    /* Desktop header sections */
    #header .hide-for-medium {
        display: none !important;
    }


    /* =====================================================
       2. HAMBURGER - LEFT
    ===================================================== */

    #header .show-for-medium.flex-left {
        display: flex !important;

        position: absolute !important;
        left: 18px !important;
        right: auto !important;
        top: 50% !important;

        transform: translateY(-50%) !important;

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

        z-index: 30 !important;
    }

    #header .show-for-medium.flex-left .mobile-nav {
        display: flex !important;
        align-items: center !important;

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

    #header .mobile-nav .nav-icon {
        display: block !important;

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

    #header .mobile-nav .nav-icon > a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 34px !important;
        height: 34px !important;

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

    #header .icon-menu {
        font-size: 25px !important;
        color: #000000 !important;
    }


    /* =====================================================
       3. CENTER LOGO
    ===================================================== */
  
    #header #logo {
        display: flex !important;
        position: absolute !important;

        left: 50% !important;
        top: 50% !important;

        transform: translate(-50%, -50%) !important;

        width: 90px !important;
        height: 58px !important;

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

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

        z-index: 50 !important;
    }

    #header #logo > a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 90px !important;
        height: 58px !important;

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

        line-height: 0 !important;
    }


    /* =========================================
       RESET BOTH LOGOS
    ========================================= */

    #header #logo .header-logo,
    #header #logo .header-logo-dark {
        position: static !important;

        width: 82px !important;
        max-width: 82px !important;

        height: auto !important;
        max-height: 50px !important;

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

        transform: none !important;

        visibility: visible !important;
        opacity: 1 !important;

        object-fit: contain !important;
    }


    /* =========================================
       LIGHT MODE
       SHOW NORMAL LOGO
    ========================================= */

    /*body:not(.home-dark-mode) #header #logo .header-logo {*/
    /*    display: block !important;*/
    /*}*/

    /*body:not(.home-dark-mode) #header #logo .header-logo-dark {*/
    /*    display: none !important;*/
    /*}*/


    /* =========================================
       DARK MODE
       SHOW DARK LOGO
    ========================================= */

    /*body.home-dark-mode #header #logo .header-logo {*/
    /*    display: none !important;*/
    /*}*/

    /*body.home-dark-mode #header #logo .header-logo-dark {*/
    /*    display: block !important;*/
    /*}*/

    /* =========================================
       LIGHT MODE
       SHOW FIRST / NORMAL LOGO
    ========================================= */

    body:not(.home-dark-mode)
    #header #logo img.header_logo.header-logo {
        /*display: block !important;*/
        visibility: visible !important;
        opacity: 1 !important;
    }

    /*body:not(.home-dark-mode)*/
    /*#header #logo img.header-logo-dark {*/
    /*    display: none !important;*/
    /*}*/


    /* =========================================
       DARK MODE
       SHOW SECOND LOGO
    ========================================= */

    /*body.home-dark-mode*/
    /*#header #logo img.header_logo.header-logo {*/
    /*    display: none !important;*/
    /*}*/

    body.home-dark-mode
    #header #logo img.header-logo-dark {
        /*display: block !important;*/
        visibility: visible !important;
        opacity: 1 !important;
    }


    /* =====================================================
       6. CART - RIGHT
    ===================================================== */

    #header .show-for-medium.flex-right {
        display: flex !important;

        position: absolute !important;

        right: 18px !important;
        left: auto !important;
        top: 50% !important;

        transform: translateY(-50%) !important;

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

        z-index: 30 !important;
    }

    #header .show-for-medium.flex-right .mobile-nav {
        display: flex !important;
        align-items: center !important;

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

    #header .show-for-medium .cart-item {
        display: block !important;

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

    #header .show-for-medium .cart-item > a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

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

        color: #000000 !important;
    }

    /* Cart icon only */
    #header .show-for-medium .header-cart-title {
        display: none !important;
    }


    /* =====================================================
       7. LIGHT HEADER
    ===================================================== */

    body:not(.home-dark-mode) #header,
    body:not(.home-dark-mode) #header .header-wrapper,
    body:not(.home-dark-mode) #header #masthead,
    body:not(.home-dark-mode) #header .header-main {
        background: #ffffff !important;
    }

    body:not(.home-dark-mode) #header .icon-menu,
    body:not(.home-dark-mode) #header .cart-item a,
    body:not(.home-dark-mode) #header .cart-icon,
    body:not(.home-dark-mode) #header .cart-icon strong {
        color: #000000 !important;
    }

    body:not(.home-dark-mode) #header .cart-icon strong,
    body:not(.home-dark-mode) #header .cart-icon strong:after {
        border-color: #000000 !important;
    }


    /* =====================================================
       8. DARK HEADER
    ===================================================== */

    body.home-dark-mode #header,
    body.home-dark-mode #header .header-wrapper,
    body.home-dark-mode #header #masthead,
    body.home-dark-mode #header .header-main {
        background: #000000 !important;
    }

    body.home-dark-mode #header .icon-menu,
    body.home-dark-mode #header .cart-item a,
    body.home-dark-mode #header .cart-icon,
    body.home-dark-mode #header .cart-icon strong {
        color: #ffffff !important;
    }

    body.home-dark-mode #header .cart-icon strong,
    body.home-dark-mode #header .cart-icon strong:after {
        border-color: #ffffff !important;
    }


    /* =====================================================
       9. HEADER CLEANUP
    ===================================================== */

    #header .top-divider {
        display: none !important;
    }

    #header .header-main {
        border: 0 !important;
        box-shadow: none !important;
    }


    /* =====================================================
       10. OFF-CANVAS OVERLAY
    ===================================================== */

    .mfp-bg {
        background: #000000 !important;
        opacity: .45 !important;
    }

    #main-menu {
        background: transparent !important;
    }


    /* =====================================================
       11. MOBILE MENU PANEL
    ===================================================== */

    #main-menu .mobile-sidebar,
    #main-menu .sidebar-menu {
        width: 82vw !important;
        max-width: 320px !important;

        min-height: 100vh !important;

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

        opacity: 1 !important;
    }


    /* =====================================================
       12. LIGHT MOBILE MENU
    ===================================================== */

    body:not(.home-dark-mode) #main-menu .mobile-sidebar,
    body:not(.home-dark-mode) #main-menu .sidebar-menu,
    body:not(.home-dark-mode) #main-menu .nav-sidebar {
        background: #ffffff !important;
        color: #000000 !important;
    }


    /* =====================================================
       13. DARK MOBILE MENU
    ===================================================== */

    body.home-dark-mode #main-menu .mobile-sidebar,
    body.home-dark-mode #main-menu .sidebar-menu,
    body.home-dark-mode #main-menu .nav-sidebar {
        background: #000000 !important;
        color: #ffffff !important;
    }


    /* =====================================================
       14. SUN / MOON BUTTON
    ===================================================== */

    body.home #main-menu .theme-mode-toggle {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        padding: 24px 28px 14px !important;
        margin: 0 !important;
    }
    
    #main-menu .theme-mode-toggle{display: none !important;}

    #main-menu #dark-mode-toggle {
        position: relative !important;

        display: block !important;

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

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

        background: transparent !important;

        border: 0 !important;
        box-shadow: none !important;

        cursor: pointer !important;
    }

    #main-menu #dark-mode-toggle span {
        position: absolute !important;

        inset: 0 !important;

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

        font-size: 22px !important;
    }


    /* LIGHT = SUN */

    body:not(.home-dark-mode) #dark-mode-toggle {
        color: #000000 !important;
    }

    body:not(.home-dark-mode)
    #dark-mode-toggle .mode-sun {
        opacity: 1 !important;
    }

    body:not(.home-dark-mode)
    #dark-mode-toggle .mode-moon {
        opacity: 0 !important;
    }


    /* DARK = MOON */

    body.home-dark-mode #dark-mode-toggle {
        color: #ffffff !important;
    }

    body.home-dark-mode
    #dark-mode-toggle .mode-sun {
        opacity: 0 !important;
    }

    body.home-dark-mode
    #dark-mode-toggle .mode-moon {
        opacity: 1 !important;
    }


    /* =====================================================
       15. PRODUCTS / FORMATS / STOCKIST
    ===================================================== */

    #main-menu .header-toggle {
        display: flex !important;

        flex-direction: column !important;

        align-items: flex-start !important;
        justify-content: flex-start !important;

        width: 100% !important;

        padding: 0px 0px 10px 0px !important;
        margin: 0 !important;

        gap: 0 !important;
    }


    /* PRODUCTS / FORMATS */
    #main-menu .header-toggle .products-btn{ margin:14px 0 7px 0 !important; }
    #main-menu .header-toggle .toggle-btn {
        display: inline-flex !important;

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

        width: auto !important;
        min-width: 0 !important;
        min-height: auto !important;

        padding: 9px 15px !important;

        background: transparent !important;

        color: #000000 !important;

        border: 0 !important;
        border-radius: 25px !important;

        box-shadow: none !important;

        font-size: 11px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;

        cursor: pointer !important;
    }


    /* ACTIVE = SAME AS DESKTOP */

    #main-menu .header-toggle .toggle-btn.active,
    #main-menu .header-toggle .toggle-btn:hover {
        background: #EB3130 !important;
        color: #ffffff !important;

        border-radius: 25px !important;
    }


    /* DARK INACTIVE BUTTON */

    body.home-dark-mode
    #main-menu .header-toggle .toggle-btn {
        color: #ffffff !important;
    }

    /* Keep active red */
    body.home-dark-mode
    #main-menu .header-toggle .toggle-btn.active,
    body.home-dark-mode
    #main-menu .header-toggle .toggle-btn:hover {
        background: #EB3130 !important;
        color: #ffffff !important;
    }


    /* =====================================================
       16. BECOME A STOCKIST
    ===================================================== */

    #main-menu .header-toggle .stockist {
        display: flex !important;
        align-items: center !important;

        width: 100% !important;
        min-height: 46px !important;

        padding: 13px 0 !important;
        margin: 0 !important;

        background: transparent !important;

        color: #000000 !important;

        border: 0 !important;
        border-bottom: none !important;

        font-size: 11px !important;
        font-weight: 700 !important;

        text-decoration: none !important;
    }
     

    /* =====================================================
       17. NORMAL MOBILE MENU
    ===================================================== */

    #main-menu .nav-sidebar {
        padding: 0 28px 30px !important;
        margin: 0 !important;
    }

    #main-menu .nav-sidebar > li {
        width: 100% !important;

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

        border-bottom: 1px solid #e6e6e6 !important;
    }

    #main-menu .nav-sidebar > li > a {
        display: flex !important;

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

        width: 100% !important;
        min-height: 50px !important;

        padding: 13px 0 !important;
        margin: 0 !important;

        color: #000000 !important;

        font-size: 11px !important;
        font-weight: 700 !important;
    }


    /* =====================================================
       18. CATALOGUE
    ===================================================== */

    #main-menu .header-catalogue {
        display: flex !important;
        align-items: center !important;

        width: 100% !important;
        min-height: 50px !important;

        padding: 13px 0 !important;

        color: #000000 !important;

        font-size: 11px !important;

        text-decoration: none !important;
    }


    /* =====================================================
       19. SEARCH
    ===================================================== */

    #main-menu .bt-mega-search-trigger {
        display: flex !important;
        align-items: center !important;

        width: 100% !important;
        min-height: 50px !important;

        padding: 13px 0 !important;

        color: #000000 !important;
    }


    /* =====================================================
       20. MY ACCOUNT
    ===================================================== */

    #main-menu .account-item > a {
        display: flex !important;

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

        width: 100% !important;
        min-height: 50px !important;

        padding: 13px 0 !important;

        color: #000000 !important;
    }


    /* =====================================================
       21. DARK MODE MENU TEXT
    ===================================================== */

    body.home-dark-mode
    #main-menu .header-toggle .stockist,

    body.home-dark-mode
    #main-menu .nav-sidebar a,

    body.home-dark-mode
    #main-menu .header-catalogue,

    body.home-dark-mode
    #main-menu .bt-mega-search-trigger,

    body.home-dark-mode
    #main-menu .account-item a {
        color: #ffffff !important;
    }


    /* =====================================================
       22. DIVIDER COLORS
    ===================================================== */

    body:not(.home-dark-mode)
    #main-menu .header-toggle .stockist,

    body:not(.home-dark-mode)
    #main-menu .nav-sidebar > li {
        border-bottom-color: #e6e6e6 !important;
    }


    body.home-dark-mode
    #main-menu .header-toggle .stockist,

    body.home-dark-mode
    #main-menu .nav-sidebar > li {
        border-bottom-color: #333333 !important;
    }


    /* =====================================================
       23. CLOSE BUTTON
    ===================================================== */

    .mfp-wrap .mfp-close,
    #main-menu .mfp-close {
        top: 6px !important;
        right: 6px !important;

        width: 38px !important;
        height: 38px !important;

        line-height: 38px !important;

        font-size: 28px !important;
    }


    body:not(.home-dark-mode)
    .mfp-wrap .mfp-close {
        color: #000000 !important;
    }


    body.home-dark-mode
    .mfp-wrap .mfp-close {
        color: #ffffff !important;
    }

   .flickity-page-dots {
    text-align: left !important;
    bottom: 4% !important;
    left: 14% !important;
}

.copyright .textwidget{
    position: static;
}
}

#main-menu ul.nav-sidebar > li.html_topbar_left {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        height: 55px !important;
        min-height: 55px !important;
        padding: 0 !important;
        margin: 0 !important;
        border-top: none !important;
    }


    /* =================================================
       SUN / MOON TOGGLE - LEFT
       ================================================= */

    #main-menu ul.nav-sidebar > li.html_topbar_left .theme-mode-toggle {
        position: absolute !important;

        left: 15px !important;
        right: auto !important;
        top: 12px !important;
        bottom: auto !important;

        width: 35px !important;
        height: 35px !important;

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

        display: block !important;

        z-index: 999 !important;
    }


    #main-menu ul.nav-sidebar > li.html_topbar_left #dark-mode-toggle {
        position: relative !important;

        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;

        width: 35px !important;
        height: 35px !important;

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

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

        border: none !important;
        background: transparent !important;
        box-shadow: none !important;

        cursor: pointer !important;
    }


    /* =================================================
       SEARCH ICON - RIGHT
       ================================================= */

    #main-menu ul.nav-sidebar > li.html_topbar_left > a.mobile-search-icon {
        position: absolute !important;

        left: auto !important;
        right: 15px !important;
        top: 12px !important;
        bottom: auto !important;

        width: 35px !important;
        height: 35px !important;

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

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

        z-index: 999 !important;
    }


    #main-menu ul.nav-sidebar > li.html_topbar_left > a.mobile-search-icon i {
        position: static !important;

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

        font-size: 18px !important;
    }


    /* =================================================
       PRODUCTS / FORMATS AREA
       ================================================= */

    #main-menu ul.nav-sidebar > li.html_topbar_left .header-toggle {
        position: relative !important;

        margin-top: 60px !important;
        padding-top: 0 !important;
        border-top : 1px solid #cecece !important;
        width: 100% !important;
    }
    
    #main-menu ul.nav-sidebar > li.html_topbar_left{
        height: auto !important;
    }
    
    #main-menu ul.nav-sidebar > li.html_topbar_left .theme-mode-toggle{
        top: 0px !important;
        left: -12px !important;
    }
    #main-menu ul.nav-sidebar > li.html_topbar_left > a.mobile-search-icon{
        right: -5px !important;
        top: 7px !important;
    }
    
    
    /* My Account */
  
    /* My Account item */
    .nav-sidebar li.account-item.has-child {
        position: relative !important;
    }

    /* My Account link */
    .nav-sidebar li.account-item.has-child > a.account-link {
        padding-right: 50px !important;
    }

    /* Normal / closed state */
    .nav-sidebar li.account-item.has-child > button.toggle {
        position: absolute !important;
        top: 50% !important;
        right: 10px !important;
        left: auto !important;
        bottom: auto !important;
        
        transform: translateY(-50%) !important;
        
        margin: 0 !important;
        padding: 0 !important;
        
        width: 35px !important;
        height: 35px !important;
    }

    /* Active / open state */
    .nav-sidebar li.account-item.has-child.active > button.toggle {
        top: 1% !important;
        position: absolute !important;
        right: 10px !important;
        left: auto !important;
        bottom: auto !important;
        
        transform: rotate(180deg) !important;
        
        margin: 0 !important;
        padding: 0 !important;
        
        width: 35px !important;
        height: 35px !important;
    }

    /* Keep original theme icon */
    .nav-sidebar li.account-item.has-child > button.toggle i {
        display: block !important;
    }
    
    .nav-sidebar li.account-item.has-child.active > .account-login .header-account-title{padding:0 0 0 15px;}
}