#details {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding: 90px 0 0
}

#details .grid-item {
    color: #fff;
    box-shadow: 0 0 10px #00000080;
    padding: 52px 27px 27px;
    float: left;
    width: 31%;
    margin: 20px;
    display: inline;
    padding-top: 0;
    border-radius: 10px
}

#details .grid-item.talks {
    width: 56%
}

#details .grid-item:first-child {
    margin-left: 0
}

#details .grid-item:nth-child(3) {
    margin-right: 0
}

#detail .grid-sizer {
    width: 33%
}

#details .span-2 {
    grid-column-end: span 2;
    grid-row-end: span 2
}

#details .span-1 {
    grid-column-end: span 1;
    grid-row-end: span 2
}

#details .iconArea {
    position: relative;
    top: -50px
}

#details .iconArea span {
    height: 80px;
    width: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #034ea1;
    border-radius: 100%;
    font-size: 40px
}

#details .iconArea span:before {
    font-size: 30px
}

#details .grid-item .detailArea h2 {
    font-family: MontserratBold;
    font-size: 16px;
    line-height: 20px;
    color: #034ea1;
    padding-bottom: 10px
}

#details .grid-item .detailArea ul {
    padding-left: 20px
}

#details .grid-item .detailArea li {
    font-family: Montserrat;
    font-size: 14px;
    line-height: 26px;
    color: #121212;
    padding-bottom: 20px;
    list-style-type: circle
}

#pageBanner.doctorProfilePage .banCont {
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 10px 10px 20px #00000080
}

#pageBanner .banCont .docDetails {
    padding: 30px 85px
}

#pageBanner .banCont .docDetails h1 {
    font-family: MontserratBold;
    font-size: 32px;
    line-height: 39px;
    color: #034ea1;
    padding-bottom: 10px
}

#pageBanner .banCont .docDetails p {
    font-family: Montserrat;
    font-size: 17px;
    line-height: 20px;
    color: #240f39;
    text-transform: uppercase
}

#pageBanner .banCont .docDetails .professionalDetails p {
    text-transform: capitalize
}

#pageBanner .banCont .docDetails .personalDetails {
    padding-bottom: 25px
}

#pageBanner .banCont .docDetails h4 {
    font-family: MontserratBold;
    font-size: 17px;
    line-height: 28px;
    color: #034ea1;
    text-transform: capitalize;
    padding-bottom: 5px
}

#pageBanner .banCont .docImg {
    position: relative
}

#pageBanner .banCont .docImg .location {
    position: absolute;
    top: 0;
    right: 10%;
    background-color: #034ea1;
    padding: 7px 16px
}

#pageBanner .banCont .docImg .location p {
    font-family: Montserrat;
    font-size: 12px;
    line-height: 15px;
    color: #fff
}

#pageBanner .banCont .docImg img {
    border-radius: 10px
}

#pageBanner .banCont .docDetails button {
    background-color: #034ea1;
    font-family: Montserrat;
    line-height: 24px;
    color: #fff;
    border: 0;
    margin-top: 20px;
    padding: 0
}

#pageBanner .banCont .docDetails button:hover {
    background-color: #034ea1
}

#pageBanner .banCont .docDetails button a {
    display: block;
    padding: 9px 23px;
    font-size: 20px
}

label.new-asd.radio-inline {
    left: 2em
}

span.backtodatetime.decas {
    width: auto
}

@media only screen and (max-width:767px) {
    #details {
        padding: 20px 0
    }

    #details .row {
        margin-right: 0;
        margin-left: 0
    }

    #details .grid-item,
    #details .grid-item.talks {
        width: 100%;
        margin: 0 0 20px
    }

    #details .iconArea span {
        width: 60px;
        height: 60px;
        font-size: 26px
    }

    #details .award .iconArea,
    #details .iconArea,
    #details .membership .iconArea,
    #details .talks .iconArea {
        top: -16%
    }

    #details .talks .iconArea {
        top: -4%
    }

    #details .talks {
        top: 0
    }

    #details .grid-item {
        padding: 15px
    }

    #details .grid-item .detailArea li {
        font-size: 14px;
        line-height: 24px;
        padding-bottom: 20px
    }

    #details .award .iconArea,
    #details .membership .iconArea {
        top: -10%
    }

    #pageBanner.doctorProfilePage {
        padding: 20px 0
    }

    #pageBanner .banCont .docDetails {
        padding: 20px
    }

    #pageBanner .banCont .docDetails h1 {
        font-size: 18px;
        line-height: 28px;
        padding-bottom: 5px
    }

    #pageBanner .banCont .docDetails p {
        font-size: 14px
    }

    #pageBanner .banCont .docDetails .personalDetails {
        padding-bottom: 10px
    }

    #pageBanner .banCont .docDetails h4 {
        font-size: 16px
    }

    #pageBanner .banCont .mobImg img {
        border-top-right-radius: 10px;
        border-top-left-radius: 10px
    }

    #pageBanner .banCont .docDetails button a {
        padding: 5px 15px;
        font-size: 15px
    }

    #details .iconArea {
        position: static;
        margin-bottom: 15px
    }
}

@media screen and (min-width:768px) and (max-width:991px) {
    #pageBanner.doctorProfilePage {
        background-position: left
    }

    #details .grid-item,
    #details .grid-item.talks {
        width: 100%;
        margin: 0 0 80px
    }

    #details .talks {
        top: 0
    }

    #details .award .iconArea,
    #details .membership .iconArea {
        top: -22%
    }

    #details .talks .iconArea {
        top: -11%
    }

    #details .grid-item .detailArea li {
        font-size: 15px;
        padding-bottom: 18px
    }

    #pageBanner .banCont .docDetails {
        padding: 30px 50px
    }

    #pageBanner .banCont .docDetails h1 {
        font-size: 20px;
        padding-bottom: 5px
    }

    #pageBanner .banCont .docDetails p {
        font-size: 14px
    }

    #pageBanner .banCont .docDetails .personalDetails {
        padding-bottom: 15px
    }
}

@media screen and (min-width:992px) and (max-width:1199px) {
    #details .grid-item {
        margin: 38px;
        padding: 52px 15px 15px
    }

    #details .grid-item .detailArea li {
        font-size: 15px;
        padding-bottom: 20px
    }

    #details .talks .iconArea {
        top: -11%
    }

    #pageBanner .banCont .docDetails h1 {
        font-size: 26px;
        padding-bottom: 0
    }

    #pageBanner .banCont .docDetails p {
        font-size: 16px
    }

    #pageBanner .banCont .docDetails {
        padding: 25px 85px
    }
}

span.apply-error {
    font-size: 10px !important
}

.price-book-btn {
    justify-content: space-between;
    align-items: center;
    margin: auto;
    padding: 0 10px !important
}

.form-group.patient-manipal-back {
    display: block;
    margin: 10px 0
}

.price-book-btn p {
    color: #090909 !important;
    font-size: 12px !important;
    font-weight: 500;
    line-height: 10px;
    padding: 15px 0 10px
}

h3#old_mobile_no_vc894 {
    color: #034ea1;
    padding: 5px 0
}

.otp-appointment-vc span {
    font-size: 12px !important;
    font-weight: 500;
    color: #024e9f;
    margin: 5px;
    left: 5px !important
}

input#otp_got_vc3 {
    width: 100% !important
}

.timeleft {
    font-size: 12px
}

span#otp_check_vc3 {
    width: fit-content;
    padding: 5px;
    position: static;
    font-size: 12px !important
}

p.otp-mobile {
    font-weight: 500;
    text-align: center
}

.checkbox-inline+.checkbox-inline,
.radio-inline+.radio-inline {
    margin-left: 10px
}

.width-booking-form {
    width: 100%;
    padding: 5px
}

p.registaryion-details {
    text-align: center
}

h3#old_mobile_no_vc894 {
    color: #034ea1
}

.checkbox-refund {
    display: inline-flex
}

input[type=checkbox],
input[type=radio] {
    margin: 5px
}

.checkbox-refund label {
    font-size: 12px
}

.checkbox-refund span {
    font-size: 12px;
    line-height: 12px;
    cursor: pointer
}

input#opd3 {
    margin: 0
}

.form-group {
    margin-bottom: 20px !important;
    margin-right: 5px
}

input,
input::-webkit-input-placeholder {
    font-size: 12px !important;
    color: #000 !important
}

span.close.closeModal {
    margin: -35px -30px !important
}

textarea#address_vc894 {
    width: 100%;
    padding-left: 15px;
    border: 1px solid #ccc;
    border-radius: 5px
}

span.back-reg-step1 {
    padding-left: 12px
}

.form-group.new-user-manipal {
    text-align: center
}

.scroll-form {
    height: 275px;
    overflow-y: scroll;
    overflow-x: hidden
}

.scroll-form1 {
    height: 380px;
    overflow-y: scroll;
    overflow-x: hidden
}

.scroll-form2 {
    height: 340px;
    overflow-y: scroll;
    overflow-x: hidden
}

.all_patient_details {
    height: auto;
    overflow-y: scroll;
    overflow-x: hidden
}

p.registaryion-details {
    font-size: 16px !important
}

.notofication-details-bar {
    padding-left: 25px
}

.notofication-details-bar p {
    line-height: 12px !important
}

span.backtodatetime {
    margin-bottom: 5px
}

.st1-data {
    width: 25px !important;
    height: 26px !important;
    padding-top: 5px !important;
    margin: 2px !important
}

hr {
    margin-top: 12px;
    margin-bottom: 12px
}

.nd2-data,
.rd3-data {
    margin: 4px !important
}

.pending-fill {
    margin: 0 !important
}

.fill-details,
.filled-details {
    margin: 0 !important
}

p.new-user-declaration {
    font-size: 12px;
    line-height: 14px
}

p.consent {
    font-size: 12px
}

p.hereby-decleartion {
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    padding: 10px 0
}

.payment-description-wrap {
    padding: 15px 10px !important
}

.payment-form td:nth-child(1) {
    width: 35%;
    border: none;
    padding: 8px 0
}

.payment-form td:nth-child(2) {
    width: 65%;
    color: #034ea1;
    border: none;
    border-left: 1px solid #a4c8ef
}

p.control-data {
    font-size: 12px !important;
    font-weight: 500;
    line-height: 12px
}

.heading-para {
    font-weight: 600;
    padding: 0 5px 5px
}

.overview-padding {
    padding: 10% 0
}
#clicked_value font{
    font-size: 9px;
}
@media screen and (max-width:1200px) {
    .fixed-form {
        position: absolute;
        top: 0;
        width: 300px;
        z-index: 99;
        right: 15px
    }

    .section-heading {
        padding: 10px 5px
    }

    .section1-paragraph {
        font-size: 10px;
        font-weight: 600
    }

    select.form-control.mutli-doc-select {
        font-size: 10px;
        font-weight: 600
    }

    input#videoc894 {
        display: contents
    }

    input#opd894 {
        display: contents
    }

    .videoc {
        padding: 5px 2px !important
    }

    input[type=radio]:checked~label {
        padding: 8px
    }

    p.hereby-decleartion {
        overflow-y: scroll;
        height: 50px
    }
}

@media screen and (max-width:768px) {
    .fixed-form {
        position: static;
        width: 100%;
        display: block
    }

    .section2 {
        overflow: hidden
    }

    .opd-video {
        justify-content: space-evenly !important;
        display: flex !important;
        padding: 10px
    }

    .opd-video .opd {
        font-weight: 400 !important;
        font-size: 12px !important;
        padding: 8px 7px !important;
        cursor: pointer
    }

    .videoc {
        font-size: 12px !important;
        padding: 8px 12px !important
    }

    #navbar-new .bookNow {
        width: 30% !important
    }

    p.heading-para {
        font-size: 16px !important;
        margin-bottom: 10px
    }

    p.registaryion-details {
        font-size: 18px !important
    }

    .section1-paragraph {
        font-size: 16px !important
    }

    select.form-control.mutli-doc-select {
        width: 40% !important;
        font-size: 16px
    }

    .section2-headpara {
        font-size: 14px !important
    }

    .width-booking-form h4 {
        font-size: 24px
    }

    .form-group {
        font-size: 16px
    }

    .form-group span {
        font-size: 16px
    }

    span.backtodatetime {
        font-size: 14px
    }

    .new-user-manipal p {
        font-size: 16px !important;
        padding: 5px 10px
    }

    .fill-details,
    .filled-details {
        width: 25% !important
    }

    .pending-fill {
        width: 25% !important
    }

    .nd2-data,
    .rd3-data,
    .st1-data {
        width: 30px !important;
        height: 30px !important;
        padding-top: 10px !important;
        margin: auto !important
    }

    textarea#address_vc894 {
        height: 28px
    }
}

@media only screen and (min-device-width:320px) and (max-device-width:450px) {
    .banner-appointment {
        min-height: 1450px !important
    }
}

@media screen and (max-width:500px) {
    .backtodatetime {
        font-size: 10px !important
    }

    .booknowSection {
        margin-top: 25px
    }

    .banner-appointment {
        min-height: auto !important
    }

    .doc-description-tabs {
        top: -1em !important
    }

    .section2 {
        height: auto
    }

    .section-heading {
        padding: 10px 5px !important
    }

    p.heading-para {
        font-size: 12px !important;
        margin-bottom: 0
    }

    .price-book-btn p {
        font-size: 10px !important
    }

    span#main-price-hv894 {
        font-size: 10px
    }

    .section1-paragraph {
        font-size: 12px !important
    }

    select.form-control.mutli-doc-select {
        width: 60% !important;
        font-size: 10px !important;
        margin-top: 2px
    }

    .padding-top-10 {
        padding-top: 0 !important;
        font-size: 10px !important
    }

    .opd-video {
        justify-content: space-between !important;
        padding: 10px 0
    }

    .opd-video label.opd,
    label.videoc {
        width: 46%;
        padding: 8px 2px !important;
        line-height: 12px !important;
        font-size: 8px !important;
        text-align: center
    }

    .prime {
        font-size: 8px !important;
        padding: 8px 2px !important;
        width: 46%;
        text-align: center;
        margin: auto
    }

    .width-booking-form h4 {
        font-size: 18px;
        margin: 0
    }

    .form-group {
        font-size: 14px;
        margin: 0
    }

    .form-group span {
        font-size: 14px
    }

    span.backtodatetime {
        float: left
    }

    .new-user-manipal p {
        padding: 0 0
    }

    .notofication-details-bar {
        padding-left: 0
    }

    .fill-details,
    .filled-details {
        width: 25% !important
    }

    .pending-fill {
        width: 25% !important
    }

    .nd2-data,
    .rd3-data,
    .st1-data {
        width: 20px !important;
        height: 20px !important;
        padding-top: 3px !important;
        margin: 5px !important
    }

    span.back-reg-step1 {
        padding-left: 12px;
        width: 32%;
        float: left
    }

    p.new-user-declaration {
        font-size: 8px !important;
        line-height: 10px !important;
        height: 50px;
        overflow-y: scroll
    }

    span.back-reg-step1,
    span.back-reg-step2,
    span.backtodatetime,
    span.backtouhid,
    span.new-user-next1 {
        top: 22px;
        float: left
    }

    span.back-reg-step1,
    span.backtodatetime,
    span.backtouhid,
    span.new-user-next1 {
        top: 10px !important;
        float: left
    }

    span.apply-error {
        position: relative;
        padding: 18px 0 !important;
        text-align: left;
        float: left;
        height: 36px
    }

    div#navbar-new .section2 {
        padding: 9px;
        margin-bottom: 20px
    }

    .price-book-btn {
        width: 100% !important;
        position: relative;
        bottom: 0
    }

    .price-book-btn-hospital {
        margin-top: 5px
    }

    button#new_user_register_me_vc894 {
        width: 50% !important
    }

    #navbar-new .bookNow {
        width: 58% !important;
        float: right;
        margin: 0 !important;
        padding: 8px 5px !important
    }

    p.unit-name-reg {
        display: contents
    }

    p.new-user-declaration {
        font-size: 10px !important;
        line-height: 10px !important;
        height: 50px
    }

    .new-user-manipal-next1 span {
        font-size: 10px !important;
        line-height: 12px !important
    }

    .apply.apply-error.relation_added {
        margin: 2px !important
    }

    p.consent {
        font-size: 12px;
        margin-top: 2px
    }

    p.hereby-decleartion {
        overflow-y: scroll;
        height: 50px
    }

    #navbar-new .bookNow {
        font-size: 12px;
        padding: 10px !important;
        margin: 0 0 0 !important
    }

    .width-booking-form {
        margin-bottom: 0
    }
    span#patientNoVcError894 {
        margin-bottom: 30px
    }

    p.control-data {
        font-size: 10px !important;
        font-weight: 500;
        line-height: 12px
    }

    .checkbox-inline,
    .radio-inline {
        padding-left: 25px
    }

    input[type=checkbox],
    input[type=radio] {
        margin: 3px
    }
    .scroll-form .form-group{
        margin-bottom: 0px !important;
    }

}

@media screen and (max-width:320px) {

    .opd-video label.opd,
    label.videoc {
        width: 49%;
        padding: 8px 4px !important;
        line-height: 12px !important;
        font-size: 8px !important;
        text-align: center
    }
}
.read-time{
    width: unset !important;
    height: unset !important;
    margin: auto 2px !important;
  }
  
.form-control {
    padding: 6px 12px 2px;
}