html, body {
  width: 100%;
  height: 100%;
}

.gradient-background {
  background-color: #00796B;
  background-image: linear-gradient(135deg, #00796B, #004C40);
  color: white;
}

.gradient-background-tbj {
  background-color: #8a0d9e;
  background-image: linear-gradient(135deg, #8a0d9e, #6f2c91);
  color: white;
}

.hero-header {
  min-height: 100%;
}

.overflow-hidden {
  overflow: hidden !important;
}

.fill-minus-navbar {
  height: calc(100% - 66px);
}

@media (min-width: 768px) {
  .hero-header {
    min-height: initial;
    height: 90%;
    overflow: hidden;
  }
}

.dot {
  width: 1em;
  height: 1em;
  border-radius: 50%;
  background-color: black;
  display: inline-block;
  vertical-align: middle;
}

h1, h2, h3, h4, h5, h6, .navbar-brand, .h1, .h2, .h3, .h4, .h5, .h6, .lead {
  font-family: neue-haas-grotesk-display;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .lead {
  letter-spacing: 0.02em;
}

.display-1, .display-2, .display-3, .display-4 {
  font-weight: 500;
}