#marquee-container {
  border: 1px solid hotpink;
      background: linear-gradient(to bottom, #fdd6e5, #fcb8d7 40%, #fbc3ea);  color: white;
  margin: auto;
  width: 100%;
  max-width: 900px;
  height: 30px;
  overflow: hidden;
  position: relative;
  font-size: 20px;
  line-height: 30px;
  white-space: nowrap;
}

#marquee-text {
  display: inline-block;
  position: absolute;
  will-change: transform;
  animation: scroll-left 10s linear infinite;
  padding-left: 100%;
}

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