{% extends 'base.html.twig' %}

{% block title %}Accueil - 2KBES{% endblock %}

{% block body %}
    <section id="content" class="image-bg1">
        <div class="container">
            <div id="banner" style="height: 200px; vertical-align:center;color:white;">

                    <div id="playButton" style="float:left;">
                        {% if  is_granted("ROLE_USER") %}
                            <a href="#list-lotto" class="btn btn-sample btn-lg btn-block soap-popupbox" style="width:  300px;text-align:  center;vertical-align:  center;border: none;height: 45px;margin-top: 42px;">JOUER</a>
                        {% else %}
                            <a href="#travelo-login" class="btn btn-sample btn-lg btn-block soap-popupbox" style="width:  300px;text-align:  center;vertical-align:  center;border: none;height: 45px;margin-top: 42px;">JOUER</a>
                        {% endif %}
                    </div>
                <div class="flexslider photo-gallery style4" style="background-color: #000000; width: 500px; float: right">
                    <ul class="slides">
                        {% for annonce in annonces %}
                            <li>

                                <h1 class="h1">{{ annonce.texte1 }}</h1>
                                <p>
                                    {{ annonce.description1 }}
                                </p>
                                <a href="{{ annonce.boutonurl }}"> {{ annonce.boutontext }}</a>
                            </li>
                        {% endfor %}
                    </ul>
                </div>
            </div>
            <div id="list-lotto" class="travelo-login-box travelo-box">
                <div class="toggle-container filters-container">
                    <div class="panel style1 arrow-right hr-alice">
                        <h4 class="panel-title">
                            <a href="/jouer/New york" class="collapsed">New york</a>
                        </h4>
                    </div>
                    <div class="panel style1 arrow-right hr-alice">
                        <h4 class="panel-title">
                            <a href="/jouer/Saint-Domingue" class="collapsed">Saint-Domingue</a>
                        </h4>
                    </div>
                    <div class="panel style1 arrow-right hr-alice">
                        <h4 class="panel-title">
                            <a href="/jouer/Nationale" class="collapsed">Nationale</a>
                        </h4>
                    </div>
                </div>
            </div>
            <div class="row">
                {#<div id="main" class="col-sm-8 col-md-9">


                    #}{#<div class="search-box-wrapper style1">
                        <div class="search-box">
                            <div class="search-tab-content">
                                <div class="tab-pane fade" id="hotels-tab">
                                    <form action="hotel-list-view.html" method="post">
                                        <div class="title-container" style="background-color: #7FB231;">
                                            <h2 class="search-title">FAITES VOS JOEUX</h2>
                                            <p>Nous vous emmenons à une toute autre facon de Jouer et bien sur: JWE POUW GENYEN</p>
                                            <i class="soap-icon-check-1"></i>
                                        </div>
                                        <div class="search-content">
                                            <h5 class="title">01. Lotterie</h5>
                                            <label>Dans quelle lotterie vous voulez pariez?</label>
                                            <input type="text" class="input-text full-width" placeholder="enter a destination or hotel name" />
                                            <hr>
                                            <h5 class="title">02. Faitez vos choix?</h5>
                                            <div class="row">
                                                <div class="col-xs-6">
                                                    <label>Check In</label>
                                                    <div class="datepicker-wrap">
                                                        <input type="text" class="input-text full-width" placeholder="mm/dd/yy" />
                                                    </div>
                                                </div>
                                                <div class="col-xs-6">
                                                    <label>Check Out</label>
                                                    <div class="datepicker-wrap">
                                                        <input type="text" class="input-text full-width" placeholder="mm/dd/yy" />
                                                    </div>
                                                </div>
                                            </div>
                                            <hr>
                                            <h5 class="title">Who</h5>
                                            <div class="row">
                                                <div class="col-xs-4">
                                                    <label>ROOMS</label>
                                                    <div class="selector">
                                                        <select class="full-width">
                                                            <option value="1">01</option>
                                                            <option value="2">02</option>
                                                            <option value="3">03</option>
                                                            <option value="4">04</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="col-xs-4">
                                                    <label>ADULTS</label>
                                                    <div class="selector">
                                                        <select class="full-width">
                                                            <option value="1">01</option>
                                                            <option value="2">02</option>
                                                            <option value="3">03</option>
                                                            <option value="4">04</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="col-xs-4">
                                                    <label>KIDS</label>
                                                    <div class="selector">
                                                        <select class="full-width">
                                                            <option value="1">01</option>
                                                            <option value="2">02</option>
                                                            <option value="3">03</option>
                                                            <option value="4">04</option>
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                            <hr>
                                            <button type="submit" class="full-width uppercase">Proceed To Result</button>
                                        </div>
                                    </form>
                                </div>
                                <div class="tab-pane fade active in" id="flights-tab">
                                    <form action="flight-list-view.html" method="post">
                                        <div class="title-container">
                                            <h2 class="search-title">FAITES VOS JOEUX</h2>
                                            <p>Une toute autre facon de Jouer. JWE POUW GENYEN !</p>
                                            <i class="soap-icon-check-1 takeoff-effect"></i>
                                        </div>
                                        <div class="search-content">

                                            <h5 class="title">01. Lotterie</h5>
                                            <div class="row">
                                                <div class="selector">
                                                    <select>
                                                        <option value="1">New-York</option>
                                                        <option value="2">Saint-Domingue</option>
                                                        <option value="3">Nationale</option>
                                                    </select>
                                                </div>
                                            </div>
                                            <hr>
                                            <h5 class="title">02. Faite vos choix?</h5>
                                            <label>Choisissez vos numeros de chance & le montant</label>
                                            <br/>
                                            <div id="myticket" class="row">
                                                <div class="col-xs-4 col-md-4">
                                                    <label>CATEGORIE</label>
                                                    <div class="selector">
                                                        <select>
                                                            <option value="1">2 CHIFFRES</option>
                                                            <option value="2">LOTTO 3 CHIFFRES</option>
                                                            <option value="3">LOTTO 4 CHIFFRES</option>
                                                            <option value="4">LOTTO 5 CHIFFRES</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="col-xs-4 col-md-4">
                                                    <label>NUMEROS</label>
                                                    <div class="number">
                                                        <input type="number" class="input-text full-width" placeholder="NUMEROS" />
                                                    </div>
                                                </div>
                                                <div class="col-xs-4 col-md-4">
                                                    <label>MONTANT</label>
                                                    <div class="number">
                                                        <input type="number" class="input-text full-width" placeholder="MONTANT" />
                                                    </div>
                                                </div>
                                            </div>
                                            <br/>
                                            <a id="addticket" href="#" >
                                                <div class="col-sm-6 col-md-3" style="padding-left: 505px">
                                                    <div class="icon-box style1"><i class="soap-icon-plus"></i></div>
                                                </div>
                                            </a>
                                            <br/><br/>
                                            <hr>
                                            <button type="submit" class="full-width btn-medium">Pariez maintenant</button>
                                        </div>
                                    </form>
                                    <hr><br/>
                                    <div class="search-content">
                                    <h5 class="title">CONSULTEZ <strong> ...</strong></h5>
                                        <br/>
                                        <div class="row">
                                            <div class="block clearfix">
                                        <div class="col-md-4">
                                            <div class="icon-box style2"><i class="soap-icon-insurance"></i><small>NOTRE CHALA</small></div>
                                        </div>

                                        <div class="col-md-4">
                                            <div class="icon-box style2"><i class="soap-icon-clock"></i><small>LES DERNIERS RESULTATS</small></div>
                                        </div>

                                        <div class="col-md-4">
                                            <div class="icon-box style2"><i class="soap-icon-star"></i><small>LES NUMEROS DE CHANCE</small></div>
                                        </div>

                                            </div></div></div>
                                </div>
                                <div class="tab-pane fade" id="flight-and-hotel-tab">
                                    <form action="flight-list-view.html" method="post">
                                        <div class="title-container">
                                            <h2 class="search-title">Search and Book Flight &amp; Hotels</h2>
                                            <p>We're bringing you a new level of comfort.</p>
                                            <i class="soap-icon-flight-hotel"></i>
                                        </div>
                                        <div class="search-content">
                                            <h5 class="title">Where</h5>
                                            <div class="row">
                                                <div class="col-xs-6">
                                                    <label>Leaving From</label>
                                                    <input type="text" class="input-text full-width" placeholder="enter your location" />
                                                </div>
                                                <div class="col-xs-6">
                                                    <label>Going To</label>
                                                    <input type="text" class="input-text full-width" placeholder="enter a destination" />
                                                </div>
                                            </div>
                                            <hr>
                                            <h5 class="title">When</h5>
                                            <label>Departing On</label>
                                            <div class="row">
                                                <div class="col-xs-6 col-md-5">
                                                    <div class="datepicker-wrap">
                                                        <input type="text" class="input-text full-width" placeholder="select date" />
                                                    </div>
                                                </div>
                                                <div class="col-xs-6 col-md-5">
                                                    <div class="selector">
                                                        <select>
                                                            <option value="">select date</option>
                                                            <option value="1">anytime</option>
                                                            <option value="2">morning</option>
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                            <label>Arriving On</label>
                                            <div class="row">
                                                <div class="col-xs-6 col-md-5">
                                                    <div class="datepicker-wrap">
                                                        <input type="text" class="input-text full-width" placeholder="select date" />
                                                    </div>
                                                </div>
                                                <div class="col-xs-6 col-md-5">
                                                    <div class="selector">
                                                        <select>
                                                            <option value="">select date</option>
                                                            <option value="1">anytime</option>
                                                            <option value="2">morning</option>
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                            <hr>
                                            <h5 class="title">Who</h5>
                                            <div class="row">
                                                <div class="col-xs-4 col-md-3">
                                                    <label>Adults</label>
                                                    <div class="selector">
                                                        <select>
                                                            <option value="1">01</option>
                                                            <option value="2">02</option>
                                                            <option value="3">03</option>
                                                            <option value="4">04</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="col-xs-4 col-md-3">
                                                    <label>Kids</label>
                                                    <div class="selector">
                                                        <select>
                                                            <option value="1">01</option>
                                                            <option value="2">02</option>
                                                            <option value="3">03</option>
                                                            <option value="4">04</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="col-xs-4 col-md-3">
                                                    <label>Infants</label>
                                                    <div class="selector">
                                                        <select>
                                                            <option value="1">01</option>
                                                            <option value="2">02</option>
                                                            <option value="3">03</option>
                                                            <option value="4">04</option>
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                            <hr>
                                            <h5 class="title">Class <small>(Optional)</small></h5>
                                            <div class="row">
                                                <div class="col-xs-6">
                                                    <label>Class of travel</label>
                                                    <div class="selector">
                                                        <select>
                                                            <option value="">Economy</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="col-xs-6">
                                                    <label>Preferred Airline</label>
                                                    <div class="selector">
                                                        <select>
                                                            <option value="">select name</option>
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                            <hr>
                                            <button type="submit" class="full-width btn-medium">PROCEED TO RESULT</button>
                                        </div>
                                    </form>
                                </div>
                                <div class="tab-pane fade" id="cars-tab">
                                    <form action="car-list-view.html" method="post">
                                        <div class="title-container">
                                            <h2 class="search-title">Search Cars</h2>
                                            <p>We're bringing you a new level of comfort.</p>
                                            <i class="soap-icon-car"></i>
                                        </div>
                                        <div class="search-content">
                                            <div class="row">
                                                <h5 class="title">Where</h5>
                                                <div class="col-xs-6">
                                                    <label>Pick Up</label>
                                                    <input type="text" class="input-text full-width" placeholder="city, distirct or specific airpot" />
                                                </div>
                                                <div class="col-xs-6">
                                                    <label>Drop Off</label>
                                                    <input type="text" class="input-text full-width" placeholder="city, distirct or specific airpot" />
                                                </div>
                                            </div>
                                            <hr>
                                            <h5 class="title">When</h5>
                                            <label>Pick-Up Date / Time</label>
                                            <div class="form-group row">
                                                <div class="col-xs-6">
                                                    <div class="datepicker-wrap">
                                                        <input type="text" class="input-text full-width" placeholder="mm/dd/yy" />
                                                    </div>
                                                </div>
                                                <div class="col-xs-6">
                                                    <div class="selector">
                                                        <select class="full-width">
                                                            <option value="1">anytime</option>
                                                            <option value="2">morning</option>
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                            <label>Drop-Off Date / Time</label>
                                            <div class="row">
                                                <div class="col-xs-6">
                                                    <div class="datepicker-wrap">
                                                        <input type="text" class="input-text full-width" placeholder="mm/dd/yy" />
                                                    </div>
                                                </div>
                                                <div class="col-xs-6">
                                                    <div class="selector">
                                                        <select class="full-width">
                                                            <option value="1">anytime</option>
                                                            <option value="2">morning</option>
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                            <hr>
                                            <h5 class="title">Who</h5>
                                            <div class="row">
                                                <div class="col-xs-3">
                                                    <label>Adults</label>
                                                    <div class="selector">
                                                        <select class="full-width">
                                                            <option value="1">01</option>
                                                            <option value="2">02</option>
                                                            <option value="3">03</option>
                                                            <option value="4">04</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="col-xs-3">
                                                    <label>Kids</label>
                                                    <div class="selector">
                                                        <select class="full-width">
                                                            <option value="1">01</option>
                                                            <option value="2">02</option>
                                                            <option value="3">03</option>
                                                            <option value="4">04</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="col-xs-6">
                                                    <label>Promo Code</label>
                                                    <input type="text" class="input-text full-width" placeholder="type here" />
                                                </div>
                                            </div>
                                            <hr>
                                            <div class="row">
                                                <div class="col-xs-6">
                                                    <label>Car Type</label>
                                                    <div class="selector">
                                                        <select class="full-width">
                                                            <option value="">select a car type</option>
                                                            <option value="economy">Economy</option>
                                                            <option value="compact">Compact</option>
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                            <hr>
                                            <div class="form-group">
                                                <button type="submit" class="full-width">PROCEED TO RESULT</button>
                                            </div>
                                        </div>
                                    </form>
                                </div>
                                <div class="tab-pane fade" id="cruises-tab">
                                    <form action="cruise-list-view.html" method="post">
                                        <div class="title-container">
                                            <h2 class="search-title">Search and Book Cruises</h2>
                                            <p>We're bringing you a new level of comfort.</p>
                                            <i class="soap-icon-cruise"></i>
                                        </div>
                                        <div class="search-content">
                                            <h5 class="title">Where</h5>
                                            <div class="form-group">
                                                <label>Your Destination</label>
                                                <input type="text" class="input-text full-width" placeholder="enter a destination or hotel name" />
                                            </div>
                                            <hr>
                                            <h5 class="title">When</h5>
                                            <div class="row">
                                                <div class="col-xs-6">
                                                    <label>Departure Date</label>
                                                    <div class="datepicker-wrap">
                                                        <input type="text" class="input-text full-width" placeholder="mm/dd/yy" />
                                                    </div>
                                                </div>
                                                <div class="col-xs-6">
                                                    <label>Cruise Length</label>
                                                    <div class="selector">
                                                        <select class="full-width">
                                                            <option value="">select length</option>
                                                            <option value="1">1-2 Nights</option>
                                                            <option value="2">3-4 Nights</option>
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                            <hr>
                                            <h5 class="title">Who</h5>
                                            <div class="row">
                                                <div class="col-xs-6">
                                                    <label>Cruise Line</label>
                                                    <div class="selector">
                                                        <select class="full-width">
                                                            <option value="">select cruise line</option>
                                                            <option>Azamara Club Cruises</option>
                                                            <option>Carnival Cruise Lines</option>
                                                            <option>Celebrity Cruises</option>
                                                            <option>Costa Cruise Lines</option>
                                                            <option>Cruise &amp; Maritime Voyages</option>
                                                            <option>Crystal Cruises</option>
                                                            <option>Cunard Line Ltd.</option>
                                                            <option>Disney Cruise Line</option>
                                                            <option>Holland America Line</option>
                                                            <option>Hurtigruten Cruise Line</option>
                                                            <option>MSC Cruises</option>
                                                            <option>Norwegian Cruise Line</option>
                                                            <option>Oceania Cruises</option>
                                                            <option>Orion Expedition Cruises</option>
                                                            <option>P&amp;O Cruises</option>
                                                            <option>Paul Gauguin Cruises</option>
                                                            <option>Peter Deilmann Cruises</option>
                                                            <option>Princess Cruises</option>
                                                            <option>Regent Seven Seas Cruises</option>
                                                            <option>Royal Caribbean International</option>
                                                            <option>Seabourn Cruise Line</option>
                                                            <option>Silversea Cruises</option>
                                                            <option>Star Clippers</option>
                                                            <option>Swan Hellenic Cruises</option>
                                                            <option>Thomson Cruises</option>
                                                            <option>Viking River Cruises</option>
                                                            <option>Windstar Cruises</option>
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                            <hr>
                                            <div class="form-group">
                                                <button type="submit" class="full-width">PROCEED TO RESULT</button>
                                            </div>
                                        </div>
                                    </form>
                                </div>
                                <div class="tab-pane fade" id="flight-status-tab">
                                    <form action="flight-list-view.html" method="post">
                                        <div class="title-container">
                                            <h2 class="search-title">Flight Status</h2>
                                            <p>We're bringing you a new level of comfort.</p>
                                            <i class="soap-icon-status"></i>
                                        </div>
                                        <div class="search-content">
                                            <h5 class="title">Where</h5>
                                            <div class="row">
                                                <div class="col-xs-6">
                                                    <label>Leaving From</label>
                                                    <input type="text" class="input-text full-width" placeholder="enter a city or place name" />
                                                </div>
                                                <div class="col-xs-6">
                                                    <label>Going To</label>
                                                    <input type="text" class="input-text full-width" placeholder="enter a city or place name" />
                                                </div>
                                            </div>
                                            <hr>
                                            <h5 class="title">When</h5>
                                            <label>Departure Date</label>
                                            <div class="datepicker-wrap">
                                                <input type="text" class="input-text full-width" placeholder="mm/dd/yy" />
                                            </div>
                                            <hr>
                                            <h5 class="title">Who</h5>
                                            <label>Flight Number</label>
                                            <input type="text" class="input-text full-width" placeholder="enter flight number" />
                                            <hr>
                                            <button type="submit" class="full-width">PROCEED TO RESULT</button>
                                        </div>
                                    </form>
                                </div>
                                <div class="tab-pane fade" id="online-checkin-tab">
                                    <form>
                                        <div class="title-container">
                                            <h2 class="search-title">Online Check-In</h2>
                                            <p>We're bringing you a new level of comfort.</p>
                                            <i class="soap-icon-stories"></i>
                                        </div>
                                        <div class="search-content">
                                            <h5 class="title">Where</h5>
                                            <div class="row">
                                                <div class="col-xs-6">
                                                    <label>Leaving From</label>
                                                    <input type="text" class="input-text full-width" placeholder="enter a city or place name" />
                                                </div>
                                                <div class="col-xs-6">
                                                    <label>Going To</label>
                                                    <input type="text" class="input-text full-width" placeholder="enter a city or place name" />
                                                </div>
                                            </div>
                                            <hr>
                                            <h5 class="title">When</h5>
                                            <label>Departure Date</label>
                                            <div class="datepicker-wrap">
                                                <input type="text" class="input-text full-width" placeholder="mm/dd/yy" />
                                            </div>
                                            <hr>
                                            <h5 class="title">Who</h5>
                                            <label>Full Name</label>
                                            <input type="text" class="input-text full-width" placeholder="enter your full name" />
                                            <hr>
                                            <button type="submit" class="full-width">SEARCH NOW</button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>#}{#
                </div>#}
                {#<div class="sidebar col-sm-4 col-md-3">#}
                {#<div class="travelo-box contact-box">#}
                {#<h4>Need Travelo Help?</h4>#}
                {#<p>We would be more than happy to help you. Our team advisor are 24/7 at your service to help you.</p>#}
                {#<address class="contact-details">#}
                {#<span class="contact-phone"><i class="soap-icon-phone"></i> 1-800-123-HELLO</span>#}
                {#<br>#}
                {#<a class="contact-email" href="#">help@travelo.com</a>#}
                {#</address>#}
                {#</div>#}
                {#<div class="travelo-box book-with-us-box">#}
                {#<h4>Why Book with us?</h4>#}
                {#<ul>#}
                {#<li>#}
                {#<i class="soap-icon-hotel-1 circle"></i>#}
                {#<h5 class="title"><a href="#">135,00+ Hotels</a></h5>#}
                {#<p>Nunc cursus libero pur congue arut nimspnty.</p>#}
                {#</li>#}
                {#<li>#}
                {#<i class="soap-icon-savings circle"></i>#}
                {#<h5 class="title"><a href="#">Low Rates &amp; Savings</a></h5>#}
                {#<p>Nunc cursus libero pur congue arut nimspnty.</p>#}
                {#</li>#}
                {#<li>#}
                {#<i class="soap-icon-support circle"></i>#}
                {#<h5 class="title"><a href="#">Excellent Support</a></h5>#}
                {#<p>Nunc cursus libero pur congue arut nimspnty.</p>#}
                {#</li>#}
                {#</ul>#}
                {#</div>#}
                {#</div>#}
            </div>
        </div>
    </section>
    <style>
        .numberCircle {
            width: 30px;
            line-height: 30px;
            border-radius: 50%;
            text-align: center;
            font-size: 15px;
            padding: 3px;
            border: 2px solid #ffffff;
        }
    </style>
    <section id="content" class="gray-area">
        <div class="container shortcode">

            <h1>Les derniers resultats</h1>
            <div class="row block">
                <div class="col-sm-4">
                    <div class="pricing-table white box">
                        <div class="header clearfix">
                            <i class="soap-icon-star circle green-color"></i><h4 class="box-title"><span>New York<small>Lotterie</small></span></h4>
                            <span class="price"><b>44</b> <small> personnes ont pariees</small></span>
                        </div>
                        {{ container["newyork"]["contenu"] | raw }}
                        <ul class="check-square features">
                            <li>
                                Tirage:
                                <section class="stage" style="transform: translateY(13px);">
                                    <figure class="ball bull-yellow-color">
                                        <span class="shadow"></span>
                                        <span class="eight">
                                        <span class="text-bull" style="position: absolute; margin: 0 !important;">{{ lastlottodraw_ne.head }}{{ lastlottodraw_ne.first }}</span>
                                    </span>
                                    </figure>
                                </section>
                                <section class="stage" style="transform: translateY(13px);">
                                    <figure class="ball bull-yellow-color">
                                        <span class="shadow"></span>
                                        <span class="eight">
                                        <span class="text-bull" style="position: absolute; margin: 0 !important;">{{ lastlottodraw_ne.second }}</span>
                                    </span>
                                    </figure>
                                </section>
                                <section class="stage" style="transform: translateY(13px);">
                                    <figure class="ball bull-yellow-color">
                                        <span class="shadow"></span>
                                        <span class="eight">
                                        <span class="text-bull" style="position: absolute; margin: 0 !important;">{{ lastlottodraw_ne.third }}</span>
                                    </span>
                                    </figure>
                                </section>
                            </li>
                            <li>Date: <span>{{lastlottodraw_ne.date_draw}}</span></li>
                            <li>Periode: <span >{{lastlottodraw_ne.draw}}</span></li>
                        </ul>
                        <button onclick='location.href="/resultat/New york"' style="margin-bottom: 1px;" class="btn-medium uppercase full-width sky-blue1">Voir les resultats</button>
                        <br>
                        {% if  is_granted("ROLE_USER") %}
                            <button onclick='location.href="/jouer/New york"' class="btn-medium uppercase full-width">Pariez pour le prochain tirage</button>
                        {% else %}
                            <button href="#travelo-login" class="btn-medium uppercase full-width soap-popupbox" onclick="addNext('/jouer/New york')">Pariez pour le prochain tirage</button>
                        {% endif %}
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="pricing-table white box">
                        <div class="header clearfix">
                            <i class="soap-icon-star circle yellow-color"></i><h4 class="box-title"><span>Saint-Domingue<small>Lotterie</small></span></h4>
                            <span class="price"><b style="color: #e9b02b;">115</b> <small> personnes ont pariees</small></span>
                        </div>
                        {{ container["saintdomingue"]["contenu"] | raw }}
                        <ul class="check-square features">
                            <li>
                                Tirage:
                                <section class="stage" style="transform: translateY(13px);">
                                    <figure class="ball bull-blue-color">
                                        <span class="shadow"></span>
                                        <span class="eight">
                                        <span class="text-bull" style="position: absolute; margin: 0 !important;">{{ lastlottodraw_ne.head }}{{ lastlottodraw_ne.first }}</span>
                                    </span>
                                    </figure>
                                </section>
                                <section class="stage" style="transform: translateY(13px);">
                                    <figure class="ball bull-blue-color">
                                        <span class="shadow"></span>
                                        <span class="eight">
                                        <span class="text-bull" style="position: absolute; margin: 0 !important;">{{ lastlottodraw_ne.second }}</span>
                                    </span>
                                    </figure>
                                </section>
                                <section class="stage" style="transform: translateY(13px);">
                                    <figure class="ball bull-blue-color">
                                        <span class="shadow"></span>
                                        <span class="eight">
                                        <span class="text-bull" style="position: absolute; margin: 0 !important;">{{ lastlottodraw_ne.third }}</span>
                                    </span>
                                    </figure>
                                </section>
                            </li>
                            <li>Date: <span>{{lastlottodraw_ne.date_draw}}</span></li>
                            <li>Periode: <span >{{lastlottodraw_ne.draw}}</span></li>
                        </ul>
                        <button onclick='location.href="/resultat/Saint-Domingue"' style="margin-bottom: 1px;" class="btn-medium uppercase full-width">Voir les resultats</button>
                        <br>
                        {% if  is_granted("ROLE_USER") %}
                            <button onclick='location.href="/jouer/Saint-Domingue"' class="btn-medium uppercase full-width yellow">Pariez pour le prochain tirage</button>
                        {% else %}
                            <button href="#travelo-login" class="btn-medium uppercase full-width yellow soap-popupbox" onclick="addNext('/jouer/Saint-Domingue')">Pariez pour le prochain tirage</button>
                        {% endif %}
                        {#<button onclick='location.href="/jouer/Saint-Domingue"' class="btn-medium uppercase full-width yellow">Pariez pour le prochain tirage</button>#}
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="pricing-table white box">
                        <div class="header clearfix">
                            <i class="soap-icon-star circle blue-color"></i><h4 class="box-title"><span>Nationale<small>Lotterie</small></span></h4>
                            <span class="price"><b style="color: #07a5d8;">31</b> <small> personnes ont pariees</small></span>
                        </div>
                        {{ container["nationale"]["contenu"] | raw }}
                        <ul class="check-square features">
                            <li>
                                Tirage:
                                <section class="stage" style="transform: translateY(13px);">
                                    <figure class="ball bull-red-color">
                                        <span class="shadow"></span>
                                        <span class="eight">
                                        <span class="text-bull" style="position: absolute; margin: 0 !important;">{{ lastlottodraw_ne.head }}{{ lastlottodraw_ne.first }}</span>
                                    </span>
                                    </figure>
                                </section>
                                <section class="stage" style="transform: translateY(13px);">
                                    <figure class="ball bull-red-color">
                                        <span class="shadow"></span>
                                        <span class="eight">
                                        <span class="text-bull" style="position: absolute; margin: 0 !important;">{{ lastlottodraw_ne.second }}</span>
                                    </span>
                                    </figure>
                                </section>
                                <section class="stage" style="transform: translateY(13px);">
                                    <figure class="ball bull-red-color">
                                        <span class="shadow"></span>
                                        <span class="eight">
                                        <span class="text-bull" style="position: absolute; margin: 0 !important;">{{ lastlottodraw_ne.third }}</span>
                                    </span>
                                    </figure>
                                </section>
                            </li>
                            <li>Date: <span>{{lastlottodraw_ne.date_draw}}</span></li>
                            <li>Periode: <span >{{lastlottodraw_ne.draw}}</span></li>
                        </ul>
                        <button onclick='location.href="/resultat/Nationale"' style="margin-bottom: 1px;" class="btn-medium uppercase full-width yellow">Voir les resultat</button>
                        <br>
                        {% if  is_granted("ROLE_USER") %}
                            <button onclick='location.href="/jouer/Nationale"' class="btn-medium uppercase full-width sky-blue1">Pariez pour le prochain tirage</button>
                        {% else %}
                            <button href="#travelo-login" class="btn-medium uppercase full-width sky-blue1 soap-popupbox" onclick="addNext('/jouer/Nationale')">Pariez pour le prochain tirage</button>
                        {% endif %}
                        {#<button onclick='location.href="/jouer/Nationale"' class="btn-medium uppercase full-width sky-blue1">Pariez pour le prochain tirage</button>#}
                    </div>
                </div>
            </div>
        </div>
    </section>


    {#
        <section id="content">
        <div class="container"  class="col-sm-8 col-md-9">
        <h2>Nos Partenaires d'Affaires</h2>
        <div class="investor-slideshow image-carousel style2 investor-list box" data-animation="slide" data-item-width="170" data-item-margin="30">

            <ul class="slides">
                {% if not banners is empty or null %}
                {% for banner in banners %}
                <li>
                    <div class="travelo-box">
                        <a><img src="{% path banner.media, 'galeriepartner' %}" alt=""></a>
                    </div>
                </li>
                {% endfor %}
                {% endif %}
            </ul>
        </div>
            <div class="row">
                <div class="col-sm-6 col-md-3">
                    <div class="icon-box style3 counters-box">
                        <div class="numbers">
                            <i class="soap-icon-conference select-color"></i>
                            <span class="display-counter" data-value="3200">0</span>
                        </div>
                        <div class="description">Plus de 3000 clients</div>
                    </div>
                </div>
                <div class="col-sm-6 col-md-3">
                    <div class="icon-box style3 counters-box">
                        <div class="numbers">
                            <i class="soap-icon-joystick skin-color"></i>
                            <span class="display-counter" data-value="8738">0</span>
                        </div>
                        <div class="description">Plus de 8500 pariages</div>
                    </div>
                </div>
                <div class="col-sm-6 col-md-3">
                    <div class="icon-box style3 counters-box">
                        <div class="numbers">
                            <i class="soap-icon-guideline green-color"></i>
                            <span class="display-counter" data-value="16509">0</span>
                        </div>
                        <div class="description">Plus de 16,000 vues des resultats</div>
                    </div>
                </div>
                <div class="col-sm-6 col-md-3">
                    <div class="icon-box style3 counters-box">
                        <div class="numbers">
                            <i class="soap-icon-savings red-color"></i>
                            <span class="display-counter" data-value="11500">0</span>
                        </div>
                        <div class="description">Plus de $10,000 mensuellement gagnes</div>
                    </div>
                </div>
            </div>
                <div class="section">
                    <h2>ASTUCES POUR GAGNER AU LOTO</h2>
                    <div class="row">
                        <div class="col-sms-6 col-sm-6 col-md-3">
                            <div class="travelo-box">
                                <h4 class="s-title animated" data-animation-type="fadeInLeft">Votre mental</h4>
                                <p>Il faut avoir un mental de gagnant. Vous devez avoir le bon état d'esprit. Ayez confiance en vos capacités de gagner. Cultivez une attitude positive.</p>
                            </div>
                        </div>
                        <div class="col-sms-6 col-sm-6 col-md-3">
                            <div class="travelo-box">
                                <h4 class="s-title animated" data-animation-type="fadeInLeft">Ne jouez pas au hasard</h4>
                                <p>Si l'on compile tous les résultats du loto depuis sa création on s'aperçoit que le numéro 41 est sorti 168 fois alors que le numéro 42 n'est sorti que 122 fois.</p>
                            </div>
                        </div>
                        <div class="col-sms-6 col-sm-6 col-md-3">
                            <div class="travelo-box">
                                <h4 class="s-title animated" data-animation-type="fadeInLeft">Les chiffres qui se suivent</h4>
                                <p>Si vous avez tendance à jouer deux chiffres qui se suivent vous réduisez à moins de 3% les chances de gagner. Édifiant non?</p>
                            </div>
                        </div>
                        <div class="col-sms-6 col-sm-6 col-md-3">
                            <div class="travelo-box">
                                <h4 class="s-title animated" data-animation-type="fadeInLeft">Les logiciels de calculs</h4>
                                <p>Grâce à internet vous n'avez pas besoin d'être un as des maths pour obtenir des calculs statistiques fiables. n'hésitez pas à vous en servir</p>
                            </div>
                        </div>
                    </div>
        </div>
        </div>
    </section>
        <div class="global-map-area section parallax" data-stellar-background-ratio="0.5">
            <div class="container description text-center">
                <h1>Comment 2K-BES fonctionne?</h1>
                <br>
                <div class="travelo-process">
                    <img src="{{ asset('assets2/images/travelo_process.png')}}" alt="">
                    <div class="process first icon-box style12">
                        <div class="details animated" data-animation-type="fadeInUp" data-animation-delay="1">
                            <h4>MON CASH</h4>
                            <p class="hidden-xs">Vous pouvez effectuez des paiments, payer des paris a partir de MON CASH</p>
                        </div>
                        <div class="icon-wrapper animated" data-animation-type="slideInLeft" data-animation-delay="0">
                            <i class="soap-icon-check-1 circle"></i>
                        </div>
                    </div>
                    <div class="process second icon-box style12">
                        <div class="icon-wrapper animated" data-animation-type="slideInRight" data-animation-delay="1.5">
                            <i class="soap-icon-support circle"></i>
                        </div>
                        <div class="details animated" data-animation-type="fadeInUp" data-animation-delay="2.5">
                            <h4>Apps Store et Play store</h4>
                            <p class="hidden-xs">Telechargez l'Application sur Apps Store et sur Play Store.</p>
                        </div>
                    </div>
                    <div class="process third icon-box style12">
                        <div class="icon-wrapper animated" data-animation-type="slideInRight" data-animation-delay="2">
                            <i class="soap-icon-stories circle"></i>
                        </div>
                        <div class="details animated" data-animation-type="fadeInUp" data-animation-delay="3">
                            <h4>A partir de Carte Banquaire</h4>
                            <p class="hidden-xs">Placez vos paris en utilisant vos cartes banquaire</p>
                        </div>
                    </div>
                    <div class="process forth icon-box style12">
                        <div class="details animated" data-animation-type="fadeInUp" data-animation-delay="4.5">
                            <h4>A partir de nos point de vente</h4>
                            <p class="hidden-xs">Nous mettons a votre disposition des agents munis de PoS pour enregistrer vos paris</p>
                        </div>
                        <div class="icon-wrapper animated" data-animation-type="slideInLeft" data-animation-delay="3.5">
                            <i class="soap-icon-plane-left takeoff-effect1 circle"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    #}
{% endblock %}