body {
  background-color: gray;
}

.logo img {
width: 10%
}

.stickybox {
  position: sticky;
  position: -webkit-sticky;
}

.Menu {
  margin: 0;
  padding: 0;
  list-style-type: none;
  overflow: hidden;
  background-color: #38444d;
}

.mainitems {
  display: inline-block;
}

a {
  text-decoration: none;
  display: inline-block;
  padding: 20px;
  color: white;
}

a:hover {
  animation-name: fadein;
  animation-duration: 300ms;
  background-color: darkblue;
}

.subitems:hover {
  animation-name: fadein;
  animation-duration: 300ms;
  background-color: darkblue;
}

.dropdown-menu {
  margin: 0;
  padding: 0;
  background-color: #38444d;
  display: none;
  list-style-type: none;
  position: absolute;
  min-width: 200px;
}

@keyframes fadein {
  0%  {opacity: 0;}
  100% {opacity: 1;}
}

@keyframes growDown {
  0% {
      transform: scaleY(0)
  }
  80% {
      transform: scaleY(1.1)
  }
  100% {
      transform: scaleY(1)
  }
}

@keyframes rotateMenu {
  0% {
      transform: rotateX(-90deg)
  }
  70% {
      transform: rotateX(20deg) 
  }
  100% {
      transform: rotateX(0deg) 
  }
}

.dropdown:hover .dropdown-menu {
  display: block;
  animation: rotateMenu 300ms ease-in-out forwards;
}