.fromright {
    -webkit-animation: fromright 1s 1 both 1s;
    -moz-animation: fromright 1s 1 both 1s;
    animation: fromright 1s 1 both 1s;
}
@-webkit-keyframes fromright {
    from {
        -webkit-transform: translateX(100px);
        opacity: 0;
    }
    to {
        -webkit-transform: translateX(0px);
        opacity: 1;
    }
}
@keyframes fromright {
    from {
        transform: translateX(100px);
        opacity: 0;
    }
    to {
        transform: translateX(0px);
        opacity: 1;
    }
}
@-moz-keyframes fromright {
    from {
        -moz-transform: translateX(100px);
        opacity: 0;
    }
    to {
        -moz-transform: translateX(0px);
        opacity: 1;
    }
}

/* animation partner section css */
@-webkit-keyframes swipe_logos {
    0% {
      -webkit-transform: translate(0);
    }
  
    100% {
        -webkit-transform: translate(-100%);
    }
}
@-moz-keyframes swipe_logos {
    0% {
      -moz-transform: translate(0);
    }
  
    100% {
        -moz-transform: translate(-100%);
    }
}
@-ms-keyframes swipe_logos {
    0% {
      -ms-transform: translate(0);
    }
  
    100% {
        -ms-transform: translate(-100%);
    }
}
@-o-keyframes swipe_logos {
    0% {
      -o-transform: translate(0);
    }
  
    100% {
        -o-transform: translate(-100%);
    }
}
@keyframes swipe_logos {
    0% {
      transform: translate(0);
    }
  
    100% {
      transform: translate(-100%);
    }
}
/* animation partner section css */


/* animation testimonial section css */

.swipe_testimonial {
    -webkit-animation: swipe_testimonial 60s linear infinite backwards;
    -moz-animation: swipe_testimonial 60s linear infinite backwards;
    -ms-animation: swipe_testimonial 60s linear infinite backwards;
    -o-animation: swipe_testimonial 60s linear infinite backwards;
    animation: swipe_testimonial 60s linear infinite backwards;
    left: 100%;
}
.swipe_testimonial_rev {
    -webkit-animation: swipe_testimonial_rev 60s linear infinite backwards;
    -moz-animation: swipe_testimonial_rev 60s linear infinite backwards;
    -ms-animation: swipe_testimonial_rev 60s linear infinite backwards;
    -o-animation: swipe_testimonial_rev 60s linear infinite backwards;
    animation: swipe_testimonial_rev 60s linear infinite backwards;
    left: 0;
}
.customer_feed_cover > .swipe_testimonial {
  -webkit-animation: swipe_testimonial 40s linear infinite backwards;
  -moz-animation: swipe_testimonial 40s linear infinite backwards;
  -ms-animation: swipe_testimonial 40s linear infinite backwards;
  -o-animation: swipe_testimonial 40s linear infinite backwards;
  animation: swipe_testimonial 40s linear infinite backwards;
}
.customer_feed_cover:hover > .swipe_testimonial {
    animation-play-state: paused;
    -webkit-animation-play-state: paused;
    -moz-animation-play-state: paused;
    -ms-animation-play-state: paused;
    -o-animation-play-state: paused;
  }
  .customer_feed_cover:hover > .swipe_testimonial_rev {
    animation-play-state: paused;
    -webkit-animation-play-state: paused;
    -moz-animation-play-state: paused;
    -ms-animation-play-state: paused;
    -o-animation-play-state: paused;
  }


  .lang_slide_row.swipe_testimonial {
    -webkit-animation: swipe_testimonial 40s linear infinite backwards;
    -moz-animation: swipe_testimonial 40s linear infinite backwards;
    -ms-animation: swipe_testimonial 40s linear infinite backwards;
    -o-animation: swipe_testimonial 40s linear infinite backwards;
    animation: swipe_testimonial 40s linear infinite backwards;
}
@-webkit-keyframes swipe_testimonial {
    0% {
      -webkit-transform: translate(0);
    }
  
    100% {
        -webkit-transform: translate(-100%);
    }
}
@-moz-keyframes swipe_testimonial {
    0% {
      -moz-transform: translate(0);
    }
  
    100% {
        -moz-transform: translate(-100%);
    }
}
@-ms-keyframes swipe_testimonial {
    0% {
      -ms-transform: translate(0);
    }
  
    100% {
        -ms-transform: translate(-100%);
    }
}
@-o-keyframes swipe_testimonial {
    0% {
      -o-transform: translate(0);
    }
  
    100% {
        -o-transform: translate(-100%);
    }
}
@keyframes swipe_testimonial {
    0% {
      transform: translate(0);
    }
  
    100% {
      transform: translate(-100%);
    }
}
/* animation testimonial section css */

/* animation testimonial section css */
@-webkit-keyframes swipe_testimonial_rev {
    100% {
      -webkit-transform: translate(0);
    }
  
    0% {
        -webkit-transform: translate(-100%);
    }
}
@-moz-keyframes swipe_testimonial_rev {
    100% {
      -moz-transform: translate(0);
    }
  
    0% {
        -moz-transform: translate(-100%);
    }
}
@-ms-keyframes swipe_testimonial_rev {
    100% {
      -ms-transform: translate(0);
    }
  
    0% {
        -ms-transform: translate(-100%);
    }
}
@-o-keyframes swipe_testimonial_rev {
    100% {
      -o-transform: translate(0);
    }
  
    0% {
        -o-transform: translate(-100%);
    }
}
@keyframes swipe_testimonial_rev {
    100% {
      transform: translate(0);
    }
  
    0% {
      transform: translate(-100%);
    }
}
/* animation testimonial section css */
/* circle ripple effect */
@keyframes circle_ripple_effect {
    0% {
        transform: scale(1);
        opacity: 0;
    }
    50% {
        opacity: 0.5;
    }
    100% {
        transform: scale(1.2);
        opacity: 0;
    }
}
@-webkit-keyframes circle_ripple_effect {
    0% {
        -webkit-transform: scale(1);
        opacity: 0;
    }
    50% {
        opacity: 0.5;
    }
    100% {
        -webkit-transform: scale(1.2);
        opacity: 0;
    }
}
@-moz-keyframes circle_ripple_effect {
    0% {
        -moz-transform: scale(1);
        opacity: 0;
    }
    50% {
        opacity: 0.5;
    }
    100% {
        -moz-transform: scale(1.2);
        opacity: 0;
    }
}
.circle_ripple_effect {
    animation: circle_ripple_effect 2s 1 0.5s;
    -webkit-animation: circle_ripple_effect 2s 1 0.5s;
    -moz-animation: circle_ripple_effect 2s 1 0.5s;
}
/* circle ripple effect */
/* animation css */
.spin {
    -webkit-animation: spin infinite 500ms linear 1s;
    -moz-animation: spin infinite 500ms linear 1s;
    -ms-animation: spin infinite 500ms linear 1s;
    animation: spin infinite 500ms linear 1s;
}
@-webkit-keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(-360deg);
    }
}
@-moz-keyframes spin {
    from {
        -moz-transform: rotate(0deg);
    }
    to {
        -moz-transform: rotate(-360deg);
    }
}
@-ms-keyframes spin {
    from {
        -ms-transform: rotate(0deg);
    }
    to {
        -ms-transform: rotate(-360deg);
    }
}
@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(-360deg);
    }
}
.fadeIn {
    -webkit-animation: fadeIn 1s 1 both;
    animation: fadeIn 1s 1 both;
    -moz-animation: fadeIn 1s 1 both;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@-moz-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
.fadeOut {
    -webkit-animation: fadeOut 1s 1 both;
    animation: fadeOut 1s 1 both;
    -moz-animation: fadeOut 1s 1 both;
}

@keyframes fadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@-webkit-keyframes fadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@-moz-keyframes fadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

.fade-out {
  -webkit-animation: fadeOut 1s 1 forwards;
  animation: fadeOut 1s 1 forwards;
}

.fadeInleft {
  -webkit-animation: fadeInleft 1s 1 both;
  animation: fadeInleft 1s 1 both;
  -moz-animation: fadeInleft 1s 1 both;
}

@keyframes fadeInleft {
  0% {
    opacity: 0;
    transform: translate3d(-20px, 0, 0);
  }
  100% {
    opacity: 1;
    transform: translate3d(0px, 0, 0);
  }
}
@-webkit-keyframes fadeInleft {
  0% {
    opacity: 0;
    transform: translate3d(-20px, 0, 0);
  }
100% {
  opacity: 1;
  transform: translate3d(0px, 0, 0);
  }
}
@-moz-keyframes fadeInleft {
  0% {
      opacity: 0;
      transform: translate3d(-20px, 0, 0);
  }
  100% {
      opacity: 1;
      transform: translate3d(0px, 0, 0);
  }
}

/* animation css */
/*===== animation css =========*/
@keyframes waves {
    0% {
      -webkit-transform: scale(0, 0);
      transform: scale(0, 0);
      opacity: 0;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    }
    50% {
      opacity: 0.9;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    }
    100% {
      -webkit-transform: scale(0.9, 0.9);
      transform: scale(4.9,4.9);
      opacity: 0;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    }
  }



  @-webkit-keyframes circle_waves {
    0% {
      -webkit-transform: scale(0, 0);
      transform: scale(0, 0);
      opacity: 0;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    }
    50% {
      opacity: 0.9;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    }
    100% {
      -webkit-transform: scale(0.9, 0.9);
      transform: scale(3,3);
      opacity: 0;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    }
  }
  @keyframes circle_waves {
    0% {
      -webkit-transform: scale(0, 0);
      transform: scale(0, 0);
      opacity: 0;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    }
    50% {
      opacity: 0.9;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    }
    100% {
      -webkit-transform: scale(0.9, 0.9);
      transform: scale(3,3);
      opacity: 0;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    }
  }
  @keyframes waves_anim {
    0% {
      -webkit-transform: scale(0, 0);
      transform: scale(0, 0);
      opacity: 0;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    }
    50% {
      opacity: 0.9;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    }
    100% {
      -webkit-transform: scale(0.9, 0.9);
      transform: scale(1.5,1.5);
      opacity: 0;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    }
  }
  
  @-webkit-keyframes waves_anim {
    0% {
      -webkit-transform: scale(0, 0);
      transform: scale(1.5,1.5);
      opacity: 0;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    }
    50% {
      opacity: 0.9;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    }
    100% {
      -webkit-transform: scale(0.9, 0.9);
      transform: scale(2,2);
      opacity: 0;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    }
  }

  .push-in {
    /* position:relative;*/
    opacity:1;
    -webkit-animation: push-in 0.6s;
    -moz-animation: push-in 0.6s;
    animation: push-in 0.6s;
  }
  
  .push-out {
    -webkit-animation: push-out 0.6s;
    -moz-animation: push-out 0.6s;
    animation: push-out 0.6s;
   
  }

@-webkit-keyframes push-in {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-100%);
  }
  70% {
    opacity: 1;
    -webkit-transform: translateY(10%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}
@-moz-keyframes push-in {
  0% {
    opacity: 0;
    -moz-transform: translateY(-100%);
  }
  60% {
    opacity: 1;
    -moz-transform: translateY(10%);
  }
  100% {
    opacity: 1;
    -moz-transform: translateY(0);
  }
}
@keyframes push-in {
  0% {
  opacity: 0;
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
    transform: translateY(-100%);
  }
  60% {
    opacity: 1;
    -webkit-transform: translateY(10%);
    -moz-transform: translateY(10%);
    -ms-transform: translateY(10%);
    -o-transform: translateY(10%);
    transform: translateY(10%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
}
@-webkit-keyframes push-out {
  0% {
    opacity: 1;
    -webkit-transform: translatey(0);
  }
  60% {
    opacity: 0;
    -webkit-transform: translateY(110%);
  }
 100% {
    opacity: 0;
    -webkit-transform: translateY(100%);
  }
}
@-moz-keyframes push-out {
  0% {
   opacity: 1;
    -moz-transform: translateY(0);
  }
  60% {
    opacity: 0;
    -moz-transform: translateY(110%);
  }
  100% {
    opacity: 0;
    -moz-transform: translateY(100%);
  }
}
@keyframes push-out {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
  60% {
    opacity: 0;
    -webkit-transform: translateY(110%);
    -moz-transform: translateY(110%);
    -ms-transform: translateY(110%);
    -o-transform: translateY(110%);
    transform: translateY(110%);
  }
  100% {
    opacity: 0;
   -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
  }
}
  /*========= animation css =======*/
  @keyframes marqueeTop {
     0% {
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0)
      }
      50% {
          -webkit-transform: translate3d(0, -100%, 0);
          transform: translate3d(0, -100%, 0)
      }
      100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
  }
  
  @keyframes marqueeBottom {
    0% {
          -webkit-transform: translate3d(0, -100%, 0);
          transform: translate3d(0, -100%, 0)
      }
      50% {
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0)
      }
      100% {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
  }

  @keyframes marqueeleft {
    0% {
         -webkit-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0)
     }
     50% {
         -webkit-transform: translate3d(-100%, 0, 0);
         transform: translate3d(-100%, 0, 0);
     }
     100% {
       -webkit-transform: translate3d(0, 0, 0);
       transform: translate3d(0, 0, 0)
   }
 }
 
 @keyframes marqueeright {
  0% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
    50% {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
     100% {
      -webkit-transform: translate3d(0, 0, -100%);
      transform: translate3d(0, 0, -100%);
   }
 }





 @-webkit-keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}
@keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}
.slideOutUp {
  -webkit-animation: slideOutUp 1s 1 both;
  animation: slideOutUp 1s 1 both;
}



@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: hidden;
  }
}
@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: hidden;
  }
}
.slideInUp {
  -webkit-animation: slideInUp 1s 1 both;
  animation: slideInUp 1s 1 both;
}


@-webkit-keyframes slidein_up {
  from {
    -webkit-transform: translateY(-100%);
    transform: translateY(100%);
    visibility: visible;
  }

  to {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    visibility: hidden;

  }
}
@keyframes slidein_up {
  from {
    -webkit-transform: translateY(-100%);
    transform: translateY(100%);
    visibility: visible;
  }

  to {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    visibility: hidden;
  }
}
.slidein_up {
  -webkit-animation: slidein_up 1s 1;
  animation: slidein_up 1s 1;
}


/*======= move cricle animation 1 =========*/
@keyframes moveright_wave_circle1 {
  0% {
    transform: translateX(-150px);
    left: 100%;
    top: 400px;
    opacity: 0;
    }
    10% {
      transform: translateX(-75px);
      opacity: 1;
    }
    50% {
      transform: translateX(0);
      
    }
    75% {
      transform: translateX(-100px);
    }
   100% {
      left: 100%;
      opacity: 1;
      transform: translateX(-150px);
      top: calc(100% + 285px);
    }
 }
 .moveright_wave_circle1 {
  animation: moveright_wave_circle1 1s 1 ease-in-out;
 }



/*======= move cricle animation 2 =========*/
@keyframes moveright_wave_circle2 {
  0% {
    top: 200px;
    left: 0;
    transform: translateX(100px);
    opacity: 0;
    }
    25% {
      transform: translateX(0px);
      opacity: 1;
    }
    50% {
      transform: translateX(0);
      
    }
    75% {
      transform: translateX(50px);
    }
   100% {
    transform: translateX(200px);
    top: calc(100% + 350px);
    left: 0;
    opacity: 1;
  }
 }
 .moveright_wave_circle2 {
  animation: moveright_wave_circle2 1s 1 ease-in-out;
 }
/*======= move cricle animation 3 =========*/
@keyframes moveright_wave_circle3 {
  0% {
    top: 70%;
    left: 50%;
    opacity: 0;
    transform: translateX(-50%);
    }
   100% {
    top: calc(100% + 200px);
    left: 50%;
    opacity: 1;
    transform: translateX(-50%);
  }
 }
 .moveright_wave_circle3 {
  animation: moveright_wave_circle3 1s 1 ease-in-out;
 }


 /*======= move cricle animation 3 =========*/
@keyframes moveright_wave_circle4 {
  0% {
    top: 100%;
    left: 50%;
    opacity: 0;
    transform: translateX(-50%);
    }
    90% {
      top: calc(100% + 200px);
      left: 50%;
      opacity: 1;
      transform: translateX(-50%);
    }
   100% {
    top: calc(100% + 200px);
    left: 50%;
    opacity: 0;
    transform: translateX(-50%) scale(40);
  }
 }
 .moveright_wave_circle2 {
  animation: moveright_wave_circle4 1s 1 ease-in-out;
 }

@-webkit-keyframes letterfadeIn {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}

@-moz-keyframes letterfadeIn {
  0% {
    opacity: 0;
    -moz-transform: translateX(-20px);
  }
  100% {
    opacity: 1;
    -moz-transform: translateY(0);
  }
}
@keyframes letterfadeIn {
  0% {
    opacity: 0;
    transform: translateX(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}


.hide_me_anim {
  -moz-animation: hide_me_anim 1s ease-in-out 5s;
  -webkit-animation: hide_me_anim 1s ease-in-out 5s;
  -o-animation: hide_me_anim 1s ease-in-out 5s;
  animation: hide_me_anim 1s ease-in-out 5s;
}
@keyframes hide_me_anim {
  0% {
      width:auto;
      height:auto;
      overflow:clip;
  }
  100% {
      width:0;
      height:0;
      overflow:hidden;
      transform: scale(0);

  }
}
@-webkit-keyframes hide_me_anim {
  0% {
    width:auto;
    height:auto;
    overflow:clip;
}
100% {
    width:0;
    height:0;
    overflow:hidden;
    -webkit-transform: scale(0);
}
}
.zoom-in-out-anim {
  -webkit-animation: zoom-in-out-anim 1s ease-in-out 2.5s;
  animation: zoom-in-out-anim 1s ease-in-out 2.5s;
}
@keyframes zoom-in-out-anim {
  0% {
     transform: scale(1);
     opacity: 0;
  }
  50% {
    transform: scale(1.3);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
@-webkit-keyframes zoom-in-out-anim {
  0% {
    opacity: 0;
    -webkit-transform: scale(1);
 }
 50% {
  -webkit-transform: scale(1.3);
  opacity: 1;
 }
 100% {
  -webkit-transform: scale(1);
  opacity: 1;
 }
}

@-webkit-keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    opacity: 1;
  }
}
.animate_flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation: flipInX 1s 1 both;
  animation: flipInX 1s 1 both;
}