body {}

.header-middle {background-color: #fff;}

.main h1 { color: #fff;}

.intro-slider .intro-slide .banner-info{ color:#fff;}

h3, .h3 {

    font-size: 4rem;

}

h4, .h4 {

    font-size: 2rem;

}

h6.info-title {
    font-size: 1.8rem;
}

.sr-only {
	display: none;
}

.page-header {
	padding: 14rem 0 3rem 0;
}

.page-header-custom {
	padding: 22.5rem 0 13rem 0;
}

.about-primary-section {

    padding-top: 80px;

    padding-bottom:00px;

  }

  .facilities-primary-section {

    padding-top: 80px;

    padding-bottom:80px;

  }

  .puzzle{ box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px; border-radius:25px;}


  .card-content{ padding: 2.9rem 3.1rem; min-height: 323px; }

  .card-heading{ padding: 3rem 3rem;}

  .disease-section{padding:80px 0 100px 0;}

  .footer-bottom { padding: 6rem 0 6rem; }

  .gallery{}

  .gallery li{ display:inline-flex; width:24.8%;}

  .gallery li img{ max-width:100%;}

  .section-pading{ padding:80px 0px;}

  .swiper { width: 600px; height: 300px; }

img{max-width: 100%;}  

.owl-theme.gallery-slider .owl-dots{bottom: -38px;}

.blog-preview-section {

  padding-top: 60px;

  padding-bottom: 80px;

}

.post-box .box-content {

  min-height: 590px;

  max-height: 590px;

  padding: 4rem 5rem 5.3rem 5rem;

  overflow: hidden;

}

.cta-section-1 {

  padding: 10rem 0 10rem 0 !important;

}

.widget-hours a{ color:#fff;}

.widget-hours a:hover{  color:#CF3438;}



.schedule-section .widget-sp {  padding-top: 42px;

}

.puzzle{ right: -44px;}

.homeFourIcon {width:100%; }

.homeFourIcon ul { margin:0; padding:0;}

.homeFourIcon li { float:left; width:50%; position:relative}

.homeFourIcon li a { display:block;color:#fff; padding:35px 0; position:relative; font-size:14px;}

.homeFourIcon li a span { display: block; font-size: 1.800em; line-height: 28px; padding-bottom:20px; padding-left: 65px; -webkit-transition: 350ms ease;transition: 350ms ease;}

.homeFourIcon li a:hover { color:#ffc12c;}

.homeFourIcon li a:hover span { color:#23fffc;}

.homeFourIcon li a:before { left: 0; content: ""; height: 50px; top: 45px; position: absolute; width: 52px; background: url(../images/menu/4-icon.png) no-repeat left top;-webkit-transition: 350ms ease;transition: 350ms ease;}

.homeFourIcon li a.expertHand:before { background-position:0 -52px; left:30px;}

.homeFourIcon li a.waitList:before { background-position:5px -104px;}

.homeFourIcon li a.surgList:before {background-position:0 -156px; left:30px;}



.homeFourIcon li a:hover:before {background-position:-60px 0;}

.homeFourIcon li a.expertHand:hover:before { background-position:-60px -52px;}

.homeFourIcon li a.waitList:hover:before { background-position:-65px -104px;}

.homeFourIcon li a.surgList:hover:before {background-position:-60px -156px;}



.homeFourIcon li:nth-child(2) a { padding-left:30px;}

.homeFourIcon li:nth-child(4) a {padding-left:30px;}



.homeFourIcon li:nth-child(1):before {border-right: 1px solid #144d70; content: ""; height: 90%; position: absolute; right: 0; top: 0; width: 1px;}

.homeFourIcon li:nth-child(3):before {border-top: 1px solid #144d70; content: ""; height: 1px; left: 0; position: absolute; top: 0; width: 95%;}

.homeFourIcon li:nth-child(3):after {border-right: 1px solid #144d70; content: ""; height: 90%; position: absolute; right: 0; bottom: 0; width: 1px;}





.homeFourIcon li:nth-child(2):before {border-bottom: 1px solid #144d70; content: ""; height: 90%; position: absolute; right: 0; top: 0; width: 1px;}

.homeFourIcon li:nth-child(4):before {border-top: 1px solid #144d70; content: ""; height: 1px; right: 0; position: absolute; top: 0; width: 95%;}



.homeFourIcon li:nth-child(1) {padding-right: 15px;}

.homeFourIcon li:nth-child(2) {padding-left: 15px;}

.homeFourIcon li:nth-child(3) {padding-right: 15px;}

.homeFourIcon li:nth-child(4) {padding-left: 15px;}

.awerness{ width:100%;}

.awerness ul{  }

.awerness ul li {   width: 49%; display: inline-block; margin-bottom:30px; position: relative; }

.awerness ul li a{color:#fff; font-size: 1.8rem; padding: 35px 0; display:block; }

.awerness ul li h3{ color:#fff; font-size:2rem;  margin-left:45px; line-height: 2.8rem; margin-bottom:15px; position:relative;}

.awerness ul li h3 i { color: #CF3438; position:absolute; top:5px; left:-45px; margin-right: 1.1rem; font-size:3rem;}

.awerness ul li:hover h3 i{ color:#fff;}



.awerness ul li:nth-child(1):before {border-right: 1px solid #144d70; content: ""; height: 90%; position: absolute; right: 0; top: 0; width: 1px;}

.awerness ul li:nth-child(3):before {border-top: 1px solid #144d70; content: ""; height: 1px; left: 0; position: absolute; top: 0; width: 95%;}

.awerness ul li:nth-child(3):after {border-right: 1px solid #144d70; content: ""; height: 90%; position: absolute; right: 0; bottom: 0; width: 1px;}



.awerness ul li:nth-child(2):before {border-bottom: 1px solid #144d70; content: ""; height: 90%; position: absolute; right: 0; top: 0; width: 1px;}

.awerness ul li:nth-child(4):before {border-top: 1px solid #144d70; content: ""; height: 1px; right: 0; position: absolute; top: 0; width: 95%;}

.awerness ul li:nth-child(1) {padding-right: 15px;}

.awerness ul li:nth-child(2) {padding-left: 15px;}

.awerness ul li:nth-child(3) {padding-right: 15px;}

.awerness ul li:nth-child(4) {padding-left: 15px;}

.schedule-section .widget-sp {

  padding-top: 42px;

  padding-bottom: 0;

}

.contact-bg{  background: url(../images/demos/demo-1/banner/conact-bg.jpg) no-repeat left bottom;}

.contact-detail-section { padding-top: 0;}

.desc span{display: block; color: #de373b; font-weight: bold; font-size: 25px; margin-top: 17px;}

.title-desc{ font-size: 3rem;}

.cardiac{  }

ul.cardiac { list-style:none; padding:0;}

ul.cardiac li {padding:5px 0 5px 25px; position:relative; margin-bottom:8px; color:#414141;}

ul.cardiac li:hover{ color:#cf3438;}

ul.cardiac li i.icon{ position:absolute; top:9px; font-size: 15px; left:0px;}



/********** Table **********/



.tableOut { overflow-y:hidden; overflow-x:auto; line-height: 25px; }

table, .tableData{font-size: 16px; border-collapse: separate;border-spacing: 0;width: 100%; empty-cells:show; border:none;border-top:1px solid #E9E9EA;border-left:1px solid #E9E9EA;}

table table, .tableData table { margin:0}

th,td, .tableData th, .tableData td {border:none; padding:8px 10px;border-bottom:1px solid #E9E9EA;border-right:1px solid #E9E9EA;}

table tr:nth-child(odd) td, .tableRowOdd{ background-color:#efefef;}

caption,th,td {font-weight: normal; background:#fff}

th, .tableData th{background:#f3f3f3; font-weight: bold;}

.tableScroll { overflow-y:hidden; overflow-x:auto} 



/***********************************/

.staff-list h4{ margin-top: 3rem; margin-bottom: 0.5rem;}

.whats-new-detail{border-bottom: 1px solid #dee2e6 !important; padding-bottom:4rem;}

.whats-new-detail a{ font-weight:600; color:#d53539;}

.whats-new-detail a:hover{ color:#283779;}

.pagination a{ border-radius:0px;}

.camps-detail{ position:relative;}

.camps-inner{ position:absolute; bottom:0px; left:0px; width:100%; padding:1.5rem; background: rgba(40, 55, 121, 0.5); color:#fff; font-weight:600; text-align:center;}

.camps-detail:hover .camps-inner{background: rgba(40, 55, 121, 0.9);}

.camps-detail:hover img{ opacity:0.8;}

.career-detail .form-control {border-radius:0px !important; min-height: 45px; font-size:16px; margin-bottom:0.8rem;}



.file {

  position: relative;

  display: inline-block;

  cursor: pointer;

  height: 2.5rem;

}

.file input {

  width: 100%;

  margin: 0;

  filter: alpha(opacity=0);

  opacity: 0;

}

.file {

  cursor: pointer;

}

.file-custom {

  line-height: 1.5;

  color: #555;

}

.file-custom {

  position: absolute;

  top: 0;

  right: 0;

  left: 0;

  z-index: 5;

  height:4.5rem;

  padding: .5rem 1rem;

  line-height: 1.8;

  color: #555;

  background-color: #fff;

  border: .075rem solid #ddd;

  border-radius: .25rem;

  /*box-shadow: inset 0 .2rem .4rem rgba(0,0,0,.05);*/

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;

}

.file-custom::before {

  position: absolute;

  top: -.075rem;

  right: -.075rem;

  bottom: -.075rem;

  z-index: 6;

  display: block;

  content: "Browse";

  height:4.5rem;

  padding: .5rem 1rem;

  line-height: 1.8;

  color: #fff;

  background-color:#283779;

  border: .075rem solid #ddd;

  border-radius: 0 .25rem .25rem 0;

}

.file-custom::after {

  content: "Choose file...";

}

.volunteerForm p { border-bottom: 1px solid #E9E9EA;

  border-right: 1px solid #E9E9EA; border-left: 1px solid #E9E9EA; padding: 8px 10px; margin-bottom:0px;}

.volunteerForm p:first-child{ border-top:1px solid #E9E9EA;}

.volunteerForm p:nth-child(odd) {

  background: #f3f3f3;

}



.volunteerForm p:nth-child(even) {

  background: #fff;

}



@media (max-width: 991px) {

  .main h1{ color: #283779;}

  .intro-slider .intro-slide .banner-info{ color: #2d2d2d;}

  .card-rating {display: none;}

  .post-box .box-content{min-height: auto;}

  }

  @media (max-width:767px) {

    .file{ width: 100%;

      margin-bottom: 26px;}

  }



  @media (max-width:530px) {



    .homeFourIcon li { width:100%;}

    .homeFourIcon li:nth-child(1)::before,.homeFourIcon li:nth-child(2)::before , .homeFourIcon li:nth-child(3)::before ,.homeFourIcon li:nth-child(3)::after  ,.homeFourIcon li:nth-child(4)::before {  border:0px;   border-right:0px;}

    .homeFourIcon li:nth-child(2), .homeFourIcon li:nth-child(4) {padding-left:0px;}

    .homeFourIcon li:nth-child(2) a, .homeFourIcon li:nth-child(4) a{ padding-left:0px;}

    .homeFourIcon li a.expertHand::before,  .homeFourIcon li a.surgList::before { left: 0;}

    

  }



  /* */

.faq{list-style: none;}

.faq div {list-style: none;

    padding: 1.25em;

}



.faq div.q {

    font-weight: bold;

    font-size: 120%;

    border-bottom: 1px #ccc solid;

    cursor: pointer;

}



.faq div.q:nth-child(1),

.faq div.q:nth-child(5),

.faq div.q:nth-child(9) {

    /*background: #eee;*/

}



.faq div.a { 

    display: none;

}

.faq div.q {

  background-image: url("../images/accordion-plus.png");

  background-repeat: no-repeat;

  border-bottom: 1px solid #e9e9e9;

  cursor: pointer;

  margin-bottom: 0;

  padding: 20px 20px 20px 60px;

  -webkit-transition: 350ms ease;

  transition: 350ms ease;

  color: #414141;

  background-position: 15px 50%;

}

.faq div.q.active {

  background-image: url("../images/accordion-minus.png");

  color: #283779;

}

.mobile-actions a.btn.btn-sm:hover { color:#CF3438;}

.mobile-actions a.btn.btn-sm::before {

  background-color: #CF3438;

}

.mobile-actions a.btn.btn-sm::after {

  background-color: #fff; 

}

.banner-actions.mt-5 {

  width: 100%;

  text-align: center;

}

.banner-actions.mt-5 .btn{ width: auto;}



@media (max-width: 991px){

  .type-section-margin-bottom {

    margin-bottom: 0 !important; padding-bottom: 3rem; padding-bottom: 5rem;

  }

  .owl-theme.gallery-slider .owl-dots {

    bottom: -58px;

  }

}





@media (max-width: 1230px){

  .menu > li > a{ font-size: 1.4rem;}

.menu li {

    padding: 5rem 0.76rem !important;

}

  

}



@media (max-width:1540px){

.menu li {

    padding: 5rem 0.76rem !important;

}

}



.menu li {

  padding: 6px 1rem !important;
    /* padding: 2rem 1rem !important; */

}

.for_color {

    background: white !important;

}

.book_appoinment form .form-control {

    font-size: 18px;

    margin-bottom: 20px;

    resize: none;

}

.book_appoinment form label {

    font-size: 18px;

    margin-left: 28px;

}.book_appoinment {

    max-width: 740px;

    margin: auto;

    margin-top: 70px;

    margin-bottom: 60px;

}

.book_appoinment form .btn::after {

    z-index: -1;

}



.book_appoinment form .btn {

    background: #283779;

    color: #283779;

    font-size: 20px;

    text-transform: uppercase;

    position: relative;

    z-index: 999999;

}

.book_appoinment form .btn::before {

    z-index: -1;

}

.book_appoinment form .btn:hover {

    color: #fff;

}

.image-box.doctor-card .box-content{ padding: 4.2rem 1rem; min-height: 140px; text-align: center;}

a#navbar-link-id-a {
    font-size: 14px !important;
}



/* ==========================================
   SAI HOSPITAL - DYNAMIC RESPONSIVE BANNER
========================================== */

.intro-slider-1 {
    position: relative;
    width: 100%;
    overflow: hidden;
}

/* ==========================================
   BANNER SLIDE
========================================== */

.intro-slider-1 .banner.intro-slide {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
    align-items: center !important;

    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;

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

    overflow: hidden;
    box-sizing: border-box;

    background-image: none !important;
    background-color: #283779;
}

/* ==========================================
   DYNAMIC FEATURED IMAGE
========================================== */

.intro-slider-1 .banner-bg-image {
    position: relative !important;
    grid-column: 1;
    grid-row: 1;

    width: 100%;
    height: auto !important;
    min-height: 0;
    overflow: hidden;
    z-index: 0;
}

.intro-slider-1 .banner-bg-image .banner-bg-img {
    position: static !important;
    display: block !important;

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

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

    object-fit: contain !important;
    object-position: center center !important;

    transform: none !important;
    inset: auto !important;
}

/* Overlay for text readability */
.intro-slider-1 .banner-bg-image::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;

    background: linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.60) 0%,
        rgba(0, 0, 0, 0.35) 55%,
        rgba(0, 0, 0, 0.10) 100%
    );

    pointer-events: none;
}

/* ==========================================
   CONTENT CONTAINER
========================================== */

.intro-slider-1 .banner.intro-slide > .container {
    position: relative !important;

    grid-column: 1;
    grid-row: 1;

    z-index: 2;

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

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

    margin-left: auto;
    margin-right: auto;

    padding-top: 60px !important;
    padding-bottom: 60px !important;

    box-sizing: border-box;
}

/* ==========================================
   BANNER CONTENT
========================================== */

.intro-slider-1 .banner.intro-slide .banner-content {
    position: static !important;
    display: block !important;

    width: 100% !important;
    max-width: 650px;

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

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

    transform: none !important;
    text-align: left;

    opacity: 1;
    visibility: visible;
}

/* Reset theme animation offsets */
.intro-slider-1 .banner-content > * {
    max-width: 100%;
}

/* ==========================================
   TYPOGRAPHY
========================================== */

.intro-slider-1 .banner-content .banner-title {
    max-width: 100%;
    height: auto;
    margin: 0 0 15px;
    line-height: 1.3;
    color: #fff;
    overflow-wrap: break-word;
}

.intro-slider-1 .banner-content .banner-info,
.intro-slider-1 .banner-content p {
    max-width: 100%;

    font-size: clamp(14px, 1.1vw, 18px);
    line-height: 1.6;

    color: #fff;
    overflow-wrap: break-word;
}

/* ==========================================
   BUTTONS
========================================== */

.intro-slider-1 .banner-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;

    gap: 12px;
    margin-top: 20px;
}

.intro-slider-1 .banner-actions .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: auto;
    max-width: 100%;

    margin: 0 !important;
    padding: 14px 24px;

    white-space: normal;
    text-align: center;
}

/* ==========================================
   TABLET
========================================== */

@media (max-width: 1199px) {

    .intro-slider-1 .banner.intro-slide > .container {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }

    .intro-slider-1 .banner.intro-slide .banner-content {
        max-width: 550px;
    }

    .intro-slider-1 .banner-content .banner-title {
        font-size: 30px;
    }
}

/* ==========================================
   MOBILE - CONTENT BELOW IMAGE
========================================== */

@media (max-width: 767px) {

    .intro-slider-1 .banner.intro-slide {
        grid-template-rows: auto auto;
    }

    .intro-slider-1 .banner-bg-image {
        grid-column: 1;
        grid-row: 1;
    }

    .intro-slider-1 .banner-bg-image::after {
        display: none;
    }

    .intro-slider-1 .banner.intro-slide > .container {
        grid-column: 1;
        grid-row: 2;

        align-items: flex-start !important;

        padding-top: 30px !important;
        padding-bottom: 35px !important;
    }

    .intro-slider-1 .banner.intro-slide .banner-content {
        width: 100% !important;
        max-width: 100%;
        text-align: left;
    }

    .intro-slider-1 .banner-content .banner-title {
        font-size: 24px;
        line-height: 1.3;
        margin-bottom: 12px;
    }

    .intro-slider-1 .banner-content .banner-info,
    .intro-slider-1 .banner-content p {
        font-size: 14px;
        line-height: 1.5;
    }

    .intro-slider-1 .banner-actions {
        gap: 10px;
        margin-top: 18px;
    }

    .intro-slider-1 .banner-actions .btn {
        padding: 12px 18px;
    }
}

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

@media (max-width: 480px) {

    .intro-slider-1 .banner.intro-slide > .container {
        padding-top: 25px !important;
        padding-bottom: 30px !important;
    }

    .intro-slider-1 .banner-content .banner-title {
        font-size: 21px;
    }

    .intro-slider-1 .banner-content .banner-info,
    .intro-slider-1 .banner-content p {
        font-size: 13px;
    }

    .intro-slider-1 .banner-actions {
        flex-direction: column;
        align-items: flex-start;
    }

    .intro-slider-1 .banner-actions .btn {
        width: auto;
        max-width: 100%;
        padding: 12px 18px;
    }
}