<section class="events-grid">
    <div class="events-grid-container">
        <div class="events-grid-content">
            <h2 class="events-grid-title">CHAQUE JOUR UN NOUVEAU TOURNOI</h2>
            <div class="events-grid-description">
                <p>Voici les prochains tournois organisés par le Club. Choisissez le vôtre !</p>
            </div>
            <div class="events-grid-items">
                <article class="events-grid-item">
                    <picture class="events-grid-item-picture">
                        <source media="@@MQ_DESKTOP" srcset="img/modules/EVENTS-GRID/image-tablet-blue.png">
                        <source media="@@MQ_TABLET" srcset="img/modules/EVENTS-GRID/image-tablet-blue.png">
                        <source media="@@MQ_MOBILE" srcset="img/modules/EVENTS-GRID/image-mobile.png">
                        <img class="events-grid-item-picture-image" alt="">
                    </picture>
                    <a class="events-grid-item-content" href="#">
                        <header class="events-grid-item-header">
                            <div class="events-grid-item-header-title">TOURNOI KNOCKOUT RE-ENTRY 200 €</div>
                        </header>
                        <footer class="events-grid-item-footer">
                            <div class="events-grid-item-footer-content">
                                <div class="events-grid-item-footer-title">MARDI 1 JUILLET</div>
                                <div class="events-grid-item-footer-subtitle">18:00 | 200 €</div>
                            </div>
                        </footer>
                    </a>
                </article>
                <article class="events-grid-item">
                    <picture class="events-grid-item-picture">
                        <source media="@@MQ_DESKTOP" srcset="img/modules/EVENTS-GRID/image-tablet-yellow.png">
                        <source media="@@MQ_TABLET" srcset="img/modules/EVENTS-GRID/image-tablet-yellow.png">
                        <source media="@@MQ_MOBILE" srcset="img/modules/EVENTS-GRID/image-mobile.png">
                        <img class="events-grid-item-picture-image" alt="">
                    </picture>
                    <a class="events-grid-item-content" href="#">
                        <header class="events-grid-item-header">
                            <div class="events-grid-item-header-title">FREEZEOUT</div>
                        </header>
                        <footer class="events-grid-item-footer">
                            <div class="events-grid-item-footer-content">
                                <div class="events-grid-item-footer-title">MERCREDI 2 JUILLET</div>
                                <div class="events-grid-item-footer-subtitle">16:00 | 200 €</div>
                            </div>
                        </footer>
                    </a>
                </article>
                <article class="events-grid-item">
                    <picture class="events-grid-item-picture">
                        <source media="@@MQ_DESKTOP" srcset="img/modules/EVENTS-GRID/image-tablet-red.png">
                        <source media="@@MQ_TABLET" srcset="img/modules/EVENTS-GRID/image-tablet-red.png">
                        <source media="@@MQ_MOBILE" srcset="img/modules/EVENTS-GRID/image-mobile.png">
                        <img class="events-grid-item-picture-image" alt="">
                    </picture>
                    <a class="events-grid-item-content" href="#">
                        <header class="events-grid-item-header">
                            <div class="events-grid-item-header-title">LE JEUDI C'EST POKER AUSSI !</div>
                        </header>
                        <footer class="events-grid-item-footer">
                            <div class="events-grid-item-footer-content">
                                <div class="events-grid-item-footer-title">JEUDI 3 JUILLET</div>
                                <div class="events-grid-item-footer-subtitle">16:00 | 200 €</div>
                            </div>
                        </footer>
                    </a>
                </article>
                <article class="events-grid-item">
                    <picture class="events-grid-item-picture">
                        <source media="@@MQ_DESKTOP" srcset="img/modules/EVENTS-GRID/image-tablet-blue.png">
                        <source media="@@MQ_TABLET" srcset="img/modules/EVENTS-GRID/image-tablet-blue.png">
                        <source media="@@MQ_MOBILE" srcset="img/modules/EVENTS-GRID/image-mobile.png">
                        <img class="events-grid-item-picture-image" alt="">
                    </picture>
                    <a class="events-grid-item-content" href="#">
                        <header class="events-grid-item-header">
                            <div class="events-grid-item-header-title">DEEP STAR JOUR 1</div>
                        </header>
                        <footer class="events-grid-item-footer">
                            <div class="events-grid-item-footer-content">
                                <div class="events-grid-item-footer-title">SAMEDI 5 JUILLET</div>
                                <div class="events-grid-item-footer-subtitle">20:00 | 175 €</div>
                            </div>
                        </footer>
                    </a>
                </article>
                <article class="events-grid-item">
                    <picture class="events-grid-item-picture">
                        <source media="@@MQ_DESKTOP" srcset="img/modules/EVENTS-GRID/image-tablet-yellow.png">
                        <source media="@@MQ_TABLET" srcset="img/modules/EVENTS-GRID/image-tablet-yellow.png">
                        <source media="@@MQ_MOBILE" srcset="img/modules/EVENTS-GRID/image-mobile.png">
                        <img class="events-grid-item-picture-image" alt="">
                    </picture>
                    <a class="events-grid-item-content" href="#">
                        <header class="events-grid-item-header">
                            <div class="events-grid-item-header-title">DEEP STAR JOUR 2</div>
                        </header>
                        <footer class="events-grid-item-footer">
                            <div class="events-grid-item-footer-content">
                                <div class="events-grid-item-footer-title">DIMANCHE 6 JUILLET</div>
                                <div class="events-grid-item-footer-subtitle">20:00 | 150 €</div>
                            </div>
                        </footer>
                    </a>
                </article>
                <article class="events-grid-item">
                    <picture class="events-grid-item-picture">
                        <source media="@@MQ_DESKTOP" srcset="img/modules/EVENTS-GRID/image-tablet-red.png">
                        <source media="@@MQ_TABLET" srcset="img/modules/EVENTS-GRID/image-tablet-red.png">
                        <source media="@@MQ_MOBILE" srcset="img/modules/EVENTS-GRID/image-mobile.png">
                        <img class="events-grid-item-picture-image" alt="">
                    </picture>
                    <a class="events-grid-item-content" href="#">
                        <header class="events-grid-item-header">
                            <div class="events-grid-item-header-title">TOURNOI KNOCKOUT RE-ENTRY 200 €</div>
                        </header>
                        <footer class="events-grid-item-footer">
                            <div class="events-grid-item-footer-content">
                                <div class="events-grid-item-footer-title">JEUDI 10 JUILLET</div>
                                <div class="events-grid-item-footer-subtitle">16:00 | 200 €</div>
                            </div>
                        </footer>
                    </a>
                </article>
            </div>
            <nav class="events-grid-buttons">
                <a class="events-grid-button button-golden" href="TP14-tournois.php">CONSULTER LE PROGRAMME COMPLET</a>
            </nav>
        </div>
    </div>
</section>
