/* =============================================================================
 CKREATE APPOINTMENT
================================================================================ */
header {
  background-color: rgba(22,22,22, 1) !important;
    box-shadow: 0px 11px 13px -8px rgba(0, 0, 0, 0.94);
  -webkit-box-shadow: 0px 11px 13px -8px rgba(0, 0, 0, 0.94);
  -moz-box-shadow: 0px 11px 13px -8px rgba(0, 0, 0, 0.94);
}

#create-appointment section {
  height: 100vh;
  max-width: var(--layout-w-960);
  padding-top: var(--space-12);
}

#create-appointment {
  background-image: url(../images/site_imgs/section-call-to-action/section-call-to-action.png);
  background-color: var(--website-color-4);
  background-attachment: fixed;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 11rem var(--space-4) var(--space-12);
  box-shadow: 0px -14px 19px -7px rgba(0,0,0,0.50) inset;
-webkit-box-shadow: 0px -14px 19px -7px rgba(0,0,0,0.50) inset;
-moz-box-shadow: 0px -14px 19px -7px rgba(0,0,0,0.50) inset;
}

#create-appointment h1 {
  font-size: calc(1.5rem + 0.75vw);
  margin-bottom: var(--space-2);
}

#create-appointment h1,
#create-appointment p {
  text-align: center;
  color: var(--font-color-alt);
  text-shadow: none;
}
#create-appointment h1~p {
  font-weight: 600;
}
#create-appointment article p,
#create-appointment article a {
  color: var(--font-color-alt);
}

#create-appointment article {
  background-color: rgba(255,255,255, 0.2);
  padding: var(--space-6);
  border: 1px solid var(--website-color-1);
  border-radius: var(--border-radius-medium);
  box-shadow: 0px 7px 13px -6px rgba(0,0,0,1);
-webkit-box-shadow: 0px 7px 13px -6px rgba(0,0,0,1);
-moz-box-shadow: 0px 7px 13px -6px rgba(0,0,0,1);
}
#create-appointment .flexbox-row {
  height: 100%;
  /* flex-wrap: wrap; */
  align-items: flex-start;
  gap: var(--space-8);
  /* padding: var(--space-1); */
  text-align: left;
}

#create-appointment .flexbox-row li {
  width: 100%;
  height: 100%;
}
/* =============================================================================
MEDIA RESPONSIVE 
================================================================================ */



@media (max-width: 48rem) {
  /* 768px */
  #create-appointment {
    padding:  var(--space-12)var(--space-4);
  }
#create-appointment article {
  padding: var(--space-4);
}

#create-appointment section {
  overflow: auto;
  height: 500px;
}
}