@media screen and (max-height: 35rem) {
  #outer {
    --header-height: 0.5rem;
  }

  #heading {
    display: none;
  }

  #tinyLogoWrapper {
    display: block;
  }
}

@media screen and (max-height: 35rem) {
  #volumeSlider {
    width: calc(100% - 2.5rem);
    margin-left: 2.5rem;
  }
}

@media screen and (max-height: 35rem) and (min-width: 30rem) {
  #divisions {
    max-width: 60rem;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr;
  }
}
