@keyframes bgAnimation {
  0% {
    background-position: 100% 50%;
    background: linear-gradient(85.25deg,
        rgba(240, 185, 11, 0.8),
        rgba(18, 18, 18, 0.5) 81.39%);
  }

  50% {
    background-position: 0% 50%;
    background: linear-gradient(85.25deg,
        rgba(18, 18, 18, 0.5),
        rgba(240, 185, 11, 0.8) 81.39%);
  }

  100% {
    background-position: 100% 50%;
    background: linear-gradient(85.25deg,
        rgba(240, 185, 11, 0.8),
        rgba(18, 18, 18, 0.5) 81.39%);
  }
}

.animate-bg {
  animation: bgAnimation 4s ease-in-out infinite;
  background-size: 200% 200%;
}

/* MOBILE */
/* Animation carousel For 3 boxes   */

#container1>div,
#container2>div,
#container3>div {
  will-change: transform;
  backface-visibility: hidden;
  /* Improves animation quality */
}

#container1,
#container2,
#container3 {
  position: absolute;
  transform-style: preserve-3d;
}

.hidden-slideMobile {
  opacity: 0;
  transform: translateX(100%);
  transition: transform 0.8s ease-out, opacity 0.8s ease-out;
}