body {}

:root {
  --primary-color: #00b0ac;
  --band-BG: #ebecee;
  --page-BG: #f1f2f4;
  --text-color: #435363;
  --error-color: #dd525e;
  --footer-BG: #435363;
}

html {font-size: 12px;}
body {font-family: "Roboto Condensed", sans-serif; font-weight: 400; font-size: 1.8rem; color: var(--text-color); line-height: 130%;}

.noWrapTxt {white-space: nowrap;}

.container {max-width: 1180px;}

.internalUse {background: var(--band-BG); text-align: center; font-weight: 600; padding: 15px 10px 2px; font-size: 1.8rem;}

header .container {display: flex; align-items: center; justify-content: space-between; padding: 30px 15px;}
header .container img {width: 280px;}
header .container h1 {margin-bottom: 0; font-size: 3.6rem; font-weight: 400;}

section {background: var(--page-BG);}
section > img {width: 100%; margin-bottom: 30px;}

.eligibilityMainWrap h2 {font-size: 3.4rem; font-weight: 300; letter-spacing: -1px;}
.formWrap h3 {font-weight: 600; font-size: 3.4rem; position: relative; display: flex; justify-content: flex-start; align-items: center; gap: 20px; margin: 40px 0 25px;}
.formWrap h3::after {content: ''; height: 1px; background: var(--footer-BG); width: 64%; max-width: 640px;}

.eligibilityTxt {color: var(--primary-color); font-size: 2rem; font-weight: 500;}

.formWrap h4 {margin: 40px 0; font-size: 1.8rem;}

.questionWrap {margin-bottom: 40px;}
.questionWrap > label {position: relative; padding-left: 15px; font-weight: 600; margin-bottom: 15px;}
.questionWrap > label::before {content: '*'; position: absolute; left: 0; top: 0; font-size: 1.6rem;}

.errorMsg {color: var(--error-color); font-weight: 600; display: none;}
.error .errorMsg {display: block;}

.radioWrap {display: flex; justify-content: flex-start; align-items: center; margin-bottom: 5px;}
.radioWrap .radioBtn:not(:last-of-type) {margin-right: 50px;}
.radioWrap .radioBtn input {display: none;}
.radioWrap .radioBtn label {position: relative; padding-left: 30px; margin-bottom: 0; cursor: pointer;}
.radioWrap .radioBtn label::before {content: ''; position: absolute; left: 0; top: 3px; width: 20px; height: 20px; border-radius: 20px; border: 1px solid var(--primary-color);}
.radioWrap .radioBtn input:checked ~ label::before {background: var(--primary-color);}

.eligibilityMainWrap .btnWrap {margin: 80px 0;}
.eligibilityMainWrap .btnWrap button {font-size: 0; border: none; width: 220px; height: 60px; background: url('../image/next-btn-light.png') no-repeat top left; background-size: 100% auto; }
.eligibilityMainWrap .btnWrap.active button {background: url('../image/next-btn-dark.png') no-repeat top left;  background-size: 100% auto; }

.patientInfoWrap .btnWrap {margin: 80px 0;}
.patientInfoWrap .btnWrap button {font-size: 0; border: none; width: 220px; height: 60px; background: url('../image/submit-btn-light.png') no-repeat top left; background-size: 100% auto; }
.patientInfoWrap .btnWrap.active button {background: url('../image/submit-btn-dark.png') no-repeat top left;  background-size: 100% auto;}

.fieldWrap {margin-bottom: 40px;}
.fieldWrap .errorMsg {font-size: 1.7rem; white-space: nowrap;}
.fieldWrap label {font-size: 1.8rem; margin-bottom: 3px;}
.fieldWrap .form-control {border: 1px solid var(--primary-color); font-size: 1.8rem; margin-bottom: 10px; background: none; border-radius: 3px; padding: 12px 15px; height: 50px;}

.patientInfoWrap .row .col-md-6:first-of-type {padding-right: 60px;}
.patientInfoWrap .row .col-md-6:last-of-type, .patientInfoWrap .row .stateWrap {padding-left: 60px;}

.dobWrap .form-control {background: url('../image/calendar-icon.png') no-repeat calc(100% - 10px) center; background-size: 20px auto; cursor: pointer;}
.dobWrap .form-control::-webkit-calendar-picker-indicator {display: none;}
.dobWrap .form-control::-webkit-inner-spin-button {display: none;}
.stateWrap .form-control {max-width: 200px;}
.stateWrap .form-control, .genderWrap .form-control {background: url('../image/arrow-icon.png') no-repeat calc(100% - 10px) center; background-size: 20px auto;}
select.form-control {background: none; appearance: none; -moz-appearance: none; -webkit-appearance: none;}

.consentWrap {margin-top: 20px;}
.consentWrap label {font-weight: 400;}

.TnCWrap {border-top: 1px solid var(--primary-color); padding-top: 60px; margin-top: 60px; padding-bottom: 40px; font-size: 1.8rem;}
.TnCWrap a {color: var(--primary-color); text-decoration: underline;}
.TnCWrap ul {margin: 0 0 30px; padding: 0; list-style: none;}
.TnCWrap ul li {position: relative; padding-left: 12px; margin-bottom: 5px;}
.TnCWrap ul li::before {content: '•'; position: absolute; left: 0; top: 0; font-size: 2rem; color: var(--primary-color);}

footer {font-family: "Roboto", sans-serif; background: var(--footer-BG); color: var(--white); padding: 30px 0;}
footer .container {display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start; gap: 20px 60px; font-size: 1.2rem; line-height: 140%;}
footer .container img {width: 160px;}
footer .container p:first-of-type {width: calc(100% - 220px); margin-bottom: 0; margin-top: 5px;}
footer .container p:last-of-type {width: 100%; margin-bottom: 0;}

.modal-dialog {max-width: 600px;}
.modal-content {border: 1px solid #000; box-shadow: 0 0 15px var(--text-color);}
.modal-body {text-align: center; padding: 60px 20px 40px;}
.modal-body h3 {font-size: 3rem; margin-top: 20px; margin-bottom: 30px;}
.modal-body ul {margin: 20px 0; padding: 0; list-style: none; font-weight: 600; font-size: 1.8rem;}
.modal-body ul li:not(:last-of-type) {margin-bottom: 5px;}
.modal-body p {font-size: 1.8rem;}
.modal-body p strong {font-weight: 600;}

@media only screen and (max-width: 840px) {
  header .container {flex-direction: column; gap: 20px; text-align: center;}
  .patientInfoWrap .row .col-md-6:first-of-type {padding-right: 15px;}
  .patientInfoWrap .row .col-md-6:last-of-type, .patientInfoWrap .row .stateWrap {padding-left: 15px;}
  .formWrap h3::after {width: 240px;}
  .fieldWrap .errorMsg {white-space: normal;}
  .stateWrap .form-control {width: 100%; max-width: 100%;}
}

@media only screen and (max-width: 520px) {
  footer .container {flex-direction: column;}
  footer .container p {width: 100% !important;}
}

.hideElement {display: none;}
.showElement {display: block;}