#spoon,
#mead-bottle-left,
#comb2 {
  animation: slide-up 100s infinite;
  animation-fill-mode: both;
}

#comb1,
#mead-bottle-right,
#bee5 {
  animation: slide-up-3 100s infinite;
  animation-fill-mode: both;
}

#bee1,
#bee3 {
  animation: slide-up-2 6s infinite;
  animation-fill-mode: both;
}
#bee2 {
  animation: slide-up-2 6s infinite;
  animation-fill-mode: both;
}

@keyframes slide-in-1 {
  0% {
    opacity: 0.25;
    left: 0;
    /* top: -25%; */
    /* transform: translateY(-25%); */
  }
  /* 60% {
    opacity: 0.5;
    left: 27.5%;
  } */
  100% {
    opacity: 1;
    left: 27.5%;
    /* transform: translateY(0%); */
  }
}

@keyframes slide-in-2 {
  0% {
    opacity: 0.25;
    left: 0%;
    /* top: -25%; */
  }
  /* 80% {
    opacity: 0.5;
    left: 30.5%;
  } */
  100% {
    opacity: 1;
    left: 30.5%;
  }
}

@keyframes slide-up {
  0% {
    transform: rotateZ(0deg) translateY(0px);
  }

  /* 25% {
    transform: rotateZ(-2.5deg) translateY(-2px);
  }

 

  60% {
    transform: rotateZ(-2.5deg) translateY(2px);
  } */
  50% {
    transform: rotateZ(20deg) translateY(2px);
  }

  100% {
    transform: rotateZ(0deg) translateY(0px);
  }
}

@keyframes slide-up-3 {
  0% {
    transform: rotateZ(0deg) translateY(0px);
  }

  50% {
    transform: rotateZ(-20deg) translateY(-2px);
  }

  100% {
    transform: rotateZ(0deg) translateY(0px);
  }
}

@keyframes slide-up-2 {
  0% {
    transform: rotateZ(0deg) translateY(0px);
  }

  25% {
    transform: rotateZ(2.5deg) translateY(5px);
  }

  50% {
    transform: rotateZ(0deg) translateY(0px);
  }

  75% {
    transform: rotateZ(-3.5deg) translateY(-5px);
  }

  100% {
    transform: rotateZ(0deg) translateY(0px);
  }
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

/* nav a.left {
  animation: test 1s;
  z-index: -1;
}

@keyframes test {
  0% {
    right: 100px;
  }
} */