.main-nav {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

.main-nav.open {
  opacity: 1;
  pointer-events: auto;
}

.main-nav.open .main-nav__list-item {
  opacity: 1;
  transform: translateY(0);
font-size: 26px;
	color: white;
}

.main-nav__list-item {
  opacity: 0;
  transform: translateY(2em);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

@media (min-width: 1020px) {
  .navbar-toggler {
    display: none;
  }

  .main-nav {
    opacity: 1 !important;
    pointer-events: auto;
    position: static;
  }

  .main-nav__list-item {
    opacity: 1;
    transform: none;
  }
}