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

{% block stylesheets %}
	<link rel="stylesheet" href="{{ ('css/about.css') }}">
	<meta
	name="viewport" content="width=device-width, initial-scale=1">

	<!-- SITE TITTLE -->
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/all.min.css"/>

	<link rel="stylesheet" href="../assets/css/maicons.css">


	<link rel="stylesheet" href="../assets/css/bootstrap.css">


	<link rel="stylesheet" href="../assets/vendor/animate/animate.css">

	<link rel="stylesheet" href="../assets/vendor/owl-carousel/css/owl.carousel.css">

	<link rel="stylesheet" href="../assets/css/theme.css">

	<link href="css/style.css" rel="stylesheet">


{% endblock %}
{% block title %}À propos
{% endblock %}
{% block body %}


	<section>
		<div>
			<div class="row">
				<div class="col-md-12">
				<!-- NAVIGATION -->
					<nav class="navbar navbar-expand-lg  navigation">
						<a class="navbar-brand ml-3" href="{{ path('app_home') }}">
							<strong>🧿Maman-Julienne</strong>
						</a>
						<p href="javascript:void(0);" class="icon mr-5" onclick="myFunction()">
							<i class="fa fa-bars"></i>
						</p>
						
						<div class="navbar-collapse" id="myLinks">
							<ul class="navbar-nav ml-auto main-nav pl-4">
								<li class="nav-item">
									<a class="nav-link active" href="{{ path('app_home') }}">Accueil</a>
								</li>
								<li class="nav-item">
									<a class="nav-link" href="{{ path('manual') }}">Mode emploi</a>
								</li>
								<li class="nav-item">
									<a class="nav-link" href="{{ path('about') }}">À propos</a>
								</li>
								{% if app.user %}
									
									<li class="nav-item dropdown dropdown-slide pl-4">
										<a class="dropdown-username text-sm mr-1" href="{{ path('users', {slug: app.user.slug}) }}">
											{{app.user.firstname|title }}
											{{ app.user.name|title }}
										</a>
										<!-- Dropdown list -->
										<div class="dropdown-menu dropdown-menu">
											<a class="dropdown-item" href="{{ path('users', {slug: app.user.slug}) }}">
												Profil</a>
											<a class="dropdown-item" href="{{ path('app_logout')}}">
												Se déconnecter</a>
										</div>
									</li>
									<li class="nav-item mx-1">
										<!-- Notifications -->
										{{ include('partials/notifications/_notification_sidebar.html.twig') }}
										<!-- Notifications -->
									</li>
									
								{% else %}
																		
									<li class="nav-item ml-4">
										<a class="nav-link p-0 mx-2 text-sm" href="{{ path('app_login')}}">
										<i class="far fa-user fa-lg mr-2"></i>Se connecter
										</a>
									</li>
									{#<li class="nav-item">
										<a class="nav-link p-0 mx-2 text-sm" href="{{ path('app_register') }}">S'inscrire</a>
									</li>		
									#}								
									
								{% endif %}
							</ul>
							<ul class="navbar-nav ml-auto pl-4">
								
							</ul>
						</div>
					</nav>
					<!-- /Navigation -->
				</div>
			</div>
		</div>
	</section>

	<!--- Notification toast -->
	<div class="push-notification-toast"style="position: absolute; top: 120px; right: 10px; width: max-content">
		{{ include ('partials/notifications/_notification_toast.html.twig') }}
	</div>
	<!--- Notification toast -->
	
	<div class="container">
		<!-- Contenu "about" -->
		<div class='blue-column'>
			<div class="col-lg-6 py-3">
				<h2 class="title-section mt-10">
					"Maman-Julienne.com"
					<br/>
					est une plateforme réseau pour vendre, acheter ou louer des biens et découvrir des services.<br/></h2>
				<div class="divider"></div>
			</div>
			<div class="row">
				<div class="col-lg-4">
					<div class="card-service wow fadeInUp">
						<div class="body">
							<h3 class="text-secondary">Vendre</h3>
							<img class="body img-fluid img rounded" src="../images/img/vendre.webp"/>
						</div>
					</div>
				</div>
				<div class="col-lg-4">
					<div class="card-service wow fadeInUp">
						<div class="body">
							<h3 class="text-secondary">Acheter</h3>
							<img class="body img-fluid img rounded" src="../images/img/acheter.webp"/>
						</div>
					</div>
				</div>
				<div class="col-lg-4">
					<div class="card-service wow fadeInUp">
						<div class="body">
							<h3 class="text-secondary">Louer</h3>
							<img class="body img-fluid img rounded" src="../images/img/louer.webp"/>
						</div>
					</div>
				</div>

			</div>
		</div>
		<div class="page-section">
			<div class="container">
				<div class="row align-items-center om-block">
					<div class="col-lg-6">
						<h2 class="title-section">Notre mission</h2>
						<div class="divider"></div>

						<p>La mission de Maman-julienne est d'offrir à chaque utilisateur la possibilité de découvrir ou de créer des offres de biens ou de services, permettant à l'utilisateur de découvrir ou redécouvrir des opportunités existantes dans leur pays ou leur région, leur ville et leur quartier<br/>
							ce qui sim grandement les utilisateurs a concrétiser leurs projets d’achat, de vente ou de location en toute objectivité.</p>
						<p>Toutes les offres bénéficieront d'une visibilité optimale, afin de permettre aux differents utilisateurs vendeur comme acheteur de profiter d'une expérience simple et efficace.</p>
					</div>
					<div class="col-lg-6 py-3">
						<div class="img-fluid-om">
							<img class="w-150 rounded" src="../assets/img/about_frame.webp" alt="">
						</div>
					</div>
				</div>


				<div class="row align-items-center ot-block">
					<div class="col-lg-6 py-3">
						<div class="w-resp">
							<h2 class="">L'équipe</h2>
							<div class="divider"></div>
						</div>
						<div class="img-fluid-ot">
							<img class="rounded" src="../assets/img/banner_image.webp" alt="">
						</div>
					</div>

					<div class="col-lg-6 py-3 mt-4">
						<div>
							<div class="w-resp-block">
								<h2 class="title-section">L'équipe</h2>
								<div class="divider"></div>
							</div>
							<p class="h-teams">
								Notre équipe est composée de membres, dynamique et bien au fait des enjeux africains.
							</p>

							<p>
								<strong>L'idée de départ ?</strong>
								Réguler au mieux, le flux d'information sur le continent et offrir la possibilité aux Africains de connaitre les opportunités présentes sur leur territoire.</p>
							<p>Baignant dans les nouvelles technologies l'idée d'une plateforme facilitant cela nous est venue naturellement.</p>

							<p>
								Aujourd'hui, et afin de progresser dans de bonnes conditions, innovation, respect, responsabilité et tolérance sont les maîtres mots de l'équipe comme de la plateforme.</p>
						</div>
					</div>
				</div>
				<div
					id="feedback" class="mb-5">
					<!-- .page-section -->
					<div class="container">
						<div class="text-center wow fadeInUp">
							<h2 class="title-section">Création de compte et souscription</h2>
							<div class="divider mx-auto"></div>
						</div>
						<div class="">
							<div class="container h-100">
								<div class="row align-items-center h-100">
									<div class="col-lg-6 py-3 wow fadeInUp">
										<p class="text mb-5">L'inscription a Maman-Julienne donne automatiquement accès à la totalité des services proposés, lors de cette dernière une souscription mensuelle de 10,000 FCFA est necessaire.</p>
										<p>Nous sommes tout à fait conscients de la somme que cela peut représenter pour certaines personnes.</p>
										<div>

											<div class="faq-box">

												<div class="faqQ" onclick="myFunctionT()">
													<p>Que permet la souscription des utilisateurs ?
													</p>
												</div>
												<div class="faqA" id="myDIVT">
													<ul>
														<li>
															<p>- Une prise en change plus qualitatif en matière de service et support client.</p>
														</li>

														<li>
															<p>- Abus ou autre non-respect du règlement de la plateforme signalé ou non seront vigoureusement traqués vous laissant le loisir de profiter d'une plateforme avec des utilisateurs honnêtes intègres et volontaires.</p>
														</li>

														<li>
															<p>- Des fonctionnalités supplémentaires correspondant au mieux au besoin utilisateur seront aussi examinées de façon plus sereine et plus professionnelle.</p>
														</li>
														<li>
															<p>- Vos informations personnées ne sont pas monétisées (intentionnellement vendu à un tiers) ils ne sont utilisés que sur la plateforme.
															</p>
														</li>
													</ul>
												</div>
											</div>
											{% if app.user %}
												<a href="{{ path('app_home')}}" class="sign-btn-about">Déposer une offre ?</a>
											{% else %}
												<a href="{{ path('app_login')}}" class="sign-btn-about">S'incrire ?</a>
											{% endif %}
										</div>
									</div>


									<div class="col-lg-6 py-3 wow zoomIn">
										<div class="img-place">
											<img class="rounded" src="../images/illustrations/design/9.svg" alt="">
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>


			</div>
		</div><!-- Container End --></section>
</div></div></div></div>{% endblock %}{% block javascripts %}<script>function myFunction() {
var x = document.getElementById("myLinks");
if (x.style.display === "block") {
x.style.display = "none";
} else {
x.style.display = "block";
}
}

// Hide and show
function myFunctionT() {
var x = document.getElementById("myDIVT");
if (x.style.display === "block") {
x.style.display = "none";
} else {
x.style.display = "block";
}
}</script>{% endblock %}