@charset "UTF-8";




.animated.up_and_down{
   -webkit-animation-name: up_and_down;
  -webkit-animation-timing-function: linear; 
  -webkit-animation-delay: 0s;
  -webkit-animation-duration: 3s;
  -webkit-animation-direction: alternate;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-fill-mode: both;
  -webkit-animation-play-state: running; 
  
  animation-name: up_and_down;
  animation-timing-function: linear; 
  animation-delay: 0s;
  animation-duration: 3s;
  animation-direction: alternate;
  animation-iteration-count: infinite;
  animation-fill-mode: both;
  animation-play-state: running;
}
.delay_1{
    
      -webkit-animation-delay: 1s !important;
       animation-delay: 1s !important;
}
.delay_2{
    -webkit-animation-delay: 3s !important; 
     animation-delay: 3s !important; 
}
@keyframes up_and_down {
   0% {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  100% {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@-webkit-keyframes up_and_down {
   0% {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  100% {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.fish_move_speed_1{
     -webkit-animation-duration: 65s !important;
     animation-duration: 65s !important;
     -webkit-animation-delay: 0s !important;
     animation-delay: 0s !important;
}
.fish_move_speed_2{
    -webkit-animation-duration: 40s !important;
     animation-duration: 40s !important;
     -webkit-animation-delay: 2s !important;
     animation-delay: 2s !important;
}
.fish_move_speed_3{
    -webkit-animation-duration: 55s !important;
     animation-duration: 55s !important;
     -webkit-animation-delay: 5s !important;
     animation-delay: 5s !important;
}
.animated.fish_move_left{
   -webkit-animation-name: fish_move_left;
  -webkit-animation-timing-function: ease-in; 
  -webkit-animation-delay: 0s;
  -webkit-animation-duration: 10s;
  -webkit-animation-direction: normal;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-fill-mode: both;
  -webkit-animation-play-state: running; 
  
  animation-name: fish_move_left;
  animation-timing-function: ease-in; 
  animation-delay: 0s;
  animation-duration: 10s;
  animation-direction: normal;
  animation-iteration-count: infinite;
  animation-fill-mode: both;
  animation-play-state: running; 
}
@keyframes fish_move_left {
   from, 0% {
-webkit-transform: translate3d(0, 0px, 0) rotate3d(0,1,0,0deg);
    transform: translate3d(0, 0px, 0) rotate3d(0,1,0,0deg);
  }
  48% {
-webkit-transform: translate3d(-2200px, 0px, 0) rotate3d(0,1,0,0deg);
    transform: translate3d(-2200px, 0px, 0) rotate3d(0,1,0,0deg);
  }
  50% {
-webkit-transform: translate3d(-2300px, 0px, 0) rotate3d(0,1,0,180deg) scale(0.9);
    transform: translate3d(-2300px, 0px, 0) rotate3d(0,1,0,180deg) scale(0.9);
  }
  98% {
-webkit-transform: translate3d(-10px, 0px, 0) rotate3d(0,1,0,180deg) scale(0.9);
    transform: translate3d(-10px, 0px, 0) rotate3d(0,1,0,180deg) scale(0.9);
  }
  100% {
-webkit-transform: translate3d(0px, 0px, 0) rotate3d(0,1,0,0deg) scale(1);
    transform: translate3d(0px, 0px, 0) rotate3d(0,1,0,0deg) scale(1);
  }
}

@-webkit-keyframes fish_move_left {
   from, 0% {
-webkit-transform: translate3d(0, 0px, 0) rotate3d(0,1,0,0deg);
    transform: translate3d(0, 0px, 0) rotate3d(0,1,0,0deg);
  }
  48% {
-webkit-transform: translate3d(-2200px, 0px, 0) rotate3d(0,1,0,0deg);
    transform: translate3d(-2200px, 0px, 0) rotate3d(0,1,0,0deg);
  }
  50% {
-webkit-transform: translate3d(-2300px, 0px, 0) rotate3d(0,1,0,180deg) scale(0.9);
    transform: translate3d(-2300px, 0px, 0) rotate3d(0,1,0,180deg) scale(0.9);
  }
  98% {
-webkit-transform: translate3d(-10px, 0px, 0) rotate3d(0,1,0,180deg) scale(0.9);
    transform: translate3d(-10px, 0px, 0) rotate3d(0,1,0,180deg) scale(0.9);
  }
  100% {
-webkit-transform: translate3d(0px, 0px, 0) rotate3d(0,1,0,0deg) scale(1);
    transform: translate3d(0px, 0px, 0) rotate3d(0,1,0,0deg) scale(1);
  }
}

.animated.fish_move_right{
   -webkit-animation-name: fish_move_right;
  -webkit-animation-timing-function: ease-in; 
  -webkit-animation-delay: 0s;
  -webkit-animation-duration: 10s;
  -webkit-animation-direction: normal;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-fill-mode: both;
  -webkit-animation-play-state: running; 
  
  animation-name: fish_move_right;
  animation-timing-function: ease-in; 
  animation-delay: 0s;
  animation-duration: 10s;
  animation-direction: normal;
  animation-iteration-count: infinite;
  animation-fill-mode: both;
  animation-play-state: running; 
}
@keyframes fish_move_right {
   from, 0% {
-webkit-transform: translate3d(0, 0px, 0) rotate3d(0,1,0,0deg);
    transform: translate3d(0, 0px, 0) rotate3d(0,1,0,0deg);
  }
  48% {
-webkit-transform: translate3d(2200px, 50px, 0) rotate3d(0,1,0,0deg);
    transform: translate3d(2200px, 50px, 0) rotate3d(0,1,0,0deg);
  }
  50% {
-webkit-transform: translate3d(2210px, 50px, 0) rotate3d(0,1,0,180deg) scale(0.9);
    transform: translate3d(2210px, 50px, 0) rotate3d(0,1,0,180deg) scale(0.9);
  }
  98% {
-webkit-transform: translate3d(10px, 0px, 0) rotate3d(0,1,0,180deg) scale(0.9);
    transform: translate3d(10px, 0px, 0) rotate3d(0,1,0,180deg) scale(0.9);
  }
  100% {
-webkit-transform: translate3d(0px, 0px, 0) rotate3d(0,1,0,0deg) scale(1);
    transform: translate3d(0px, 0px, 0) rotate3d(0,1,0,0deg) scale(1);
  }
}

@-webkit-keyframes fish_move_right {
   from, 0% {
-webkit-transform: translate3d(0, 0px, 0) rotate3d(0,1,0,0deg);
    transform: translate3d(0, 0px, 0) rotate3d(0,1,0,0deg);
  }
  48% {
-webkit-transform: translate3d(2200px, 50px, 0) rotate3d(0,1,0,0deg);
    transform: translate3d(2200px, 50px, 0) rotate3d(0,1,0,0deg);
  }
  50% {
-webkit-transform: translate3d(2210px, 50px, 0) rotate3d(0,1,0,180deg) scale(0.9);
    transform: translate3d(2210px, 50px, 0) rotate3d(0,1,0,180deg) scale(0.9);
  }
  98% {
-webkit-transform: translate3d(10px, 0px, 0) rotate3d(0,1,0,180deg) scale(0.9);
    transform: translate3d(10px, 0px, 0) rotate3d(0,1,0,180deg) scale(0.9);
  }
  100% {
-webkit-transform: translate3d(0px, 0px, 0) rotate3d(0,1,0,0deg) scale(1);
    transform: translate3d(0px, 0px, 0) rotate3d(0,1,0,0deg) scale(1);
  }
}
