/* BEGIN EPIC COMMUNITY MEMBER CUSTOM CSS */
/* Epic recommends any additional CSS be placed below this line. Avoid adding CSS above because it makes it difficult to determine which are your changes and which are Epic's. */
/* BEGIN: prelogin page images */
.isPrelogin #features li {
  display: inline-block;
  padding: 1rem 1rem 1rem 6rem;
  vertical-align: top;
  width: 50%;
}

.isPrelogin #features li:before {
  content: "";
  display: block;
  height: 4rem;
  margin: 0 0 -4rem -5rem;
  width: 4rem;
}

#features li:nth-child(3)::before {
  background: rgba(0, 0, 0, 0) url("../images/quicklinks/medical_advice.png") no-repeat center center;
}

#features li:nth-child(4)::before {
  background: rgba(0, 0, 0, 0) url("../images/quicklinks/test_results.png") no-repeat center center;
}

#features li:nth-child(5)::before {
  background: rgba(0, 0, 0, 0) url("../images/quicklinks/medications.png") no-repeat center center;
}

#features li:nth-child(6)::before {
  background: rgba(0, 0, 0, 0) url("../images/quicklinks/appointments.png") no-repeat center center;
}

#features li:nth-child(7)::before {
  background: rgba(0, 0, 0, 0) url("../images/quicklinks/phone.png") no-repeat center center;
}

#features li:nth-child(8)::before {
  background: rgba(0, 0, 0, 0) url("../images/quicklinks/medical_history.png") no-repeat center center;
}

.features .icon-phone {
  background-image: url("../images/quicklinks/phone.png");
}

.features .icon-bill {
  background-image: url("../images/quicklinks/account_summary.png");
}

.features .icon-manageaccount {
  background-image: url("../images/quicklinks/medical_history.png");
}

/* END: prelogin page images */
/* BEGIN: footer color*/
body #footer,
body #footer a,
.datatile #wrap > .copyright a,
body.md_showform #footer,
body.md_showform #footer a,
body.md_saveform #footer,
body.md_saveform #footer a {
  color: rgb(0, 145, 234);
}

/* END: Footer color*/
/* BEGIN: Prelogin Logo spacing */
.logo {
  height: 7rem;
}

/* END: Prelogin Logo Spacing */
/* BEGIN: Background Shading */
#main, .BeforeList input.SearchList {
  background-color: rgba(255, 255, 255, 1);
}

#sidebar {
  background-color: rgba(255, 255, 255, 0.9);
}

/* END: Background Shading */
/* BEGIN: Custom Logonbox*/
.embedded .button.completeworkflow, .embedded .button.completeworkflow:focus, .embedded .button.completeworkflow:hover {
  background-color: #0032a0;
}

.embedded .signup {
  display: none;
}

.embedded #footer {
  display: none;
}

/* END: Custom Logonbox*/
/* BEGIN: Resize OS iframe height */
#div.setOfStepsContainer .stepContainer {
  border: none;
  border-radius: 0;
  box-shadow: none;
  display: inline-block;
  height: 720px;
  margin: 0.25rem;
  overflow: hidden;
  padding: 0;
  position: relative;
  vertical-align: top;
  width: 690px;
}

/* END: Resize OS iframe height */
/* BEGIN: Force correct logo */
#graphicHeader:not(:empty) #header_logo .header_logo_link {
  background: transparent url("../images/logo.png") no-repeat scroll center/contain;
}

/* END: Force correct logo */
.se_image_patient {
  width: 120px;
}

/*Subtext style under the "Help us prepare for your arrival" header in the On My Way workflow which is defined in the string Scheduling.OnMyWay.AboutVisitLabel*/
.OnMyWayAboutVisitLabelOverride {
  background-image: none;
  padding: 0.75rem;
  max-width: fit-content;
}

/* BEGIN: Pay a Guest design code */
#extPmtPageFrame, #visitpayment-content #extPmtPageFrame, #visitpayment-content #iFrameLoadingIndicator {
  height: 40rem;
}

#guestPay-content #extPmtPageFrame, #guestPay-content #iFrameLoadingIndicator {
  height: 40rem;
}

@media only screen and (max-width: 825px) {
  #payment-content #extPmtPageFrame,
  #payment-content #iFrameLoadingIndicator,
  #guestPay-content #extPmtPageFrame,
  #guestPay-content #iFrameLoadingIndicator {
    height: 60rem;
  }
}
/* END: Pay a Guest design code */
/* START: CLEAR button integration */
:root {
  --w-max:328px;
  --w-min:236px;
  --h-max:56px;
  --h-min:40px;
  --pad-max:64px;
  --pad-min:32px;
  --gap:8px;
}

#clear-button {
  width: clamp(var(--w-min), 100%, var(--w-max));
  min-width: var(--w-min);
  max-width: var(--w-max);
  height: var(--h-max);
  background: #081245;
  color: #ffffff;
  font: 600 16px/26px "Inter", sans-serif;
  border: none;
  border-radius: 32px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--gap);
  padding: 0;
  box-sizing: border-box;
  transition: opacity 0.15s;
  white-space: nowrap;
  margin-bottom: 5px;
  font-weight: normal;
}

#clear-button:hover {
  opacity: 0.8;
}

#clear-button .icon {
  flex: 0 0 24px;
  display: flex;
  align-items: center;
}

#clear-button .icon svg {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  display: block;
}

#clear-button::before,
#clear-button::after {
  content: "";
  flex: 0 0 var(--pad-max);
}

@media (max-width: 327px) {
  #clear-button {
    height: var(--h-min);
  }
  #clear-button::before,
  #clear-button::after {
    flex-basis: var(--pad-min);
  }
}
/* END: CLEAR button integration */
/* START HMH Button Redesign for CLEAR */
.login .button {
  border-radius: 32px;
  min-width: var(--w-min);
  max-width: var(--w-max);
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--gap);
  box-sizing: border-box;
  transition: opacity 0.15s;
  white-space: nowrap;
  margin: 0.5em auto;
  padding: 0.75em;
  background-color: #041A55;
}

a.button.guest, a.button.otherbutton {
  border-radius: 32px;
  min-width: var(--w-min);
  max-width: var(--w-max);
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--gap);
  box-sizing: border-box;
  transition: opacity 0.15s;
  white-space: nowrap;
  margin: 0.5em auto;
  padding: 0.75em;
}

.helpfeaturescontainer {
  display: none;
}

/* END HMH Button Redesign for CLEAR */