@keyframes leftToRight {
  from {
    opacity: 0;
    left: -850px;
  }
  to {
    opacity: 1;
    left: 0;
  }
}

@keyframes bounce {
  from {
    scale: 1;
  }
  to {
    scale: 1.2;
  }
}

@keyframes move {
  0% {
    offset-distance: 0%; /* je commence au début du trajet */
  }
  100% {
    offset-distance: 100%; /* je finis à la fin du trajet */
  }
}

@keyframes randomMove {
  0% {
    transform: translate(0px, 0px);
  }
  10% {
    transform: translate(100px, 100px);
  }
  20% {
    transform: translate(200px, -200px);
  }
  30% {
    transform: translate(0px, -200px);
  }
  40% {
    transform: translate(100px, 100px);
  }
  50% {
    transform: translate(300px, -100px);
  }
  60% {
    transform: translate(500px, -200px);
  }
  70% {
    transform: translate(550px, -400px);
  }
  80% {
    transform: translate(350px, -350px);
  }
  90% {
    transform: translate(20px, -150px);
  }
  100% {
    transform: translate(0px, 0px);
  }
}

/* ----------------------------------------------
 * Generated by Animista on 2024-4-17 17:27:23
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation flip-vertical-right
 * ----------------------------------------
 */
@-webkit-keyframes flip-vertical-right {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
  }
  100% {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
  }
}
@keyframes flip-vertical-right {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
  }
  100% {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
  }
}

@keyframes opacityOn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes btnColorChange {
  from {
    background: var(--gradient1);
  }
  to {
    background: var(--gradient2);
  }
}

@keyframes menuBefore {
  from {
    width: 0%;

    left: 50%;
  }

  to {
    width: 80%;

    left: 10%;
  }
}

@keyframes contactBg_rotate {
  from {
    rotate: 0deg;
  }
  to {
    rotate: 365deg;
  }
}

@keyframes moveH1FromLeft {
  0% {
    left: -100vw;
    transform: skewX(10deg);
  }
  70% {
    left: 0vw;
    transform: skewX(10deg);
  }
  75% {
    left: 5vw;
    transform: skewX(-10deg);
  }
  80% {
    left: -5vw;
    transform: skewX(10deg);
  }
  90% {
    left: 2vw;
    transform: skewX(-5deg);
  }
  95% {
    left: -2vw;
    transform: skewX(5deg);
  }
  100% {
    left: 0vw;
    transform: skewX(0deg);
  }
}

@keyframes badgeRevInSpinner {
  0% {
    left: -100vw;
    /* rotate: 0deg; */
  }
  33% {
    /* rotate: 360deg; */
  }
  66% {
    /* rotate: 0deg; */
  }
  100% {
    left: 0vw;
    /* rotate: 360deg; */
  }
}

@keyframes badgeRotate {
  0% {
    rotate: 0deg;
  }

  100% {
    rotate: 360deg;
  }
}

@keyframes h2Opacity {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.card7 {
  animation: none;
}

.card7.flip-active {
  animation: flipCards 0.6s ease;
}

@keyframes flipCards {
  0% {
    transform: rotateX(0deg);
  }
  50% {
    transform: rotateX(90deg);
  }
  100% {
    transform: rotateX(0deg);
  }
}