<!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Site d’information culturelles et sportives</title> <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css"> <link href="css/style.css" rel="stylesheet"> </head> <body> <header> <nav> <a href="#">Retour à l'accueil |</a> <a href="#">À propos |</a> <a href="#id01">Nos newsletters</a> </nav> </header> <main> <section class="haut"> <h1>Site d’information culturelles et sportives</h1> <h2> Bonjour et bienvenu sur notre site, Depuis cette page nous vous invitons à choisir les abonnements aux newsletter qui vous conviennent. </h2> <a href="#id01">Découvrir nos newsletters</a> </section> <section class="millieu"> <div id="id01" class="modal"> <div class="modal-dialog"> <div class="modal-content"> <div class="container"> <div class="container-contact"> <form action="" method="get"> <h3>S'abonner à </h3> <a href="#" class="closebtn"><span class="lnr lnr-cross"></span> fermer le formulaire</a> <br> <hr /> <input type="checkbox" name="sport" id="sport" /><label for="sport">sports et activités sportives</label> <input type="radio" id="s_hebdo" name="sport_freq" value="hebdo" /><label for="s_hebdo">Hebdomadaire</label> <input type="radio" id="s_daily" name="sport_freq" value="daily" /><label for="s_daily">Journalier</label> <br /> <input type="checkbox" name="culture" id="culture" /><label for="culture">arts et cultures</label> <input type="radio" id="c_hebdo" name="culture_freq" value="hebdo" /><label for="c_hebdo">Hebdomadaire</label> <input type="radio" id="c_daily" name="culture_freq" value="daily" /><label for="c_daily">Journalier</label> <hr /> <input type="email" id="email" pattern="[^@\s]+@[^@\s]+\.[^@\s]+" size="30" placeholder="votre email" title="Adresse e-mail invalide" required /> <button type="submit">Enregistrer mon abonnement</button> </form> </div> </div> </div> </div> </div> </section> </main> <footer> <nav> <a href="https://www.instagram.com/s-et-c">Rejoigner notre communauté |</a> <a href="contact@s-et-c.fr">Nous écrire</a> </nav> <p>© S&C diffusion 2021</p> </footer> </body> </html>