nav {
  position: sticky;
  top: 0;
  height: 22vw;
  width: 100%;
  background-color: #f4a261;
  display: flex;
  align-items: center;
  z-index: 100;
}

#burger-wrapper {
  height: 10vw;
  width: 10vw;
  margin-left: 5vw;
}

#burger {
  height: 100%;
  width: 100%;
}

#logo-wrapper {
  position: absolute;
  height: 20vw;
  width: 20vw;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#logo {
  height: 100%;
  width: 100%;
  border-radius: 50%;
  object-fit: cover;
}

nav a {
  text-decoration: none;
  color: black;
}

nav a:hover {
  color: white;
}

.nav-text {
  display: none;
}

@media (min-width: 768px) {
  nav {
    height: 14vw;
  }

  #burger-wrapper {
    height: 7vw;
    width: 7vw;
  }

  #logo-wrapper {
    height: 13vw;
    width: 13vw;
  }
}

@media (min-width: 1024px) {
  nav {
    height: 4vw;
    display: flex;
    justify-content: space-between;
  }

  #burger-wrapper {
    display: none;
  }

  #logo-wrapper {
    height: 4vw;
    width: 4vw;
  }

  .nav-text {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 45%;
    font-size: 1vw;
    font-weight: bold;
  }

  .nav-text.left {
    gap: 10vw;
  }

  .nav-text.right {
    gap: 10vw;
  }
}

@media screen and (max-width: 932px) and (orientation: landscape) {
  nav {
    height: 10vw;
  }

  #logo-wrapper {
    height: 10vw;
    width: 10vw;
  }

  #burger-wrapper {
    height: 6vw;
    width: 6vw;
  }
}