<section class="why-play-streaks temp run">
    <header class="header d-md-none"><h2>WHY PLAY STREAKS?</h2></header>
    <div class="text-carousel d-none d-md-block">
        <div class="animation-text">
            <span>WHY PLAY STREAKS?</span><img src="img/layout/logo.svg" alt="logo" class="logo">
            <span>WHY PLAY STREAKS?</span><img src="img/layout/logo.svg" alt="logo" class="logo">
            <span>WHY PLAY STREAKS?</span><img src="img/layout/logo.svg" alt="logo" class="logo">
            <span>WHY PLAY STREAKS?</span><img src="img/layout/logo.svg" alt="logo" class="logo">
            <span>WHY PLAY STREAKS?</span><img src="img/layout/logo.svg" alt="logo" class="logo">
            <span>WHY PLAY STREAKS?</span><img src="img/layout/logo.svg" alt="logo" class="logo">
        </div>
    </div>
    <div class="content">
        <div class="line line-1">
            <div class="column col1 d-none d-xxl-block">
                <div class="block block1"></div>
                <div class="block block2"></div>
                <div class="block block3"></div>
            </div>
            <div class="column col2 d-none d-lg-block bw-r">
                <div class="block block1"><img src="img/layout/block-circle.svg" alt=""></div>
                <div class="block block2"></div>
                <div class="block block3"></div>
            </div>
            <article class="topic">
                <div class="image">
                    <div class="stamp stamp-free stamp-l">
                        <div class="item bg"></div>
                        <div class="bubble-cluster">
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                        </div>
                        <div class="item content content-free">
                            <div class="item free"></div>
                        </div>
                        
                    </div>
                </div>
                <div class="text">
                    <header><h3>100% FREE</h3></header>
                    <p>Free entry. <br class="mobile">
                    No deposit required.</p>
                </div>
            </article>
            <div class="column col3 d-none d-md-block">
                <div class="block block1"></div>
                <div class="block block2"><img src="img/layout/arrow-left.svg" alt=""></div>
                <div class="block block3"></div>
            </div>
            <div class="column col4 d-none d-md-block">
                <div class="block block1"></div>
                <div class="block block2"><img src="img/layout/arrow-left.svg" alt=""></div>
                <div class="block block3"></div>
            </div>
            <div class="column col5 d-none d-xl-block bw-r">
                <div class="block block1"><img src="img/layout/block-dots1.svg" alt=""></div>
                <div class="block block2"><img src="img/layout/arrow-left.svg" alt=""></div>
                <div class="block block3"></div>
            </div>
        </div>
        <div class="line line-2">
            <div class="column col1 d-none d-xxl-block">
                <div class="block block1"><img src="img/layout/block-ball.svg" alt=""></div>
                <div class="block block2"></div>
                <div class="block block3"></div>
            </div>
            <div class="column col2 d-none d-lg-block">
                <div class="block block1"></div>
                <div class="block block2"></div>
                <div class="block block3"><img src="img/layout/block-win.svg" alt="" class="win"></div>
            </div>
            <div class="column col3 d-none d-md-block">
                <div class="block block1"></div>
                <div class="block block2"></div>
                <div class="block block3"></div>
            </div>
            <div class="column col4 d-none d-md-block bw-r">
                <div class="block block1"></div>
                <div class="block block2"><img src="img/layout/block-star.svg" alt=""></div>
                <div class="block block3"></div>
            </div>
            <article class="topic">
                <div class="image">
                    <div class="stamp stamp-easy stamp-r">
                        <div class="item bg"></div>
                        <div class="bubble-cluster">
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                        </div>
                        <div class="item content content-easy">
                            <div class="item soccer-ball"></div>
                            <div class="item helmet"></div>
                            <div class="item basket-ball"></div>
                        </div>
                    </div>
                </div>
                <div class="text">
                    <header><h3>EASY TO PLAY</h3></header>
                    <p>Easily connect via your. <br class="mobile">
                    No app download required.</p>
                </div>
            </article>

            <div class="column col5 d-none d-xl-block bw-r">
                <div class="block block1"><img src="img/layout/block-circle.svg" alt=""></div>
                <div class="block block2"></div>
                <div class="block block3"></div>
            </div>
        </div>
        <div class="line line-3">
            <div class="column col1 d-none d-xxl-block">
                <div class="block block1"></div>
                <div class="block block2"><img src="img/layout/block-circle.svg" alt=""></div>
                <div class="block block3"></div>
            </div>
            <div class="column col2 d-none d-lg-block bw-r">
                <div class="block block1"></div>
                <div class="block block2"></div>
                <div class="block block3"></div>
            </div>
            <article class="topic">
                <div class="image">
                    <div class="stamp stamp-human stamp-l">
                        <div class="item bg"></div>
                        <div class="bubble-cluster">
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                        </div>
                        <div class="item content content-human">
                            <div class="item square"></div>
                            <div class="item bar1"></div>
                            <div class="item bar2"></div>
                            <div class="item barball barball1"></div>
                            <div class="item barball barball2"></div>
                            <div class="item human"></div>
                        </div>
                    </div>
                </div>
                <div class="text">
                    <header><h3>PERSONALIZED <br class="mobile">FOR YOU</h3></header>
                    <p>Streaks is designed to get better the more you play. Personalized gameplay, favorites leagues, teams, players and prizes, etc.</p>
                </div>
            </article>
            <div class="column col3 d-none d-md-block">
                <div class="block block1"></div>
                <div class="block block2"><img src="img/layout/block-helmet.svg" alt=""></div>
                <div class="block block3"></div>
            </div>
            <div class="column col4 d-none d-xxl-block bw-r">
                <div class="block block1"><img src="img/layout/block-bg.svg" alt=""></div>
                <div class="block block2"></div>
                <div class="block block3"><img src="img/layout/block-dots2.svg" alt=""></div>
            </div>
        </div>
        <div class="line line-4">
            <div class="column col1 d-none d-xxl-block">
                <div class="block block1"></div>
                <div class="block block2"><img src="img/layout/block-bg.svg" alt=""></div>
                <div class="block block3"></div>
            </div>
            <div class="column col2 d-none d-lg-block">
                <div class="block block1"><img src="img/layout/block-dots3.svg" alt=""></div>
                <div class="block block2"></div>
                <div class="block block3"></div>
            </div>
            <div class="column col3 d-none d-md-block">
                <div class="block block1"></div>
                <div class="block block2"></div>
                <div class="block block3"><img src="img/layout/block-tenisball.svg" alt="" class="tenisball"></div>
            </div>
            <div class="column col4 d-none d-md-block bw-r">
                <div class="block block1"></div>
                <div class="block block2"></div>
                <div class="block block3"></div>
            </div>
            <article class="topic">
                <div class="image">
                    <div class="stamp stamp-win stamp-r">
                        <div class="item bg"></div>
                        <div class="bubble-cluster cluster1">
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img coin1"></div></div>
                        </div>
                        <div class="bubble-cluster cluster2">
                            <div class="dot"><div class="img coin2"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                        </div>
                        <div class="item content content-win">
                            <div class="item bar1"></div>
                            <div class="item bar2"></div>
                            <div class="item bar3"></div>
                            <div class="item star1"></div>
                            <div class="item star2"></div>
                            <div class="item star3"></div>
                        </div>
                    </div>
                </div>
                <div class="text">
                    <header><h3>WIN GUARANTEED</h3></header>
                    <p>Top places win x, y, z but everyone also earns for just playing. <span class="pink">(How much disclaimer text will be here?)</span></p>
                </div>
            </article>
            <div class="column col5 d-none d-xl-block bw-r">
                <div class="block block1"></div>
                <div class="block block2"></div>
                <div class="block block3"><img src="img/layout/block-circle.svg" alt=""></div>
            </div>
        </div>
        <div class="line line-5">
            <div class="column col1 d-none d-xxl-block">
                <div class="block block1"></div>
                <div class="block block2"></div>
                <div class="block block3"></div>
            </div>
            <div class="column col2 d-none d-lg-block bw-r">
                <div class="block block1"></div>
                <div class="block block2"></div>
                <div class="block block3"><img src="img/layout/block-picks.svg" alt="" class="picks"></div>
            </div>
            <article class="topic">
                <div class="image">
                    <div class="stamp stamp-unique stamp-l">
                        <div class="item bg"></div>
                        <div class="bubble-cluster">
                            <div class="dot"><div class="img star1"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img"></div></div>
                            <div class="dot"><div class="img star2"></div></div>
                        </div>
                        <div class="item content content-unique">
                            <div class="item plate1"></div>
                            <div class="item plate2"></div>
                            <div class="item tropheu"></div>
                        </div>
                    </div>
                </div>
                <div class="text">
                    <header><h3>UNIQUE PRIZING</h3></header>
                    <p>Convert your streaks points into cash, crypto (BTC, ETH, DOGE), prizes or experiences. </p>
                </div>
            </article>
            <div class="column col3 d-none d-md-block">
                <div class="block block1"></div>
                <div class="block block2"><img src="img/layout/block-star.svg" alt=""></div>
                <div class="block block3"><img src="img/layout/arrow-left.svg" alt=""></div>
            </div>
            <div class="column col4 d-none d-md-block">
                <div class="block block1"></div>
                <div class="block block2"></div>
                <div class="block block3"><img src="img/layout/arrow-left.svg" alt=""></div>
            </div>
            <div class="column col5 d-none d-xl-block bw-r">
                <div class="block block1"></div>
                <div class="block block2"></div>
                <div class="block block3"><img src="img/layout/arrow-left.svg" alt=""></div>
            </div>
        </div>
    </div>
</section>