@layer addon { .templateMarquee { display: flex; width: 100%; .marquee { width: 100%; align-items: center; height: auto; overflow: hidden; z-index: 9; background: var(--gradient); -webkit-background-clip: text; -webkit-text-stroke: 4px transparent; color: var(--color-light); font-family: var(--font-basic); line-height: 1; font-size: 8rem; font-weight: 900; display: flex; flex-direction: row; text-transform: uppercase; @media (max-width: 56em) { font-size: 5rem; } @media (--max-fablet) { font-size: 5rem; } ul { all: unset; li { all: unset; white-space: nowrap; } } } } }