/* experience images moving animation */

.scroll-container {
  overflow: hidden;
  white-space: nowrap;
  display: flex;
  width: 100%;
}

.scroll-content {
  display: flex;
  gap: 1rem;
  animation: scroll-loop 10s linear infinite;
}

/* True Infinite Loop*/
@keyframes scroll-loop {
  from {
    transform: translateX(0%);
  }
  to {
    transform: translateX(calc(-100% - 1rem));
  }
}

/* Pause animation on hover */
.scroll-container:hover .scroll-content {
  animation-play-state: paused;
}