#skip-nav {
  position: absolute;
  left: -9999px;
  z-index: 999;
  padding: 1em;
  background-color: black;
  color: white;
  opacity: 0;
}

#skip-nav:focus {
  left: 50%;
  transform: translateX(-50%);
  opacity: 1;
}

body {
  font-weight: 400;
  font-family: Montserrat;
}

.mobile {
  display: block;
}

.desktop {
  display: none;
}

.bg-red {
  background-color: #a41e34 !important;
}

.bg-green {
  background-color: #017b78 !important;
}

.t-white {
  color: var(--bs-light);
}

.t-green {
  color: #017b78;
}

.t-grey {
  color: #565a5c;
}

.t-red {
  color: #a41e34;
}

.t-upper {
  text-transform: uppercase;
}

.t-bold {
  font-weight: bold !important;
}

.t-xs {
  font-size: 0.75rem;
}

.t-sm {
  font-size: 1rem;
}

.t-md {
  font-size: 0.9rem;
}

.t-lg {
  font-size: 1.5rem;
}

.t-logo {
  font-size: 1.9rem;
  font-weight: bold;
}

.t-left {
  text-align: left !important;
}

.social-icon {
  font-size: 15px;
}

.page-heading {
  height: 45vh;
  max-height: 675px;
  background: url("../images/header-jam.jpg");
  background-size: cover;
  background-repeat: no-repeat;
}

.page-heading h1 {
  margin-top: 50%;
}

.landing-heading {
  height: 100vh;
  max-height: 675px;
}

.landing-heading h1 {
  margin-top: 70%;
}

.landing-heading {
  background: url("../images/header-landing.jpg");
  background-size: cover;
  background-repeat: no-repeat;
}

.landing-heading a:hover {
  color: var(--bs-light) !important;
  background-color: #a41e34 !important;
}

.video-promo video {
  width: 94vw;
}

.upcoming a {
  width: 100%;
}

.upcoming a:hover {
  color: var(--bs-light);
  font-weight: bold;
}

.upcoming button:hover {
  color: var(--bs-light);
  font-weight: bold;
}

.event-card {
  display: inline-block;
}

.about img {
  width: 100%;
}

.contact-form img {
  width: 50%;
}

.register div.form-group {
  max-width: 600px;
}

/* not quite small */
@media (min-width: 450px) {
  .t-md {
    font-size: 1rem;
    font-weight: 200;
  }

  .t-lg {
    font-size: 2rem;
    font-weight: 400;
  }

  .t-logo {
    font-size: 2.25rem;
    font-weight: bold;
  }
}

/* small */
@media (min-width: 576px) {
  .t-sm {
    font-size: 1.25rem;
    font-weight: 400;
  }

  .t-md {
    font-size: 1.5rem;
    font-weight: 400;
  }

  .t-lg {
    font-size: 2.25rem;
    font-weight: 400;
  }

  .t-logo {
    font-size: 3rem;
    font-weight: bold;
  }

  .landing-heading h1 {
    margin-top: 45%;
  }

  .landing-heading a {
    width: 12rem;
  }

  .video-promo video {
    width: 95vw;
  }
}

/* medium */
@media (min-width: 768px) {
  .t-sm {
    font-size: 1.25rem;
    font-weight: 400;
  }

  .t-md {
    font-size: 2rem;
    font-weight: 400;
  }

  .t-lg {
    font-size: 2.5rem;
    font-weight: 400;
  }

  .t-logo {
    font-size: 4rem;
    font-weight: bold;
  }

  .landing-heading h1 {
    margin-top: 30%;
  }

  .landing a {
    width: 15rem;
  }

  .video-promo video {
    width: 97vw;
  }
}

/* large (desktop) */
@media (min-width: 992px) {
  .mobile {
    display: none;
  }

  .desktop {
    display: block;
  }

  .t-sm {
    font-size: 1.25rem;
    font-weight: 400;
  }

  .t-md {
    font-size: 2rem;
    font-weight: 400;
  }

  .t-lg {
    font-size: 2.5rem;
    font-weight: 400;
  }

  .t-logo {
    font-size: 4.5rem;
    font-weight: bold;
  }

  .social-icon {
    font-size: 25px;
  }

  .page-heading {
    height: 60vh;
  }

  .page-heading h1 {
    margin-top: 15%;
  }

  .landing-heading h1 {
    margin-top: 20%;
  }

  .landing-heading {
    height: 100vh;
    max-height: 675px;
  }

  .landing-heading a {
    width: 15rem;
    font-size: 1.75rem;
  }

  .video-promo video {
    max-width: 55vw;
  }

  .vision-card {
    max-width: 49%;
    display: inline-block;
  }
}

/* extra large */
@media (min-width: 1200px) {
  .t-sm {
    font-size: 1.25rem;
    font-weight: 400;
  }

  .t-lg {
    font-size: 2.75rem;
    font-weight: 400;
  }

  .landing-heading {
    height: 100vh;
    max-height: none;
  }

  .video-promo h1 {
    margin-top: 2.5rem !important;
  }
}

/* extra extra large */
@media (min-width: 1400px) {
  .video-promo h1 {
    margin-top: 10rem !important;
  }
}
