html,
body {
  height: 100%;
}

body {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  padding-top: 40px;
  padding-bottom: 40px;
  background-color: #f5f5f5;
}

.form-signin {
  width: 100%;
  max-width: 330px;
  padding: 15px;
  margin: auto;
  align-items: center;
}

.form-signin .form-control, .form-password-reset-confirm .form-control {
  position: relative;
  box-sizing: border-box;
  height: auto;
  padding: 10px;
  font-size: 16px;
}
.form-signin .form-control:focus {
  z-index: 2;
}

.form-password-reset{
  width: 100%;
  max-width: 600px;
  margin: auto;
}

.form-password-reset-confirm {
  width: 100%;
  max-width: 700px;
  margin: auto;
  align-items: center;
}

.error-text{
  color:  red;
}

/* Custom Button Colors */
.btn-dark-blue {
  color: white;
  background-color: #325765;
  border-color: #325765;
}

.btn-dark-blue:hover {
  color: #fff;
  background-color: #2d515e;
  border-color: #2d515e;
}

/* Content text sized up 5%, matching the same bump applied to #main-content
   in override.css (the main app shell). This shell (login/signup) has no
   sidebar/header to exclude, and every text element here already carries
   its own Tailwind tw:text-* utility class rather than inheriting a bare
   font-size, so (like #main-content's rules) a plain #entrance-content{
   font-size} alone wouldn't reach them -- each utility class actually used
   on these two pages needs its own +5% restatement, scoped by the
   #entrance-content id (added to login.html/signup.html's outer <section>)
   so a plain `.tw\:text-sm` selector's specificity doesn't win by load
   order against Tailwind's own utility CSS. */
#entrance-content {
  font-size: 105%;
}
#entrance-content .tw\:text-xl {
  font-size: 1.3125rem; /* +5% of Tailwind's default text-xl: 1.25rem */
}
#entrance-content .tw\:text-sm {
  font-size: 0.91875rem; /* +5% of Tailwind's default text-sm: 0.875rem */
}
#entrance-content .tw\:text-xs {
  font-size: 0.7875rem; /* +5% of Tailwind's default text-xs: 0.75rem */
}

/* Gap between form fields, matching the `form .tw\:mb-3` bump in
   override.css (0.75rem -> +5% -> +10% -> +10%, compounding to
   0.9075rem). Scoped to #entrance-content rather than editing .tw\:mb-3
   globally, for the same reason as the main app's rule: that utility is
   also used for non-form spacing on these same pages (the title block,
   the "Already have an account?" paragraph). */
#entrance-content form .tw\:mb-3 {
  margin-bottom: 0.9075rem !important;
}