/* ==========================================
   Slider
========================================== */
.slider {
  background: #fff;
  overflow: hidden;
  display: flex;
  align-items: center;
  position: relative;
  padding: 1rem 0;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 1rem;
}
.slider .slider-track {
  display: flex;
  gap: 5rem;
  width: max-content;
  animation: scroll 25s linear infinite;
}
.slider .slider-item {
  width: 11.25rem;
  height: 5rem;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.slider .slider-item img {
  width: 11.25rem;
  height: 5rem;
  object-fit: fill;
  object-position: center;
  transition: transform 0.3s ease, opacity 0.3s ease;
  opacity: 0.9;
}
.slider .slider-item img:hover {
  transform: scale(1.05);
  opacity: 1;
}

/* ==========================================
   Infinite Scroll
========================================== */
@keyframes scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(calc(-100% - 1rem));
  }
}
@media (min-width: 769px) {
  .slider {
    padding: 1rem 0;
    gap: 1.875rem;
  }
  @keyframes scroll {
    from {
      transform: translateX(0);
    }
    to {
      transform: translateX(calc(-100% - 1.875rem));
    }
  }
}
@media (min-width: 1025px) {
  .slider {
    padding: 4rem 0;
  }
}

/*# sourceMappingURL=slider.css.map */
