.carousel {
  overflow: hidden;
  width: 75vw;
  max-width: 85%;
  background: #e6012a;
  padding: 20px 0;
  position: relative;
}
.carousel-track {
  display: flex;
  width: max-content;
  flex-wrap: nowrap;
  animation: slide 10s linear infinite;
  align-items: center;
}
.carousel-track:hover {
  animation-play-state: paused;
}
.carousel img {
  max-width: 250px;
  height: auto;
  margin: 0 2vw;
  object-fit: contain;
}

.carousel::before, .carousel::after {
  content: "";
  position: absolute;
  top: 0;
  width: 15%;
  height: 100%;
  z-index: 1;
}
.carousel::before {
  left: 0;
  background: linear-gradient(to right, #e6012a, #e6012b00);
}
.carousel::after {
  right: 0;
  background: linear-gradient(to left, #e6012a, #e6012b00);
}

@keyframes slide {
  from {
      transform: translateX(0);
  }
  to {
      transform: translateX(-50%);
  }
}
@media (max-width: 600px) {
  .carousel img {
      max-width: 120px;
      margin: 0 3vw;
  }
}