/*
Medexa Responsive Styles
*/

/* =========================================
   Mobile Portrait
   Up to 575px
========================================= */

@media (max-width: 575px) {

    html {
        font-size: 14px;
    }

    body {
        font-size: 15px;
    }

    #site-header .navbar {
        padding: 12px 0;
    }

    #site-header .navbar-nav {
        gap: 0;
        width: 100%;
    }

    #site-header .navbar-nav .nav-link {
        padding: 10px 0;
    }

    #site-header .header-action {
        margin-top: 10px;
    }

    #site-header .header-action .btn {
        width: auto;
    }
    
    #site-header .navbar-nav .nav-item {
    margin: 0;
}

#site-header .navbar-nav .nav-link {
    padding: 7px 0 !important;
    line-height: 1.4;
}
  
   #site-header .top-bar-inner {
        min-height: 36px;
    }

    #site-header .top-bar-item {
        font-size: 11px;
    }

    #site-header .top-bar-left {
        gap: 12px;
    }

    #site-header .top-bar-right {
        display: none;
    }
    
    /*******Footer******/
    #site-footer .footer-cta {
        padding: 55px 0 60px;
    }

    #site-footer .footer-cta h2 {
        font-size: 32px;
    }

    #site-footer .footer-cta p {
        font-size: 16px;
    }

    #site-footer .footer-cta-actions {
        flex-direction: column;
    }

    #site-footer .footer-cta-actions a {
        width: 100%;
        max-width: 300px;
    }

    #site-footer .footer-main {
        padding: 50px 0 0;
    }

    #site-footer .footer-clinic,
    #site-footer .footer-column {
        margin-bottom: 40px;
    }

    #site-footer .footer-column a,
    #site-footer .footer-clinic p,
    #site-footer .footer-clinic > a {
        font-size: 16px;
    }

    #site-footer .footer-bottom {
        margin-top: 10px;
    } 
    

}


/* =========================================
   Mobile Landscape
   576px - 767px
========================================= */

@media (min-width: 576px) and (max-width: 767px) {

    html {
        font-size: 15px;
    }

    body {
        font-size: 15px;
    }
    #site-header .top-bar-item {
        font-size: 12px;
    }

    #site-header .top-bar-right {
        display: none;
    } 
    

}


/* =========================================
   Tablet Portrait
   768px - 991px
========================================= */

@media (min-width: 768px) and (max-width: 991px) {

    html {
        font-size: 15px;
    }

    body {
        font-size: 16px;
    }
    
      #site-header .top-bar-item {
        font-size: 12px;
    }

}


/* =========================================
   Tablet Landscape
   992px - 1024px
========================================= */

@media (min-width: 992px) and (max-width: 1024px) {

    html {
        font-size: 15px;
    }

    body {
        font-size: 16px;
    }
    
    

}