@extends('base')

@section('title', 'A propos')

@section('content')


            <!-- Page Header Start -->
            <div class="page-header">
                <div class="container">
                    <div class="row">
                        <div class="col-12">
                            <h2>À Propos de Nous</h2>
                        </div>
                        <div class="col-12">
                            <a href="">Accueil</a>
                            <a href="">À Propos</a>
                        </div>
                    </div>
                </div>
            </div>
            <!-- Page Header End -->


            <!-- About Start -->
            <div class="about">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-5 col-md-6">
                            <div class="about-img">
                                <img src="{{asset('assets/img/about.jpg')}}" alt="Image de notre entreprise">
                            </div>
                        </div>
                        <div class="col-lg-7 col-md-6">
                            <div class="about-text">
                                <h2><span>10</span> Ans d'Expérience</h2>
                                <p>
                                    Forts de 10 ans d'expérience, nous sommes spécialisés dans le nettoyage et l'entretien de locaux professionnels et résidentiels. Notre équipe est formée aux meilleures techniques pour garantir un service de qualité.
                                </p>
                                <p>
                                    Notre engagement envers la satisfaction client et notre souci du détail nous ont permis de bâtir une solide réputation. Nous nous adaptons à vos besoins spécifiques pour fournir un service personnalisé et efficace.
                                </p>
                                {{-- <a class="btn" href="">En Savoir Plus</a> --}}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- About End -->


            <!-- Story Start -->
            <div class="story">
                <div class="container">
                    <div class="section-header">
                        <p>Histoire de l'Entreprise</p>
                        <h2>Découvrez Notre Parcours</h2>
                    </div>
                    <div class="row">
                        <div class="col-lg-12">
                            <div class="story-container">
                                <div class="story-end">
                                    <p>Now</p>
                                </div>
                                <div class="story-continue">

                                    <div class="row story-right">
                                        <div class="col-md-6">
                                            <p class="story-date">
                                                01 Dec 2020
                                            </p>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="story-box">
                                                <div class="story-text">
                                                    <h3>Lorem ipsum dolor</h3>
                                                    <p>
                                                        Lorem ipsum dolor sit amet elit. Proin euismod nibh in convallis. Nam vitae posuere tortor, et imperdiet nunc. Praesent nisl nulla, fringilla eu ornare, dignissim vitae ipsum.
                                                    </p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row story-left">
                                        <div class="col-md-6 d-md-none d-block">
                                            <p class="story-date">
                                                01 Jun 2020
                                            </p>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="story-box">
                                                <div class="story-text">
                                                    <h3>Lorem ipsum dolor</h3>
                                                    <p>
                                                        Lorem ipsum dolor sit amet elit. Proin euismod nibh in convallis. Nam vitae posuere tortor, et imperdiet nunc. Praesent nisl nulla, fringilla eu ornare, dignissim vitae ipsum.
                                                    </p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6 d-md-block d-none">
                                            <p class="story-date">
                                                01 Jun 2020
                                            </p>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="col-12">
                                            <div class="story-year">
                                                <p>2020</p>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row story-right">
                                        <div class="col-md-6">
                                            <p class="story-date">
                                                01 Dec 2019
                                            </p>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="story-box">
                                                <div class="story-text">
                                                    <h3>Lorem ipsum dolor</h3>
                                                    <p>
                                                        Lorem ipsum dolor sit amet elit. Proin euismod nibh in convallis. Nam vitae posuere tortor, et imperdiet nunc. Praesent nisl nulla, fringilla eu ornare, dignissim vitae ipsum.
                                                    </p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row story-left">
                                        <div class="col-md-6 d-md-none d-block">
                                            <p class="story-date">
                                                01 Jun  2019
                                            </p>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="story-box">
                                                <div class="story-text">
                                                    <h3>Lorem ipsum dolor</h3>
                                                    <p>
                                                        Lorem ipsum dolor sit amet elit. Proin euismod nibh in convallis. Nam vitae posuere tortor, et imperdiet nunc. Praesent nisl nulla, fringilla eu ornare, dignissim vitae ipsum.
                                                    </p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6 d-md-block d-none">
                                            <p class="story-date">
                                                01 Jun  2019
                                            </p>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="col-12">
                                            <div class="story-year">
                                                <p>2019</p>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row story-right">
                                        <div class="col-md-6">
                                            <p class="story-date">
                                                01 Dec 2018
                                            </p>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="story-box">
                                                <div class="story-text">
                                                    <h3>Lorem ipsum dolor</h3>
                                                    <p>
                                                        Lorem ipsum dolor sit amet elit. Proin euismod nibh in convallis. Nam vitae posuere tortor, et imperdiet nunc. Praesent nisl nulla, fringilla eu ornare, dignissim vitae ipsum.
                                                    </p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row story-left">
                                        <div class="col-md-6 d-md-none d-block">
                                            <p class="story-date">
                                                01 Jun 2018
                                            </p>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="story-box">
                                                <div class="story-text">
                                                    <h3>Lorem ipsum dolor</h3>
                                                    <p>
                                                        Lorem ipsum dolor sit amet elit. Proin euismod nibh in convallis. Nam vitae posuere tortor, et imperdiet nunc. Praesent nisl nulla, fringilla eu ornare, dignissim vitae ipsum.
                                                    </p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6 d-md-block d-none">
                                            <p class="story-date">
                                                01 Jun 2018
                                            </p>
                                        </div>
                                    </div>
                                </div>
                                <div class="story-start">
                                    <p>Launch</p>
                                </div>
                                <div class="story-launch">
                                    <div class="story-box">
                                        <div class="story-text">
                                            <h3>Launched our company on 01 Jan 2018</h3>
                                            <p>
                                                Lorem ipsum dolor sit amet elit. Proin euismod nibh in convallis. Nam vitae posuere tortor, et imperdiet nunc. Praesent nisl nulla, fringilla eu ornare, dignissim vitae ipsum.
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- Story End -->


             <!-- Team Start -->
    <div class="team">
        <div class="container">
            <div class="section-header">
                <p>Membre de l'équipe</p>
                <h2>Rencontrez nos nettoyeurs experts</h2>
            </div>
            <div class="row">
                <div class="col-lg-3 col-md-6">
                    <div class="team-item">
                        <div class="team-img">
                            <img src="{{asset('assets/img/user.jpg')}}" alt="Image de l'équipe">
                        </div>
                        <div class="team-text">
                            <h2>Josh Dunn</h2>
                            <h3>PDG</h3>
                            <div class="team-social">
                                <a class="social-tw" href=""><i class="fab fa-twitter"></i></a>
                                <a class="social-fb" href=""><i class="fab fa-facebook-f"></i></a>
                                <a class="social-li" href=""><i class="fab fa-linkedin-in"></i></a>
                                <a class="social-in" href=""><i class="fab fa-instagram"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6">
                    <div class="team-item">
                        <div class="team-img">
                            <img src="{{asset('assets/img/user.jpg')}}" alt="Image de l'équipe">
                        </div>
                        <div class="team-text">
                            <h2>Mollie Ross</h2>
                            <h3>Responsable d'équipe</h3>
                            <div class="team-social">
                                <a class="social-tw" href=""><i class="fab fa-twitter"></i></a>
                                <a class="social-fb" href=""><i class="fab fa-facebook-f"></i></a>
                                <a class="social-li" href=""><i class="fab fa-linkedin-in"></i></a>
                                <a class="social-in" href=""><i class="fab fa-instagram"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6">
                    <div class="team-item">
                        <div class="team-img">
                            <img src="{{asset('assets/img/user.jpg')}}" alt="Image de l'équipe">
                        </div>
                        <div class="team-text">
                            <h2>Dylan Adams</h2>
                            <h3>Nettoyeur</h3>
                            <div class="team-social">
                                <a class="social-tw" href=""><i class="fab fa-twitter"></i></a>
                                <a class="social-fb" href=""><i class="fab fa-facebook-f"></i></a>
                                <a class="social-li" href=""><i class="fab fa-linkedin-in"></i></a>
                                <a class="social-in" href=""><i class="fab fa-instagram"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6">
                    <div class="team-item">
                        <div class="team-img">
                            <img src="{{asset('assets/img/user.jpg')}}" alt="Image de l'équipe">
                        </div>
                        <div class="team-text">
                            <h2>Jennifer Page</h2>
                            <h3>Nettoyeur</h3>
                            <div class="team-social">
                                <a class="social-tw" href=""><i class="fab fa-twitter"></i></a>
                                <a class="social-fb" href=""><i class="fab fa-facebook-f"></i></a>
                                <a class="social-li" href=""><i class="fab fa-linkedin-in"></i></a>
                                <a class="social-in" href=""><i class="fab fa-instagram"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Team End -->


@endsection