<main id="main">
    <section id="features" class="features">
        <div class="container">
            <div class="section-title">
                <h2>Sekoliko fonctionnalités</h2>
            </div>

            <div class="row no-gutters">
                <div class="col-xl-5 d-flex align-items-stretch order-2 order-lg-1">
                    <div class="content d-flex flex-column justify-content-center">
                        <div class="row">
                            <div class="col-md-6 icon-box" data-aos="fade-up">
                                <i class="bx bx-group"></i>
                                <h4>Personnels</h4>
                                <p>Gestion des personnels(congé...)</p>
                            </div>
                            <div class="col-md-6 icon-box" data-aos="fade-up" data-aos-delay="100">
                                <i class="bx bx-id-card"></i>
                                <h4>Etudiants</h4>
                                <p>Géstion des étudiants par classe</p>
                            </div>
                            <div class="col-md-6 icon-box" data-aos="fade-up" data-aos-delay="200">
                                <i class="bx bx-cog"></i>
                                <h4>Logistique</h4>
                                <p>Gestion de votre matiels ou salle</p>
                            </div>
                            <div class="col-md-6 icon-box" data-aos="fade-up" data-aos-delay="300">
                                <i class="bx bx-note"></i>
                                <h4>Note etudiant</h4>
                                <p>Gestion note étudiant par matière</p>
                            </div>
                            <div class="col-md-6 icon-box" data-aos="fade-up" data-aos-delay="400">
                                <i class="bx bx-money"></i>
                                <h4>Paiement</h4>
                                <p>Suivi des paiements salaire ou écolage</p>
                            </div>
                            <div class="col-md-6 icon-box" data-aos="fade-up" data-aos-delay="500">
                                <i class="bx bx-book"></i>
                                <h4>Bibliotheque</h4>
                                <p>Bibliothèque numérique.</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="image col-xl-7 d-flex align-items-stretch justify-content-center order-1 order-lg-2" data-aos="fade-left" data-aos-delay="100">
                    <img src="{{ asset('images/front/sekoliko_feature.png') }}" class="img-fluid" alt="">
                </div>
            </div>
        </div>
    </section>
    <!-- End App Features Section -->

    {% include 'front/content/_contact.html.twig' %}
</main>
