/* BIG SCREENS (above 1920px) */
@media (min-width: 120.0625em) {
  /* 1921px / 16 */
}

/* 1920px */
@media (max-width: 120em) {
  html {
    font-size: 60%;
  }
}

/* BELOW 84 * 16px = 1344px (Smaller desktops) */
@media (max-width: 84em) {
  html {
    /* 9px / 16p = 56% */
    font-size: 59%;
  }
}

/* BELOW 1200px (Landscape tablets) */
@media (max-width: 75em) {
  html {
    /* 9px / 16p = 56% */
    font-size: 56.25%;
  }
  .side-img {
    display: none;
  }

  .top-gallery {
    justify-content: center; /* center the remaining content */
  }

  .center-content {
    width: 100%;
  }
}

/* BELOW 944px (Tablets) */
@media (max-width: 59em) {
  html {
    /* 8px / 16p = 50% */
    font-size: 50%;
  }
}

/* BELOW 800px (Tablets2) */
@media (max-width: 50em) {
  html {
    /* 8px / 16p = 50% */
    font-size: 48%;
  }
  .bottom-gallery .img-left,
  .bottom-gallery .img-right {
    display: none;
  }

  .bottom-gallery {
    justify-content: center;
    height: auto;
  }

  .bottom-gallery .img-middle {
    width: 100%;
    height: auto;
  }
}

/* BELOW 704 (Smaller tablets) */
@media (max-width: 44em) {
  html {
    /* 7px / 16p = 50% */
    font-size: 43.75%;
  }
}

/* BELOW 600px (Phones) */
@media (max-width: 37em) {
  html {
    /* 6px / 16p = 50% */
    font-size: 37.5%;
  }
}

/* BELOW 400px (Thin) */
@media (max-width: 26em) {
  html {
    /* 6px / 16p = 50% */
    font-size: 28.5%;
  }
}