.main-menu .dropmenu {position:absolute;}

.main-menu .dropmenu li {
  opacity: 0;display:none;visibility:hidden;
  transform-origin: top center;
}
.main-menu:hover .dropmenu li {
  display:block;visibility:visible;
}

.main-menu li:hover .dropmenu li:nth-child(1) {
  animation: dropmenu .3s ease-in-out forwards;
  animation-delay: .2s;
}

.main-menu li:hover .dropmenu li:nth-child(2) {
  animation: dropmenu .3s ease-in-out forwards;
  animation-delay: .3s;
}

.main-menu li:hover .dropmenu li:nth-child(3) {
  animation: dropmenu .3s ease-in-out forwards;
  animation-delay: .4s;
}

.main-menu li:hover .dropmenu li:nth-child(4) {
  animation: dropmenu .3s ease-in-out forwards;
  animation-delay: .5s;
}

.main-menu li:hover .dropmenu li:nth-child(5) {
  animation: dropmenu .3s ease-in-out forwards;
  animation-delay: .6s;
}

.main-menu li:hover .dropmenu li:nth-child(6) {
  animation: dropmenu .3s ease-in-out forwards;
  animation-delay: .7s;
}

.main-menu li:hover .dropmenu li:nth-child(7) {
  animation: dropmenu .3s ease-in-out forwards;
  animation-delay: .8s;
}

@keyframes dropmenu {
  from {
    opacity: 0;
    transform: translateX(30px) rotateY(0deg);
  }
  to {
    opacity: 1;
    transform: translateX(0) rotateY(0);
  }
}