.marquee-text {
  overflow: clip;
}

.marquee-text-track:hover {
  animation-play-state: paused;
  cursor: wait;
}

.marquee-text-track {
  display: flex;
  padding-left: 2rem;
  gap: 2rem;
  width: max-content;
  animation: marquee-move-text var(--speed, 15s) linear infinite var(
      --direction,
      forwards
    );
}

.marquee-text p {
  border: 3px solid rgb(255, 0, 0);
  background-color: #f3f3f3;
  border-radius:1%;
  padding: 1rem 2.5rem; 
}

@keyframes marquee-move-text {
  to {
    transform: translateX(-50%);
  }
}