:root {
  --color-westedge-blue: #00254a;
  --color-westedge-blue-hover: #00376e;
  --color-westedge-gold: #b89757;
  --color-westedge-gold-hover: #d4b48b;
  --color-background: #e6e6e6;
  --color-font: #545454;
  --color-button-background: #1e2266;
  --color-button-font: white;
  --color-border: black;
  --spacing-small: 10px;
  --spacing-medium: 15px;
  --spacing-large: 25px;
  --font-size-small: 0.8rem;
}

body {
  background-color: var(--color-background);
}

.forgot_pass_container {
  max-width: 500px;
  margin: 10vh auto 0px auto;
  font-family: sans-serif;
  line-height: 1.4;
  flex-direction: column;
  color: var(--color-font);
}

.forgot_pass_container img {
  width: 60%;
  height: auto;
}

.forgot_pass_container .main_logo_img {
  display: block;
  margin: 0px auto;
  width: 192px;
}

.forgot_pass_container button {
  background: var(--color-button-background);
  border: 0px solid var(--color-border);
  color: var(--color-button-font);
  padding: var(--spacing-small);
  font-size: var(--font-size-small);
  margin: var(--spacing-medium) 0px 0px 0px;
  border-radius: var(--spacing-small);
}

.forgot_pass_container input[type="text"] {
  padding: var(--spacing-small);
  width: 100%;
}

.forgot_pass_container h3 {
  margin: var(--spacing-large) 0px 0px 0px;
  text-align: center;
  font-weight: 400;
}

.forgot_pass_container p {
  text-align: center;
}

.loading_icon {
  width: 25px !important;
  vertical-align: middle;
  animation: spin 0.9s linear infinite;
}

@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}