=movingDown
  +animation-name(movingDown)
  +animation-duration(1s)
  +animation-iteration-count(infinite)
  animation-play-state: paused

=movingRight
  +animation-name(movingRight)
  +animation-duration(1s)
  +animation-iteration-count(infinite)
  animation-play-state: paused
  //On hover change animation play state to running
  //now the animations will stop instead of jumping back to the original state

=leftRight
  +animation-name(leftRight)
  +animation-duration(0.2s)
  +animation-iteration-count(infinite)

=fadeInFadeOut
  +animation-name(fadeInFadeOut)
  +animation-duration(0.5s)
  +animation-iteration-count(infinite)

=cloudsAnimation
  +animation-name(cloudsAnimation)
  +animation-duration(60s)
  +animation-iteration-count(infinite)
  animation-play-state: paused

=cloudsAnimation2
  +animation-name(cloudsAnimation2)
  +animation-duration(48s)
  +animation-iteration-count(infinite)
  animation-play-state: paused

=cloudsAnimation3
  +animation-name(cloudsAnimation3)
  +animation-duration(54s)
  +animation-iteration-count(infinite)
  animation-play-state: paused

@keyframes movingDown
  0%, 100%
    +translate3dRotate(0,0,0, 0deg)
  50%
    +translate3dRotate(0,8px,0, 0deg)

@keyframes movingRight
  0%, 100%
    +translate3d(0,0,0)
  50%
    +translate3d(5px, 0, 0)

@keyframes cloudsAnimation
  0%, 100%
    +translate3d(0,0,0)
  50%
    +translate3d(15vw, 0, 0)

@keyframes cloudsAnimation2
  0%, 100%
    +translate3d(0,0,0)
  50%
    +translate3d(-15vw, 0, 0)

@keyframes cloudsAnimation3
  0%, 100%
    +translate3d(0,0,0)
  50%
    +translate3d(5vw, 0, 0)

@keyframes leftRight
  0%, 50%, 100%
    +translate3d(0,0,0)
  25%
    +translate3d(1px, 1px, 0)
  75%
    +translate3d(-1px, -1px, 0)

@keyframes fadeInFadeOut
  0%, 100%
    opacity: 1
  10%
    opacity: 0.25
  20%
    opacity: 0.4
  30%
    opacity: 0.8
  40%
    opacity: 0.3
  50%
    opacity: 0.7
  60%
    opacity: 0.9
  70%
    opacity: 0.6
  80%
    opacity: 0.25
  90%
    opacity: 0.25