<div class="newsletter" data-class="NEWSLETTER" data-analytics-type="Inscription Newsletter" data-analytics-name="Page Newsletter" data-analytics-call="validation_formulaire">
    <div class="newsletter-container">
        <div class="newsletter-content">
            <h1 class="newsletter-title">SUIVEZ L'ACTUALITÉ DE NOS CASINOS</h1>
            <p class="newsletter-subtitle">Inscrivez-vous à notre newsletter.</p>
            <form class="newsletter-form form" action="#">
                <input type="text" name="moreinfos" class="moreinfos" />
                <div class="form-container">
                    <div class="form-group">
                        <div class="form-inline">
                            <label for="mme">CIVILITÉ<sup>*</sup></label>
                        </div>
                        <div class="form-inline">
                            <input class="form-radio" type="radio" id="mr" name="civilite" value="mr"
                                   data-required="required"
                                   data-errormsg="Vous devez renseigner votre civilité">
                            <label for="mr"><span></span>MONSIEUR</label>
                        </div>
                        <div class="form-inline">
                            <input class="form-radio" type="radio" id="mme" name="civilite" value="mme" data-required="required">
                            <label for="mme"><span></span>MADAME</label>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="form-block form-required">
                            <label class="form-block-label" for="nom">Nom</label>
                            <input id="nom" type="text" class="form-input" name="nom" maxlength="30" data-required="required" data-format="nospecialchars" data-errormsg="Ce champ est invalide">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="form-block form-required">
                            <label class="form-block-label" for="prenom">Prénom</label>
                            <input id="prenom" type="text" class="form-input" name="prenom" maxlength="30" data-required="required" data-format="nospecialchars" data-errormsg="Ce champ est invalide">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="form-block form-required">
                            <label class="form-block-label" for="birthDay">DATE DE NAISSANCE</label>
                            <div class="newsletter-form-birthdate">
                                <div class="form-group">
                                    <select class="form-select" name="birthDay" id="birthDay"
                                            data-required="required"
                                            data-errormsg="Vous devez renseigner votre jour de naissance">

                                        <option value="" disabled="disabled" selected="selected">JOUR</option>
                                        <option value="1">1</option>
                                        <option value="2">2</option>
                                        <option value="3">3</option>
                                        <option value="4">4</option>
                                        <option value="5">5</option>
                                        <option value="6">6</option>
                                        <option value="7">7</option>
                                        <option value="8">8</option>
                                        <option value="9">9</option>
                                        <option value="10">10</option>
                                        <option value="11">11</option>
                                        <option value="12">12</option>
                                        <option value="13">13</option>
                                        <option value="14">14</option>
                                        <option value="15">15</option>
                                        <option value="16">16</option>
                                        <option value="17">17</option>
                                        <option value="18">18</option>
                                        <option value="19">19</option>
                                        <option value="20">20</option>
                                        <option value="21">21</option>
                                        <option value="22">22</option>
                                        <option value="23">23</option>
                                        <option value="24">24</option>
                                        <option value="25">25</option>
                                        <option value="26">26</option>
                                        <option value="27">27</option>
                                        <option value="28">28</option>
                                        <option value="29">29</option>
                                        <option value="30">30</option>
                                        <option value="31">31</option>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <select class="form-select" name="birthMonth"
                                            data-required="required"
                                            data-errormsg="Vous devez renseigner votre mois de naissance">
                                        <option value="" disabled="disabled" selected="selected">MOIS</option>
                                        <option value="1">Janvier</option>
                                        <option value="2">Fevrier</option>
                                        <option value="3">Mars</option>
                                        <option value="4">Avril</option>
                                        <option value="5">Mai</option>
                                        <option value="6">Juin</option>
                                        <option value="7">Juillet</option>
                                        <option value="8">Août</option>
                                        <option value="9">Septembre</option>
                                        <option value="10">Octobre</option>
                                        <option value="11">Novembre</option>
                                        <option value="12">Décembre</option>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <select class="form-select" name="birthYear" data-required="required" data-errormsg="Vous devez renseigner votre année de naissance">
                                        <option value="" disabled="disabled" selected="selected">ANNÉE</option>
                                        <option value="1998">1998</option>
                                        <option value="1997">1997</option>
                                        <option value="1996">1996</option>
                                        <option value="1995">1995</option>
                                        <option value="1994">1994</option>
                                        <option value="1993">1993</option>
                                        <option value="1992">1992</option>
                                        <option value="1991">1991</option>
                                        <option value="1990">1990</option>
                                        <option value="1989">1989</option>
                                        <option value="1988">1988</option>
                                        <option value="1987">1987</option>
                                        <option value="1986">1986</option>
                                        <option value="1985">1985</option>
                                        <option value="1984">1984</option>
                                        <option value="1983">1983</option>
                                        <option value="1982">1982</option>
                                        <option value="1981">1981</option>
                                        <option value="1980">1980</option>
                                        <option value="1979">1979</option>
                                        <option value="1978">1978</option>
                                        <option value="1977">1977</option>
                                        <option value="1976">1976</option>
                                        <option value="1975">1975</option>
                                        <option value="1974">1974</option>
                                        <option value="1973">1973</option>
                                        <option value="1972">1972</option>
                                        <option value="1971">1971</option>
                                        <option value="1970">1970</option>
                                        <option value="1969">1969</option>
                                        <option value="1968">1968</option>
                                        <option value="1967">1967</option>
                                        <option value="1966">1966</option>
                                        <option value="1965">1965</option>
                                        <option value="1964">1964</option>
                                        <option value="1963">1963</option>
                                        <option value="1962">1962</option>
                                        <option value="1961">1961</option>
                                        <option value="1960">1960</option>
                                        <option value="1959">1959</option>
                                        <option value="1958">1958</option>
                                        <option value="1957">1957</option>
                                        <option value="1956">1956</option>
                                        <option value="1955">1955</option>
                                        <option value="1954">1954</option>
                                        <option value="1953">1953</option>
                                        <option value="1952">1952</option>
                                        <option value="1951">1951</option>
                                        <option value="1950">1950</option>
                                        <option value="1949">1949</option>
                                        <option value="1948">1948</option>
                                        <option value="1947">1947</option>
                                        <option value="1946">1946</option>
                                        <option value="1945">1945</option>
                                        <option value="1944">1944</option>
                                        <option value="1943">1943</option>
                                        <option value="1942">1942</option>
                                        <option value="1941">1941</option>
                                        <option value="1940">1940</option>
                                        <option value="1939">1939</option>
                                        <option value="1938">1938</option>
                                        <option value="1937">1937</option>
                                        <option value="1936">1936</option>
                                        <option value="1935">1935</option>
                                        <option value="1934">1934</option>
                                        <option value="1933">1933</option>
                                        <option value="1932">1932</option>
                                        <option value="1931">1931</option>
                                        <option value="1930">1930</option>
                                        <option value="1929">1929</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="form-block form-required">
                            <label class="form-block-label" for="email">Email</label>
                            <input id="email" type="text" class="form-input" name="email" maxlength="100"
                                   data-required="required"
                                   data-format="email"
                                   data-errormsg="Vous devez renseigner une adresse email valide">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="form-block form-required">
                            <select class="form-select" name="casino"
                                    data-required="required"
                                    data-errormsg="Vous devez choisir un casino">
                                <option value="" disabled="disabled" selected="selected">CHOISISSEZ VOTRE CASINO</option>
                                <option value="01">casino 1</option>
                                <option value="02">casino 2</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="newsletter-form-preferences">
                            <h6 class="newsletter-form-preferences-title">VOS PRÉFÉRENCES</h6>
                            <div class="newsletter-form-preferences-checkboxes">
                                <div class="newsletter-form-preferences-checkbox">
                                    <input class="newsletter-form-preferences-checkbox-input" type="checkbox" name="type" value="games" id="games">
                                    <div class="newsletter-form-preferences-checkbox-ui">
                                        <div class="newsletter-form-preferences-checkbox-ui-icon">
                                            <svg class="newsletter-form-preferences-checkbox-ui-icon-shape">
                                                <use xlink:href="img/sprites/sprite.svg#icon-hexagon-full"></use>
                                            </svg>
                                            <svg class="newsletter-form-preferences-checkbox-ui-icon-check">
                                                <use xlink:href="img/sprites/sprite.svg#icon-check-full"></use>
                                            </svg>
                                        </div>
                                        <label class="newsletter-form-preferences-checkbox-ui-label" for="games">Jeux de casino</label>
                                    </div>
                                </div>
                                <div class="newsletter-form-preferences-checkbox">
                                    <input class="newsletter-form-preferences-checkbox-input" type="checkbox" name="type" value="shows" id="shows">
                                    <div class="newsletter-form-preferences-checkbox-ui">
                                        <div class="newsletter-form-preferences-checkbox-ui-icon">
                                            <svg class="newsletter-form-preferences-checkbox-ui-icon-shape">
                                                <use xlink:href="img/sprites/sprite.svg#icon-hexagon-full"></use>
                                            </svg>
                                            <svg class="newsletter-form-preferences-checkbox-ui-icon-check">
                                                <use xlink:href="img/sprites/sprite.svg#icon-check-full"></use>
                                            </svg>
                                        </div>
                                        <label class="newsletter-form-preferences-checkbox-ui-label" for="shows">Spectacles</label>
                                    </div>
                                </div>
                                <div class="newsletter-form-preferences-checkbox">
                                    <input class="newsletter-form-preferences-checkbox-input" type="checkbox" name="type" value="bars" id="bars">
                                    <div class="newsletter-form-preferences-checkbox-ui">
                                        <div class="newsletter-form-preferences-checkbox-ui-icon">
                                            <svg class="newsletter-form-preferences-checkbox-ui-icon-shape">
                                                <use xlink:href="img/sprites/sprite.svg#icon-hexagon-full"></use>
                                            </svg>
                                            <svg class="newsletter-form-preferences-checkbox-ui-icon-check">
                                                <use xlink:href="img/sprites/sprite.svg#icon-check-full"></use>
                                            </svg>
                                        </div>
                                        <label class="newsletter-form-preferences-checkbox-ui-label" for="bars">Bars et restaurants</label>
                                    </div>
                                </div>
                            </div>
                            <p class="newsletter-form-preferences-paragraph">
                                <a href="#">DÉCOUVREZ NOTRE POLITIQUE DE CONFIDENTIALITÉ</a>
                            </p>
                        </div>
                    </div>
                    <div class="form-group" data-id="submit">
                        <div class="form-block">
                            <input class="form-submit button button-golden" type="submit" value="VALIDER"/>
                        </div>
                    </div>
                </div>
            </form>

            <!-- CONFIRMATION -->
            <div class="newsletter-confirmation">
                <div class="newsletter-confirmation-wrapper">
                    <p>Merci !<br />Nous avons bien pris en compte votre demande.</p>
                </div>
            </div>
            <!-- end CONFIRMATION -->


            <div class="newsletter-illustration">
                <picture data-alt="" data-default-src="img/layout/newsletter/newsletter-visuel_desktop.jpg">
                    <source media="(min-width: 1025px)" srcset="img/layout/newsletter/newsletter-visuel_desktop.jpg"/>
                    <source media="(min-width: 481px)" srcset="img/layout/newsletter/newsletter-visuel_desktop.jpg"/>
                    <source media="(max-width: 480px)"  srcset="img/layout/newsletter/newsletter-visuel_desktop.jpg"/>
                    <img src="" alt="" />
                </picture>
            </div>
        </div>
    </div>
</div>
