/* =========================================================
   CCSAFC MOBILE NAVIGATION FIX
   Loads AFTER main stylesheet
========================================================= */


/* =========================================================
   MOBILE / TABLET NAVIGATION
========================================================= */

@media (max-width: 991.98px) {


    /* Navbar layout */

    .site-navbar > .container {

        display: flex;

        align-items: center;

        flex-wrap: wrap;

    }



    /* Brand */

    .club-brand {

        margin-right: auto;

    }



    /* Burger button */

    .navbar-toggler.menu-toggle {

        display: flex !important;

        flex-direction: column;

        justify-content: center;

        align-items: center;


        width: 48px;

        height: 44px;


        margin-left: auto;

        padding: 8px;


        background-color: #ffffff !important;


        border: 1px solid #e5e5e5 !important;

        border-radius: 6px;


        opacity: 1 !important;

        visibility: visible !important;


        position: relative;

        z-index: 2000;

    }



    /* Remove Bootstrap icon */

    .navbar-toggler-icon {

        display: none !important;

    }



    /* Burger lines */

    .navbar-toggler.menu-toggle .menu-toggle-line {

        display: block !important;


        width: 24px !important;

        height: 3px !important;


        margin: 3px 0 !important;


        background-color: #111111 !important;


        border-radius: 2px;


        opacity: 1 !important;

        visibility: visible !important;


        transform: none !important;

    }



    /* Hover */

    .navbar-toggler.menu-toggle:hover {

        border-color: #c8102e !important;

    }



    .navbar-toggler.menu-toggle:hover .menu-toggle-line {

        background-color: #c8102e !important;

    }



    /* Focus */

    .navbar-toggler.menu-toggle:focus {

        outline: none !important;


        box-shadow:

            0 0 0 3px rgba(200,16,46,0.15) !important;

    }



    /* Mobile menu container */

    .navbar-collapse {

        width: 100% !important;

        flex-basis: 100%;

        order: 3;


        margin-top: 10px;

    }



    /* Navigation links */

    .site-nav-link {

        display: flex !important;

        align-items: center;


        min-height: 48px;


        padding: 12px 10px !important;


        color: #111111 !important;


        border-bottom:

            1px solid #e5e5e5;

    }



    .site-nav-link:hover {

        color: #c8102e !important;

    }



    /* Dropdown */

    .site-dropdown {

        position: static !important;


        width: 100% !important;


        margin: 0 !important;


        padding: 5px 10px;


        background-color: #f8f8f8;


        border: none;


        border-left:

            3px solid #c8102e;


        border-radius: 0;


        box-shadow: none;

    }



    .site-dropdown .dropdown-item {

        padding: 10px 15px;


        color: #111111;


        font-size: 15px;

    }



}



/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 576px) {


    .navbar-toggler.menu-toggle {

        width: 44px;

        height: 40px;

    }



    .navbar-toggler.menu-toggle .menu-toggle-line {

        width: 22px !important;

    }


}



/* =========================================================
   VERY SMALL MOBILE
========================================================= */

@media (max-width: 380px) {


    .navbar-toggler.menu-toggle {

        width: 42px;

        height: 38px;

    }



    .navbar-toggler.menu-toggle .menu-toggle-line {

        width: 20px !important;

    }


}@charset "UTF-8";
/* CSS Document */