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

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

{% block body %}
	<!-- breadcrumb-area -->
	<section class="breadcrumb-area d-flex align-items-center" style="background-image:url({{ asset('assets/custom/img/bg/footer-bg.png') }})">
		<div class="container">
			<div class="row align-items-center">
				<div class="col-xl-12 col-lg-12">
					<div class="breadcrumb-wrap text-center">
						<div class="breadcrumb-title">
							<h2>Nous Contacter</h2>
							<div class="breadcrumb-wrap">

								<nav aria-label="breadcrumb">
									<ol class="breadcrumb">
										<li class="breadcrumb-item">
											<a href="{{ path('default')}}">Accueil</a>
										</li>
										<li class="breadcrumb-item active" aria-current="page">contact</li>
									</ol>
								</nav>
							</div>
						</div>
					</div>
				</div>

			</div>
		</div>
	</section>
	<!-- contact-area -->
	<section id="contact" class="contact-area after-none contact-bg pt-120 pb-120 p-relative fix">
		<div class="container">

			<div class="row justify-content-center align-items-center">

				<div class="col-lg-4 order-1">

					<div class="contact-info">
						<div class="single-cta pb-30 mb-30 wow fadeInUp animated" data-animation="fadeInDown animated" data-delay=".2s">
							<div class="f-cta-icon">
								<i class="far fa-map"></i>
							</div>
							<h5>Adresse</h5>
							<p>
								{{ app_address }}</p>
						</div>
						<div class="single-cta pb-30 mb-30 wow fadeInUp animated" data-animation="fadeInDown animated" data-delay=".2s">
							<div class="f-cta-icon">
								<i class="far fa-clock"></i>
							</div>
							<h5>Telephone</h5>
							<p>{{ app_phone_number }}</p>
						</div>
						<div class="single-cta wow fadeInUp animated" data-animation="fadeInDown animated" data-delay=".2s">
							<div class="f-cta-icon">
								<i class="far fa-envelope-open"></i>
							</div>
							<h5>E-mail</h5>
							<p>
								<a href="#">{{ app_email }}</a>
							</p>
						</div>
					</div>
				</div>
				<div class="col-lg-8 order-2">
					<div class="contact-bg02">
						<div class="section-title center-align mb-40 text-center wow fadeInDown animated" data-animation="fadeInDown" data-delay=".4s">
							<h2>
								Entrer en contact
							</h2>
						</div>
						{{ form_start(form, {'attr': {'class': 'contact-form-style'}}) }}
						<div class="row">
							<div class="col-lg-6 col-md-6">
								<div class="contact-field p-relative c-name mb-20">
									{{ form_widget(form.name, {'attr': {'class': '', 'placeholder': 'Nom*'}}) }}
									{{ form_errors(form.name) }}
								</div>
							</div>
							<div class="col-lg-6 col-md-6">
								<div class="contact-field p-relative c-subject mb-20">
									{{ form_widget(form.email, {'attr': {'class': '', 'placeholder': 'Email*'}}) }}
									{{ form_errors(form.email) }}
								</div>
							</div>
							<div class="col-lg-6 col-md-6">
								<div class="contact-field p-relative c-name mb-20">
									{{ form_widget(form.subject, {'attr': {'class': '', 'placeholder': 'Objet*'}}) }}
									{{ form_errors(form.subject) }}
								</div>
							</div>
							<div class="col-lg-6 col-md-6">
								<div class="contact-field p-relative c-name mb-20">
									{{ form_widget(form.message, {'attr': {'class': '', 'placeholder': 'Message*'}}) }}
									{{ form_errors(form.message) }}
									<button class="btn btn-primary btn-hover-dark mt-4" data-aos="fade-up" data-aos-delay="200" type="submit">ENVOYER</button>
								</div>
							</div>
						</div>
						{{ form_end(form) }}
					</div>

				</div>
			</div>

		</div>

	</section>
	<!-- contact-area-end -->
	<!-- newslater-area -->
	<section class="newslater-area p-relative pt-120 pb-120" style="background-color: #f7f5f1;">
		<div class="animations-01"><img src="img/bg/an-img-07.png" alt="contact-bg-an-05"></div>
		<div class="container">
			<div class="row justify-content-center align-items-center text-center">
				<div class="col-xl-9 col-lg-9">
					<div class="section-title center-align mb-40 text-center wow fadeInDown animated" data-animation="fadeInDown" data-delay=".4s">
						<h5>Bulletin</h5>
						<h2>
							Obtenir les meilleures offres sur l'hotel
						</h2>
						<p>Avec l'abonnement, profitez de vos hotels preferes sans avoir a vous soucier</p>
					</div>
					<form name="ajax-form" id="contact-form4" action="#" method="post" class="contact-form newslater">
						<div class="form-group">
							<input class="form-control" id="email3" name="email" type="email" placeholder="Votre Adresse Email" value="" required="">
							<button type="submit" class="btn btn-custom" id="send2">Souscrire maintenant</button>
						</div>
						<!-- /Form-email -->
					</form>
				</div>

			</div>

		</div>
	</section>
	<!-- newslater-aread-end -->

	
{% endblock %}