/* Full screen loader */

.page-loader {
    position: absolute;
    top: 0%;
    left: 0;
    width: 100%;
    height:100%;
    background: rgba(255,255,255,0.9);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9;
}
.new-plan-message { font-size: 22px !important; width:70% !important; font-weight: bold; }
.estimated-monthly .input-section span {
    text-align: center;
}
.plan-expired { font-size:18px !important; color:red !important}
.term-area { margin-top:3% !important }
/* Simple spinner */
.spinner {
    width: 40px;
    height: 40px;
    border: 4px solid #ccc;
    border-top: 4px solid #007bff;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

/* Animation */
@keyframes spin {
    100% {
        transform: rotate(360deg);
    }
}

.tableData table th:first-child {
    width: 13%;
}
.subsciption-tble-data {
    position: relative;
}
.error {
    font-size: 13px;
    text-align: left;
}
.content.dashboard {
    padding-bottom: 50px;
}
.subscribe-class .container {
    overflow-y: hidden;
}
.radiobtn-class {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 25px;
    padding-top: 20px;
}

.hides { visibility: hidden; }
.radiobtn-class label {
    font-size: 15px;
    color: #000!important;
}
.content-wrapper::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.7);
    z-index: 0;
}
.container {
    padding: 0px 0;
}
.plan_list_outer { position: relative;background: #FFFFFF; border: 1px solid #DDE3EA; border-radius: 12px; padding: 0px;box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04); margin-top: 20px; display: flex; }

.content-wrapper.fixed-margin {
    padding-bottom: 0px;
    padding-top: 0px;
    height: auto!important;
}
.checkbox-class input[type="radio"] {
    display: none;
}
.checkbox-class input[type="radio"] + label {
    display: inline-block;
    position: relative;
    padding-left: 4px;
    cursor: pointer;
    font-size: 16px;
    color: #333;
}
span.pay-label {
    position: relative;
    top: -9px;
}
.checkbox-class input[type="radio"] + label::before {
     content: "";
    position: absolute;
    left: 0;
    top: -3px;
    width: 2px;
    height: 2px;
    border: 1px solid #333;
    background: white;
    box-sizing: border-box;
    visibility: hidden;
}
.checkbox-class input[type="radio"]:checked + label::after {
  content: "\2713";
    position: absolute;
    left: 0px;
    top: -3px;
    font-size: 2px;
    color: #000;
    font-weight: 800;
    visibility: hidden;
}
.slider {
    position: relative;
    width: 80%;
    max-width: 800px;
    height: 519px; /* Fixed height to avoid jumping */
    overflow: hidden;
    border-radius: 10px;
    background-color: #000; /* Black background to handle image transitions */
}
.slides {
    display: flex;
    transition: transform 0.5s ease-in-out;
    height: 100%;
}
.slide {
    min-width: 100%;
    height: 100%;
    box-sizing: border-box;
}
.slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.slider-button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(0, 0, 0, 0.5);
    color: #fff;
    border: none;
    border-radius: 5px;
    padding: 10px 15px;
    cursor: pointer;
    font-size: 18px;
    z-index: 10;
}
.prev {
    left: 10px;
}
.next {
    right: 10px;
}
.slider-button:hover { background-color: rgba(0, 0, 0, 0.8); }
.button-section { position: absolute; bottom: 0%; z-index: 10; height: 100%; width: 100%; background-color: rgba(0, 0, 0, 0.2); }
button.slider-button.prev, .nextSlide { z-index: 9999; }
.row.subscription_screen { margin: 0; }
.d_flex_align_print { display: flex; align-items: center; padding: 15px 30px 0 0; }
#patient_subscription_form .plan_box_outer { padding: 0px 20px 25px 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.subscription-heading { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 20px; background: #fffbeb; border: 1px solid #fde68a; border-radius:8px; font-size: 13px; font-weight: 600 !important; color: #92400e !important; margin-bottom: 20px; }
.new_dashboard_main.medaillion_subscription_section .plan_box_outer.single-plan-box { border: none; background: #fff; padding: 20px 20px; }
.plan_box_outers { width: 100%; padding: 40px; border: 1.5px solid #000; max-width: 1090px; margin: 0 auto; border-radius: 5px;}
.plan_box_outer { width: 100%; display: inline-block; text-align: center; max-width: 99%; margin: 0 auto;}
#patient_subscription_form .plan_box_outer.single-plan-box .plan_box_inner { width: 100% !important; align-items: center; background: #e8f6fc;}
#patient_subscription_form .plan_box_inner { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#patient_subscription_form .plan_box_inner { max-width: 100%; margin-bottom: 0; width: 54%;}
.single-plan-box .plan_box_inner { width: 50% !important; }
.plan_box_inner { width: 100%; margin: 0 auto 30px; max-width: 400px; display: inline-block; text-align: center; vertical-align: top;}
#patient_subscription_form .plan_box_outer.single-plan-box .plan_box_inner > div { flex-basis: 100%; }
.single-plan-box .plan_box_list { width: 100%; }
.plan_box_outer .plan_box_list { width: 50%; padding: 0 10px; }
.plan_box_outer .plan_box_list { width: 100%; padding: 0 0px 0 0; display: inline-block; }
.plan_box_outer .plan_box_list.active_plan .premium-blk { border-color: #2b9bcc; }
.plan_box_outer .premium-blk { box-shadow: 1px 0 8px 1px #ddd; width: 100%; border: 1.5px solid #c8eaf6; border-radius: 12px; background: #e8f6fc; padding: 10px 15px 5px; margin-bottom: 0px;position: relative; overflow: hidden; }
.premium-blk.patient-subc .pro-head-bx { margin: 0 0px; }
.pro-head-bx { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0px 0 10px; }
.new_dashboard_main.medaillion_subscription_section .plan_box_outer.single-plan-box h3 { font-size: 20px !important; }
.plan_box_outer .plan_box_list.active_plan .premium-blk h3 { color:#1a9fd4 !important; font-weight: 600; }
.plan_box_outer .premium-blk h3 { background: none !important; border-radius: 0; color: #000; font-size: 30px; padding: 0; text-align: center; text-shadow: none; }
.patient-subc h3 { text-align: left !important; font-size: 24px !important; margin-top: 0px !important; }
.new_dashboard_main.medaillion_subscription_section .row.pro_plan_desc { display: flex; flex-wrap: wrap; }
.row.pro_plan_desc { padding: 15px 0; }
.patient-subc .row { margin-left: 1px; margin-right: 1px; }
.pro_plan_desc table { width: 100%; margin-top:-1%; }
.new_dashboard_main.medaillion_subscription_section .row.pro_plan_desc table tr { border-bottom: 1px solid #e3e0e0; }
.pro_plan_desc tr td:first-child { width: 27%; padding: 15px 0px; }
.pro_plan_desc .img-resoinsive { width: 100%; }
.pro_plan_desc .img-resoinsive { width: 100%; max-width: 54px; margin: 0 auto; }
.pro_plan_desc .img-resoinsive { width: 100%; max-width: 80px; }
.pro_plan_desc tr td:nth-child(2) { width: 73%; padding: 10px 0px; line-height: 16px; }
.new_dashboard_main.medaillion_subscription_section .pro_plan_desc span { font-size: 16px; display: block; padding-bottom: 2px; font-weight: bold; }
.new_dashboard_main.medaillion_subscription_section .pro_plan_desc span { font-weight: 500; }
.new_dashboard_main.medaillion_subscription_section .pl_sub { font-size: 13px; font-weight: 400; }
.patient-subc p { color: #000; font-size: 14px !important; margin-bottom: 5px; line-height: normal !important; text-align: center !important; padding-bottom: 10px !important; font-weight: 400 !important; width: 100% !important; }
.plan_box_inner p { text-align: left !important; padding: 0 !important; }
.plan-flex { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 10px 10px; margin-bottom: 10px; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
.radio_tick_outer { width: 100%; display: inline-block; }
.new_dashboard_main.medaillion_subscription_section .subscription_message { color: #9c9c9c; text-align: left !important; }
.radio_tick_outer p { font-size: 15px; text-align: left; margin-bottom: 15px; }
.plan_box_inner p { text-align: left !important; padding: 0 !important; }
.patient-subc .sub-price h4 { line-height: 21px; }
.patient-subc h4 { font-size: 32px; font-weight: 500; }
.sub-price h4 .total_fee { font-size: 24px !important; position: unset; margin: 0px -10px; }
.patient-subc span.total_fee { top: 10px; position: relative; font-weight: 600; font-size: 21px !important; padding: 0; width: 100%; display: flex; padding: 0px 10px 0px 0px; flex-direction: column; }
.sub-price h4 #price { font-size: 24px; margin: 0; }
.per-mnth { font-size: 14px; color: #505050; font-weight: 500; }
#patient_subscription_form .choose_subscription_plan_outer { max-width: 100%; padding: 0 10px; padding-left: 0px; width: 100%; margin-top: 178px; }
.single-plan-box .choose_subscription_plan_outer { width: 100% !important; }
.choose_subscription_plan_outer { width: 100%; display: inline-block; text-align: center; max-width: 600px; padding-left: 30px; }
.exiting-cd { margin: 0 0 5px; }
.radio_tick_outer { width: 100%; display: inline-block; }
.choose_subscription_plan_outer ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.radio_tick_outer ul { width: 100%; display: flex; padding-left: 0px; margin-top: 10px; gap: 20px; margin-bottom: 0rem; }
.choose_subscription_plan_outer ul li { width: auto; padding-right: 0px; }
.exiting-cd li { margin: 0 0 10px !important; }
.patient-subc li { margin-bottom: 0 !important; }
.radio_tick_outer li { width: auto; display: inline-block; list-style: none; margin-bottom: 22px; text-align: left; position: relative; }
.radio_tick_outer li label { position: relative; width: 100%; display: inline; }
.radio_tick_outer li label { position: relative; }
.sg-full-wd { width: 100%; }
.new_dashboard_main.medaillion_subscription_section .radio_tick_outer .label_name { font-size: 14px; }
.patient-subc span.label_name { padding-left: 24px; }
.patient-subc span.label_name { padding-left: 30px; font-weight: 500; display: block; }
.exiting-cd li span { font-size: 15px !important; }
.new_dashboard_main.medaillion_subscription_section .plan_box_outer.single-plan-box h3 { font-size: 20px !important; }
.card_detail_outer h3, .user-information-section h3 { text-align: left; font-size: 16px; font-weight: 600; color: #1a2535; display: flex; align-items: center; gap: 8px;}
.card_detail_outer .form_list_outer { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap;flex-flow: row wrap;align-items: center;width: 100%;margin-bottom: 20px;}
.card_detail_outer .left_side { width: 50%; padding-right: 15px; position: relative; }
.text_blck h6, label { color: #303030 !important; font-size: 17px; }
.text_clor_sech h6, label { color: #fff !important; }
.card_detail_outer .form_inner { position: relative; }
.form_inner { width: 100%; display: inline-block; text-align: left; }
.card-badge { display: flex; gap: 22px; }
.security-badge { display: flex; align-items: center; gap: 5px; font-size: 14px; color: #16A34A; font-weight: 500; border-radius: 20px; padding: 3px 10px; width: 163px; justify-content: center; }
.card_detail_outer .form-control { outline: none; position: relative; background:#fff; width: 100%; height: 40px; color: #1a1a1a !important; font-size: 13px; box-shadow: none; padding: 0 15px; padding-top: 0px; border-radius: 0; font-family: "Encode Sans", sans-serif; font-weight: 500; left: auto; bottom: auto; border-color: #000; }
.card-section .form-group { position: relative; }
span.card-suffix { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); font-size: 15px; color: #92400e; pointer-events: none; }
.total-fee-text .currency-font { font-size: 20px !important; color: #1a2535 !important; line-height: 1.1; font-variant-numeric: tabular-nums; margin-bottom: 0px; }
.total-fee-text .currenttimefont-class { font-size: 17px; font-weight: 400 !important; color: #64748b; }
.card_detail_outer .right_side { width: 50%; position: relative; padding-left: 15px; }
.card_detail_outer .subscribe_btn, #patient_app_details .subscribe_btn { display: inline-block; vertical-align: middle;padding: 9px 15px; color: #fff; font-size: 14px; font-weight: 600;margin-top: 0px;border: 0px;background: #00b050 !important;border-radius: 10px;border: 1.5px solid #000;}
.row.pro_plan_desc { padding: 0px 0px 0px; }
.pro_plan_desc td { border: none !important;}
.pro_plan_desc tr:last-child td { border: none !important; }
.pro_plan_desc table { border-bottom: 0px solid #ddd; }
.pro_plan_desc .img-resoinsive { margin-left: 35px; }
p.pl_sub { width: 100%; text-align: left !important; color: #000; font-size: 15px !important; padding-bottom: 15px !important; border-bottom: 1px solid #ddd;}
.plan-flex { border: none; border-bottom: 1px solid #ddd; width: 100%; padding: 6px 0px 12px !important; }
.plan-flex .sub-text { width: 50%; padding-right: 10px; }
button#continueBtn { position: relative; left: 10px; top: 5px; }
label.selectProviderLabel { color: black !important; font-size: 14px; position: relative; top:3px; }
span.error.selectProviderSlabError { font-size: 13px; position: absolute; top: 43px; left: 150px; z-index: 9999; }
.selectprovider-class { display: flex; align-items: center; margin-top: 14px!important; gap: 5px; margin-left: 0px; }
label.termsPolicyError.msgerror { position: unset; }
.term-privay label { margin-right: 15px; }
.term-privay input { position: relative; top: 2px; }
.toggle-container { display: flex; align-items: center; justify-content: center; margin-bottom: 20px; }
.toggle-container .switch { position: relative; display: inline-block; width: 120px; height: 34px; }  
.toggle-container .switch input { opacity: 0; width: 0; height: 0; }  
.toggle-container .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color:#001b50; transition: 0.4s; border-radius: 34px; display: flex; align-items: center; justify-content: center; font-size: 18px; color: white; font-weight: bold; height: auto; width: 115px!important; max-width: 100%; }  
.toggle-container .slider:before { position: absolute;content: "";height: 26px;width: 26px;border-radius: 50%;left: 4px;bottom: 4px;background-color: white;transition: 0.4s;}  
.toggle-container input:checked + .slider { background-color: #001b50; }  
.toggle-container input:checked + .slider:before { transform: translateX(79px); }
.toggle-container input:checked + .slider #toggle-text { content: "Monthly"; color: white; text-align: left; margin-right: 32px; }  
.toggle-container input:not(:checked) + .slider #toggle-text { content: "Annual"; color: white; margin-left: 29px; font-size: 16px; }
.subscription-options tr:last-child td { border-bottom: 0px solid #ccc!important;  }
.tableData tr:last-child td { border-bottom: 1px solid #ccc!important; }
.subscription-options .tableData table { width: 100%; border-collapse: collapse; border-radius: 12px; overflow: hidden; border: 1px solid #dde3ea; font-size: 13px; }
.tableData tbody tr { border-bottom: 1px solid #eef1f5; }
.annually_label { margin-top:15px;margin-bottom: 4px;}
.checkbox-class label { color: #000 !important }
.content.dashboard { position: relative;}
.tableData { padding: 5px 20px 0px 20px; width: 100%; max-width: 99%;}
.subscription-options { justify-content: start!important; margin-top: 0.5%!important; }
.monthly-section label {margin-bottom: 1px;}
.subscribe-class .container { height: auto!important; }
.monthlyDiscountTd{ font-size: 14px !important; font-weight: bold !important; background: #95e99b; color: #000; }
.monthlyDiscountTd0{ font-size: 14px !important; font-weight: bold !important; background: #f1f5f9; color: #000; }
.monthlyDiscountTd1{ font-size: 14px !important; font-weight: bold !important; background: #95e99b; color: #000; }
.monthlyDiscountTd2{ font-size: 14px !important; font-weight: bold !important; background: #95e99b; color: #000; }
.monthlyDiscountTd3{ font-size: 14px !important; font-weight: bold !important; background: #95e99b; color: #000; }
.monthlyDiscountTd4{ font-size: 14px !important; font-weight: bold !important; background: #95e99b; color: #000; }
.monthlyDiscountTd5{ font-size: 14px !important; font-weight: bold !important; background: #95e99b; color: #000; }
.monthlyDiscountTd6{ font-size: 14px !important; font-weight: bold !important; background: #95e99b; color: #000; }
.monthlyDiscountTd7{ font-size: 14px !important; font-weight: bold !important; background: #95e99b; color: #000; }
.annuallyDiscountTd0{ font-size: 15px !important; font-weight: bold !important; background: #f1f5f9; color: #000; }
.annuallyDiscountTd1{ font-size: 16px !important; font-weight: bold !important; background: #dcfce7; color: #000; }
.annuallyDiscountTd2{ font-size: 16.5px !important; font-weight: bold !important; background: #bbf7d0; color: #000; }
.annuallyDiscountTd3{ font-size: 17px !important; font-weight: bold !important; background: #bfdbfea1; color: #000; }
.annuallyDiscountTd4{ font-size: 17.5px !important; font-weight: bold !important; background: #bfdbfe; color: #000; }
select#selectProviderSlab { width: 72px; }
.tableData td:last-child span { background: transparent; }
.tableData td:last-child span { background: transparent; font-size: 14px !important; font-weight: 400 !important;}
.subscription-options { background: #fff; border: 1px solid #dde3ea; border-radius: 20px; box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1), 0 2px 8px rgba(0, 0, 0, 0.06); }
select#selectProviderSlab{ height: 43px; width: 100px;}
.current-plan.col-md-6,.next-plan.col-md-6 { flex: 0 0 100%; max-width: max-content; }
button.btn.btn-primary.couponApplyBtn { position: relative; right: 0px; display: inline-block; vertical-align: middle; padding: 7px 20px; color: #fff; font-size: 14px; font-weight: 600; margin-top: 0px; border: 0px; background: #4880FF !important; border-radius: 6px; top: 0px; }
span#couponMessage { width: 100%; right: 8px; font-size: 12px !important; text-align: right; }
.couponwrapper-class { margin-top: -15px; display: flex; gap: 10px; align-items: center; }
.previewPlan { margin: 0rem; background: #1a9fda !important; font-size: 15px; font-weight: 600; display: none; }
.estimated-monthly { padding: 8px 20px; background: linear-gradient(135deg, #f8fbff 0%, #eef6fc 100%); border-bottom: 1px solid #dde3ea; justify-content: space-around; display: flex; }
.subscription-options th:last-child { border-right: 1px solid #ccc !important; }
.tableData table tr th { background: #f4f8fc; }
.tableData tbody tr:nth-child(even) { background: #fafcff; }
.subscription-options tr td:last-child { border-right: 0px solid #ccc !important; }
.tableData tr td:last-child { border-right: 0px solid #ccc !important; }
.tableData th, td { border-left: 0px solid #ccc !important; border-top: 0px solid #ccc !important; }
.input-section span,.plans span { text-align: left; width: 100%; display: block; padding-bottom: 10px; color: #1a9fd4; font-weight: 600; font-size: 19px; }
.plans span{ text-align: center; }
.plans .row { display: flex; gap: 10px; align-items: stretch; flex-wrap: wrap; padding-right: 10px; justify-content: end; }
.plan { border: 1px solid #000; border-radius: 8px; padding: 11px 15px 4px; cursor: pointer; transition: all .2s ease; position: relative; background: #fff; min-width: 200px; }
.appointment-number-area { width: 100%; }
span.badge { position: absolute; top: -14px; right: 9px; font-size: 12px; font-weight: 400; padding: 4px 8px; border-radius: 8px; letter-spacing: .5px; background: #00b04f; width: max-content; color: #fff; font-weight: bold; }
span.badge.gold-color { background: #f59e0b; }
.plan h6 { font-size: 15px; font-weight: 600; color: #333; }
.input-section .form-control { height: 44px; background-color: #fff; border-color: #000; border-radius: 8px !important; color: #000; font-weight: 700; }
.no-of-providrs { display: none;}
.subsciption-detals-main { display: flex !important; column-gap: 15px; flex-wrap: wrap; justify-content: space-between; }
.subsciption-right-detail-bx { flex: 0 0 49%; max-width: 49%; }
.term-privay { width: 100%; border-top: 1px solid #c8eaf6; padding-top: 3px; }
.subscription-heading { text-align: center; width: 100%; }
.plans .active { border-color: #1a9fd4; color: #1a9fd4; background: rgb(201, 255, 201); box-shadow: 0 0 0 1px rgba(26, 159, 212, 0.15); }
.plans .active.plan h6 { font-size: 15px; color: #000; font-weight: 600; }
.form-control:disabled, .form-control[readonly] { border-color: #dde3ea; }
@media screen and (max-width: 1920px) {
    .selectprovider-class { margin-left: 0px; padding-left: 12px; }
    .page-loader { top: 0%;}
    .subscribe-class .container { max-width: 90%; }
}
@media (max-width: 1800px){
    .pro_plan_desc table { margin-top:-5px !important}
    label.selectProviderLabel {text-align: left; width: 100%;}
    .selectprovider-class { margin-left: 0px; padding-left: 0px; }
    .tableData table th:first-child { width: 15%; }
    .plan { padding: 11px 10px 4px; }
    .estimated-monthly .plans.col-md-8 { flex: 1; max-width: max-content; }
    .step-one { width: 23% }
    .step-two { width:23% }
    .step-three { width:65% }
}

@media screen and (max-width: 1700px) {
    .pro_plan_desc table { margin-top:-5px !important}
    .offset-md-1 { margin-left: 4%; }
    .plans.col-md-8 { flex: 70%; max-width: 70%;}
}

@media screen and (max-width: 1620px) {
    .pro_plan_desc table { margin-top:-18px !important}
    .plan-row .current-plan label, .plan-row .next-plan label { font-size: 20px!important; }
    p.subscription-text { font-size: 15px; }
    .patient-subc span.total_fee { font-size: 18px !important; max-width: 100%; top: 0px; padding-right: 0px; }
    .pro_plan_desc tr td:first-child { width: 30%; }
    select#selectProviderSlab { height: 36px; }
    span.error.selectProviderSlabError { top: 43px; }
    label.termsPolicyError.msgerror { font-size: 13px!important; }
    td.total-fee-text { padding-right: 5px!important; }
    .input-section .form-control { height: 40px; }
    .estimated-monthly button#previewBtn { font-size: 15px; padding: 7px 20px; }
    span.badge { font-size: 10px !important;}
    .plan_box_inner p { padding-left: 10px !important;  }
    .term-privay p {    padding-left: 0px !important;   }
    span.text-centers { margin-top: 8px !important; }
    .input-section span, .plans span {  font-size: 18px; }
}
@media screen and (max-width: 1460px) {
    .pro_plan_desc table { margin-top:-5px !important}
    .subscribe-class .container { max-width: 95%; }
    .plan h6 { font-size: 14px; }
    .estimated-monthly button#previewBtn { font-size: 14px; padding: 7px 15px; }
    .plan {padding: 10px 5px 4px;min-width: 190px; }
}
@media screen and (max-width: 1450px) {
    .offset-md-1 { margin-left: 2%; }
    .plans.col-md-8 { flex: 72%; max-width: 72%; }
}
@media screen and (max-width: 1400px) {
    .subscription-options { margin-top: 2%!important; }
    .container.my-5.subscription-options { margin-bottom: 0px !important; }
    .subscription { padding-bottom: 0px!important; }
    .pro_plan_desc tr td:first-child { width: 110px; }
    .current-plan.col-md-6, .next-plan.col-md-6 { flex: 0 0 100%; max-width: 450px; }
    .selectprovider-class { padding-left: 0px; }
    .patient-subc span.total_fee { font-size: 15px !important; }
    .patient-subc p { font-size: 13px !important; }
    .pro_plan_desc tr td:nth-child(2) { line-height: 16px;  }
    .plan_box_outer .premium-blk { padding-bottom: 0px; } 
    .card_detail_outer h3, .user-information-section h3 { font-size: 15px; } 
    .exiting-cd li span { font-size: 14px !important; }
    .card_detail_outer .form-control { height: 28px; font-size: 12px; }
    .subscription-confirm-cancel-btn .form_inner.cancel-btn { font-size: 14px; }
    .subscription-options .tableData th { padding: 4px 8px !important; }
    .annually_label { margin-bottom: 2px; }
    .card_detail_outer input::placeholder { font-size: 12px !important; }
    .page-loader { top: 0%;}
    .offset-md-1 { margin-left: 0%; }
    .plans.col-md-8 { flex: 74%; max-width: 74%; }
    .estimated-monthly { padding: 25px 20px 25px; }
    .total-fee-text .currency-font { font-size: 24px !important; }
    .total-fee-text .currenttimefont-class {font-size: 15px;}
    .pro_plan_desc tr td:first-child { width: 28% !important;}
    .input-section .form-control { height: 42px; }
    .plans .row { padding-right: 0px; gap: 11px; }
    .card_detail_outer .subscribe_btn, #patient_app_details .subscribe_btn { padding: 7px 15px; }
    .pro_plan_desc tr td:nth-child(2) { width: 72% !important; }
}

@media (max-width: 1366px){
        .row.pro_plan_desc { padding: 0px 0px 6px; }
        .current-plan, .next-plan { padding: 5px 40px; }
        .term-privay label { margin-bottom: 0; }
        .radio_tick_outer ul { margin-top: 3px; }
        .pro_plan_desc tr td:nth-child(2) { padding: 5px 0px; }
        .exiting-cd { margin: 5px 0 5px; }
        .card_detail_outer .form_list_outer { margin-bottom: 12px; }
        .term-privay p { margin: 0; }
        .term-privay { padding-bottom: 5px;}
}
@media screen and (max-width: 1340px) {
    .current-plan p, .next-plan p { width: 90%; }
    .plan_box_outer .premium-blk { padding: 15px 10px; }
    .current-plan.col-md-6, .next-plan.col-md-6 { flex: 0 0 100%; max-width: 430px; }
    .current-plan p, .next-plan p { width: 90%; }
    .plan-flex { flex-wrap: nowrap; gap: 25px; }
    .patient-subc span.total_fee { max-width: 100%; padding-right: 0; }
    .plan { padding: 9px 15px 3px; }
    .estimated-monthly button#previewBtn { padding: 7px 15px; }  
    .input-section span, .plans span { font-size: 17px; }
    .input-section .form-control { height: 38px; }
}
@media screen and (max-width: 1250px) {
    .input-section span, .plans span { font-size: 16px; }
    .estimated-monthly { padding: 20px 20px 0px; }
    .plans .row { gap: 20px; }
}
@media screen and (max-width: 1199px) {
    .estimated-monthly { padding: 20px 10px 0px; }
    .plan.col-md-4 { min-width: auto; }
    .estimated-monthly .input-section.col-md-3 { flex: 0 0 30%; max-width: 30%; }
    .estimated-monthly .offset-md-1 { margin-left: 2.333333%; }
    .page-loader {top:0%; }
}
@media screen and (max-width: 1107px) {
    .input-section .form-control { height: 55px; }
}
@media (min-width: 1070px) and (max-width: 1170px) {
    .pro_plan_desc tr td:nth-child(2) { width: 200px; padding: 10px 0px; }
}
@media screen and (max-width: 1080px) {
    .subsciption-right-detail-bx { flex: 0 0 48%; max-width: 48%; }
}
@media screen and (max-width:991px) {
    .input-section .form-control { height: 38px; }
    .subsciption-right-detail-bx { flex: 0 0 100%; max-width: 100%; }
    .plans .row { padding-right: 10px; padding-left: 10px; }
    .plans { margin-top: 14px; }
    .tableData { padding: 10px 0px 10px 0px; }
    button.preview_btn.prev-new-subs { margin-right: 15px !important;}
    .plans-right-main-bx .plan_box_list { padding: 0px 0px !important;}
    .page-loader { top:0%; }
}
@media screen and (max-width:600px) {
    .monthly-section { overflow-x: auto;width: 100%;}
    .estimated-monthly .input-section.col-md-3 { flex: 0 0 100%; max-width:100%; }
    .estimated-monthly .offset-md-1 { margin-left: 0%; }
}
.current-plan, .next-plan { background-color: #c1cccf; width: 100%; text-align: center; border-radius: 0 0 9px 9px; height: auto; color: #fff; font-weight: bold; padding: 14px 40px;}
.current-plan label, .next-plan label { font-size: 23px;margin-bottom: 2px; }
.current-plan p, .next-plan p { font-size: 20px;width: 80%;font-weight: 400;}
input.cardType {position: relative;top: -7px;margin-right: 5px;}
.plan-row { margin: 0 auto;gap:20px; display: none;}
p.subscription-text { font-size: 16px;margin-bottom: 3px;font-weight: 600;}
.next-plan { background-color: #ffA500!important;}
.colorBlack { color: black !important; }
.current-plan h4 { font-size: 28px; font-weight: 600; margin-bottom: 0px; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: #e7e7e7; position: relative; color: black;}
label.planLabel { color: #3a9df9 !important; }
span.text-centers { display: inline-block; margin-top: 15px; padding: 4px 10px; background: #DCFCE7; border: 1px solid #BBF7D0; border-radius: 20px; font-size: 17px; font-weight: 600; color: #16A34A; margin-left: 0px; }
.pro_plan_desc tr { display: flex; align-items: start; }
.disc-pill { display: inline-block; padding: 3px 10px; border-radius: 20px; }
.d0 { background: #f1f5f9; color: #64748b; }
.d1 { background: #dcfce7; color: #16a34a; }
.d2 { background: #bbf7d0; color: #15803d; }
.d3 { background:#bfdbfea1; color: #1d4ed8; }
.d4 { background: #bfdbfe; color: #1d4ed8; }
.descriptions { font-size: 14px; font-style: normal; color: #333; }
button.preview_btn { display: inline-block; vertical-align: middle; padding: 5px 10px; color: #fff; font-size: 14px; font-weight: 600; margin-top: 0px; border: 0px; background: #3a9df9 !important; border-radius: 10px; border: 1.5px solid #000; }
.col-md-12.selectprovider-class { display: flex; justify-content: space-between; }
.couponwrapper-class input#coupon_code { width: 100%; max-width: 60%; margin-left: auto; border: 1.5px solid #ddd; }
a.reactivatePlan { text-decoration: none !important;}
.extra-discount-badge { display: inline-block; background: green; color: #fff; padding: 4px 11px; font-size: 14px; border-radius: 14px; margin-top:-25px}
.premium-blk.patient-subc.subsciption-detals-main { overflow: visible; }
.extra-discount-parent { margin-top: -25px}
.plan-button { position: relative; flex: 1; height: 45px; display: flex; align-items: center; justify-content: center; padding: 0 14px; border: 1px solid #111111; border-radius: 9px; background: #ffffff; color: #111111; font-size: 14px; font-weight: 700; cursor: pointer; transition: background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .12s ease; }
.plan-button.selected { background-color: rgb(201, 255, 201);}
.step-circle { width: 38px; height: 38px; min-width: 38px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: linear-gradient(145deg, #72cee5, #55b9d6); border: 1px solid #3c9dbb; color: #ffffff; font-size: 21px; font-weight: 700; box-shadow: inset 0 1px 2px rgba(255, 255, 255, .5), 0 2px 4px rgba(0, 0, 0, .08); line-height: 0.9; }
.step-one { width:24% }
.step-one span{ display: flex;text-align: center;gap: 10px; }
.step-two { width: 23%; border: .5px solid #63c3dd63; padding: 10px; border-radius: 10px; height: stretch; display: flex; flex-direction: column; justify-content: space-between; }
.step-two span{ display: flex;text-align: center;justify-content: center;gap: 10px; }
.step-three { width: 50%; display: flex; flex-direction: column; justify-content: space-between; padding-bottom: 11px; }
.step-three span{ display: flex;text-align: center;justify-content: center;gap: 10px; }
.plan-type-area { display: flex; gap: 10px;}
.user-information-section { width: 48%; text-align: -webkit-center; margin: 0 auto; border-bottom: 5px solid #00000000; margin-bottom: 15px; background: #bec4ca69; border-radius: 15px; padding: 20px; }
.guest-user-plan-detail { background-color: #1077cd; color: #fff; padding: 10px; width: 100%; display: flex; border-radius: 12px; justify-content: space-between; align-items: center;}
.guest-user-plan-detail .guest-plan-detail { text-align: left; font-weight:bold}
.guest-user-plan-detail i { text-align: right}
.appointment-number-area {display: flex;justify-content: center;padding: 0 15px 10px;gap: 10px; }
.quick-start-avtar-area .vhss_character canvas { left: 10% !important}
.user-information-section h3 { width: 100%; }
.form-group.col-md-6 lable { width: 100%; text-align: left; display: inline-block;}
.card_detail_outer { width: 100%; text-align: -webkit-center; margin: 0 auto; border-bottom: 5px solid #00AF4F; margin-bottom: 15px; background: #1077cd30; border-radius: 15px; padding: 20px; }
.user-information-section { background: #fff; border: 1px solid; }
.card_detail_outer { background: #D5E0F8; border: 1px solid;}
span#couponMessage { width: 100%; right: 0; font-size: 12px !important; text-align: right; position: relative; display: inline-block; }
.card_detail_outer .card-badge svg { height: 26px; width: 30px; }
.user-information-section h3 i.fa.fa-user { font-size: 22px; border: 1px solid #00000096; padding: 5px; border-radius: 10px; }
.user-information-section h3 { margin-bottom: 20px; }
.user-information-section { align-content: flex-start; }
.guest-plan-detail.hide.show { display: inline !important; visibility: hidden; }
.step-one span .step-label { width: 183px; }
.step-one span { align-items: center; }
.guest-user-plan-detail.invisible-a { background-color: #1077cd00; }
.guest-user-plan-detail.invisible-a i { text-align: right; position: absolute; right: 46px; top: 25px; z-index: 99999999999999; color: #000; padding: 10px; cursor: pointer; }
.guest-user-plan-detail i { padding: 10px; cursor: pointer; }

@media (max-width: 1859px) and (min-width: 1350px) {
  .step-two { width: 25%; padding: 10px; }
  .input-section span, .plans span { font-size: 16px; }
  .step-circle { width: 32px; height: 32px; min-width: 32px; font-size: 18px; }
  .plan { padding: 10px 5px 4px;min-width: 156px; }
}

@media (max-width: 1460px) and (min-width: 1350px) {
    .plans .row { padding-right: 0px; gap: 6px; }
    .plan { padding: 10px 5px 4px; min-width: 148px;}
    .step-two { width: 26%; padding: 10px; }
    .plan-button { padding: 0 6px; }
}
.plans-area { width:100%; max-width:850px; margin: auto;}
.plans-area p { padding : 3px}
.plans-area table th:nth-child(2), .plans-area table th:nth-child(3) { padding: 0 !important }
.plans-area .table-bordered { border: 1px solid #a1b2c3; border-radius: 10px; border-collapse: separate; border-spacing: 0; overflow: hidden;}
.plans-area .table-bordered td, .table-bordered th { border: 1px solid #a1b2c3; }
.plans-area .table thead th { border-bottom: 1px solid #a1b2c3; }
.plans-area th.plan-detail { text-align: center; vertical-align: middle !important; font-size: 24px; color: #000; }
.plans-area th.plan-bassic, th.plan-advance { vertical-align: top !important; }
.plans-area span.intakeaid { display: block; background: #4A90D7; color: #fff; text-align: center; font-size: 20px; padding: 5px 0; }
.plans-area span.intakeaid-pro { display: block; background: #45D257; color: #fff; text-align: center; font-size: 20px; padding: 5px 0; }
.plans-area i.fas.fa-check.green-check { color: #45D257; }
.plans-area td.td-center { text-align: center; }
.plans-area th.plan-bassic, th.plan-advance { vertical-align: top !important; }
.plans-area p { padding: 3px; text-align: center; }
.plans-area td.plan-detail { color: #000; font-weight: 700; }
.plans-area td.plan-detail i.fa.fa-dot-circle-o { padding: 5px; background: #09aeef; border-radius: 22px; margin: 0 7px 1px 1px; }
.plans-area td.sub-bassic a { background: #4D92D8; color: #fff; padding: 8px 15px; border: 2px solid #000; border-radius: 10px; }
.plans-area td.sub-advance a { background: #45D257; color: #fff; padding: 8px 15px; border: 2px solid #000; border-radius: 10px; }
.msgerror {  left: 9px !important; }
.half-size { width:48% !important}
.half-size-area { padding: 30px 0 30px; }