@media (max-width: 70em) {
  .menu {
    width: 30vw;
  }

  html {
    font-size: 56.25%;
  }

  .gallery__picture--container {
    top: 9.6rem;
  }

  .gallery__picture--text {
    width: 70vw;
  }

  .gallery__picture--big {
    width: 70vw;
  }

  .gallery__pictures--container {
    gap: 2.4rem;
  }
}

@media (max-width: 55em) {
  .teaching {
    grid-template-columns: 1fr;
  }

  .header {
    background-image: url(images/background_mobile.jpg);
  }

  .header__head--1 {
    top: 15%;
    left: 50%;
    width: 100%;
    text-align: center;
  }

  .header__head--sub {
    top: 30%;
    left: 50%;
    width: 100%;
    text-align: center;
  }

  .menu {
    width: 40vw;
  }

  .gallery__picture--container {
    top: 12.8rem;
  }

  .gallery__picture--text {
    font-size: 2rem;
    width: 80vw;
  }

  .gallery__picture--big {
    width: 80vw;
  }

  .gallery__pictures--container {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 45em) {
  html {
    font-size: 50%;
  }

  .menu {
    width: 50vw;
  }

  .menu__button--open {
    left: 4.8vw;
  }

  .gallery__picture--container {
    top: 16rem;
  }

  .gallery__picture--text {
    width: 90vw;
  }

  .gallery__picture--big {
    width: 90vw;
  }
}

@media (max-width: 37.5em) {

  .gallery__pictures--container {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 30em) {
  html {
    font-size: 43.75%;
  }

  .menu {
    width: 100vw;
    height: 60vh;
  }

  .menu__button--open {
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
  }

  .menu__button--close {
    left: 50%;
    transform: translateX(-50%);
  }

  .menu__list {
    top: 8rem;
    align-items: center;
  }

  .menu__list--link {
    font-size: 3rem;
    margin: 2.4rem 0 2.4rem 0;
  }

  .container {
    margin-top: 12.8rem;
  }

  .teaching {
    margin-top: 12.8rem;
  }

  .header__head--1 {
    font-size: 7.4rem;
  }

  .header__head--sub {
    font-size: 2.2rem;
    top: 25%;
  }

  .menu__button {
    font-size: 4.4rem;
  }

  .courses__course--header {
    font-size: 3rem;
  }
}