<div class="detail-top">
<div class="container">
<div class="row">
<div class="col-12 col-sm-12">
<div class="header-detail table-list">
<div class="header-left">
{% if HotelDetail.Name is defined and HotelDetail.Name is not null %}
<h1>{{ HotelDetail.Name }}</h1>
{% endif %}
{% if HotelDetail.Category.Star is defined and HotelDetail.Category.Star is not null %}
<div class="rating" style=" margin-bottom: 9px;">
<span class="bottom-ratings">
{% for star in 1..HotelDetail.Category.Star %}
<span class="fa fa-star"></span>
{% endfor %}
</span>
</div>
{% endif %}
{% if HotelDetail.City.Name is defined and HotelDetail.City.Name is not null %}
<address class="property-address">
<i class="fa fa-map-marker-alt fa-1" aria-hidden="true"
style="margin-right: 5px;margin-left: 1px;"></i>{{ HotelDetail.City.Name }}{% if HotelDetail.City.Zone is defined and HotelDetail.City.Zone is not null and HotelDetail.City.Zone is not empty %} ,{{ HotelDetail.City.Zone }} {% endif %}
</address>
{% endif %}
{% if HotelDetail.avisGlobale is defined and HotelDetail.avisGlobale is not null %}
<p class="description-review mt-2">
<span class="avi-detail"> {{ HotelDetail.avisGlobale.global.moyenne_etoiles }}</span>
({{ HotelDetail.avis|length }} Avis) Très Bien
</p>
{% endif %}
</div>
{% if HotelDetail.min_price is defined %}
<div id="vjs-min-price1">
<template>
<div v-if="min_arrangement.libelle !== undefined" class="header-right price new-set">
<p class="price-start"> {{ "A partir de"|trans }}</p>
<span class="item-price">${ minPrixSingle.split(',')[0] },<span
style=" font-size: 16px; ">${minPrixSingle.split(',')[1]}</span><sup
style=" font-size: 60%; ">{{ deviseSelected().symbole }} </sup></span>
<p class="rant old-price" v-if="minPrixSingle != minBasePrixSingle">${
minBasePrixSingle }</p>
<p class="rant">{{ "par personne en"|trans }} ${ min_arrangement.libelle }</p>
</div>
<div v-else class="ssc-line mb header-right price new-set"
style="height: 93px;width: 132px"></div>
</template>
</div>
{% endif %}
</div>
{% if configAffichage is defined and configAffichage.HOTEL.DETAILS_BLOC_ALBUMS ==1 %}
{% if HotelDetail.Album is defined and HotelDetail.Album is not null and HotelDetail.Album|length > 2 %}
<div class="detail-media">
<div id="property-grid-module-1" class="property-grid-module grid">
<div class="row no-margin"
style="box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);">
<div class="col-12 col-sm-12 col-md-4">
<div class="figure-grid item-thumb"
style="background-image: url('{{ HotelDetail.Album[0].Url }}');">
<a href="#" class="hover-effect"></a>
<div class="media-tabs">
<ul class="media-tabs-list">
<li class="popup-trigger" data-placement="bottom"
data-toggle="tooltip"
data-original-title="{{ "Voir toutes les photos"|trans }}">
<a href="#gallery" data-toggle="tab">
<i class="fa fa-camera"></i>
</a>
</li>
</ul>
</div>
</div>
<div class="figure-grid item-thumb"
style="background-image: url('{{ HotelDetail.Album[1].Url }}');">
<a href="#" class="hover-effect"></a>
</div>
</div>
<div class="col-12 col-md-8">
<div class="figure-grid item-thumb heightFirstImg"
style="background-image: url( '{{ HotelDetail.Album[2].Url }}');">
<a href="#" class="hover-effect"></a>
<div id="vjs-min-price2" v-if="min_arrangement != null">
<div id="mo_summary_client"
class="mo-hotel-summary-client clearfix ">
<p class="best-option"> {{ "Le meilleur prix disponible"|trans }} </p>
<template v-if="min_arrangement.length == 0">
<div class="ssc-line mb"></div>
<div class="ssc-line mb"></div>
<div class="ssc-head-line mb w-70"
style="float: right"></div>
</template>
<div style="display: none"
v-show="min_arrangement.min_prices !== undefined">
<div class="room-boardtype text-right">
<p class="room">Chambre - Vue sur Jardin + Chambre - Vue sur
Jardin
-
<span class="boardtype">${ min_arrangement.libelle }</span>
</p>
</div>
<p class="your-compo">
<span id="summary_client_adults_number">${ Recap }</span>
</p>
<div class="price-box mt-2">
<div class="inner d-flex justify-content-end align-items-center">
<p class="prices">${ minPrix }
<small>{{ deviseSelected().symbole }} </small>
</p>
</div>
<p class="final"> {{ "Prix final"|trans }} </p>
<p class="detail">
<a href="#tarifs"
class="target"> {{ "Voir détails du prix"|trans }} <i
class="fa fa-chevron-down"></i></a>
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% elseif HotelDetail.Album is defined and HotelDetail.Album is not null %}
<div class="detail-media">
<div id="property-grid-module-1" class="property-grid-module grid">
<div class="row no-margin"
style="box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);">
<div class="col-md-12">
{% for photo in HotelDetail.Album %}
<div class="figure-grid item-thumb heightFirstImg"
style="background-image: url('{{ photo.Url }}');">
<a href="#" class="hover-effect"></a>
<div class="media-tabs">
<ul class="media-tabs-list">
<li class="popup-trigger" data-placement="bottom"
data-toggle="tooltip"
data-original-title="{{ "Voir toutes les photos"|trans }}">
<a href="#gallery" data-toggle="tab">
<i class="fa fa-camera"></i>
</a>
</li>
</ul>
</div>
</div>
{% endfor %}
</div>
</div>
</div>
</div>
{% endif %}
{% endif %}
</div>
{% if configAffichage is defined and configAffichage.HOTEL.DETAILS_BLOC_ALBUMS ==3 %}
{% if HotelDetail.Album is defined and HotelDetail.Album is not null and HotelDetail.Album|length > 0 %}
<div class="col-12 col-sm-12">
<div class="f-carousel" id="myCarousel">
{% for photo in HotelDetail.Album %}
<div class="f-carousel__slide" data-thumb-src="{{ photo.Url }}">
<a href="{{ photo.Url }}" data-fancybox="gallery">
<img width="100%" height="480" alt="" data-lazy-src="{{ photo.Url }}"
class="fancy-img"/>
<div class="card-image-overlay">
{% if configAffichage is defined and configAffichage.HOTEL.DETAILS_BLOC_ALBUMS ==3 %}
{% if HotelDetail.TripAdvisor is defined and HotelDetail.TripAdvisor is not null %}
<div id="tripadvisor-detail-hotel" class="trip">
{{ HotelDetail.TripAdvisor|raw }}
</div>
{% endif %}
<div id="vjs-etiquette" class="etiquette-detail-hotel">
<template>
<div v-if="etiquettes !== undefined" class="">
<div class="label-wrap" id="etiquette-hotel-list">
<div class="label-status label"
:style="{ backgroundColor:etiquettes.color }"
v-for="etiquette in etiquettes">
<span v-if="etiquette.promotion !== undefined">-${etiquette.promotion}% {{ "jusqu'au"|trans }} ${etiquette.fin}</span>
<span v-else>${etiquette.libelle}</span>
<i
v-if="typeof etiquette.hasCountDown !== 'undefined' && etiquette.hasCountDown"
ref="countdown"
:data-time="etiquette.countdownDate.date"></i>
</div>
</div>
</div>
<img v-for="etiquette in etiquettesEmplacement"
:src="etiquette.media"
style="max-height: 48px">
</template>
</div>
{% endif %}</div>
</a>
</div>
{% endfor %}
</div>
</div>
{% endif %}
{% endif %}
</div>
</div>
</div>
<!--start detail content-->
<section class="section-detail-content">
<div class="container">
<div class="row">
<div class="col-12 col-sm-12 col-md-8 col-lg-8 container-contentbar">
<div class="detail-bar example">
{% if app.request.get('product') == "appartement" %}
{% if HotelDetail.LongDescription is not defined and HotelDetail.LongDescription is null %}
<div id="description"
class="property-description detail-block a" {% if is_mobile() %} style="margin-top: 20px;" {% endif %} >
<div class="detail-title">
<h2 class="title-left"> {{ "Info"|trans }}</h2>
</div>
<article>
<p style="color: red"> {{ "Aucune information n'a été trouvée concernant votre choix ."|trans }}</p>
</article>
</div>
{% endif %}
{% endif %}
{% if configAffichage is defined and configAffichage.HOTEL.DETAILS_BLOC_ALBUMS ==2 %}
{% if HotelDetail.Album is defined and HotelDetail.Album is not null and HotelDetail.Album|length > 0 %}
<div class="detail-media detail-top-slideshow" id="galleries">
<div class="tab-content">
<div id="gallery" class="tab-pane fade in active">
<span class="label-wrap visible-sm visible-xs">
{#<span class="label label-primary">For Sale</span>
<span class="label label-danger">Sold</span>#}
</span>
<div class="slideshow">
<div class="slideshow-main">
<div class="slide">
{% for photo in HotelDetail.Album %}
<div>
<img src="{{ photo.Url }}" width="1170" height="654"
alt="Slide show">
</div>
{% endfor %}
</div>
</div>
<div class="slideshow-nav-main">
<div class="slideshow-nav">
{% for photo in HotelDetail.Album %}
<div>
<img src="{{ photo.Url }}" width="100" height="70"
alt="Slide show thumb">
</div>
{% endfor %}
</div>
</div>
</div>
</div>
<div id="map" class="tab-pane fade"></div>
<div id="street-map" class="tab-pane fade"></div>
</div>
<div class="media-tabs">
<ul class="media-tabs-list">
<li class="popup-trigger" data-placement="bottom" data-toggle="tooltip"
data-original-title="{{ "View Photos"|trans }}">
<a href="#gallery" data-toggle="tab">
<i class="fa fa-camera"></i>
</a>
</ul>
<ul class="actions">
<li class="share-btn">
<div class="share_tooltip tooltip_left fade">
<a href="#"
onclick="window.open(this.href, 'mywin','left=50,top=50,width=600,height=350,toolbar=0'); return false;">
<div class="detail-media detail-top-slideshow" id="galleries"><i
class="fa fa-facebook"></i></div>
</a>
<a href="#"
onclick="if(!document.getElementById('td_social_networks_buttons')){window.open(this.href, 'mywin','left=50,top=50,width=600,height=350,toolbar=0'); return false;}"><i
class="fa fa-twitter"></i></a>
<a href="#"
onclick="window.open(this.href, 'mywin','left=50,top=50,width=600,height=350,toolbar=0'); return false;"><i
class="fa fa-pinterest"></i></a>
<a href="#"
onclick="window.open(this.href, 'mywin','left=50,top=50,width=600,height=350,toolbar=0'); return false;"><i
class="fa fa-linkedin"></i></a>
<a href="#"
onclick="window.open(this.href, 'mywin','left=50,top=50,width=600,height=350,toolbar=0'); return false;"><i
class="fa fa-google-plus"></i></a>
<a href="#"><i class="fa fa-envelope"></i></a>
</div>
<span data-placement="right" data-toggle="tooltip"
data-original-title="{{ "share"|trans }}"><i
class="fa fa-share-alt"></i></span>
</li>
</ul>
</div>
</div>
{% endif %}
{% endif %}
{% if HotelDetail.LongDescription is defined and HotelDetail.LongDescription is not null and HotelDetail.LongDescription|length>0 %}
<div id="description"
class="property-description detail-block a" {% if is_mobile() %} style="margin-top: 20px;" {% endif %} >
<div class="detail-title">
<h2 class="title-left"> {{ "Description"|trans }}</h2>
</div>
<article>
{% if HotelDetail.LongDescription|length>200 %}
<div class="summary">
<p class=" style-courte-description"> {{ HotelDetail.LongDescription|remove_size_styles|raw }}
...</p>
</div>
<div class="more">
<p> {{ HotelDetail.LongDescription|remove_size_styles|raw }}</p>
</div>
<div class="less active">
<a class="button-read-more button-read active" href="#"
style="color: #337ab7;border-bottom: 0"> {{ "Lire la suite"|trans }} <i
class="fa fa-angle-double-down" aria-hidden="true"></i></a>
<a class="button-read-less button-read " href="#"
style="color: #337ab7;"> {{ "Reduire"|trans }} <i
class="fa fa-angle-double-up" aria-hidden="true"></i></a>
</div>
{% else %}
<p> {{ HotelDetail.LongDescription|remove_size_styles|raw }}</p>
{% endif %}
</article>
</div>
{% endif %}
{% if HotelDetail.Top10Facilitie is defined and HotelDetail.Top10Facilitie|length>0 and HotelDetail.Facilitie is defined and HotelDetail.Facilitie|length>0 %}
<div class="property-description detail-block b mt-5" id="Equipements">
<div class="detail-title">
<h2 class="title-left"> {{ "Equipements"|trans }} </h2>
</div>
{% if HotelDetail.Facilitie is defined and HotelDetail.Facilitie is not null %}
<div id="liste-hotel"
class="Facilité-description py-4 accordion-collapse collapse in">
<div class="row">
<div class="col-12 col-sm-12 d-flex flex-wrap">
{% for amenagement in HotelDetail.Facilitie %}
<div class="col-12 col-sm-12 col-md-4">
<div class="widget-block">
<h3> {% if amenagement.Icone is defined and amenagement.Icone is not null %}
<img src="{{ amenagement.Icone }}"
class="icon-i"> | {% endif %} {{ amenagement.Title }}
</h3>
<ul>
{% for amen in amenagement.Amenagements %}
<li> {{ amen.Title }}</li>
{% endfor %}
</ul>
</div>
</div>
{% endfor %}
</div>
</div>
{% endif %}
</div>
</div>
{% endif %}
{% if HotelDetail.Option is defined and HotelDetail.Option is not null and HotelDetail.Option|length>0 %}
<div class="property-des detail-block c " id="option-local">
<div class="detail-title">
<h2 class="title-left"> {{ "Options"|trans }} </h2>
</div>
<div class="">
<div class="row">
<div class="col-12 col-sm-12">
<div class="widget-block">
<ul>
{% for option in HotelDetail.Option %}
<li class="mb-1"> {{ option.Title }}</li>
{% endfor %}
</ul>
</div>
</div>
</div>
</div>
</div>
{% endif %}
{% if HotelDetail.Note is defined and HotelDetail.Note is not null and HotelDetail.Note|length>0 %}
<div class="property-description detail-block d " id="conditions-restrictives">
<div class="detail-title">
<h2 class="title-left"> {{ "Conditions Restrictives"|trans }} </h2>
</div>
<div class="row">
<div class="col-12 col-sm-12">
<div class="detail-block">
{% if HotelDetail.Note is defined and HotelDetail.Note is not null %}
<ul style="padding-left: 20px;margin-top: 0;margin-bottom: 0">
<li> {{ HotelDetail.Note|raw }}</li>
</ul>
{% endif %}
</div>
</div>
</div>
</div>
{% endif %}
{% if BookingDetails is defined %}
<form action="{{ path('tarif_dispo') }}" method="post">
<textarea name="BookingCreation" hidden>{{ Request }}</textarea>
<button>Je réserve</button>
</form>
{% endif %}
{% if app.request.get('product') != "appartement" %}
{% if configAffichage.HOTEL.DETAILS_VERSION_FILTRE ==1 %}
<div class="property-description detail-block e" id="tarifs">
<div class="detail-title">
<h2 class="title-left"> {{ "Chambres & Tarifs"|trans }} </h2>
</div>
{% include checkCustomTemplate('advanced-search.html.twig') with { produit:'SHE', modele:2 } %}
{% include checkCustomTemplate('SejourHotel/availability/list-hotels.html.twig') %}
<div class="pull-right">
{% if configAffichage is defined and configAffichage.HOTEL.VIEW_CALENDRA == 'oui' %}
<button type="button"
class="btn gap-2 d-flex justify-content-center align-items-center bg-yellow "
data-toggle="modal"
data-target="#calendrier">
<svg width="22" height="22" viewBox="0 0 22 22" fill="none"
xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_961_1304)">
<path d="M21.5703 1.71875H19.2391V1.46094C19.2391 0.655359 18.5837 0 17.7781 0C16.9726 0 16.3172 0.655359 16.3172 1.46094V1.71875H12.4555V1.46094C12.4555 0.655359 11.8001 0 10.9945 0C10.189 0 9.53361 0.655359 9.53361 1.46094V1.71875H5.67188V1.46094C5.67188 0.655359 5.01652 0 4.21094 0C3.40536 0 2.75 0.655359 2.75 1.46094V1.71875H0.429688C0.192371 1.71875 0 1.91112 0 2.14844V21.5703C0 21.8076 0.192371 22 0.429688 22H21.5703C21.8076 22 22 21.8076 22 21.5703V2.14844C22 1.91112 21.8076 1.71875 21.5703 1.71875ZM17.1766 1.46094C17.1766 1.12922 17.4464 0.859375 17.7781 0.859375C18.1099 0.859375 18.3797 1.12922 18.3797 1.46094V1.71875H17.1766V1.46094ZM10.393 1.46094C10.393 1.12922 10.6628 0.859375 10.9945 0.859375C11.3263 0.859375 11.5961 1.12922 11.5961 1.46094V1.71875H10.393V1.46094ZM3.60938 1.46094C3.60938 1.12922 3.87922 0.859375 4.21094 0.859375C4.54266 0.859375 4.8125 1.12922 4.8125 1.46094V1.71875H3.60938V1.46094ZM21.1406 21.1406H0.859375V5.92969H17.9609C18.1983 5.92969 18.3906 5.73732 18.3906 5.5C18.3906 5.26268 18.1983 5.07031 17.9609 5.07031H0.859375V2.57812H2.75V2.88613C2.75 3.6917 3.40536 4.34706 4.21094 4.34706C4.44825 4.34706 4.64062 4.15469 4.64062 3.91738C4.64062 3.68006 4.44825 3.48769 4.21094 3.48769C3.87922 3.48769 3.60938 3.21784 3.60938 2.88613V2.57812H9.53361V2.88613C9.53361 3.6917 10.189 4.34706 10.9945 4.34706C11.2319 4.34706 11.4242 4.15469 11.4242 3.91738C11.4242 3.68006 11.2319 3.48769 10.9945 3.48769C10.6628 3.48769 10.393 3.21784 10.393 2.88613V2.57812H16.3172V2.88613C16.3172 3.6917 16.9726 4.34706 17.7781 4.34706C18.0155 4.34706 18.2078 4.15469 18.2078 3.91738C18.2078 3.68006 18.0155 3.48769 17.7781 3.48769C17.4464 3.48769 17.1766 3.21784 17.1766 2.88613V2.57812H21.1406V21.1406Z"
fill="black"></path>
<path d="M5.5 11.8594H2.75C2.51268 11.8594 2.32031 12.0518 2.32031 12.2891V15.0391C2.32031 15.2763 2.51268 15.4688 2.75 15.4688H5.5C5.73732 15.4688 5.92969 15.2763 5.92969 15.0391V12.2891C5.92969 12.0518 5.73732 11.8594 5.5 11.8594ZM5.07031 14.6094H3.17969V12.7188H5.07031V14.6094Z"
fill="black"></path>
<path d="M19.25 11.8594H16.5C16.2627 11.8594 16.0703 12.0518 16.0703 12.2891V15.0391C16.0703 15.2763 16.2627 15.4688 16.5 15.4688H19.25C19.4873 15.4688 19.6797 15.2763 19.6797 15.0391V12.2891C19.6797 12.0518 19.4873 11.8594 19.25 11.8594ZM18.8203 14.6094H16.9297V12.7188H18.8203V14.6094Z"
fill="black"></path>
<path d="M19.25 16.3281H16.5C16.2627 16.3281 16.0703 16.5205 16.0703 16.7578V19.5078C16.0703 19.7451 16.2627 19.9375 16.5 19.9375H19.25C19.4873 19.9375 19.6797 19.7451 19.6797 19.5078V16.7578C19.6797 16.5205 19.4873 16.3281 19.25 16.3281ZM18.8203 19.0781H16.9297V17.1875H18.8203V19.0781Z"
fill="black"></path>
<path d="M14.667 11.8594H11.917C11.6797 11.8594 11.4873 12.0518 11.4873 12.2891V15.0391C11.4873 15.2763 11.6797 15.4688 11.917 15.4688H14.667C14.9043 15.4688 15.0967 15.2763 15.0967 15.0391V12.2891C15.0967 12.0518 14.9043 11.8594 14.667 11.8594ZM14.2373 14.6094H12.3467V12.7188H14.2373V14.6094Z"
fill="black"></path>
<path d="M10.083 11.8594H7.33301C7.09569 11.8594 6.90332 12.0518 6.90332 12.2891V15.0391C6.90332 15.2763 7.09569 15.4688 7.33301 15.4688H10.083C10.3203 15.4688 10.5127 15.2763 10.5127 15.0391V12.2891C10.5127 12.0518 10.3203 11.8594 10.083 11.8594ZM9.65332 14.6094H7.7627V12.7188H9.65332V14.6094Z"
fill="black"></path>
<path d="M5.5 16.3281H2.75C2.51268 16.3281 2.32031 16.5205 2.32031 16.7578V19.5078C2.32031 19.7451 2.51268 19.9375 2.75 19.9375H5.5C5.73732 19.9375 5.92969 19.7451 5.92969 19.5078V16.7578C5.92969 16.5205 5.73732 16.3281 5.5 16.3281ZM5.07031 19.0781H3.17969V17.1875H5.07031V19.0781Z"
fill="black"></path>
<path d="M14.667 16.3281H11.917C11.6797 16.3281 11.4873 16.5205 11.4873 16.7578V19.5078C11.4873 19.7451 11.6797 19.9375 11.917 19.9375H14.667C14.9043 19.9375 15.0967 19.7451 15.0967 19.5078V16.7578C15.0967 16.5205 14.9043 16.3281 14.667 16.3281ZM14.2373 19.0781H12.3467V17.1875H14.2373V19.0781Z"
fill="black"></path>
<path d="M10.083 16.3281H7.33301C7.09569 16.3281 6.90332 16.5205 6.90332 16.7578V19.5078C6.90332 19.7451 7.09569 19.9375 7.33301 19.9375H10.083C10.3203 19.9375 10.5127 19.7451 10.5127 19.5078V16.7578C10.5127 16.5205 10.3203 16.3281 10.083 16.3281ZM9.65332 19.0781H7.7627V17.1875H9.65332V19.0781Z"
fill="black"></path>
<path d="M5.5 7.39062H2.75C2.51268 7.39062 2.32031 7.583 2.32031 7.82031V10.5703C2.32031 10.8076 2.51268 11 2.75 11H5.5C5.73732 11 5.92969 10.8076 5.92969 10.5703V7.82031C5.92969 7.583 5.73732 7.39062 5.5 7.39062ZM5.07031 10.1406H3.17969V8.25H5.07031V10.1406Z"
fill="black"></path>
<path d="M19.25 7.39062H16.5C16.2627 7.39062 16.0703 7.583 16.0703 7.82031V10.5703C16.0703 10.8076 16.2627 11 16.5 11H19.25C19.4873 11 19.6797 10.8076 19.6797 10.5703V7.82031C19.6797 7.583 19.4873 7.39062 19.25 7.39062ZM18.8203 10.1406H16.9297V8.25H18.8203V10.1406Z"
fill="black"></path>
<path d="M14.667 7.39062H11.917C11.6797 7.39062 11.4873 7.583 11.4873 7.82031V10.5703C11.4873 10.8076 11.6797 11 11.917 11H14.667C14.9043 11 15.0967 10.8076 15.0967 10.5703V7.82031C15.0967 7.583 14.9043 7.39062 14.667 7.39062ZM14.2373 10.1406H12.3467V8.25H14.2373V10.1406Z"
fill="black"></path>
<path d="M10.083 7.39062H7.33301C7.09569 7.39062 6.90332 7.583 6.90332 7.82031V10.5703C6.90332 10.8076 7.09569 11 7.33301 11H10.083C10.3203 11 10.5127 10.8076 10.5127 10.5703V7.82031C10.5127 7.583 10.3203 7.39062 10.083 7.39062ZM9.65332 10.1406H7.7627V8.25H9.65332V10.1406Z"
fill="black"></path>
<path d="M19.9405 5.19621C19.8606 5.11629 19.7497 5.07031 19.6367 5.07031C19.5237 5.07031 19.4129 5.11629 19.3329 5.19621C19.253 5.27613 19.207 5.38699 19.207 5.5C19.207 5.61301 19.253 5.72387 19.3329 5.80379C19.4129 5.88371 19.5237 5.92969 19.6367 5.92969C19.7497 5.92969 19.8606 5.88371 19.9405 5.80379C20.0204 5.72387 20.0664 5.61301 20.0664 5.5C20.0664 5.38699 20.0204 5.27613 19.9405 5.19621Z"
fill="black"></path>
</g>
<defs>
<clipPath id="clip0_961_1304">
<rect width="22" height="22" fill="white"></rect>
</clipPath>
</defs>
</svg>
Vérifier notre calendrier de prix
</button>
{% endif %}
</div>
</div>
{% elseif configAffichage.HOTEL.DETAILS_VERSION_FILTRE ==2 %}
<div class="property-description detail-block e" id="tarifs">
<div class="detail-title">
<h2 class="title-left"> {{ "Chambres & Tarifs"|trans }} </h2>
</div>
<div id="filtre" style="display: none">
{% include checkCustomTemplate('advanced-search.html.twig') with { produit:'SHE', modele:2 } %}
</div>
<div id="result">
<div class="capitulatif" style="min-height: 80px;">
<div class="ligne_detaif">
<div class="bloc_date">
<i aria-hidden="true" class="fa fa-calendar fa-1 mr-2"></i>Arrivée :
<span style="font-size:12px" id="recap-checkin"></span>
</div>
<div class="bloc_date">
<i aria-hidden="true" class="fa fa-moon-o fa-1"
style="margin-left: 1px;"></i>Durée :
<span style="font-size:12px" id="recap-nuitees"></span>
</div>
<div class="bloc_date">
<i aria-hidden="true" class="fa input-users fa-1 mr-2"></i></i>
occupations :
<span style="font-size:12px" id="recap-occupations"></span>
</div>
<div style="float: right">
<button id="edit-search" class="btn btn-secondary " type="button">
Modifier
</button>
</div>
</div>
</div>
{% include checkCustomTemplate('SejourHotel/availability/list-hotels.html.twig') %}
</div>
<div class="pull-right">
{% if configAffichage is defined and configAffichage.HOTEL.VIEW_CALENDRA == 'oui' %}
<button type="button"
class="btn gap-2 d-flex justify-content-center align-items-center bg-yellow "
data-toggle="modal"
data-target="#calendrier">
<svg width="22" height="22" viewBox="0 0 22 22" fill="none"
xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_961_1304)">
<path d="M21.5703 1.71875H19.2391V1.46094C19.2391 0.655359 18.5837 0 17.7781 0C16.9726 0 16.3172 0.655359 16.3172 1.46094V1.71875H12.4555V1.46094C12.4555 0.655359 11.8001 0 10.9945 0C10.189 0 9.53361 0.655359 9.53361 1.46094V1.71875H5.67188V1.46094C5.67188 0.655359 5.01652 0 4.21094 0C3.40536 0 2.75 0.655359 2.75 1.46094V1.71875H0.429688C0.192371 1.71875 0 1.91112 0 2.14844V21.5703C0 21.8076 0.192371 22 0.429688 22H21.5703C21.8076 22 22 21.8076 22 21.5703V2.14844C22 1.91112 21.8076 1.71875 21.5703 1.71875ZM17.1766 1.46094C17.1766 1.12922 17.4464 0.859375 17.7781 0.859375C18.1099 0.859375 18.3797 1.12922 18.3797 1.46094V1.71875H17.1766V1.46094ZM10.393 1.46094C10.393 1.12922 10.6628 0.859375 10.9945 0.859375C11.3263 0.859375 11.5961 1.12922 11.5961 1.46094V1.71875H10.393V1.46094ZM3.60938 1.46094C3.60938 1.12922 3.87922 0.859375 4.21094 0.859375C4.54266 0.859375 4.8125 1.12922 4.8125 1.46094V1.71875H3.60938V1.46094ZM21.1406 21.1406H0.859375V5.92969H17.9609C18.1983 5.92969 18.3906 5.73732 18.3906 5.5C18.3906 5.26268 18.1983 5.07031 17.9609 5.07031H0.859375V2.57812H2.75V2.88613C2.75 3.6917 3.40536 4.34706 4.21094 4.34706C4.44825 4.34706 4.64062 4.15469 4.64062 3.91738C4.64062 3.68006 4.44825 3.48769 4.21094 3.48769C3.87922 3.48769 3.60938 3.21784 3.60938 2.88613V2.57812H9.53361V2.88613C9.53361 3.6917 10.189 4.34706 10.9945 4.34706C11.2319 4.34706 11.4242 4.15469 11.4242 3.91738C11.4242 3.68006 11.2319 3.48769 10.9945 3.48769C10.6628 3.48769 10.393 3.21784 10.393 2.88613V2.57812H16.3172V2.88613C16.3172 3.6917 16.9726 4.34706 17.7781 4.34706C18.0155 4.34706 18.2078 4.15469 18.2078 3.91738C18.2078 3.68006 18.0155 3.48769 17.7781 3.48769C17.4464 3.48769 17.1766 3.21784 17.1766 2.88613V2.57812H21.1406V21.1406Z"
fill="black"></path>
<path d="M5.5 11.8594H2.75C2.51268 11.8594 2.32031 12.0518 2.32031 12.2891V15.0391C2.32031 15.2763 2.51268 15.4688 2.75 15.4688H5.5C5.73732 15.4688 5.92969 15.2763 5.92969 15.0391V12.2891C5.92969 12.0518 5.73732 11.8594 5.5 11.8594ZM5.07031 14.6094H3.17969V12.7188H5.07031V14.6094Z"
fill="black"></path>
<path d="M19.25 11.8594H16.5C16.2627 11.8594 16.0703 12.0518 16.0703 12.2891V15.0391C16.0703 15.2763 16.2627 15.4688 16.5 15.4688H19.25C19.4873 15.4688 19.6797 15.2763 19.6797 15.0391V12.2891C19.6797 12.0518 19.4873 11.8594 19.25 11.8594ZM18.8203 14.6094H16.9297V12.7188H18.8203V14.6094Z"
fill="black"></path>
<path d="M19.25 16.3281H16.5C16.2627 16.3281 16.0703 16.5205 16.0703 16.7578V19.5078C16.0703 19.7451 16.2627 19.9375 16.5 19.9375H19.25C19.4873 19.9375 19.6797 19.7451 19.6797 19.5078V16.7578C19.6797 16.5205 19.4873 16.3281 19.25 16.3281ZM18.8203 19.0781H16.9297V17.1875H18.8203V19.0781Z"
fill="black"></path>
<path d="M14.667 11.8594H11.917C11.6797 11.8594 11.4873 12.0518 11.4873 12.2891V15.0391C11.4873 15.2763 11.6797 15.4688 11.917 15.4688H14.667C14.9043 15.4688 15.0967 15.2763 15.0967 15.0391V12.2891C15.0967 12.0518 14.9043 11.8594 14.667 11.8594ZM14.2373 14.6094H12.3467V12.7188H14.2373V14.6094Z"
fill="black"></path>
<path d="M10.083 11.8594H7.33301C7.09569 11.8594 6.90332 12.0518 6.90332 12.2891V15.0391C6.90332 15.2763 7.09569 15.4688 7.33301 15.4688H10.083C10.3203 15.4688 10.5127 15.2763 10.5127 15.0391V12.2891C10.5127 12.0518 10.3203 11.8594 10.083 11.8594ZM9.65332 14.6094H7.7627V12.7188H9.65332V14.6094Z"
fill="black"></path>
<path d="M5.5 16.3281H2.75C2.51268 16.3281 2.32031 16.5205 2.32031 16.7578V19.5078C2.32031 19.7451 2.51268 19.9375 2.75 19.9375H5.5C5.73732 19.9375 5.92969 19.7451 5.92969 19.5078V16.7578C5.92969 16.5205 5.73732 16.3281 5.5 16.3281ZM5.07031 19.0781H3.17969V17.1875H5.07031V19.0781Z"
fill="black"></path>
<path d="M14.667 16.3281H11.917C11.6797 16.3281 11.4873 16.5205 11.4873 16.7578V19.5078C11.4873 19.7451 11.6797 19.9375 11.917 19.9375H14.667C14.9043 19.9375 15.0967 19.7451 15.0967 19.5078V16.7578C15.0967 16.5205 14.9043 16.3281 14.667 16.3281ZM14.2373 19.0781H12.3467V17.1875H14.2373V19.0781Z"
fill="black"></path>
<path d="M10.083 16.3281H7.33301C7.09569 16.3281 6.90332 16.5205 6.90332 16.7578V19.5078C6.90332 19.7451 7.09569 19.9375 7.33301 19.9375H10.083C10.3203 19.9375 10.5127 19.7451 10.5127 19.5078V16.7578C10.5127 16.5205 10.3203 16.3281 10.083 16.3281ZM9.65332 19.0781H7.7627V17.1875H9.65332V19.0781Z"
fill="black"></path>
<path d="M5.5 7.39062H2.75C2.51268 7.39062 2.32031 7.583 2.32031 7.82031V10.5703C2.32031 10.8076 2.51268 11 2.75 11H5.5C5.73732 11 5.92969 10.8076 5.92969 10.5703V7.82031C5.92969 7.583 5.73732 7.39062 5.5 7.39062ZM5.07031 10.1406H3.17969V8.25H5.07031V10.1406Z"
fill="black"></path>
<path d="M19.25 7.39062H16.5C16.2627 7.39062 16.0703 7.583 16.0703 7.82031V10.5703C16.0703 10.8076 16.2627 11 16.5 11H19.25C19.4873 11 19.6797 10.8076 19.6797 10.5703V7.82031C19.6797 7.583 19.4873 7.39062 19.25 7.39062ZM18.8203 10.1406H16.9297V8.25H18.8203V10.1406Z"
fill="black"></path>
<path d="M14.667 7.39062H11.917C11.6797 7.39062 11.4873 7.583 11.4873 7.82031V10.5703C11.4873 10.8076 11.6797 11 11.917 11H14.667C14.9043 11 15.0967 10.8076 15.0967 10.5703V7.82031C15.0967 7.583 14.9043 7.39062 14.667 7.39062ZM14.2373 10.1406H12.3467V8.25H14.2373V10.1406Z"
fill="black"></path>
<path d="M10.083 7.39062H7.33301C7.09569 7.39062 6.90332 7.583 6.90332 7.82031V10.5703C6.90332 10.8076 7.09569 11 7.33301 11H10.083C10.3203 11 10.5127 10.8076 10.5127 10.5703V7.82031C10.5127 7.583 10.3203 7.39062 10.083 7.39062ZM9.65332 10.1406H7.7627V8.25H9.65332V10.1406Z"
fill="black"></path>
<path d="M19.9405 5.19621C19.8606 5.11629 19.7497 5.07031 19.6367 5.07031C19.5237 5.07031 19.4129 5.11629 19.3329 5.19621C19.253 5.27613 19.207 5.38699 19.207 5.5C19.207 5.61301 19.253 5.72387 19.3329 5.80379C19.4129 5.88371 19.5237 5.92969 19.6367 5.92969C19.7497 5.92969 19.8606 5.88371 19.9405 5.80379C20.0204 5.72387 20.0664 5.61301 20.0664 5.5C20.0664 5.38699 20.0204 5.27613 19.9405 5.19621Z"
fill="black"></path>
</g>
<defs>
<clipPath id="clip0_961_1304">
<rect width="22" height="22" fill="white"></rect>
</clipPath>
</defs>
</svg>
Vérifier notre calendrier de prix
</button>
{% endif %}
</div>
</div>
{% endif %}
{% endif %}
{% if app.request.get('product') != "appartement" %}
{% if HotelDetail.avis is defined and HotelDetail.avis is not null and HotelDetail.avis|length>0 %}
<div class="detail-block Point-forts list-avis mb-5">
{% if HotelDetail.avisGlobale %}
<div class="mb-5">
<div class="detail-title">
<h2 class="title-left"> {{ "Avis"|trans }}
({{ HotelDetail.avis|length }})</h2>
</div>
<div class="bloc-card">
<div class="row align-items-center">
<div class="col-md-5">
<div class="item-rating mb-3">
<h4>{{ "Estimation globale du séjour"|trans }} </h4>
<h5 class="total-avis">{{ HotelDetail.avisGlobale.global.moyenne_etoiles }}
/ 5.0 </h5>
<div class="globale-bar">
<div class="mark-pourcentage"> {{ HotelDetail.avisGlobale.global.pourcentage }}
%
</div>
<div class="progress">
<div class="progress-bar bg-success" role="progressbar"
style="width: {{ HotelDetail.avisGlobale.global.pourcentage }}%"
aria-valuenow="{{ HotelDetail.avisGlobale.global.pourcentage }}%"
aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div>
<div class="col-md-7">
<div class="item-card-progress mb-3 ">
<div class="item-card-body">
{% for categorie in HotelDetail.avisGlobale.categories %}
<div class="item-review-progress gap-3">
<p class="mark-title">{{ categorie.critere }} </p>
<div class="progress">
<div class="progress-bar bg-success"
role="progressbar"
style="width: {{ categorie.pourcentage }}%"
aria-valuenow="{{ categorie.pourcentage }}%"
aria-valuemin="0"
aria-valuemax="100"></div>
</div>
<p class="mark-pourcentage"> {{ categorie.pourcentage }}
% </p>
</div>
{% endfor %}
</div>
</div>
</div>
</div>
</div>
</div>
{% endif %}
<div class="yelp-category">
{% for avi in HotelDetail.avis %}
<div class="card-review mb-3">
<div class="card h-100">
<div class="card-body p-10">
<div class="d-flex justify-content-between align-items-center details-users-avis">
<div class="d-flex align-item-center">
{% if HotelDetail.avi.linkimg is defined and HotelDetail.avi.linkimg is not null %}
<span class="icon-users"> {{ avi.linkimg }} </span>
{% else %}
<span class="icon-users"> <i
class="fa fa-user"></i> </span>
{% endif %}
<div class="info-review">
<h4 class="users-name"> {{ avi.name }}</h4>
<div class="d-flex align-item-center">
<p class="time-review mb-0"> {{ avi.created.date|date('d-m-Y H:i:s') }} </p>
<p class="mb-0">
{# <span class="badge badge-warning">{{ avi.NumberStars }}</span>#}
<span class="avi-detail">{{ avi.NumberStars }}/5</span>
</p>
</div>
</div>
</div>
<span class="bottom-ratings">
{% for star in 1..avi.NumberStars %}
<span class="fa fa-star"></span>
{% endfor %}
</span>
</div>
{% if avi.commentaire is defined and avi.commentaire is not null %}
<p class="description-review"> {{ avi.commentaire|raw }} </p>
{% endif %}
</div>
</div>
</div>
{% endfor %}
</div>
</div>
{% endif %}
{% endif %}
</div>
</div>
<div class="col-12 col-sm-12 col-md-4 col-lg-4 container-sidebar">
<aside id="sidebar" class="sidebar-white">
{% if configAffichage is defined and configAffichage.HOTEL.DETAILS_BLOC_ALBUMS!=2 %}
{% if HotelDetail.Localization is defined and HotelDetail.Localization.Longitude is not null and HotelDetail.Localization.Latitude %}
<div class="widget localisation">
<div id="maph"></div>
</div>
{% else %}
<div class="widget localisation">
<img src="{{ asset('assets-commun/images/no-location.png') }}" alt="icon">
</div>
{% endif %}
{% endif %}
{% if configAffichage is defined and configAffichage.HOTEL.DETAILS_BLOC_ALBUMS !=3 %}
{% if HotelDetail.TripAdvisor is defined and HotelDetail.TripAdvisor is not null %}
<div id="tripadvisor-detail-hotel" class="trip">
{{ HotelDetail.TripAdvisor|raw }}
</div>
{% endif %}
<div id="vjs-etiquette" class="etiquette-detail-hotel">
<template>
<div v-if="etiquettes !== undefined" class="">
<div class="label-wrap" id="etiquette-hotel-list">
<div class="label-status label" :style="{ backgroundColor:etiquettes.color }"
v-for="etiquette in etiquettes">
<span v-if="etiquette.promotion !== undefined">-${etiquette.promotion}% {{ "jusqu'au"|trans }} ${etiquette.fin}</span>
<span v-else>${etiquette.libelle}</span>
<i
v-if="typeof etiquette.hasCountDown !== 'undefined' && etiquette.hasCountDown"
ref="countdown" :data-time="etiquette.countdownDate.date"></i>
</div>
</div>
</div>
<img v-for="etiquette in etiquettesEmplacement" :src="etiquette.media"
style="max-height: 48px">
</template>
</div>
{% if HotelDetail.hotelsRecommander is defined and HotelDetail.hotelsRecommander is not null and HotelDetail.hotelsRecommander|length>0 %}
<div class="widget widget-recommend" id="hotel-recommandes">
<div class="widget-top">
<h3 class="widget-title"> {{ "Hôtels Recommandés"|trans }} </h3>
</div>
<div class="widget-body">
{% for recommander in HotelDetail.hotelsRecommander %}
<div class="media">
<div class="media-left">
<figure class="item-thumb">
<a class="hover-effect"
href="{{ path('details_hotel',{id:recommander.id,slug:recommander.slug}) }}">
<img src="{{ recommander.photoPrincipal }}" width="100"
height="75" alt="thumb">
</a>
</figure>
</div>
<div class="media-body">
<h3 class="media-heading"><a
href="{{ path('details_hotel',{id:recommander.id,slug:recommander.slug}) }}">{{ recommander.libelle }}</a>
</h3>
<div class="rating">
<span class="bottom-ratings">
{% for star in 1..recommander.getStars %}
<span class="fa fa-star"></span>
{% endfor %}
</span>
</div>
<div class="amenities">
<p><i class="fa fa-map-marker-alt fa-1" aria-hidden="true"
style=" margin-left: 1px;"></i> {{ recommander.ville }}</p>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
{% endif %}
{% if HotelDetail.hotelsequivalent is defined and HotelDetail.hotelsequivalent is not null and HotelDetail.hotelsequivalent|length > 0 %}
<div class="widget widget-recommend" id="hotel-equivalents">
<div class="widget-top">
<h3 class="widget-title"> {{ "Hôtels Equivalents"|trans }} </h3>
</div>
<div class="widget-body">
{% for recommander in HotelDetail.hotelsequivalent %}
<div class="media">
<div class="media-left">
<figure class="item-thumb">
<a class="hover-effect"
href="{{ path('details_hotel',{id:recommander.id,slug:recommander.slug}) }}">
<img src="{{ recommander.photoPrincipal }}" width="100"
height="75" alt="thumb">
</a>
</figure>
</div>
<div class="media-body">
<h3 class="media-heading"><a
href="{{ path('details_hotel',{id:recommander.id,slug:recommander.slug}) }}">{{ recommander.libelle }}</a>
</h3>
<div class="rating">
<span class="bottom-ratings">
{% for star in 1..recommander.getStars %}
<span class="fa fa-star"></span>
{% endfor %}
</span>
</div>
<div class="amenities">
<p><i class="fa fa-map-marker-alt fa-1" aria-hidden="true"
style=" margin-left: 1px;"></i> {{ recommander.ville }}</p>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
{% endif %}
{% endif %}
<div class="widget widget-recommend" hidden id="vjs-recap-result">
<div class="widget-top">
<h3 class="widget-title"> {{ "Récap Reservation"|trans }}</h3>
</div>
<div class="widget-body">
<template v-if="result != null">
<p><strong>checkin</strong> ${ checkin }</p>
<p><strong>checkout</strong> ${ checkout }</p>
<p><strong>occupations</strong> ${ occupations }</p>
<p><strong>nuitée</strong> ${ nuitees } nuitée(s)</p>
{% if resultView == 'pension-room' %}
<div v-for="(chambre,index) in result.Pax">
${ index + 1 } - ${ chambre.Room.Name } en ${ result.Name } ${
chambre.Room.Price.formatMoney() }
<small> {{ deviseSelected().symbole }}</small>
<span v-if="chambre.Room.OnRequest">{{ "Sur demande"|trans }}</span> <span
v-else>{{ "Disponible"|trans }}</span>
<p><strong>Adulte</strong> x${ chambre.Adult }</p>
<p><strong>Enfant</strong>
<template v-if="chambre.Child === undefined"> x0</template>
<template v-else> x${ chambre.Child.length } (${ chambre.Child.join(', ') }
ans)
</template>
</p>
<div v-for="(Views,index) in chambre.Room.View"
v-if="Views.selected || Views.Required">
${Views.Name } ${parseFloat(Views.Price).formatMoney() }
<small> {{ deviseSelected().symbole }}</small>
</div>
<div v-for="(Supplements,index) in chambre.Room.Supplement"
v-if="Supplements.selected || Supplements.Required">
${Supplements.Name } ${parseFloat(Supplements.Price).formatMoney()
} <small> {{ deviseSelected().symbole }}</small>
</div>
</div>
{% endif %}
{% if resultView == 'room-pension' %}
<div v-for="(chambre,index) in result">
${ index + 1 } - ${ chambre.Room.Names } en ${ chambre.Room.Name } ${
chambre.Room.Price.formatMoney() }
<small> {{ deviseSelected().symbole }}</small>
<span v-if="chambre.Room.OnRequest">{{ "Sur demande"|trans }}</span> <span
v-else>{{ "Disponible"|trans }}</span>
<p><strong>Adulte</strong> x${ chambre.Pax.Adult }</p>
<p><strong>Enfant</strong>
<template v-if="chambre.Pax.Child === undefined"> x0</template>
<template v-else> x${ chambre.Pax.Child.length } (${
chambre.Pax.Child.join(', ') } ans)
</template>
</p>
<div v-for="(Views,index) in chambre.Room.View"
v-if="Views.selected || Views.Required">
${Views.Name } ${parseFloat(Views.Price).formatMoney() }
<small> {{ deviseSelected().symbole }}</small>
</div>
<div v-for="(Supplements,index) in chambre.Room.Supplement"
v-if="Supplements.selected || Supplements.Required">
${Supplements.Name } ${ parseFloat(Supplements.Price).formatMoney() }
<small> {{ deviseSelected().symbole }}</small>
</div>
</div>
{% endif %}
<span v-for="(stopSale , index) in result.StopSales" :key="idHotel + '-' + index">${ stopSale }<br></span>
<span v-if="result.MinStay">{{ "Min Stay"|trans }} ${ result.MinStay } {{ "nuitées requises"|trans }}<br></span>
<span v-if="result.retrocession > 0">${result.retrocession } {{ "jours rétrocession"|trans }}<br></span>
<span v-if="result.chambreSurDemande">{{ "Chambre sur demande"|trans }}<br></span>
<p><strong>Total Réservation</strong> ${result.Total.formatMoney()}
<small> {{ deviseSelected().symbole }}</small></p>
{% if configAffichage.GENERALE.COUPON_REDUCTION == 'oui' %}
<input onchange="window.code_coupon=$(this).val()"
placeholder="code coupon de réduction">
{% endif %}
<button type="button" v-if="result.btnReserver" @click="tarifDispo">Réserver</button>
</template>
</div>
</div>
</aside>
</div>
</div>
{% if configAffichage is defined and configAffichage.HOTEL.DETAILS_BLOC_ALBUMS ==3 %}
<div class="row">
{% if HotelDetail.hotelsRecommander is defined and HotelDetail.hotelsRecommander is not null and HotelDetail.hotelsRecommander|length>0 %}
<div class="widget widget-recommend" id="hotel-recommandes">
<div class="widget-top">
<h3 class="widget-title"> {{ "Hôtels Recommandés"|trans }} </h3>
</div>
<div class="widget-body">
<div class="hotels-recommande carousel slide-animated">
{% for recommander in HotelDetail.hotelsRecommander %}
<div class="media">
<div class="media-left">
<figure class="item-thumb">
<a class="hover-effect"
href="{{ path('details_hotel',{id:recommander.id,slug:recommander.slug}) }}">
<img src="{{ recommander.photoPrincipal }}" width="100"
height="75" alt="thumb">
</a>
</figure>
</div>
<div class="media-body">
<h3 class="media-heading"><a
href="{{ path('details_hotel',{id:recommander.id,slug:recommander.slug}) }}">{{ recommander.libelle }}</a>
</h3>
<div class="rating">
<span class="bottom-ratings">
{% for star in 1..recommander.getStars %}
<span class="fa fa-star"></span>
{% endfor %}
</span>
</div>
<div class="amenities">
<p><i class="fa fa-map-marker-alt fa-1" aria-hidden="true"
style=" margin-left: 1px;"></i> {{ recommander.ville }}</p>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</div>
{% endif %}
{% if HotelDetail.hotelsequivalent is defined and HotelDetail.hotelsequivalent is not null and HotelDetail.hotelsequivalent|length > 0 %}
<div class="widget widget-recommend" id="hotel-equivalents">
<div class="widget-top">
<h3 class="widget-title"> {{ "Hôtels Equivalents"|trans }} </h3>
</div>
<div class="widget-body">
<div class="hotels-recommande carousel slide-animated">
{% for recommander in HotelDetail.hotelsequivalent %}
<div class="media">
<div class="media-left">
<figure class="item-thumb">
<a class="hover-effect"
href="{{ path('details_hotel',{id:recommander.id,slug:recommander.slug}) }}">
<img src="{{ recommander.photoPrincipal }}" width="100"
height="75" alt="thumb">
</a>
</figure>
</div>
<div class="media-body">
<h3 class="media-heading"><a
href="{{ path('details_hotel',{id:recommander.id,slug:recommander.slug}) }}">{{ recommander.libelle }}</a>
</h3>
<div class="rating">
<span class="bottom-ratings">
{% for star in 1..recommander.getStars %}
<span class="fa fa-star"></span>
{% endfor %}
</span>
</div>
<div class="amenities">
<p><i class="fa fa-map-marker-alt fa-1" aria-hidden="true"
style=" margin-left: 1px;"></i> {{ recommander.ville }}</p>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</div>
{% endif %}
</div>
{% endif %}
</div>
</section>
<!--end detail content-->
<div id="lightbox-popup-main" class="fade">
<div class="lightbox-popup">
<div class="popup-inner">
<div class="lightbox-left">
<div class="lightbox-header">
<div class="header-actions">
<ul class="actions">
<li class="lightbox-close">
<span><i class="fa fa-close"></i></span>
</li>
</ul>
</div>
</div>
<div class="gallery-area">
<div class="slider-placeholder">
<div class="loader-inner">
<span class="fa fa-spin fa-spinner"></span> {{ "Loading Slider..."|trans }}
</div>
</div>
<div class="expand-icon lightbox-expand hidden-xs"></div>
<div class="gallery-inner">
<div class="lightbox-slide slide-animated">
{% if HotelDetail.Album is defined and HotelDetail.Album is not null %}
{% for photo in HotelDetail.Album %}
<div>
<img src="{{ photo.Url }}" alt="Lightbox Slider" width="1170" height="525">
</div>
{% endfor %}
{% endif %}
</div>
</div>
<div class="lightbox-slide-nav visible-xs">
<button class="lightbox-arrow-left lightbox-arrow"><i class="fa fa-angle-left"></i></button>
<button class="lightbox-arrow-right lightbox-arrow"><i class="fa fa-angle-right"></i>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
{#modal #}
<div class="modal" id="calendrier" tabindex="-1" role="dialog">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header bg-white padding-10">
<p class="mb-0 text-calendrier"> Tarif et disponibilité pour la date de votre séjour </p>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<i class="fa fa-close text-dark"></i>
</button>
</div>
<div class="modal-body no-padding">
<div id="main">
<div id="hotel-main-content">
{% set lblMonth = {
'01': 'Janvier',
'02': 'Février',
'03': 'Mars',
'04': 'Avril',
'05': 'Mai',
'06': 'Juin',
'07': 'Juillet',
'08': 'Août',
'09': 'Septembre',
'10': 'Octobre',
'11': 'Novembre',
'12': 'Décembre'
} %}
<div id="calendar-tab" class="active in bg-white">
<div class="row">
<div class="col-sm-12 col-md-12 no-float no-padding">
<label>Sélectionnez un mois</label>
{% set month = 'now' %}
<select class="form-control select-chambre-height"
id="select-month">
{% for i in 1..3 %}
<option data-href="{{ path('calendrie_hotel',{'hotel':id}) }}"
value="{{ month|date('Y-m-d') }}"> {{ lblMonth[month|date('m')] }} {{ month|date('Y') }}</option>
{% set month = month|date_modify("+1 month") %}
{% endfor %}
</select>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<div class="calendar">
<table>
<thead>
<tr>
<td>dimanche</td>
<td>lundi</td>
<td>mardi</td>
<td>mercredi</td>
<td>jeudi</td>
<td>vendredi</td>
<td>samedi</td>
</tr>
</thead>
<tbody>
<tr>
<td class="surdemand"><a href="#">1</a></td>
<td class=" surdemand">
<a href="#">2</a></td>
<td class=" surdemand"><a href="#">3</a></td>
<td class=" surdemand"><a href="#">4</a></td>
<td class=" surdemand"><a href="#">5</a></td>
<td class=" surdemand"><a href="#">6</a></td>
<td class=" surdemand"><a href="#">7</a></td>
</tr>
<tr>
<td class=" surdemand"><a href="#">8</a></td>
<td class=" surdemand"><a href="#">9</a></td>
<td class=" surdemand"><a href="#">10</a></td>
<td class=" surdemand"><a href="#">11</a></td>
<td class=" surdemand"><a href="#">12</a></td>
<td class=" surdemand"><a href="#">13</a></td>
<td class=" surdemand"><a href="#">14</a></td>
</tr>
<tr>
<td class=" surdemand"><a href="#">15</a></td>
<td class=" surdemand"><a href="#">16</a></td>
<td class=" surdemand"><a href="#">17</a></td>
<td class=" surdemand"><a href="#">18</a></td>
<td class=" surdemand"><a href="#">19</a></td>
<td class=" surdemand"><a href="#">20</a></td>
<td class=" surdemand"><a href="#">21</a></td>
</tr>
<tr>
<td class=" surdemand"><a href="#">22</a></td>
<td class=" surdemand"><a href="#">23</a></td>
<td class=" surdemand"><a href="#">24</a></td>
<td class=" surdemand"><a href="#">25</a></td>
<td class=" surdemand"><a href="#">26</a></td>
<td class=" surdemand"><a href="#">27</a></td>
<td class=" surdemand"><a href="#">28</a></td>
</tr>
<tr>
<td class=" surdemand"><a href="#">29</a></td>
<td class=" surdemand"><a href="#">30</a></td>
<td class=" surdemand"><a href="#">31</a></td>
</tr>
</tbody>
</table>
</div>
<div class="calendar-legend">
<label class="available">Disponible</label>
<label class="unavailable">Non disponible</label>
<label class="surdemand">Sur Demande</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>