:root {
  /* From: https://github.com/morhetz/gruvbox-contrib */
  --main-bg-color: #1d2021;
  --main-fg-color: #ebdbb2;
  --main-fg-color-disabled: #928374;
  --main-fg-color-transparent: rgba(235, 219, 178, .5);
  --border-color: #ebdbb2;
  --same-day-color: #185a00;
  --hover-color: #d65d0e;
  --selected-color: #fabd2f;
  --hover-bg-color: #3c3836;
  --selected-input-color: sandybrown;
  --important-selection-color: #cc241d;
  --color-scrollbar-track: #1d2021;
  --color-scrollbar-thumb: #3c3836;
}

body {
  background-color: var(--main-bg-color);
  color: var(--main-fg-color);
  font-family: 'Open Sans', sans-serif;
}

.container {
  position: relative;
}

.centerDiv {
  margin: 0 auto;
  margin-top: 50px;
  max-width: 600px;
  padding: 1%;

}

h1 {
  color: var(--selected-input-color);
  font-family: 'Caveat', cursive;
  font-size: xxx-large;
}

.flashMessage {
  color: var(--hover-color);
  font-size: smaller;
}

.flash {
  color: var(--hover-color);
  font-size: smaller;
}

input {
  color: var(--main-fg-color) !important;
  background-color: var(--hover-bg-color) !important;
}

input[type="text"] {
  color: var(--main-fg-color) !important;
  background-color: var(--hover-bg-color) !important;
}

/* unvisited link */
a:link {
  color: var(--selected-input-color);
  text-decoration: none;
}

/* visited link */
a:visited {
  color: var(--selected-input-color);
}

/* mouse over link */
a:hover {
  color: var(--selected-color);
}

/* selected link */
/* a:active {
  color: rgb(255, 0, 0);
} */

#logoImage {
  width: 1em;
  /* height: 2.5rem; */
  margin-right: 1rem;
}

hr {
  background-color: var(--main-fg-color);
}

.http_error {
  text-align: right;
}

.spinnerDiv {
  display: none;
  position: fixed;
  top: 0px;
  left: 50%;
  z-index: 9999999999;
}