#meltwater {
  /* background-color: var(--lightestgray); */
  background-color: #FAFAFA;
  overflow: hidden;
  position: relative;
  font-size: .9rem;

  .wrapper {
    padding: 1.5rem 0;
    display: inline-flex;

    animation: scroll 100s linear infinite; /* Animation */

    .waterfall {
      display: block;
      white-space: nowrap;
    }
  }

  .wrapper:hover {
    animation-play-state: paused; /* Animation wird gestoppt */
  }

  a {
    color: var(--primary);
    text-decoration: none;
  }

  &:before, &:after {
    content: "";
    position: absolute;
    
    top: 0;
    width: 200px;
    height: 100%;
    z-index: 1000;
  }
  &:before {
    left: 0;
    background-image: linear-gradient(to right, #FAFAFF, transparent);
  }
  &:after {
    right: 0;
    background-image: linear-gradient(to left, #FAFAFF, transparent);
  }

}

/* Schlüsselbild-Animation */
@keyframes scroll {
  from {
    transform: translateX(0%); /* Start außerhalb des sichtbaren Bereichs */
  }
  to {
    transform: translateX(-50%); /* Endet außerhalb auf der anderen Seite */
  }
}