@charset "utf-8";
/* CSS Document */

@media only screen and (min-width: 320px) and (max-width: 567px) {
    /**----Home page----**/
    
    .logo {
        width: 70%;
        float: none;
        margin: 0 auto;
    }
    .logo img {
        width: 100%;
    }
    .call-now {
        padding: 5px 0 0 0;
        width: 100%;
        text-align: center;
    }
    .call-now h1 {
        font-size: 19px;
    }
    .container {
        width: 100%;
    }
    .bx-wrapper .bx-caption {
        width: auto;
        bottom: 5px;
    }
    .bx-wrapper .bx-caption span {
        font-size: 14px;
    }
    .promotion {
        width: 100%;
    }
    .services {
        width: 100%;
    }
    .services ul {
        width: 90%;
        display: block;
        margin: 0 auto;
    }
    .promo-1,
    .promo-2,
    .promo-3 {
        float: none;
        margin: 25px auto;
    }
    .footer {
        width: 100%;
    }
    .footer-top {
        width: 100%;
        margin-top: 20px;
    }
/*    .footer-middle-right {
        display: none;
    }*/
    .footer-bottom {
        width: 100%;
    }
    .footer-bottom p {
        text-align: center;
        padding-right: 0;
    }
    .footer-middle {
        width: 100%;
    }
    .footer-middle-left {
        width: auto;
        float: none;
        margin: 0 auto;
        padding-top: 20px;
    }
}
@media only screen and (min-width: 767px) and (max-width: 991px) {
      .services ul li.service1,
    .services ul li.service2,
    .services ul li.service3,
    .services ul li.service4,
    .services ul li.service5,
    .services ul li.service6 {
        width: 33.33%;
    }
    .services ul{display:flex !important;}

}
@media only screen and (min-width: 574px) and (max-width: 991px) {
 .call-now{margin-right:30px;}
  
}



 @media only screen and (min-width: 320px) and (max-width: 767px) {
    .logo{padding-left:30px;padding-top:20px;}
    .nav-menu {
        width: 100%;
        margin: 10px;
        background:transparent;
    }
    .nav-menu ul li a {
        float: none !important;
    }
    .nav-menu ul {
        float: none !important;
    }
    .nav-menu ul li {
        display: block !important;
    }
    .nav-menu ul li a {
        display: block !important;
        padding: 5px 13px 5px 12px !important;
        background: none;
    }
    .nav-menu ul li a.active,
    .nav-menu ul li a:hover {
        background: #FF0000 !important;
        border-radius: 5px;
        display: block !important;
    }
    .bx-wrapper .bx-caption {
        padding: 0;
    }
    .services ul li a {
        text-align: center !important;
        float: none !important;
        display: block;
        padding-top: 140px !important;
    }
    .services ul li.service1,
    .services ul li.service2,
    .services ul li.service3,
    .services ul li.service4,
    .services ul li.service5,
    .services ul li.service6 {
        width: 100%;
    }
    .services ul{display:block !important;}
    .services ul li.service1,
    .services ul li.service2,
    .services ul li.service3,
    .services ul li.service4,
    .services ul li.service5,
    .services ul li.service6 {
        min-height: 160px;
        background-position: center;
    }
    .services ul li.service1:hover,
    .services ul li.service2:hover,
    .services ul li.service3:hover,
    .services ul li.service4:hover,
    .services ul li.service5:hover,
    .services ul li.service6:hover {
        background-position: center;
    }
    .about-content {
        max-width: 100%;
        width:100% !important;
        overflow: hidden;
    }
    .about-content-left {
        max-width: 100%;
        width:100% !important;
        float: none;
        overflow: hidden;
    }
    .about-content-right {
        max-width: 100%;
        width:100% !important;
        float: none;                
    }
    .about-content-left-p {    
        width:95% !important;
    }
   

    .speciality-content-left {
        width: 100%;
        float: none;    
    }
    .speciality-content-middle {
        width: 100%;
        float: none;
    }
    .speciality-content-right {
        width: 100%;
        float: none;    
    }
    .haematology {
        float: none !important; 
    }
    .haematology h2{
        display:inline-block;
    }
    .speciality-content{
        width:96%;
    }
    .facility-content-left{width:100%;}
    .facility-left {
        width:90% !important;
    }
    .facility-left p {
        width: 100%;    
    }
    .facility-content-left-p{width:93% !important;}
    .facility-left .dot {    
        display: none;
    }
    .facility-left label {
        width: 100%;
        float: none; 
        display: block;
        padding-left:20px;
}
.facility-right{width:auto !important;float:none !important;margin:auto !important;text-align:center;}
.gallery-content{width:100%;}
.gallery-content-left{width:100%;}
.gallery-content-left-p{width:96%;margin:10px;}
.gallery-content-left-p h3 {
    float: none;
    clear: left;
}

.contact-content-left-p,.contact-content,.contact-content-left{width:100%;overflow:hidden;}
.contact-content-left-p{text-align:inherit !important;width:90%;}
.contact-content-right img{margin-top:10px;}
.contact-content-left h4{width:100%;display:inline-block;}
.feedback_box{width:93%;}
.form_in2 input{width:80%;margin:0 0 0 5px;}
.form_in2 p{width:100%;}
.for_dot3{display:none;}
.appointment-content-right{text-align:center;}
.appointment-content-right img{margin-top:30px !important;}


    #toTop {
        bottom: 135px !important;
    }
    .footer-top ul {
        padding: 12px !important;
    }
    .footer-top ul li {
        display: block;
    }
    .footer-top ul li a {
        border: none;
    }
    .footer, .footer-top, .footer-middle, .footer-middle-left { 
        width: 100%;
    }
}
@media only screen and (min-width: 500px) and (max-width: 767px) {
.services ul li.service1,
    .services ul li.service2,
    .services ul li.service3,
    .services ul li.service4,
    .services ul li.service5,
    .services ul li.service6 {
        width: 50% !important;
    }
    }
@media only screen and (max-width: 575px){
    .footer-middle-right{width:100%;left:0;top:170px;}
    .footer-middle-left{padding-top:163px;width:100%;}

}
@media only screen and (max-width: 420px){
    .gallery-content-left-p h3 {text-align:center;}
    .gallery-content-left-p ul li{float:none;margin:5px auto !important;}
}
@media only screen and (min-width: 768px) and (max-width: 980px) {}








/*----- Toggle Button -----*/
.toggle-nav {
    display:none;
}
 
/*----- Menu -----*/
/*@media screen and (min-width: 860px) {
    .menu {
        width:100%;
        padding:10px 18px;
        box-shadow:0px 1px 1px rgba(0,0,0,0.15);
        border-radius:3px;
        background:#303030;
    }

 
.menu ul {
    display:inline-block;
}
 
.menu li {
    margin:0px 50px 0px 0px;
    float:left;
    list-style:none;
    font-size:17px;
}
 
.menu li:last-child {
    margin-right:0px;
}
 
.menu a {
    text-shadow:0px 1px 0px rgba(0,0,0,0.5);
    color:#777;
    transition:color linear 0.15s;
}
 
.menu a:hover, .menu .current-item a {
    text-decoration:none;
    color:#66a992;
}
 
}*/
 
/*----- Responsive -----*/
@media screen and (max-width: 1150px) {
    .wrap {
        width:90%;
    }
}
 

 
@media screen and (max-width: 860px) {
    .menu {
        position:relative;
       /* display:inline-block;*/
    }
 
    .menu ul.active {
        display:none;
    }
 
    .menu ul {
        width:100%;
        position:absolute;
        top:51px;
        left:0px;
        padding:10px 0px;
        box-shadow:0px 1px 1px rgba(0,0,0,0.15);
        border-radius:3px;
        background:#2e3241;
        z-index:9999;
    }
 
    .menu ul:after {
        width:0px;
        height:0px;
        position:absolute;
        top:0%;
        left:22px;
        content:'';
        transform:translate(0%, -100%);
        border-left:7px solid transparent;
        border-right:7px solid transparent;
        border-bottom:7px solid #303030;
    }
 
    .menu li {
        margin:5px 0px 5px 0px;
        float:none;
        display:block;
    }
 
    .menu a {
        display:block;
    }
 
    .toggle-nav {
        padding:9px 20px;
        float:left;
        display:inline-block;
        box-shadow:0px 1px 1px rgba(0,0,0,0.15);
        border-radius:3px;
        background:#2e3241;
        text-shadow:0px 1px 0px rgba(0,0,0,0.5);
        color:#777;
        font-size:20px;
        transition:color linear 0.15s;
    }
 
    .toggle-nav:hover, .toggle-nav.active {
        text-decoration:none;
        color:#66a992;
    }
 

}