
html { visibility: hidden; }

#mrg-doctor-profile-banner {
    padding: 5% 0%;
    background-image: url("/uploads/images/doctor-profile/Doctor-Banner-bg.png");
    background-size: 100% 100%;
    background-position: center;
    background-color: #f3f9f9;
    position: relative;
    margin-top: 8%;
}

/* Outer Section */
#mrg-doctor-profile-banner .banner-appointment-form {
    width: 100%;
    padding: 5vh 2vw;
    display: flex;
    justify-content: center;
    padding-bottom: 0px;
    padding-right: 0px;
}

img.img-fluid.doctor-img-wrapper {
    position: absolute;
    bottom: 0px;
    width: 30%;
}

/* White Card */
#mrg-doctor-profile-banner .banner-appointment-card {
    background: #fff;
    width: 40vw;
    padding: 2.8vw;
    padding-top: 1vw;
    border-radius: 1.5vw;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

#mrg-doctor-profile-banner .heading {
    text-align: center;
    color: #3c4196;
    font-size: 2vw;
    font-weight: 700;
    margin-bottom: 2vw;
    line-height: 2.6vw;
    font-family: 'Lato';
}

#mrg-doctor-profile-banner .heading span {
    display: block;
    font-size: 1.6vw;
}

/* Radio Container */
#mrg-doctor-profile-banner .consultation-type {
    display: flex;
    gap: 1.2vw;
    justify-content: space-between;
    margin-bottom: 1.2vw;
}


/* Radio Label */
#mrg-doctor-profile-banner .radio-box {
    display: flex;
    align-items: center;
    gap: 0.6vw;
    background: #fff;
    border: 0.12vw solid #d6d6d6;
    padding: 0.5vw 1vw;
    border-radius: 0.6vw;
    font-size: 0.9vw;
    cursor: pointer;
    user-select: none;
    font-weight: 400;
    font-family: 'Lato-Regular';
    color: #3c4196;
}

/* Hide default radio */
#mrg-doctor-profile-banner .radio-box input {
    display: none;
}

/* Custom Radio Circle */
#mrg-doctor-profile-banner .custom-radio {
    width: 1vw;
    height: 1vw;
    border-radius: 50%;
    border: 0.4vw solid #f9eb88;
    position: relative;
    background: #9a968f;
    display: block;
}

/* Blue inside circle when selected */
#mrg-doctor-profile-banner .radio-box input:checked+.custom-radio::after {
    content: "";
    width: 1vw;
    height: 1vw;
    border: 0.4vw solid #3c4196;
    background: #f9eb88;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* Inputs */
#mrg-doctor-profile-banner .banner-appointment-form-wrapper .form-group {
    margin-bottom: 1.5vw;
}

#mrg-doctor-profile-banner .banner-appointment-form-wrapper label {
    font-size: 0.9vw;
    color: #2a2a2a;
    margin-bottom: 0.5vw;
    display: flex;
}

#mrg-doctor-profile-banner .banner-appointment-form-wrapper input {
    width: 100%;
    padding: 0.7vw 0.9vw;
    border-radius: 0.5vw;
    border: 0.12vw solid #d6d6d6;
    font-size: 0.9vw;
}

/* Submit Button */
#mrg-doctor-profile-banner .submit-btn {
    width: max-content;
    background: #3c4196;
    color: #fff;
    border: none;
    padding: 0.5vw 2.1vw;
    border-radius: 0.5vw;
    font-size: 1.1vw;
    font-weight: 500;
    cursor: pointer;
    margin: auto;
    display: block;
    font-family: 'Lato-Semibold';
}

.d-banner-text-wrapper h3 {
    color: #3c4196;
    font-family: 'Lato-Bold';
    font-size: 2vw;
}


.d-banner-text-wrapper p {
    color: #000000;
    font-family: 'Lato-Regular';
    padding-top: 2%;
}

#mrg-doctor-profile-banner .doctor-prf-wrapper {
    display: flex;
    width: 65%;
    margin-right: 0px;
    margin-left: auto;
    align-items: flex-end;
}

#mrg-doctor-profile-banner .doctor-form-wrapper {
    width: 60%;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 767px) {

    #mrg-doctor-profile-banner .banner-appointment-card {
        width: 90vw;
        padding: 6vw;
        border-radius: 4vw;
    }

    #mrg-doctor-profile-banner .heading {
        font-size: 6vw;
        line-height: 7vw;
        margin-bottom: 5vw;
    }

    #mrg-doctor-profile-banner .consultation-type {
        flex-direction: column;
        align-items: center;
        gap: 3vw;
    }

    #mrg-doctor-profile-banner .radio-box {
        padding: 2vw 4vw;
        border-radius: 2vw;
        font-size: 3.5vw;
        gap: 2vw;
    }

    #mrg-doctor-profile-banner .custom-radio {
        width: 3.5vw;
        height: 3.5vw;
        border-width: 0.6vw;
    }

    #mrg-doctor-profile-banner .custom-radio::after {
        width: 2.2vw !important;
        height: 2.2vw !important;
    }

    #mrg-doctor-profile-banner .banner-appointment-form-wrapper label {
        font-size: 3.5vw;
    }

    #mrg-doctor-profile-banner .banner-appointment-form-wrapper input {
        padding: 3vw;
        font-size: 3.5vw;
        border-radius: 2vw;
    }

    #mrg-doctor-profile-banner .submit-btn {
        padding: 2vw 5vw;
        font-size: 4vw;
        border-radius: 2vw;
        margin-top: 10%;
    }

}


/* Banner css ends here  */




.doctor-tabs {
    margin-top: 2vw;
}

.tabs-nav {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    border-bottom: 2px solid #eee;
    overflow-x: auto;
}

.tabs-nav li {
    padding: 1vw 2vw;
    cursor: pointer;
    font-size: 1.1vw;
    background: #f5f5f5;
    margin-right: 0.5vw;
    border-radius: 0.3vw 0.3vw 0 0;
    white-space: nowrap;
    transition: all 0.3s ease;
}

.tabs-nav li.active {
    background: #ffdf00;
    /* yellow tab bg like screenshot */
    color: #000;
}

.tabs-content {
    background: #fff;
    padding: 2vw;
    border: 1px solid #eee;
    border-top: none;
    position: relative;
    min-height: 10vw;
}

.tab {
    display: none;
    opacity: 0;
    transform: translateY(10px);
    transition: all 0.3s ease;
}

.active-tab {
    display: block;
    opacity: 1;
    transform: translateY(0);
}

section#doctor-pf-tab-sec .doctor-tabs.container {
    width: 100%;
    max-width: 100%;
    /* background-color: #3c4196; */
}

section#doctor-pf-tab-sec {
    width: 100%;
    max-width: 100%;
    padding: 0px;
    margin: 0px;
}

html {
    scroll-behavior: smooth;
}

ul.tabs-nav.doctor-tabs-container {
    width: 100%;
    margin: auto;
    background-color: #3c4196;
    padding: 0px 10%;

}

ul.tabs-nav.doctor-tabs-container li {
    width: 25%;
    margin-right: 0px;
    opacity: 1;
    font-size: 1.5vw;
    font-family: 'Lato-Bold';
    border-radius: 0px;
    background-color: #3c4196;
    color: #f4d711;
    text-align: center;
}

ul.tabs-nav.doctor-tabs-container li.active {
    background-color: #f4d711;
    color: #3c4196;
}

.tabs-content-container h3 a {
    font-size: 1.2vw;
}

.tabs-content-container h3 {
    padding-bottom: 2%;
    font-size: 1.2vw;
}

.doctor-tabs.container .tabs-content.tabs-content-container {
    padding: 0% 0%;
}

.tab-content-wrapper span {
    color: #3c4196;
    font-size: 1.3vw;
    font-family: 'Lato-Semibold';
}

.Specialization-wrapper {
    padding: 5% 10%;
    background-image: url("/uploads/images/doctor-profile/sec-bg.png");
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center;
    background-color: #f1f1ff;
}

.Specialist-details-wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 2%;
    flex-wrap: wrap;
    width: 66%;
}

.tab-1-content {
    padding: 2% 10%;
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center;
    padding-top: 2%;
}

.Specialization-wrapper h2 {
    color: #3c4196;
    font-family: 'Lato-Semibold';
    font-size: 2vw;
    position: relative;
    margin-bottom: 3%;
    padding-top: 0%;
    margin-top: 0%;
}

.Specialization-wrapper h2::after {
    position: absolute;
    top: unset;
    bottom: -1vw;
    width: 30%;
    background-color: #f4d711;
    height: 0.5vw;

}

.Specialization-wrapper h4 {
    background-color: #fff;
    border: 1px solid #000;
    padding: 1.2% 3%;
    width: max-content;
    border-radius: 50px;
    margin-bottom: 1%;
}

.Specialization-wrapper h4 a {
    width: max-content;
    border-radius: 50px;
    margin-bottom: 1%;
    font-size: 1.2vw;
    display: block;
}

.tab-2-first-sec {
    background-color: #f2e592;
    padding: 2% 10%;
    margin: 0px;
    margin-top: -3px;
}

div#tab-2 .tab-2-first-sec h3 {
    color: #3c4196;
    font-family: 'Lato-Bold';
    font-size: 2vw;
    padding-bottom: 1%;
    text-align: center;
    margin-top: 0px;
}

div#tab-2 .tab-2-first-sec p {
    color: #000;
    font-size: 1vw;
    padding-bottom: 0%;
    text-align: center;
    position: relative;
}

.tab-2-second-sec {
    background-image: url(/uploads/images/doctor-profile/second-tab-bg.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: top right;
    padding: 5% 10%;
}


section#testid {
    margin-top: 1vw;
    margin-bottom: 0vw;
    background-image: url(/uploads/images/doctor-profile/third-tab-bg.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: top right;
}

.tab-2-second-sec .location-map {
    height: 41vw;
    padding-left: 1%;
    padding-bottom: 3%;
}

section.hp-sec5.aos-init {
    display: none !important;
}

section#testid {
    margin-top: 1vw;
    margin-bottom: -1vw;
}

span.faq-icon.ms-auto {
    top: 0.4vw;
}

.section.footer .row.aos-init {
    opacity: 1;
    transform: translateZ(0);
}

section#testid::after {
    display: none;
}



.tabs-content ul {
    padding-left: 1.5%;
}

.tabs-content ul li {
    font-size: 1.2vw;
    color: #737373;
    padding-bottom: 00.5%;
    line-height: 1.5;
    letter-spacing: 0.4px;
}


button.owl-prev-custom {
    top: 44%;
}

button.owl-next-custom {
    top: 44%;
}

@media (min-width: 767px) and (max-width: 1050px) {
    
.body-nav-fixed-menu-top div#header .menu-top .col-sm-7.col-md-7.col-xs-12 {
        width: 100% ! IMPORTANT;
        max-width: 100% !important;
    }
    div#header .button-em {
        font-size: 1.5vw;
        padding: 0.65vw 2%;
        width: 100% !important;
    }
    
        div#header a.book-btn {
        font-size: 1.5vw;
        width: 100%;
    }
    .body-nav-fixed-menu-top div#header .menu-top .col-sm-5.col-md-5 {
    width: 20%;
}
    div#header .navbar-brand>img {
        top: -1.5vw !important;
    }
    div#header .container {
        height: 7vw;
    }

    div#header .pull-right {
        width: 100%;
    }

    img.img-fluid.doctor-img-wrapper {
        width: 40%;
    }
    
    .tabs-content ul li {
    font-size: 2vw;
}

#mrg-doctor-profile-banner .banner-appointment-card {
    background: #fff;
    width: 45vw;
    padding: 3vw;
    padding-top: 1vw;
}

    .d-banner-text-wrapper h3 {
        color: #3c4196;
        font-family: 'Lato-Bold';
        font-size: 3vw;
    }

    #mrg-doctor-profile-banner .doctor-form-wrapper {
        width: 100%;
    }

    #mrg-doctor-profile-banner .doctor-prf-wrapper {
        display: block;
        width: 50%;
        margin-right: 0px;
        margin-left: auto;
        align-items: anchor-center;
    }

    #mrg-doctor-profile-banner .banner-appointment-form {
        width: 100%;
        padding: 5vh 2vw;
        display: flex;
        justify-content: left;
        padding-bottom: 0px;
        padding-right: 0px;
        padding-left: 0px;
        padding-top: 1vw;
    }

    #mrg-doctor-profile-banner .radio-box input:checked+.custom-radio::after {
        width: 1.5vw;
        height: 1.5vw;
        border: 0.6vw solid #3c4196;
    }

    #mrg-doctor-profile-banner .custom-radio {
        width: 1.5vw;
        height: 1.5vw;
        border: 0.6vw solid #f9eb88;
    }

    #mrg-doctor-profile-banner .heading {
        font-size: 3vw;
    }

    #mrg-doctor-profile-banner .heading span {
        font-size: 2.6vw;
    }

    #mrg-doctor-profile-banner .radio-box {
        font-size: 1.4vw;
    }

    #mrg-doctor-profile-banner .banner-appointment-form-wrapper label {
        font-size: 1.5vw;
    }

    #mrg-doctor-profile-banner .banner-appointment-form-wrapper input {
        font-size: 1.5vw;
    }

    .tabs-content-container h3 {
        font-size: 2vw;
    }

    .tab-content-wrapper span {
        font-size: 2vw;
    }

    .Specialization-wrapper h2 {
        font-size: 3.5vw;
    }

    .Specialization-wrapper h4 {
        padding: 1.5% 4%;
        font-size: 2.5vw;
    }

    ul.tabs-nav.doctor-tabs-container li {
        font-size: 2.2vw;
    }

    div#tab-2 .tab-2-first-sec h3 {
        font-size: 3vw;
    }

    div#tab-2 .tab-2-first-sec p {
        font-size: 2vw;
    }

    .Specialist-details-wrapper {
        width: 100%;
    }

    section#testid {
        padding: 1% 0 5%;
    }

    .tabs-content-container h3 a {
        font-size: 2vw;
    }

    .Specialization-wrapper h4 a {
        font-size: 2.2vw;
    }

    span.faq-icon.ms-auto {
        top: 0.9vw;
        width: 3.5vw;
    }

}


.d-banner-text-wrapper p {
    text-align: left;
}

    .testimonial-card p {
        text-align: left;
    }


p {
    text-align: left;
}


/* Mobile adjustments */
@media (max-width: 767px) {
    #mrg-doctor-profile-banner .doctor-prf-wrapper {
        display: block;
        width: 100%;
        margin-right: 0px;
        margin-left: auto;
        align-items: flex-end;
    }

    #mrg-doctor-profile-banner .doctor-form-wrapper {
        width: 100%;
        padding-left: 0px;
        padding-top: 0%;
    }

    .d-banner-text-wrapper h3 {
        color: #3c4196;
        font-family: 'Lato-Bold';
        font-size: 5vw;
        margin-left: 0px;
        padding-left: 0px;
        padding-top: 20%;
    }

    .tabs-nav li {
        font-size: 3.5vw;
        padding: 2vw 4vw;
    }


    #mrg-doctor-profile-banner .radio-box input:checked+.custom-radio::after {
        width: 3vw;
        height: 3vw;
        border: 0.9vw solid #3c4196;
    }

    #mrg-doctor-profile-banner .custom-radio {
        width: 3vw;
        height: 3vw;
        border: 0.9vw solid #f9eb88;
    }

    #mrg-doctor-profile-banner .heading {
        font-size: 5vw;
    }

    #mrg-doctor-profile-banner .heading span {
        font-size: 5vw;
    }

    #mrg-doctor-profile-banner .radio-box {
        font-size: 4vw;
    }

    #mrg-doctor-profile-banner .banner-appointment-form-wrapper label {
        font-size: 4vw;
    }

    #mrg-doctor-profile-banner .banner-appointment-form-wrapper input {
        font-size: 4vw;
    }

    .tabs-content-container h3 {
        font-size: 4vw;
    }

    .tab-content-wrapper span {
        font-size: 4vw;
    }

    .Specialization-wrapper h2 {
        font-size: 7vw;
        padding-bottom: 4%;
    }

    .Specialization-wrapper h4 {
        padding: 1.5% 4%;
        font-size: 5vw;
    }

    ul.tabs-nav.doctor-tabs-container li {
        font-size: 4.5vw;
    }

    div#tab-2 .tab-2-first-sec h3 {
        font-size: 6vw;
    }

    div#tab-2 .tab-2-first-sec p {
        font-size: 4.5vw;
    }
    
       
    .tabs-content ul li {
    font-size: 4vw;
}

    img.img-fluid.doctor-img-wrapper {
        position: relative;
        bottom: -6vw;
        width: 100%;
    }

    ul.tabs-nav.doctor-tabs-container {
        padding: 0px 0%;
    }

    section#doctor-pf-tab-sec .doctor-tabs.container {
        width: 100% !important;
        max-width: 100% !important;
    }

    .tabs-content-container h3 {
        font-size: 4.5vw;
        padding-left: 0px;
        padding-bottom: 8%;
        line-height: 1.3;
    }

    .tab-content-wrapper span {
        font-size: 5vw;
    }

    ul.tabs-nav.doctor-tabs-container li {
        width: 290px;
    }

    .Specialist-details-wrapper {
        width: 100%;
    }

    .Specialization-wrapper h4 {
        padding: 2.5% 5%;
        font-size: 5vw;
    }

    .Specialization-wrapper {
        padding: 10% 5%;
    }

    .tab-1-content {
        padding: 7% 5%;
        padding-top: 4%;
    }

    #bangalore-marga-faq {
        padding: 8% 6%;
    }

    .tab-2-second-sec .location-map {
        height: 90vw;
        padding-left: 0%;
        padding-bottom: 3%;
        padding-top: 3%;
    }

    .tab-2-second-sec {
        padding: 5% 5%;
    }

    .tab-2-first-sec {
        padding: 6% 5%;
        margin: 0px;
        margin-top: -3px;
    }

    .tabs-content-container h3 a {
        font-size: 4.5vw;
    }

    .Specialization-wrapper h4 a {
        font-size: 5vw;
    }

    span.faq-icon.ms-auto {
        top: 6.9vw;
        width: 8.5vw;
    }

    div#header {
        position: fixed;
        top: 0px;
        width: 100%;
    }
       .navbar-brand>img {
        height: 14vw;
        margin: 0px;
        position: relative;
        top: -10px !important;
    }
.navbar-fixed-top {
    top: 0;
    border-width: 0 0 1px;
    height: 17vw;
}
.tabs-content ul {
    padding-left: 4.5%;
}
    .tabs-content ul li {
        font-size: 5vw;
        padding-bottom: 2%;
    }
        .Specialization-wrapper h4 a {
        width: 100%;
    }
    button.navbar-toggle {
    position: relative;
    top: 5px;
}
      img.img-fluid.doctor-img-wrapper {
        position: absolute;
        bottom: unset;
        width: 80%;
        top: 2%;
        margin: auto;
        left: 10%;
    }

#mrg-doctor-profile-banner .doctor-prf-wrapper {
        display: block;
        width: 100%;
        margin-right: 0px;
        margin-left: auto;
        align-items: flex-end;
        padding-top: 120%;
    }
    
    #mrg-doctor-profile-banner {
    padding-bottom: 10%;
}
button.navbar-toggle {
    position: relative;
    top: 8px;
}

}