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

{% block title %}{{ parent() }} | Videos {% endblock %}

{% block body %}

    <div id="homepage" data-controller="openingPages">
        {% include('inc/nav.html.twig') %}
        <div id="videos-container">
            {% include('inc/translate.html.twig') %}
            <div class="video-item">

                <iframe id="video1" src="https://player.vimeo.com/video/936928819?h=014d5d9df0&title=0&byline=0&portrait=0" allow="fullscreen" allowfullscreen></iframe>
                <div class="français">
                    <h3>Toujours la lumière se découvre</h3>
                    Une méditation en silence au bord de l'eau, du couchant et de l'âme.
                </div>
                <div class="anglais">
                    <h3>Always the Light Reveals Itself</h3>
                    A silent meditation at the edge of the water, the sunset and the soul.
                </div>
            </div>

            <div class="video-item">

                <iframe id="video2" src="https://player.vimeo.com/video/936928653?h=2085fe5b8a&title=0&byline=0&portrait=0" allow="fullscreen" allowfullscreen></iframe>
                <div class="français">
                    <h3>La grâce de l'ombre</h3>
                    XIXème siècle, Angélique est en prison pour prostitution. Une parole d'amitié la lance sur un itinéraire spirituel modeste et lumineux.
                </div>
                <div class="anglais">
                    <h3>The Grace of Shadow</h3>
                    19th century. Angelique is in prison for prostitution. A word of friendship launches her on a modest and luminous spiritual journey.
                </div>
            </div>
            <div class="video-item">

                <iframe id="video3" src="https://player.vimeo.com/video/936928536?h=87b89cfc19&title=0&byline=0&portrait=0" allow="fullscreen" allowfullscreen></iframe>
                <div class="français">
                    <h3>La Barbe Bleue</h3>
                    Dans la trame ancestrale du conte, le personnage n’est pas nommé Barbe Bleue mais Gros Cheval Blanc...
                </div>
                <div class="anglais">
                    <h3>The Blue Beard</h3>
                    In the ancestral framework of the tale, the character is not named Bluebeard but Big White Horse...
                </div>
            </div>


        </div>
        <div>
            <div id="esquisses-container">
                <h3 class="français">Esquisses</h3>
                <h3 class="anglais">Sketches</h3>
                <p class="français">Quelques instants pour explorer la lumière grâce à la matière</p>
                <p class="anglais">A few moments to explore light thanks to the material.</p>
            </div>

            <div id="esquisses-grid">

                <iframe id="video4" src="https://player.vimeo.com/video/936928277?h=dfbdab1cf6&title=0&byline=0&portrait=0" allow="fullscreen" allowfullscreen></iframe>

                <iframe id="video5" src="https://player.vimeo.com/video/937601673?h=63d3ee1e51&title=0&byline=0&portrait=0" allow="fullscreen" allowfullscreen></iframe>

                <iframe id="video6" src="https://player.vimeo.com/video/936927953?h=dd1b9cc304&title=0&byline=0&portrait=0" allow="fullscreen" allowfullscreen></iframe>

                <iframe id="video7" src="https://player.vimeo.com/video/936927720?h=db89881c5c&title=0&byline=0&portrait=0" allow="fullscreen" allowfullscreen></iframe>

                <iframe id="video8" src="https://player.vimeo.com/video/936927604?h=f1ad262b31&title=0&byline=0&portrait=0" allow="fullscreen" allowfullscreen></iframe>

                <iframe id="video9" src="https://player.vimeo.com/video/936927495?h=acc59abf11&title=0&byline=0&portrait=0" allow="fullscreen" allowfullscreen></iframe>

                <iframe id="video10" src="https://player.vimeo.com/video/936927318?h=fc12cd81d4&title=0&byline=0&portrait=0" allow="fullscreen" allowfullscreen></iframe>

                <iframe id="video11" src="https://player.vimeo.com/video/933270297?h=7e9377cc22&title=0&byline=0&portrait=0" allow="fullscreen" allowfullscreen></iframe>
            </div>
        </div>

        {% include('inc/footer.html.twig') %}
    </div>
{% endblock %}