/* Body */
body {
  background: var(--background-color);
}
p, div,a {
  color: var(--text-color) !important;
}
a.button {
  background-color: var(--text-color) !important;
  color: white !important;
}

/* Image Tags */
.hd-image {
  aspect-ratio: 16 / 9;
  width: 100%;
}
.mini-image {
  aspect-ratio: auto;
  width: 20%;
}

/* Hero */
.hero {
  position: relative;
  margin-bottom: -30px;
  min-height: 500px;
}
.hero-body {
  z-index: 1;
  padding-bottom: 30px !important; 
  display: flex;
  justify-content: center;
  align-items: flex-end;
}
.hero .title {
  text-align: center;
  font-family: serif;
  text-shadow: 1px 1px 1px var(--accent-color), -1px -1px 1px var(--accent-color), -1px 0px 1px var(--accent-color), 0px -1px 1px var(--accent-color);
}
.hero .title span {
  font-size: 2em;
}
.hero .logo {
  width: 15vw;
}

/* Navigation buttons */
.desktop-navigation {
  display: inherit;
  margin-top: 30px !important;
  margin-bottom: 20px !important;
}
.phone-navigation {
  margin-top: 10px !important;
  display: none !important;
  text-align: center;
}
#nav {
  margin-top: 10px !important;
  margin-bottom: 20px !important;
}
#nav.hidden {
  display: none;
}

/* Sections */
.section {
  margin-top: 0px !important;
  padding-top: 0px !important;
  background-color: var(--section-color);
}
.subtitle {
  padding-bottom: 18px !important;
}

/** Buttons */
a.button {
  margin: 0.5rem !important;
  text-decoration: none !important;
  background-color: var(--button-color) !important;
}

/*  Columns */
.columns {
  margin: 0 !important;
}
.column {
  padding: 10px !important;
}

/*  Images */
.has-image {
  text-align: center;
}
.has-image>img {
  max-width: 100%;
}

/* Progress bars */
.progress {
  margin-top: 18px !important;
  margin-bottom: 18px !important;
}
.progress::-webkit-progress-value { background-color: var(--accent-color) !important; }

.progress::-moz-progress-bar { background-color: var(--accent-color) !important; }

.progress::-ms-fill { background-color: var(--accent-color) !important; }

.progress::indeterminate {
  background-image: linear-gradient(to right, rgba($color: #YOURVALUES, $alpha: 1.0) 30%, #ededed 30%);
}