/* Universal Css Start Here */
body {
    background-color: var(--body-color);
    font-family: var(--font-default);
    color: var(--text-color);
    overflow-x: hidden;
    position: relative;
}

.over-hidden {
    overflow: hidden;
}

a {
    text-decoration: none;
    /* color: var(--extra-color-3); */
}

a:hover {
    color: var(--primary-color);
}

button {
    font-family: var(--font-btn);
    border: 0;
}

figure {
    margin-bottom: 0;
}

.primary-btn {
}

.secondary-btn {
}
.loader {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    position: fixed;
    width: 100%;
    background: white;
    z-index: 9999;
}

.circle-container {
    position: relative;
    width: 120px;
    height: 120px;
}

.circle {
    position: absolute;
    width: 20px;
    height: 20px;
    background-color: #3498db;
    border-radius: 50%;
    opacity: 1;
    transform: translate(50px, 50px);
    transition: transform 1s ease;
}

.circle:nth-child(1) {
    animation: move1 8s infinite ease-in-out;
}

.circle:nth-child(2) {
    animation: move2 8s infinite ease-in-out 1s;
}

.circle:nth-child(3) {
    animation: move3 8s infinite ease-in-out 2s;
}

.circle:nth-child(4) {
    animation: move4 8s infinite ease-in-out 3s;
}

.circle:nth-child(5) {
    animation: move5 8s infinite ease-in-out 4s;
}

.circle:nth-child(6) {
    animation: move6 8s infinite ease-in-out 5s;
}

.circle:nth-child(7) {
    animation: move7 8s infinite ease-in-out 6s;
}

.circle:nth-child(8) {
    animation: move8 8s infinite ease-in-out 7s;
}

.circle:nth-child(9) {
    animation: move9 8s infinite ease-in-out 8s;
}

.circle:nth-child(10) {
    animation: move10 8s infinite ease-in-out 9s;
}

.circle:nth-child(11) {
    animation: move11 8s infinite ease-in-out 10s;
}

.circle:nth-child(12) {
    animation: move12 8s infinite ease-in-out 11s;
}

@keyframes move1 {
    0%,
    100% {
        transform: translate(50px, 50px);
    }

    50% {
        transform: translate(80px, 20px);
    }
}

@keyframes move2 {
    0%,
    100% {
        transform: translate(50px, 50px);
    }

    50% {
        transform: translate(20px, 80px);
    }
}

@keyframes move3 {
    0%,
    100% {
        transform: translate(50px, 50px);
    }

    50% {
        transform: translate(80px, 80px);
    }
}

@keyframes move4 {
    0%,
    100% {
        transform: translate(50px, 50px);
    }

    50% {
        transform: translate(20px, 20px);
    }
}

@keyframes move5 {
    0%,
    100% {
        transform: translate(50px, 50px);
    }

    50% {
        transform: translate(50px, 0);
    }
}

@keyframes move6 {
    0%,
    100% {
        transform: translate(50px, 50px);
    }

    50% {
        transform: translate(0, 50px);
    }
}

@keyframes move7 {
    0%,
    100% {
        transform: translate(50px, 50px);
    }

    50% {
        transform: translate(100px, 50px);
    }
}

@keyframes move8 {
    0%,
    100% {
        transform: translate(50px, 50px);
    }

    50% {
        transform: translate(50px, 100px);
    }
}

@keyframes move9 {
    0%,
    100% {
        transform: translate(50px, 50px);
    }

    50% {
        transform: translate(70px, 10px);
    }
}

@keyframes move10 {
    0%,
    100% {
        transform: translate(50px, 50px);
    }

    50% {
        transform: translate(10px, 70px);
    }
}

@keyframes move11 {
    0%,
    100% {
        transform: translate(50px, 50px);
    }

    50% {
        transform: translate(70px, 70px);
    }
}

@keyframes move12 {
    0%,
    100% {
        transform: translate(50px, 50px);
    }

    50% {
        transform: translate(30px, 30px);
    }
}

/* Universal Css End Here */

/* Typography Start Here */

/* Typography End Here */
.mobile-header {
    position: fixed;
    width: 100%;
    height: 100vh;
    top: 0;
    right: 0;
    padding: 100px 20px 20px;
    background-color: var(--main-bg);
    min-height: 100%;
    transform: translateX(100%);
    transition: 0.2s;
    z-index: 999;
    overflow-y: scroll;
}

.mobile-header.active {
    transform: translateX(0);
}
@media (max-width: 760px) {
    .web_logo img {
        width: 100px;
    }

    .icon_wrapper img {
        width: 14px;
    }
}

/* Header Css Start Here */

/* banner-sec start here */
.banner-sec {
    position: relative;
    background-image: url("../img/upper_banner.webp");
    background-repeat: no-repeat;
    background-size: cover;
}

/* banner-sec end here */

/*  */

.clinic_imgbox {
    margin-top: -19px;
    margin-left: 51px;
}
@media (max-width: 680px) {
    .clinic_imgbox {
        margin-top: 19px;
    }
}

/*  */

/*  */
.offer_sec {
    position: relative;
    background-image: url("../img/offer_bg.webp");
    background-repeat: no-repeat;
    background-size: cover;
}

/*  */
/*  */
.treatment_tabs .nav-pills .nav-link {
    border: 0;
    border-radius: unset;
}
.treatment_tabs .nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    background-color: var(--extra-color-1);
    color: var(--heading-color-1);
}

.treatment_img_wrapper.sm_postion_none {
    position: relative;
    z-index: 2;
}

.treatment_imgbox {
    margin-top: -38px;
    position: relative;
    z-index: 1;
}

.treatment_img.sm_postion_none {
    text-align: end;
    margin-top: -59px;
    position: relative;
    z-index: 2;
}
@media (max-width: 680px) {
    .treatment_img.sm_postion_none {
        text-align: unset;
        margin-top: 0;
    }

    .treatment_imgbox {
        margin-top: 0;
    }
}

/*  */

/*  */
.body_othopedic_box {
    /* background-image: url("../img/othopedic_care1.webp"); */
    background-repeat: no-repeat;
    background-size: cover;
}
.treatment_othopedic_box {
    /* background-image: url("../img/othopedic_care2.webp"); */
    background-repeat: no-repeat;
    background-size: cover;
}
.othopedic_box,
.treatment_othopedic_box,
.body_othopedic_box {
    height: 209px;
}

.bg_back {
    width: 100%;
    position: absolute;
    height: 136px;
    top: 35%;
    left: 0;
}

/*  */

/*about page start here  */
.about_accordion .nav-pills .nav-link.active {
    background-color: var(--heading-color-1);
}
.about_accordion .nav-pills .nav-link {
    border: 0;
    border-radius: 0;
}

/* about page end here */

/* pagination css start here */
.pagniation_Wrapper .page-link {
    border-radius: 4px;
}

/* pagination css end here */

/* faq start here */
.faq_Wrapper .accordion-button::after {
    content: "\2b";
    font-family: "fontAwesome";
    background-image: unset;
    color: var(--heading-color-1);
    /* padding: 2px 5px; */
    /* width: 20px; */
    height: unset;
    font-size: 25px;
}

.faq_Wrapper .accordion-button:not(.collapsed)::after {
    background-image: unset;
    transform: rotate(-180deg);
    content: "\2b";
    color: var(--heading-color-1);
    padding: 2px 3px;
    font-size: 25px;
}

.faq_Wrapper .accordion-button:not(.collapsed) {
    color: var(--heading-color-1);
    background-color: transparent;
    box-shadow: none;
}

.faq_Wrapper .accordion-flush .accordion-item:last-child {
    border-bottom: 1px solid #d8ebfb;
}

/* faq end here */
/* insurance page  start here*/
.insurance_banner_sec {
    position: relative;
    background-image: url("../img/insurance_banner.webp");
    background-repeat: no-repeat;
    background-size: cover;
}

/* insurance page  end here*/
/* .offer_keypoint_icon img {
    width: 128px !important;
    height: 36px;
    object-fit: fill;
} */
.offer_keypoint_icon img {
    width: 66px !important;
    height: 46px !important;
    object-fit: contain;
}
#navbar li {
    position: relative;
}

#navbar li.active::after {
    content: "";
    position: absolute;
    border-bottom: 2px solid var(--primary-color);
    width: 100%;
    bottom: -28px;
    left: 0;
}

#navbar .nav-item.dropdown.active::after {
    content: "";
    position: absolute;
    border-bottom: 2px solid var(--primary-color);
    width: 100%;
    bottom: 1px;
    left: 0;
}
#navbar li.active .dropdown-menu li::after {
    content: unset !important;
}

.contact_form input::-webkit-outer-spin-button,
.contact_form input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

/*  */
.flip-card {
    perspective: 1000px;
}

.flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    transition: transform 0.6s;
}

.banner_card:hover .flip-card-inner {
    transform: rotateY(180deg);
}

.flip-card-front,
.flip-card-back {
    /* position: absolute; */
    width: 100%;
    /* height: 100%; */
    backface-visibility: hidden;
    border-radius: 1rem;
}

/* .flip-card-front {
	background: transparent;
} */

.flip-card-back {
    transform: rotateY(180deg);
    /* display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center; */
    height: 100%;
    padding: 20px;
    color: white;
    position: absolute;
    top: 0;
}

/* .flip-card-back ul {
	padding-left: 0;
	margin-bottom: 10px;
}

.flip-card-back li {
	margin-bottom: 8px;
}

.flip-card-back button {
	padding: 8px 20px;
	font-size: 14px;
	border-radius: 5px;
	color: #fff;
	background-color: #007bff;
	border: none;
} */

/* form */

/* .datepicker-container {
	position: relative;
  }

  .date-input {
	cursor: pointer;
  }

  .datepicker {
	position: absolute;
	z-index: 1000;
	background-color: white;
	border: 1px solid #ced4da;
	border-radius: 4px;
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1);
	display: none;
	padding: 10px;
  }

  .datepicker-days {
	display: flex;
	flex-wrap: wrap;
  }

  .datepicker-day {
	width: 14.28%;
	text-align: center;
	padding: 5px;
	cursor: pointer;
  }

  .datepicker-day:hover {
	background-color: #f1f1f1;
  }

  .datepicker-day.selected {
	background-color: #007bff;
	color: white;
  } */

.detail-wrapper1,
.detail-wrapper2 {
    width: 31%;
}

.detail-wrapper4 {
    width: 10%;
}

.detail-wrapper3 {
    width: 8%;
}
.detail-wrapper5 {
    width: 20%;
}

select.show-placeholder {
    border: 1px solid var(--extra-color-3);
    color: var(--input-color);
    font-size: 11px !important;
    font-family: var(--secondary-font) !important;
    font-weight: 400 !important;
    border-radius: 0.25rem;
    padding: 0.375rem 0.75rem !important;
    height: auto !important;
}

input#dob {
    display: none;
}

div#date-select-wrapper select {
    /* display: none !important; */
    -webkit-appearance: none;
    -moz-appearance: none;
}
@media (max-width: 768px) {
    .check_gender {
        flex-wrap: wrap;
    }
}

@media (max-width: 992px) {
    .claim_form_section .sm_border {
        border-top: 1px solid var(--heading-color-1);
    }

    .sm_border_right-0 {
        border-right: 0;
    }
}
@media (min-width: 992px) {
    .primary_info_form .col-lg,
    .family_form_Wrapper .col-lg {
        flex: 1 0 0% !important;
    }
}

/* .patient_detail_wrapper1 ,.patient_detail_wrapper2 {
    width: 23%;
}

.patient_detail_wrapper3 {
    width: 5%;
} */
/* @media(max-width:1024px){
	.patient_detail_wrapper1, .patient_detail_wrapper2 {
		width: 18%;
	}
} */

/* form css */
.nav-pills .nav-link::before {
    content: "\f0dd";
    position: absolute;
    font-family: "fontawesome";
    bottom: -25px;
    left: 0;
    z-index: 33;
    color: rgba(230, 230, 230, 1);
    font-size: 37px;
    display: flex;
    justify-content: center;
    width: 100%;
}

.form_tabs .nav-pills .nav-link {
    position: relative;
    width: 223px;
    background-color: rgba(230, 230, 230, 1);
    color: var(--black-color);
    border-radius: 0;
}
.form_tabs .nav-pills .nav-link.active {
    background-color: var(--heading-color-1);
    color: var(--white-color);
}
.form_tabs .nav-pills .nav-link.active::before {
    color: var(--heading-color-1);
}
@media (max-width: 1024px) {
    section.upper_banner {
        height: 150px;
    }
    .upper_banner_img {
        height: 100%;
    }

    section.upper_banner .upper_banner_img img {
        height: 100%;
        object-fit: fill;
    }
}
@media (max-width: 580px) {
    .upper_banner_img {
        height: 200px;
    }
    .upper_banner_img img {
        height: 100%;
        object-fit: fill;
    }

    .form_tabs .nav-pills .nav-link {
        width: 151px;
        margin: 10px;
    }
}

/*  */

/* .table-bordered th, .table-bordered td {
	border: 1px solid black;
} */
.table th,
.table td {
    padding: 0.5rem;
    text-align: center;
}

.table th {
    background-color: var(--black-color);
}

.checkbox-cell {
    display: flex;
    justify-content: center;
    align-items: center;
    border: 0;
}

.checkbox-cell input {
    margin: 0 5px;
}

.info_head {
    height: 56px;
}
@media (max-width: 768px) {
    .info_head {
        height: auto;
    }
}

.hipa-print_label {
    width: 89px;
}

.hipa-date-label {
    width: 77px;
}
@media (max-width: 768px) {
    .hipa-print_label,
    .hipa-date-label {
        width: auto;
    }
}

/* .phone-block {
	max-width: 300px;
	margin: 20px auto;
  } */
/*
  .phone-block input[type='tel'] {
	width: 100%;
	padding: 10px;
	border: 1px solid #e3e3e3;
	border-radius: 5px;
	box-sizing: border-box;
	transition: border 0.3s;
  }
   */
.phone-block input[type="tel"]:focus {
    /* border-color: #ccc; */
    outline: none;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0;
    /* <-- Apparently some margin are still there even though it's hidden */
}

input[type="number"] {
    -moz-appearance: textfield;
    /* Firefox */
}

/* member_reimbursement_form */
.member_reimbursement_sec .form-control,
.box_input .form-control {
    width: 31px;
    height: 32px;
    /* padding: 0.5rem; */
    border: 1px solid #000;
    background-color: #e6e6fa;
    /* text-align: center; */
}
.member_reimbursement_sec .form-control,
.box_input .form-control {
    width: 31px;
    height: 32px;
    /* padding: 0.5rem; */
    border: 1px solid #000;
    background-color: #e6e6fa;
    /* text-align: center; */
}
.member_reimbursement_sec textarea {
    border: 1px solid #000;
    background-color: #e6e6fa;
    resize: none;
}

.form-table {
    width: 100%;
    border-collapse: collapse;
}

.form-table th,
.form-table td {
    border: 1px solid black;
    padding: 10px;
    background-color: #e6e6fa;
}

.form-table th {
    text-align: left;
    width: 50%;
}

/* member_reimbursement_form */

.keypoint_icon img {
    width: 100%;
    /* height: 21px; */
    /* object-fit: contain; */
}
.clinic-sec .keypoint_icon {
    flex: 0 0 6%;
}

.offer_sec .keypoint_icon {
    flex: 0 0 8%;
}

@media (max-width: 880px) {
    .keypoint_icon img {
        width: 96px;
        height: 21px;
        object-fit: contain;
    }
}

/* .tag_line.py-3.heading_bg p {
    width: 940px;
} */

.meet_img img {
    width: 100%;
    height: 260px;
    object-fit: cover;
    border-radius: 10px;
}

.article_card_wrapper .card {
    min-height: 466px;
    /* max-height: 405px; */
    max-height: 550px;
}

.article_card_wrapper img {
    width: 100%;
    height: 260px;
    object-fit: fill;
}
@media (max-width: 1080px) {
    .contact_socail_info {
        display: unset !important;
    }
}

.treatment_img_wrapper img {
    width: 65%;
    height: 157px;
}

.treatment_imgbox img {
    width: 100%;
    height: 297px;
}

.treatment_img img {
    width: 65%;
    height: 157px;
}

.nav_wrapper .dropdown-menu {
    z-index: 999999999999999999999999 !important;
}

@media (max-width: 1200px) {
    .img_and_experience_wrapper .clinic_img {
        flex: 0 0 50%;
    }
}
@media (max-width: 766px) {
    .img_and_experience_wrapper .clinic_img {
        flex: unset;
    }
}

.clinic_img img {
    height: 167px;
    width: 100%;
}

.clinic_imgbox img {
    width: 100%;
    height: 287px;
}

header.header-top {
    background: white;
    z-index: 99999999999;
    padding: 10px;
}
input:focus,
select:focus,
input[type="radio"]:focus {
    outline: 2px solid red;
    border-color: red;
    box-shadow: 0 0 5px red;
}
