.scroll {
  position: relative;
  display: flex;
  overflow: hidden;
  /*-webkit-mask-image: linear-gradient(90deg, transparent, #fff 20%, #fff 80%, transparent)*/
}

.scroll div {
  white-space: nowrap;
  animation: scroll var(--time) linear infinite;
  animation-delay: calc(var(--time)*-1);

}

.scroll div:nth-child(2) {
  animation: scroll2 var(--time) linear infinite;
  animation-delay: calc(var(--time)/-2);
}

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

  100% {
    transform: translateX(-100%);
  }
}

@keyframes scroll2 {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-200%);
  }
}

.scroll div span {
  display: inline-flex;
  margin: 10px;
  letter-spacing: 0.2em;
  background: #333;
  color: #fff;
  padding: 5px 10px;
  border-radius: 5px;
  transition: 0.5s;
}

.scroll div span:hover {
  background: #3fd2f9;
  cursor: pointer;
}

.imgBox div {
  display: flex;
  align-items: center;
  justify-content: center;
}

.imgBox img {
  max-width: 400px;
  max-height: 300px;
}