{% extends "layout.html.twig" %}

{% block title 'title'|trans %}

{% block content %}
    {% include 'includes/navbar.html.twig' %}
    <div id="main-page">
        <div class="section is-paddingless">
            {% include 'includes/home.html.twig' %}
        </div>
        
        <div class="section is-paddingless">
            {% include 'includes/vibes.html.twig' %}
        </div>

        <div class="section is-paddingless">
            {% include 'includes/billets.html.twig' %}
        </div>
        
        <div class="section is-paddingless">
            {% include 'includes/resto.html.twig' %}
        </div>
        <div class="section is-paddingless">
            {% include 'includes/beer.html.twig' %}
        </div>
        <div class="section is-paddingless">
            {% include 'includes/history.html.twig' %}
        </div>

        <div class="section is-paddingless">
            {% include 'includes/partenaires.html.twig' %}
        </div>

        <div class="section is-paddingless">
            {% include 'includes/programme.html.twig' %}
        </div>
        
        <div class="section is-paddingless">
            {% include 'includes/footer2.html.twig' %}
        </div>
    </div>

    <a style="display: none;" data-fancybox="" data-src="#trueModal" data-modal="true" href="javascript:;" id="popup">-</a>
<div id="trueModal" class="p-5" style="display: none;">
    <div class="wrapperinnermodal">
        <div class="columns">
            <div class="column has-text-centered">
                <h1>Je certifie avoir plus de 18 ans :</h1>
            </div>
        </div>
        <div class="columns">
            <div class="column">
                <div class="carre" id="yes"><div class="innercarre"></div></div><h2>OUI</h2>
            </div>
            <div class="column">              
                <div class="carre"><div class="innercarre"></div></div><h2>NON</h2>
            </div>
        </div>
        <div class="columns">
            <div class="column  has-text-centered">
                <p>L’abus d’alcool est dangereux pour la santé.<br />À consommer avec modération.</p>
            </div>
        </div>   
    </div>
</div>
<script>
    $(document).ready(function() {            
            
            $('#popup').trigger('click'); 

    
            $('#yes').click(function(){
                $('#bgvid')[0].play();  
                $.fancybox.close();

            }) ;

            $('.carre').click(function(){
                $('.carre.actif').removeClass('actif');
                $(this).addClass('actif');
            });   

    });
</script>

{% endblock %}