.flipper {
  transform-style: preserve-3d;
  position: relative;
  perspective: 1000px;
  .front, .back {
    backface-visibility: hidden;
    transition: 0.6s;
    transform-style: preserve-3d;
    transform: rotateY(0deg);
    position: absolute;
    top: 0;
    left: 0;
  }

  .front {
    transform: rotateY(0deg);
    z-index: 2;
    animation:flip-front 5s ease-in-out infinite ;
    animation-delay: 2s;
  }

  .back {
    transform: rotateY(-180deg);
    animation:flip-back 5s ease-in-out infinite ;
    animation-delay: 2s;
  }
}

.ua-ie{
  .front, .back {
    backface-visibility: visible;
    animation: none;
  }
  .back{
    display: none;
  }
}


@keyframes flip-front{
  0%{ transform: rotateY(0deg);}
  40%{ transform: rotateY(0deg);}
  70%{ transform: rotateY(-180deg);}
  100%{ transform: rotateY(-360deg);}
}
@keyframes flip-back{
  0%{ transform: rotateY(-180deg);}
  40%{ transform: rotateY(-180deg);}
  70%{ transform: rotateY(0deg);}
  100%{ transform: rotateY(180deg);}
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(50px) !important;
  }
  100% {
    opacity: 1;
    transform: translateY(0)
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translateX(-50px) !important;
  }
  100% {
    opacity: 1;
    transform: translateY(0)
  }
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    transform: translateX(-50px) !important;
  }
  100% {
    opacity: 1;
    transform: translateX(0)
  }
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    transform: translateX(-50px) !important;
  }
  100% {
    opacity: 1;
    transform: translateX(0)
  }
}

@keyframes zoomIn {
  0% {
    opacity: 0;
    transform: scale(0.9) !important;
  }
  100% {
    opacity: 1;
    transform: scale(1)
  }
}

@keyframes zoomInUp {
  0% {
    opacity: 0;
    transform: scale(0) translateY(50px) !important;
  }
  100% {
    opacity: 1;
    transform: scale(1) translateY(0)
  }
}

@keyframes zoomInDown {
  0% {
    opacity: 0;
    transform: scale(0) translateY(-50px) !important;
  }
  100% {
    opacity: 1;
    transform: scale(1) translateY(0)
  }
}

