Symfony Profiler

{% extends 'base.html.twig' %}
{% set page = 'homepage' %}
{% block title %}Accueil{% endblock %}
{% block body %}
{% set headerContent = content('Home', 'Header') %}
{% if headerContent.picture is defined and headerContent.picture is not empty %}
{% set backgroundImage = headerContent.picture[0].path %}
{% else %}
{% set backgroundImage = 'empty' %}
{% endif %}
<header class="header-home" style="background-image:url({% if backgroundImage is empty %}'/uploads/images/{{ backgroundImage }}'{% else %}'https://tracol.lu/uploads/tracol.jpg'{% endif %})">
<div class="container-fluid">
<div class="px-4 py-5 text-center">
<div id="block-header-home" class="col-lg-12">
{% if headerContent.content is defined %}
<div id="svg-header" class="col-lg-8 div-svg-header ">
<svg id="svg-home" xmlns="http://www.w3.org/2000/svg" width="9.089" height="14.77" viewBox="0 0 9.089 14.77">
<path id="Tracé_76" data-name="Tracé 76" d="M682.759,232.441h-9.089v14.77l9.089-1.931Z" transform="translate(-673.669 -232.441)" fill="#f6a400"/>
</svg>
</div>
<div class="col-lg-8 div-svg-header home-p">
<p id="header-text-home" class="header-text">{{ headerContent.content|raw }}</p>
</div>
{% endif %}
{#
<div name="form-search-normal" id="form-search-normal" class="div-svg-header">
<form action="{{ path('results') }}" style="display: flex; align-items: center; width: 100%">
<div style="display: flex;flex-direction: column;justify-content: center; width: 66.666vw;">
<div class="selectors" style="display: flex; align-items: center; width: auto;">
<div id="transaction-drop" class="dropdown">
<div class="undroped">
<p class="undroped-header">Type de transaction</p>
<p name="transaction-type" class="undroped-subheader">Achat ou Location</p>
<input type="hidden" value="" class="input-subheader" name="transaction-type">
</div>
<div class="droped">
<div class="dropdown-header">Type de transaction</div>
<ul id="transaction-li" class="items">
<li class="item" data-value ="Vente">Achat</li>
<li class="item" data-value ="Location">Location</li>
<li class="item" data-value ="Location saisonnière">Location saisonniere</li>
<li class="item" data-value ="Programme">Programme</li>
<li class="item" data-value ="Viager">Viager</li>
<li class="item" data-value ="Enchere">Enchère</li>
</ul>
</div>
</div>
<div id="property-drop" class="dropdown">
<div class="undroped">
<p class="undroped-header">Type de biens</p>
<p name="property-type" class="undroped-subheader">Appartement, Bureau, ...</p>
<input type="hidden" value="" class="input-subheader" name="property-type">
</div>
<div class="droped">
<div class="dropdown-header">Type de biens</div>
<ul id="property-li" class="items">
<li class="item" data-value ="Appartement">Appartements</li>
<li class="item" data-value ="Bureaux">Bureaux</li>
<li class="item" data-value ="Maison">Maisons</li>
<li class="item" data-value ="Commerce">Commerces</li>
<li class="item" data-value ="Garage / Parking">Garages / Parkings</li>
<li class="item" data-value ="Immeuble">Immeubles</li>
</ul>
</div>
</div>
<div id="location-drop" class="dropdown">
<div class="undroped">
<p class="undroped-header">Localisation</p>
<p class="undroped-subheader">Choissisez une ville</p>
<input type="hidden" value="" class="input-subheader" name="location">
</div>
<div class="droped">
<div class="dropdown-header">Localisation</div>
<ul id="location-li" class="items">
<li class="item" data-value ="Appartement">Luxembourg-Ville</li>
<li class="item" data-value ="Bureaux">Leudelange</li>
<li class="item" data-value ="Maison">Esch-Sur-Alzette</li>
</ul>
</div>
</div>
<div class="div-form">
<button id="search-detail" class="btn btn-primary child search">RECHERCHE AVANCEE</button>
</div>
<div>
<button style="background-color: transparent;border-color: transparent;" id="submit-search" type="submit">
<svg class="search-button" xmlns="http://www.w3.org/2000/svg" width="55.982" height="90.97" viewBox="0 0 55.982 90.97">
<g id="Groupe_3817" data-name="Groupe 3817" transform="translate(-1528.861 -105)">
<path id="Tracé_95" data-name="Tracé 95" d="M729.651,232.441H673.669v90.97l55.982-11.894Z" transform="translate(855.192 -127.441)" fill="#f6a400"/>
<g id="Groupe_3794" data-name="Groupe 3794" transform="translate(1545.335 126.696)">
<g id="np_search_1868241_000000">
<path id="Tracé_92" data-name="Tracé 92" d="M8.287,17.368A8.662,8.662,0,1,1,14.4,14.813a8.679,8.679,0,0,1-6.109,2.555Zm0-15.055a6.36,6.36,0,1,0,4.477,1.881A6.377,6.377,0,0,0,8.287,2.313Z" transform="translate(0.441 -0.012)" fill="#fff"/>
<path id="Tracé_93" data-name="Tracé 93" d="M57.82,59.567l1.626-1.633L67.4,65.852l-1.626,1.633Z" transform="translate(-44.591 -44.782)" fill="#fff"/>
</g>
</g>
</g>
</svg></button>
<button class="btn btn-primary" id="send" type="submit" style="display: none">Envoyer</button>
</div>
</div>
<div id="sub-search-div" class="sub-search-div" style="display: none">
<div class="col-lg-3 div-form">
<input class="sub-search-input" name="budget" id="budget" type="text" placeholder="Budget max.">
</div>
<div id="rooms-drop" class="dropdown">
<div class="undroped">
<p class="undroped-header transparent-font">Nombre de chambres</p>
<p class="undroped-subheader good-place"></p>
<input type="hidden" class="input-subheader" name="rooms">
</div>
<div class="droped">
<div class="dropdown-header">Nombre de chambres</div>
<ul id="rooms-li" class="items">
<li class="item" data-value ="1">1</li>
<li class="item" data-value ="2">2</li>
<li class="item" data-value ="3">3</li>
<li class="item" data-value ="4">4</li>
<li class="item" data-value ="5">5</li>
<li class="item" data-value ="6">6</li>
</ul>
</div>
</div>
<div class="col-lg-3 div-form">
<input class="sub-search-input" id="area-minimumm" name="area-minimumm" type="text" placeholder="Surface minimum.">
</div>
</div>
</div>
</form>
</div>
#}
</div>
</div>
</div>
</header>
<div class="container-fluid">
<section class="project">
{% set projectContent = content('Home', 'Projects') %}
<div id="home-section" class="col-lg-8 mx-auto div-svg-header pre-section">
<div class="home-section-title" style="font-size: 2.3em;display: flex;flex-direction: column;">
<svg xmlns="http://www.w3.org/2000/svg" width="9.089" height="14.77" viewBox="0 0 9.089 14.77" style="margin-bottom: 10px">
<path id="Tracé_76" data-name="Tracé 76" d="M682.759,232.441h-9.089v14.77l9.089-1.931Z" transform="translate(-673.669 -232.441)" fill="#f6a400"/>
</svg>
<h1 class="project-title">{% if projectContent.name is defined %}{{ projectContent.name }}{% else %}Nos projets{% endif %}</h1>
</div>
<div class="separator"></div>
<div class="pre-section-content col-md-6">
{% if projectContent.content is defined %}
{{ projectContent.content|raw }}
{% else %}
Dotées d’une architecture résolument contemporaine, associée à des matériaux de qualité, les maisons et les résidences Tracol Immobilier ne vous laisseront pas indifférent.
{% endif %}
</div>
</div>
</section>
<section class="properties" style="margin-bottom: 40px">
{#
<div id="button-property" class="col-lg-8 mx-auto div-svg-header" style="display: flex; align-items: center">
<button data-id="all" class="btn btn-primary all border-radius projectButton"><span class="span-all">TOUS</span></button>
<button data-id="futur" class="btn btn-primary come border-radius projectButton"><span class="span-projects">A VENIR</span></button>
<button data-id="construction" class="btn btn-primary come border-radius projectButton"><span class="span-projects">EN COURS</span></button>
<div class="col-lg-6 projects-link">
<a href="{{ path('projects') }}" class="property-span-arrow">VOIR TOUS NOS PROJETS
<i class="fas fa-arrow-right property-arrow"></i>
</a>
</div>
</div>
#}
{#
<div id="button-property-mobile" class="col-lg-8 mx-auto div-svg-header" style="display: none; align-items: center">
<div id="flick2" class="flicking-viewport">
<div class="flicking-camera">
<button data-id="all" class="btn btn-primary all border-radius projectButton"><span class="span-all">TOUS</span></button>
<button data-id="futur" class="btn btn-primary come border-radius projectButton"><span class="span-projects">A VENIR</span></button>
<button data-id="construction" class="btn btn-primary come border-radius projectButton"><span class="span-projects">EN COURS</span></button>
</div>
</div>
<div class="col-lg-8 projects-link">
<a href="{{ path('projects') }}" class="property-span-arrow">VOIR TOUS NOS PROJETS
<i class="fas fa-arrow-right property-arrow"></i>
</a>
</div>
</div>
#}
<div id="projects" class="col-lg-8 mx-auto" style="display: flex; flex-wrap: wrap; justify-content: space-between">
{% for project in projects|slice(0,4) %}
<div onclick="location.href='{{ path('project-detail', {'id': project.id}) }}'" data-id="{{ path('project-detail', {'id': project.id}) }}" id="width-col-6-home" class="col-lg-6 margin-top-30" style="position: relative; cursor: pointer">
{#
<div class="div-hover" id="div-hover" style="">
{% if project.comments[0].comment is not empty %}
<p class="project-content" style="visibility: hidden">
{{ project.comments[0].comment|slice(0, 300) }}
</p>
<p class="project-arrow">
<a style="" href="{{ path('project-detail', {'id': project.id}) }}" class="project-arrow-2">
<span class="galerry-ref"></span><i class="fas fa-arrow-right project-svg-arrow-2"></i>
</a>
</p>
{% else %}
<p class="project-arrow">
<a style="margin-top: 180px" href="{{ path('project-detail', {'id': project.id}) }}" class="project-arrow-2">
<span class="galerry-ref"></span><i class="fas fa-arrow-right project-svg-arrow-2"></i>
</a>
</p>
{% endif %}
</div>
#}
<div class="tag-ref-projet-3"><span class="text-tag-ref">{{ typeProject(project.construction.construction_step) }}</span></div>
{% if project.pictures is not empty %}
{% for picture in project.pictures|slice(0,1) %}
<div class="img" style="background-image: url('{{ picture.url }}'); margin: 0px;">
</div>
{% endfor %}
{% else %}
<div class="img" style="background-image: url('{{ asset('build/Maisons_H_R1.jpg') }}'); margin: 0px;"></div>
{% endif %}
<p class="city">{{ project.city.name }}</p>
<p class="project-name">{{ project.reference }}</p>
</div>
{% endfor %}
</div>
<div class="col-lg-8 mx-auto projects-link-mobile" style="display: none">
<a href="{{ path('projects') }}" class="property-span-arrow">VOIR TOUS NOS PROJETS
<i class="fas fa-arrow-right property-arrow"></i>
</a>
</div>
<div id="link-none" class="col-lg-8 mx-auto div-svg-header d-flex justify-content-end">
<div>
<a id="link-none-a d-flex" class="property-span-arrow" href="{{ path('projects') }}">Découvrir plus
<svg class="svg-inline--fa fa-arrow-right fa-w-14 property-arrow" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="arrow-right" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" data-fa-i2svg=""><path fill="currentColor" d="M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z"></path></svg>
</a>
</div>
</div>
</section>
<section class="reference">
{% set referenceContent = content('Home', 'References') %}
<div class="col-lg-8 mx-auto div-svg-header" style="display: flex; margin-top: 30px">
<div class="col-lg-5">
<svg xmlns="http://www.w3.org/2000/svg" width="9.089" height="14.77" viewBox="0 0 9.089 14.77">
<path id="Tracé_76" data-name="Tracé 76" d="M682.759,232.441h-9.089v14.77l9.089-1.931Z" transform="translate(-673.669 -232.441)" fill="#f6a400"/>
</svg>
<h1 class="project-title">
{% if referenceContent.name is defined and referenceContent.name %}
{{ referenceContent.name }}
{% else %}
Nos références
{% endif %}
</h1>
</div>
</div>
{#
<div id="button-reference" class="offset-lg-2 col-lg-8 div-svg-header" style="display: flex; align-items: center">
<button data-id="all" class="btn btn-primary all border-radius projectButtonref"><span class="span-all">TOUS</span></button>
<button data-id="residences" class="btn btn-primary come border-radius projectButtonref"><span class="span-projects">RÉSIDENCES</span></button>
<button data-id="maisons" class="btn btn-primary come border-radius projectButtonref"><span class="span-projects">MAISONS</span></button>
<button data-id="commerces" class="btn btn-primary come border-radius projectButtonref"><span class="span-projects">COMMERCES</span></button>
<button data-id="bureaux" class="btn btn-primary come border-radius projectButtonref"><span class="span-projects">BUREAUX</span></button>
<div id="links-ref-home" class="col-lg-3 projects-link">
<a href="{{ path('reference') }}" class="property-span-arrow">VOIR TOUTES NOS REFERENCES
<i class="fas fa-arrow-right property-arrow"></i>
</a>
</div>
</div>
<div id="button-reference-mobile" class="offset-lg-2 col-lg-8 div-svg-header" style="display: none; align-items: center">
<div id="flick" class="flicking-viewport">
<div class="flicking-camera">
<button data-id="all" class="btn btn-primary all border-radius projectButtonref"><span class="span-all">TOUS</span></button>
<button data-id="residences" class="btn btn-primary come border-radius projectButtonref"><span class="span-projects">RÉSIDENCES</span></button>
<button data-id="maisons" class="btn btn-primary come border-radius projectButtonref"><span class="span-projects">MAISONS</span></button>
<button data-id="commerces" class="btn btn-primary come border-radius projectButtonref"><span class="span-projects">COMMERCES</span></button>
<button data-id="bureaux" class="btn btn-primary come border-radius projectButtonref"><span class="span-projects">BUREAUX</span></button>
</div>
</div>
<div class="col-lg-3 projects-link">
<a href="{{ path('reference') }}" class="property-span-arrow">VOIR TOUTES NOS REFERENCE
<i class="fas fa-arrow-right property-arrow"></i>
</a>
</div>
</div>
#}
<div id="references-home" class="col-lg-8">
<div id="flick100" class="flicking-viewport">
<div class="flicking-camera">
<div class="col-lg-12 ref-container" style="display: flex; flex-wrap: wrap;">
{% for key, reference in properties|slice(0,4) %}
<a href="{{ path('property-detail', {'id': reference.id}) }}" class="col-lg-6 col-md-12 {% if loop.index % 2 == 0 %}padd-to-left{% else %}padd-to-right{% endif %}">
<div class="div-img-hover-2 ref-list">
{#
<div class="div-hover-2" id="div-hover-2" style="position: absolute; bottom: 5px; left: 5px; background-color: #242424; color: white; width: 291px; height: 85px">
<p class="city">{{ reference.city.name }}</p>
<p class="project-name">{{ reference.reference }}</p>
<p class="date-ref">{{ reference.updated_at|date("d/m/Y") }}</p>
{% if reference.comments[0].comment is not empty %}
<p class="project-content" style="visibility: hidden">
{{ reference.comments[0].comment|slice(0, 250) }}
</p>
<a href="javascript:void(0);" class="project-arrow-2 lightbox-on" data-id="modul-{{ key }}">
<span class="galerry-ref">GALERIES PHOTOS</span><i class="fas fa-arrow-right project-svg-arrow-2"></i>
</a>
{% else %}
<a style="margin-top: 180px" href="javascript:void(0);" class="project-arrow-2 lightbox-on" data-bs-toggle="modul"
data-bs-target="#exampleModulHomeRef{{ key }}">
<span class="galerry-ref">GALERIES PHOTOS</span><i class="fas fa-arrow-right project-svg-arrow-2"></i>
</a>
{% endif %}
</div>
#}
<div class="tag-ref"><span class="text-tag-ref">{{ specialPropertyCategory(reference.category) }}</span></div>
{% if reference.pictures is not empty %}
{% for picture in reference.pictures|slice(0,1) %}
<div class="img-tmp" style="background-image: url({{ picture.url }});"></div>
{% endfor %}
{% else %}
<div class="img-tmp" style="background-image: url('build/Hudson_Ontario2.png');"></div>
{% endif %}
<p class="city">{{ reference.city.name }}</p>
<p class="project-name">{{ reference.reference }}</p>
</div>
</a>
<div class="lightbox" id="modul-{{ key }}">
<div class="closer"></div>
<div class="arrows left">←</div>
<div class="arrows right">→</div>
<div class="counter">1/1</div>
<ul class="items">
{% for picture in reference.pictures %}
<li class="item">
<img class="img" src="{{ picture.url }}">
</li>
{% endfor %}
</ul>
</div>
{% endfor %}
</div>
<div id="link-none" class="col-lg-12 mx-auto div-svg-header d-flex justify-content-end">
<div>
<a id="link-none-a d-flex" class="property-span-arrow" href="{{ path('reference') }}">Découvrir plus
<svg class="svg-inline--fa fa-arrow-right fa-w-14 property-arrow" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="arrow-right" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" data-fa-i2svg=""><path fill="currentColor" d="M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z"></path></svg>
</a>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="property-promotion">
{% set propertyContent = content('Home', 'Biens') %}
<div id="home-sale" class="col-lg-8 mx-auto div-svg-header" style="display: flex; justify-content: space-between">
<div id="property-content-p" class="col-lg-5 property-content" style="display: flex;flex-direction: column;justify-content:space-around">
<svg xmlns="http://www.w3.org/2000/svg" width="9.089" height="14.77" viewBox="0 0 9.089 14.77">
<path id="Tracé_76" data-name="Tracé 76" d="M682.759,232.441h-9.089v14.77l9.089-1.931Z" transform="translate(-673.669 -232.441)" fill="#f6a400"/>
</svg>
<h1 class="property-name">{% if propertyContent.name is defined and propertyContent.name %}{{ propertyContent.name }}{% else %}UN BIEN À vendre ?{% endif %}</h1>
{% if propertyContent.content is defined and propertyContent.content %}
{{ propertyContent.content|raw }}
{% else %}
Choisir de vendre votre terrain à un promoteur immobilier tel que Tracol Immobilier, c’est assurer la sécurité de votre transaction tout en profitant d’une expertise solide. Leur discrétion, leur réseau de contacts et leur accompagnement tout au long du processus sont autant de bonnes raisons de confier votre projet aux équipes développement de Tracol Immobilier pour le concrétiser rapidement , à des conditions idéales.
{% endif %}
<div id="link-palyer" class="div-svg-header">
<div class="see-video" style="display: flex; align-content: center">
<a id="contact-link" class="property-span-arrow" href="{{ path('contact') }}">CONTACTEZ-NOUS
<i class="fas fa-arrow-right property-arrow"></i>
</a>
</div>
<div class="movie-link">
<a id="movie" data-bs-toggle="modal" data-bs-target="#exampleModal" class="property-span-arrow">VOIR LA VIDEO
<i class="fas fa-arrow-right property-arrow"></i>
</a>
<a id="movie-mobile" data-bs-toggle="modal" data-bs-target="#exampleModal" class="property-span-arrow">
<span class="video-span" style="display: none">VOIR LA VIDEO</span>
<i id="svg-video-mobile" style="display: none" class="fas fa-play"></i>
</a>

<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<iframe width="560" height="315" src="https://www.youtube.com/embed/8zFDrIoLoCQ" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-3 see-video-mobile" style="display: none">
<a class="property-span-arrow" href="{{ path('contact') }}">CONTACTEZ-NOUS
<i class="fas fa-arrow-right property-arrow"></i>
</a>
</div>
<div class="home-sale-img" style="position: relative; background-image: url({{ asset('build/2385888.png') }})";>
</div>
</div>
</section>
<section class="numbers" style="margin-bottom: 120px">
{% set numbersContent1 = content('Home', 'Chiffres-1') %}
{% set numbersContent2 = content('Home', 'Chiffres-2') %}
{% set numbersContent3 = content('Home', 'Chiffres-3') %}
{% set numbersContent4 = content('Home', 'Chiffres-4') %}
<div class="col-lg-8 mx-auto div-svg-header" style="display: flex; margin-top: 30px">
<div class="col-lg-8">
<svg xmlns="http://www.w3.org/2000/svg" width="9.089" height="14.77" viewBox="0 0 9.089 14.77">
<path id="Tracé_76" data-name="Tracé 76" d="M682.759,232.441h-9.089v14.77l9.089-1.931Z" transform="translate(-673.669 -232.441)" fill="#f6a400"/>
</svg>
{% if numbersContent1.name is defined %}<h1 class="property-name">{{ numbersContent1.name }}</h1>{% else %}<h1 class="property-name">wdr rd gdrgr dgr</h1>{% endif %}
</div>
</div>
<div class="col-lg-8 mx-auto div-svg-header" style="display: flex; align-items: center">
<div id="flick1" class="flicking-viewport" style="display: flex; justify-content: center">
<div class="flicking-camera" style="align-items: flex-start; justify-content: flex-start;">
{% if numbersContent1.content is defined %}
<div class="number-content constr" style="display: flex; flex-direction: column; align-items: center; justify-content: center">
{{ numbersContent1.content|raw }}
</div>
{% else %}
<div class="separator"></div>
<div class="number-content comm" style="display: flex; flex-direction: column; align-items: center; justify-content: center">
<p>Environ</p>
<h2><strong class="count">0</strong></h2>
<p>logements</p>
<p><strong>commercialisés </strong>(par an)</p>
</div>
{% endif %}
{% if numbersContent1.content is defined %}
<div class="separator"></div>
<div class="number-content comm" style="display: flex; flex-direction: column; align-items: center; justify-content: center">
{{ numbersContent2.content|raw }}
</div>
{% else %}
<div class="separator"></div>
<div class="number-content comm" style="display: flex; flex-direction: column; align-items: center; justify-content: center">
<p>Environ</p>
<h2><strong class="count">0</strong></h2>
<p>logements</p>
<p><strong>commercialisés </strong>(par an)</p>
</div>
{% endif %}
{% if numbersContent1.content is defined %}
<div class="separator"></div>
<div class="number-content porte" style="display: flex; flex-direction: column; align-items: center; justify-content: center">
{{ numbersContent3.content|raw }}
</div>
{% else %}
<div class="separator"></div>
<div class="number-content comm" style="display: flex; flex-direction: column; align-items: center; justify-content: center">
<p>Environ</p>
<h2><strong class="count">0</strong></h2>
<p>logements</p>
<p><strong>commercialisés </strong>(par an)</p>
</div>
{% endif %}
{% if numbersContent1.content is defined %}
<div class="separator"></div>
<div class="number-content coll" style="display: flex; flex-direction: column; align-items: center; justify-content: center">
{{ numbersContent4.content|raw }}
</div>
{% else %}
<div class="separator"></div>
<div class="number-content comm" style="display: flex; flex-direction: column; align-items: center; justify-content: center">
<p>Environ</p>
<h2><strong class="count">0</strong></h2>
<p>logements</p>
<p><strong>commercialisés </strong>(par an)</p>
</div>
{% endif %}
</div>
</div>
</div>
</section>
</div>
<section class="newsletter">
<div class="col-lg-8 row m-auto">
<div class="col-lg-6">
<svg xmlns="http://www.w3.org/2000/svg" width="9.089" height="14.77" viewBox="0 0 9.089 14.77">
<path id="Tracé_76" data-name="Tracé 76" d="M682.759,232.441h-9.089v14.77l9.089-1.931Z" transform="translate(-673.669 -232.441)" fill="#fff"/>
</svg>
<h1 class="property-name">Inscrivez-vous à<br> notre newsletter</h1>
</div>
<div class="col-lg-4">
<div id="div-form-newsletter">
<span id="span-newsletter">Restez informé ! Abonnez-vous à notre newsletter.</span>
<form action="{{ path('mailchimp') }}" id="form-newsletter">
<div class="input-group mt-2">
<input id="input-email" class="form-control input-email" type="email" name="email" placeholder="Votre adresse mail">
<button class="btn btn-primary button-newsletter" type="submit"><i class="fas fa-arrow-right"></i></button>
</div>
</form>
</div>
</div>
</div>
</section>

<div id="video" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<div class="embed-responsive embed-responsive-16by9">
<iframe id="cartoonVideo" class="embed-responsive-item" width="560" height="315" src="https://youtu.be/8zFDrIoLoCQ" allowfullscreen></iframe>
</div>
</div>
</div>
</div>
</div>

{# <div class="modal fade" id="popUpChristmas" tabindex="-1" aria-labelledby="popUpChristmas" aria-hidden="true">#}
{# <div class="modal-dialog video-pop-up-dialog">#}
{# <div class="modal-content video-pop-up-content">#}
{# <div class="modal-body" style="position: relative">#}
{# <button class="btn btn-primary" id="closeModal">×</button>#}
{# <button id="buttonVideoFour" class="active">#}
{# <i style="font-size: 65px; background-color: transparent;" class="far fa-play-circle"></i>#}
{# </button>#}
{# <video id="video1" preload="auto" width="100%" height="100%" poster="{{ asset('build/cover-xmas.png') }}" controls>#}
{# <source type="video/mp4" src="{{ asset('build/2021_09_12 Carte de voeux animée - Vidéo R4.mp4') }}" />#}
{# </video>#}
{# </div>#}
{# </div>#}
{# </div>#}
{# </div>#}
{# <script>#}
{# let myVideo = document.getElementById("video1");#}
{# myVideo.controls = false#}
{# </script>#}
{# <script>#}
{# $('.slider-home-ref-detail').slick({#}
{# dots: false,#}
{# infinite: true,#}
{# speed: 3000,#}
{# slidesToShow: 1,#}
{# slidesToScroll: 1,#}
{# autoplay: true,#}
{# responsive: [#}
{# {#}
{# breakpoint: 576,#}
{# settings: {#}
{# slidesToShow: 1,#}
{# slidesToScroll: 1#}
{# }#}
{# }#}
{# ]#}
{# });#}
{# </script>#}
{% endblock %}

templates/home.html.twig line 8