*,
*::before,
*::after {
}

:root {
  --c--black: #000000;
  --c-dblue: #023047;
  --c-blue: #219ebc;
  --c-lblue: #8ecae6;
  --c-orange: #fb8500;
  --c-yellow: #ffb703;
  --c-lneutral: #fffaf2;
  --c-white: #ffffff;
  --c-green: #007932;
  --c-red: #f00314;
}

body {
  background-color: var(--c-lneutral);
  color: var(--c-dblue);
}

.custom-header {
  background-image: linear-gradient(to right, var(--c-blue), var(--c-dblue));
  padding: 2em;
}

/* .custom-container {
  border: solid var(--c-orange) 2px;
} */

.custom-btn-search {
  background-color: var(--c-orange);
  color: var(--c-dblue);
  font-weight: bold;
}

.custom-btn-search:hover {
  background-color: var(--c-yellow);
  color: var(--c-dblue);
  font-weight: bold;
}

.custom-btn {
  background-color: var(--c-dblue);
}

.custom-card-header {
  background-color: var(--c-blue) !important;
  color: var(--c-dblue) !important;
}

.custom-card-body {
  background-image: linear-gradient(var(--c-blue), var(--c-lblue));
  line-height: 1.5rem !important; /*TO DO: Get this to work*/
}

.custom-favorable {
  background-color: var(--c-green);
  border-radius: .1em;
  padding: 0px .35px !important; /*TO DO: Get this to work*/
}

.custom-moderate {
  background-color: var(--c-orange);
  border-radius: .1em;
  padding: 0px .35px !important; /*TO DO: Get this to work*/
}

.custom-severe {
  background-color: var(--c-red);
  border-radius: .1em;
  padding: 0px .35px !important; /*TO DO: Get this to work*/
}

.custom-footer {
  background-image: linear-gradient(to right, var(--c-blue), var(--c-dblue));
}