.logos-img {
  width: 150px;
  margin: 0 20px;
  transition: .5s;
  cursor: pointer;
}

.logos-img:not(:hover) {
  filter: grayscale(100%);
}

.logos-scroll-infinite {
  position: relative;
  display: flex;
  width: 1200px;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent, #fff 20%, #fff 80%, transparent);
}

.logos-scroll-infinite div {
  white-space: nowrap;
  animation: animate 30s linear infinite;
}

@keyframes animate {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

.logos-scroll-infinite:hover div {
  animation-play-state: paused;
}