@extends('templates.default.layouts.default')

@section('content')

	{{-- <div class="faq-step1">
		<div class="section1-faq" background-image:"{{ asset('uploads/banner-faq.jpg') }}">
			<div class="inner-form">
				<form class="form-faq">
					<input type="search" placeholder="Recherche" autocomplete="off" aria-label="Recherche">
				</form>
			</div>
		</div>
		<div class="section2-faq">
			<div class="container">
				<div class="list">
					<div class="wrap-question">
						<a href="#">
							<h4 class="h4">
			                    CARRIERES
			                </h4>
							<p class="not-empty">Vous souhaitez offrir Le Petit Ballon ? Carte cadeau, abonnement cadeau, toutes les infos ici</p>
						</a>
					</div>
					<div class="wrap-question">
						<a href="#">
							<h4 class="h4">
			                    CARRIERES
			                </h4>
							<p class="empty"></p>
						</a>
					</div>
					<div class="wrap-question">
						<a href="#">
							<h4 class="h4">
			                    CARRIERES
			                </h4>
							<p class="not-empty">Vous souhaitez offrir Le Petit Ballon ? Carte cadeau, abonnement cadeau, toutes les infos ici</p>
						</a>
					</div>
					<div class="wrap-question">
						<a href="#">
							<h4 class="h4">
			                    CARRIERES
			                </h4>
							<p class="not-empty">Vous souhaitez offrir Le Petit Ballon ?</p>
						</a>
					</div>
					<div class="wrap-question">
						<a href="#">
							<h4 class="h4">
			                    CARRIERES
			                </h4>
							<p class="not-empty">Vous souhaitez offrir Le Petit Ballon ? Carte cadeau, abonnement cadeau, toutes les infos ici</p>
						</a>
					</div>
				</div>
			</div>
		</div>
		<div class="section3-faq">
			<div class="container">
				<div class="wrap">
					<h3 class="h3">Articles a la une</h3>
					<ul class="list-articles">
			            <li class="item-article">
			                <a href="#">
			                  Les livraisons du Père Noël
			                </a>
			            </li>

			            <li class="item-article">
			                <a href="#">
			                  Comment suivre ma livraison ? Comment suivre ma livraison ?
			                </a>
			            </li>
						<li class="item-article">
						   <a href="#">
							 Comment suivre ma livraison ?</br>Comment suivre ma livraison ?
						   </a>
					   </li>
					   <li class="item-article">
						   <a href="#">
							 Comment suivre ma livraison ?
						   </a>
					   </li>
					   <li class="item-article">
						   <a href="#">
							 Comment suivre ma livraison ?
						   </a>
					   </li>
			        </ul>
				</div>
			</div>
		</div>
	</div> --}}



	<div class="faq-step2">
		<div class="container">
			<div class="section1-faq-step2">
				<div class="bar-top">
					<ol class="breadcrumbs">
					    <li>
					        <a href="#">Le Petit Ballon Centre d'Aide</a>
					    </li>
					    <li>
					        <a href="#">LIVRAISON</a>
					    </li>
					</ol>
					<form class="form" method="get">
						<input type="search" placeholder="Recherche" aria-label="Recherche">
					</form>
				</div>
				<div class="wrap">
					<div class="title">
						<h1 class="h1">LIVRAISON</h1>
						<a href="#" class="login-btn transition">Login</a>
						<p class="title-description">Toutes les réponses à vos questions sur la livraison.</p>
					</div>
					<ul class="list-articles">
						<li class="promoted"><a href="#">Les livraisons du Père Noël</a></li>
						<li class="promoted"><a href="#">Les livraisons du Père Noël</a></li>
						<li><a href="#">Les livraisons du Père Noël</a></li>
						<li><a href="#">Les livraisons du Père Noël Les livraisons du Père Noël Les livraisons du Père Noël?</a></li>
						<li class="promoted"><a href="#">Les livraisons du Père Noël</a></li>
						<li><a href="#">Les livraisons du Père Noël Les livraisons du Père Noël</a></li>
					</ul>
				</div>
			</div>
		</div>
	</div>



	<div class="faq-step3" style="display: none;">
		<div class="container">
			<div class="section1-faq-step3">
				<div class="bar-top">
					<ol class="breadcrumbs">
					    <li>
					        <a href="#">Le Petit Ballon Centre d'Aide</a>
					    </li>
					    <li>
					        <a href="#">LIVRAISON</a>
					    </li>
					</ol>
					<form class="form" method="get">
						<input type="search" placeholder="Recherche" aria-label="Recherche">
					</form>
				</div>
			</div>
			<div class="section2-faq-step3">
				<div class="row">
					<div class="col-md-12 col-lg-2">
						<div class="left">
							<h3 class="h3 toggler-faq closed">Articles dans cette section</h3>
							<ul class="collapsible-faq">
								<li class="active"><a href="#">Les livraisons du Père Noël </a></li>
								<li><a href="#">Les livraisons du Père Noël Les livraisons du Père Noël </a></li>
								<li><a href="#">Les livraisons du Père Noël Les livraisons du Père Noël Les livraisons du Père Noël </a></li>
								<li><a href="#">Les livraisons du Père Noël </a></li>
							</ul>
						</div>
					</div>
					<div class="col-md-12 col-lg-10">
						<div class="right">
							<div class="article-head">
								<h1 class="h1">Les livraisons du Père Noël</h1>
								<div class="subtitle">
									<div class="author">
										<div class="avatar">
											<i class="fa fa-user"></i>
										</div>
										<div class="author-details">
											<a href="#" class="name">Paul</a>
											<p>
												<span class="period">1 month ago</span>
												<span class="update">Update</span>
											</p>
										</div>
									</div>
									<a href="#" class="login-btn transition">Login</a>
									<div class="clearfix"></div>
								</div>
							</div>
							<div class="article">
								<div class="article-img">
									<img src="{{ asset('uploads/pic-faq3.jpg') }}"/>
								</div>
								<p>During this Christmas period, we guarantee <span class="underline">delivery to your home before 12/24</span> for any order placed <span class="bold">BEFORE 12/17 at midnight</span>.</p>
								<p>During this Christmas period, we guarantee <span class="underline">delivery to your home before 12/24</span> for any order placed <span class="bold">BEFORE 12/17 at midnight</span>.</p>
								<p>During this Christmas period, we guarantee <span class="underline">delivery to your home before 12/24</span> for any order placed <span class="bold">BEFORE 12/17 at midnight</span>.</p>
								<p><a href="#" class="url">https://www.lepetitballon.com/subscription/give/presentation/</a></p>
								<p></p>
								<p>As a reminder, delivery is free from 6 bottles or € 60 purchase.</p>
								<p></p>
								<div class="article-img">
									<img src="{{ asset('uploads/pic2-faq3.png') }}"/>
								</div>
								<div class="footer-article">
									<div class="article-share">
										<ul>
											<li><a href="#"><i class="fa fa-facebook"></i></a></li>
											<li><a href="#"><i class="fa fa-twitter"></i></a></li>
											<li><a href="#"><i class="fa fa-linkedin"></i></a></li>
										</ul>
									</div>
									<div class="article-votes">
										<p class="quest">Was this article helpful?</p>
										<ul>
											<li><a href="#" class="vote-btn transition"><i class="fa fa-check"></i> YES</a></li>
											<li><a href="#" class="vote-btn transition"><i class="fa fa-times"></i> NO</a></li>
										</ul>
										<p class="helpful">Users who found this useful: 0 of 0</p>
									</div>
									<div class="article-otherquest">
										<span>You have more questions ? <a href="#">Send inquiry</a></span>
									</div>
								</div>
								<div class="similar-articles">
									<div class="row">
										<div class="col-md-6 col-lg-6">
											<div class="recently">
												<h3 class="h3">Recently viewed articles</h3>
												<ul>
													<li><a href="#">Santa's Delivery</a></li>
													<li><a href="#">Trouble! I received a broken / corked bottle</a></li>
													<li><a href="#">Trouble! I received a broken / corked bottle</a></li>
													<li><a href="#">Santa's Delivery</a></li>
													<li><a href="#">Trouble! I received a broken / corked bottle</a></li>
													<li><a href="#">Trouble! I received a broken / corked bottle</a></li>
												</ul>
											</div>
										</div>
										<div class="col-md-6 col-lg-6">
											<h3 class="h3">Related articles</h3>
											<ul>
												<li><a href="#">Santa's Delivery</a></li>
												<li><a href="#">Trouble! I received a broken / corked bottle</a></li>
												<li><a href="#">Trouble! I received a broken / corked bottle</a></li>
												<li><a href="#">Santa's Delivery</a></li>
												<li><a href="#">Trouble! I received a broken / corked bottle</a></li>
												<li><a href="#">Trouble! I received a broken / corked bottle</a></li>
												<li><a href="#">Trouble! I received a broken / corked bottle</a></li>
												<li><a href="#">Trouble! I received a broken / corked bottle</a></li>
											</ul>
										</div>
									</div>
								</div>
								<div class="comments">
									<div class="header-com">
										<h3 class="h3">comments</h3>
										<p class="callout">0 comments</p>
									</div>
									<p class="callout">You must <a href="#">log in</a> to leave a comment.</p>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>

@endsection

{{-- Page script --}}
@section('script')
	<script type="text/javascript">

    </script>
@endsection