@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInDown {
  animation-name: fadeInDown;
}

@keyframes moving {
  30% {
    webkit-transform: skewX(-45deg) translateX(33.5em);
    transform: skewX(-45deg) translateX(33.5em);
  }

  100% {
    webkit-transform: skewX(-45deg) translateX(33.5em);
    transform: skewX(-45deg) translateX(33.5em);
  }
}

@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translate3d(100%,0,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.fadeInRight {
    animation-name: fadeInRight
}
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0,100%,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.fadeInUp {
    animation-name: fadeInUp
}

.moving {
  animation-name: moving;
}

/* Современные браузеры, кроме Chrome, Opera, Safari */
@keyframes go-left-right {
  /* назовём анимацию: "go-left-right" */
  from {
    top: -10px;
    /* от: left: 0px */
  }

  to {
    top: 0px;
    /* до: left: 100%-50px */
  }
}

/* Префикс для Chrome, Opera, Safari */
@-webkit-keyframes go-left-right {
  from {
    top: -15px;
  }

  to {
    top: 0px;
  }
}

.progressmove {
  /* применить анимацию go-left-right */
  /* продолжительность 3s */
  /* количество раз: бесконечное (infinite) */
  /* менять направление анимации каждый раз (alternate) */
  animation: go-left-right 0.5s infinite alternate;
  -webkit-animation: go-left-right 0.5s infinite alternate;
}

@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translate3d(-100%,0,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.fadeInLeft {
    animation-name: fadeInLeft
}
