.animate {
  position: relative;
  display: inline-block; }
  .animate .real {
    position: absolute;
    opacity: 0; }
  .animate .clone {
    position: relative;
    opacity: 0;
    z-index: -1; }
  .animate.found .real {
    animation-name: fadeIn;
    animation-duration: 2s;
    animation-fill-mode: forwards; }
    .animate.found .real.fadeIn {
      animation-name: fadeIn; }
    .animate.found .real.slideLeft {
      animation-name: slideLeft; }
    .animate.found .real.slideRight {
      animation-name: slideRight; }
    .animate.found .real.slideUp {
      animation-name: slideUp; }
    .animate.found .real.delay1 {
      animation-delay: .75s; }
    .animate.found .real.delay2 {
      animation-delay: 1.5s; }
    .animate.found .real.delay3 {
      animation-delay: 2.25s; }
    .animate.found .real.delay4 {
      animation-delay: 2.8s; }
    .animate.found .real.delay5 {
      animation-delay: 3.2s; }

/* Keyframe */
@keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 100%; } }

@keyframes slideRight {
  0% {
    opacity: 0;
    -webkit-transform: translate(-30%, 0);
    -moz-transform: translate(-30%, 0);
    -ms-transform: translate(-30%, 0);
    -o-transform: translate(-30%, 0);
    transform: translate(-30%, 0); }
  100% {
    opacity: 100%;
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0); } }

@keyframes slideLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate(30%, 0);
    -moz-transform: translate(30%, 0);
    -ms-transform: translate(30%, 0);
    -o-transform: translate(30%, 0);
    transform: translate(30%, 0); }
  100% {
    opacity: 100%;
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0); } }

@keyframes slideUp {
  0% {
    opacity: 0;
    -webkit-transform: translate(0%, 30%);
    -moz-transform: translate(0%, 30%);
    -ms-transform: translate(0%, 30%);
    -o-transform: translate(0%, 30%);
    transform: translate(0%, 30%); }
  100% {
    opacity: 100%;
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0); } }

/* Small Devices, Tablets */
@media (max-width: 767px) {
  .animate.found .real.delay1 {
    animation-delay: 0s; }
  .animate.found .real.delay2 {
    animation-delay: 0s; }
  .animate.found .real.delay3 {
    animation-delay: 0s; } }