/** !! Rename to "responsive.css" ?? **/




#topbar .top-menu .menu-toggle {
    width: 35px;
    height: 35px;
    border-radius: 0;
    border: 1px solid red;  
}


/* Desktop Large (e.g., big monitors, 1440px and up) */
@media (min-width: 1440px) {
/* Your styles here */
}

/* Desktop Normal (e.g., laptops, desktops from 1024px to 1439px) */
@media (min-width: 1024px) and (max-width: 1439px) {
/* Your styles here */
}

/* Mobile Landscape (e.g., phones turned sideways: 576px to 767px) */
@media (min-width: 576px) and (max-width: 767px) and (orientation: landscape) {
/* Your styles here */
}

/* Mobile Portrait (e.g., phones held upright: up to 575px) */
@media (max-width: 575px) and (orientation: portrait) {
/* Your styles here */
    html {
        margin: 0 !important;
    }

    body.admin-bar #topbar {
        top: 46px;
    }

    #topbar {
        width: 100vw;
        justify-content: center;
    }
    #topbar .container {
        width: auto;
        gap: 25px;
    }

    #topbar .site-logo {
        height: 80%;        
    }
    #topbar .site-logo img {
        height: 100%;
    }

    #topbar .top-menu {
        display: flex;
        align-items: center;
    }

    #topbar .top-menu .main-nav {
        display: none;
        visibility: hidden;
    }
}

  
/* body {
background-color: red !important;
} */