</head>
<body>
    <header class="p-2 df jcsb aic">
        <div class="df fdc lh-0">
            <h1>SWIF</h1>
            <small>Site Web d' Information sur les Films</small>
        </div>
        <p class="fs-4">Pour supprimer les pub sur les vidéos, <br> utiliser un bloqueur de pub du type <a href="https://ublockorigin.com/fr" target="_blank" class="cl-yellow">UblockOrigin</a></p>
        <div>
            <input type="text" id="search-bar" placeholder="Recherche par titre, année, acteur..">
            <button id="reset-button" class="fs-9 cl-green">&times;</button>
        </div>
    </header>
    <main class="mb-5 min-h-60 p-2 sm-p-0">
        <div class="df jcc gap-2 fw" id="movie-container"></div>
        <div id="trailer-overlay" class="trailer-overlay">
            <div id="trailer-content" class="trailer-content">
                <button id="close-trailer" class="close-button">&times;</button>
                <iframe id="movie-trailer" frameborder="0" allowfullscreen></iframe>
            </div>
        </div>
        <div id="movie-overlay" class="movie-overlay">
            <div id="trailer-content" class="trailer-content">
                <button id="close-movie" class="close-button">&times;</button>
                <iframe id="movie-iframe" frameborder="0" allowfullscreen></iframe>
            </div>
        </div>
        <div id="no-results-message" class="dn fs-7 fw-7 w-full tc mt-6 ttu cl-green">Aucun résultat</div>     
    </main>
    <footer class="df jcsb p-2 bg-dark ttu fs-6">
        <p>swif</p>
        <p>por malfermi filmon alklaku la bildon</p>
        <a href="#"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M11 5.825L6.4 10.4L5 9l7-7l7 7l-1.4 1.425l-4.6-4.6V13h-2zM11 18v-3h2v3zm0 4v-2h2v2z"/></svg></a>
    </footer>
</body>
</html>
