head Code range and leny + text anim

PHOTO

Wed Oct 16 2024 16:48:04 GMT+0000 (Coordinated Universal Time)

Saved by @zily

<head>
    <style>
        /* Range Slider Styles */
        .rangeslider,
        .rangeslider__fill {
            background: #e6e6e6;
            display: block;
            height: 12px;
            width: 100%;
            border-radius: 10px;
        }

        .rangeslider {
            position: relative;
        }

        .rangeslider__fill {
            background: #00ff00;
            position: absolute;
            top: 0;
        }

        .rangeslider__handle {
            background: white;
            border: 1px solid #D9DBE9;
            cursor: pointer;
            display: inline-block;
            width: 80px;
            height: 40px;
            position: absolute;
            top: -10px;
            border-radius: 50%;
        }

        .wrapper-rangeslider {
            width: 100%;
            margin: 50px auto 0;
        }

        /* Text Animation Styles */
        [text-split] {
            opacity: 0;
        }
        
        html.w-editor [text-split] {
            opacity: 1;
        }

        .word {
            overflow: hidden;
            padding-bottom: 0.1em;
            margin-bottom: -0.1em;
            transform-origin: bottom;
        }

        /* Lenis Scroll Styles */
        html.lenis {
            height: auto;
        }

        .lenis.lenis-smooth {
            scroll-behavior: auto;
        }

        .lenis.lenis-smooth [data-lenis-prevent] {
            overscroll-behavior: contain;
        }

        .lenis.lenis-stopped {
            overflow: hidden;
        }
    </style>
</head>

COPY