h1 svg {
  height: 1rem;
  width: auto;
  color: #ffffff;
}

@media screen and (min-width: 640px) {
  h1 svg {
    height: 1.3rem;
  }
}

@media screen and (min-width: 1024px) {
  h1 svg {
    height: 1.5rem;
  }
}

.current-menu-item {
  color: #ee0007;
}

#hamburger.open span:nth-child(1) {
  transform: rotate(45deg) translate(0.5px, -1.5px);
}
#hamburger.open span:nth-child(2) {
  opacity: 0;
}
#hamburger.open span:nth-child(3) {
  transform: rotate(-45deg) translate(-0.5px, 1.5px);
}

#mobileMenu.open {
  transform: translateX(0);
}

@keyframes bgSlideDown {
  0% {
    transform: translateY(-100%);
  }
  100% {
    transform: translateY(0);
  }
}

@keyframes bgSlideUp {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-100%);
  }
}

.bg-slide-in::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: #0e0e0e;
  animation: bgSlideDown 0.3s ease-out forwards;
}

.bg-slide-out::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: #0e0e0e;
  animation: bgSlideUp 0.3s ease-in forwards;
}
