/* used to remove flash of unstyled content for page load animation */
/* https://gsap.com/resources/fouc/ */
body {
  visibility: hidden;
}

/* ---------- Main content ---------- */
.main-content {
  background-color: #314788;
}

.image-container {
  margin-bottom: 28px;
}

.section-image {
  width: 100%;
}

a {
  color: #fff;
}

a:hover {
  color: #000;
}

/* ----- Current section (for mobile) ----- */
.current-section {
  display: none;
}

/* ---------- media queries ---------- */
@media screen and (max-width: 992px) {
  h1 {
    font-size: 56px;
  }

  /* ----- Table of contents ----- */
  .mobile-table-of-contents-link {
    display: none;
  }
}

@media screen and (max-width: 792px) {
  .main-content .main-content-section:first-child {
    padding-top: 96px;
  }
}

@media screen and (max-width: 767px) {
  h1 {
    font-size: 48px;
    padding-right: 20px;
  }

  /* ---------- Table of contents ---------- */
  .table-of-contents {
    display: none;
  }

  .mobile-table-of-contents-link {
    display: block;
  }

  .current-section {
    display: block;
    font-size: 36px;
    margin-bottom: 0;
  }

  .main-content {
    padding-top: 176px;
  }

  .main-content .main-content-section:first-child {
    padding-top: 44px;
  }

  /* ----- Mobile nav menu ----- */
  .mobile-nav-icon {
    min-width: 32px;
    width: 32px;
  }

  .mobile-nav-menu {
    overflow: scroll;
    padding-top: 0;
  }
}

@media screen and (max-width: 656px) {
  .main-content .main-content-section:first-child {
    padding-top: 100px;
  }
}

@media screen and (max-width: 576px) {
  .main-content {
    padding-top: 213px;
  }

  .main-content .main-content-section:first-child {
    padding-top: 40px;
  }

  .main-content .main-content-section {
    padding-top: 44px;
  }

  .current-section {
    font-size: 28px;
  }
}

@media screen and (max-width: 405px) {
  .main-content {
    padding-top: 160px;
  }

  h1 {
    font-size: 32px;
  }

  .current-section {
    font-size: 20px;
  }
}

@media screen and (max-width: 366px) {
  .main-content .main-content-section:first-child {
    padding-top: 100px;
  }
}