@extends('app')
@section('title-page',"Composition de le CAAf")
@section('content')
    <section>
        <div class="lgx-banner lgx-banner-inner">
            <div class="lgx-page-inner">
                <div class="container">
                    <div class="row">
                        <div class="col-xs-12">
                            <div class="lgx-heading-area">
                                <div class="lgx-heading lgx-heading-white">
                                  
                                </div>
                               
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="akwaba-overPage"> Akwaba</div>
    </section>

    {{-- <x-marqueeText /> --}}
    @include('components/marquee-text')

    <style>
        .profile-card {
            background: white;
            border-radius: 10px;
            padding: 20px;
            width: 250px;
            text-align: center;
            display: block;
            margin: 0 auto;
            align-items: center;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }

        .profile-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
        }

        .profile-card img {
            width: 200px;
            height: 200px;
            border-radius: 50%;
            object-fit: cover;
            margin-bottom: 10px;
        }

        .social-icons {
            display: flex;
            justify-content: center;
            gap: 10px;
            margin-bottom: 15px;
        }

        .profile-card h3 {
            font-size: 20px;
            margin-bottom: 5px;
            color: #333;
        }

        .profile-card p {
            font-size: 14px;
            color: #666;
        }
    </style>



    <section >

                     {{--  style="background: url('../../assets/img/bg.png') center center no-repeat;margin-top:-20px" --}}
        <div id="lgx-about" class="lgx-about"  style="background: url('../../assets/img/bg.png') center center no-repeat;background-size:cover">
            <div class="lgx-inner">
         
                <div class="container">

                   <div class="lgx-heading lgx-heading-white title" >
                        <div style="display:flex;justify-content:center; flex-direction:column;width:100%;">
                        <h1 class="text-black" style="color:#F1F1F1; font-size:60px;font-weight: bold;">BUREAU DE LA CAAf</h1>
                        <h2 style="margin-top: -45px">Composition</h2>
                        </div>
                    </div>


                    <section style="margin-top: 17px;margin-bottom: 17px;">
                        <div class="profile-card">
                            <img src="{{ asset('assets/img/media/composition-caaf/Me-Olagnika-SALAM.jpg') }}" alt="Olagnika">


                            <div style="color:orange">PRESIDENT DE LA CAAf-UINL</div>
                            <div style="color:green;font-weight:bold">Me Olagnika SALAM</div>
                            <p class="text-center"><i>[Benin]</i></p>
                        </div>

                        <div style="margin-top:30px;display:flex;justify-content:center;align-items:center;flex-wrap:wrap">

                            <div class="profile-card">
                                <img src="{{ asset('assets/img/media/composition-caaf/Me-Alassane-SANGARE.jpeg') }}" alt="Olagnika">

                                <div style="color:orange">VICE-PRESIDENT -Zone 1</div>
                                <div style="color:green;font-weight:bold">Me Alassane SANGARE</div>
                                <p class="text-center"><i>[Mali]</i></p>
                            </div>

                            <div class="profile-card">
                                <img src="{{ asset('assets/img/media/composition-caaf/Me-Alioune-KA.jpeg') }}"  style="width: 199px;height:240px" alt="Olagnika">

                                <div style="color:orange">VICE-PRESIDENT -Zone 2</div>
                                <div style="color:green;font-weight:bold">Me Alioune KA</div>
                                <p class="text-center"><i>[Sénégal]</i></p>
                            </div>

                            <div class="profile-card">
                                <img src="{{ asset('assets/img/media/composition-caaf/Me-Germain-DJOMIA.jpeg') }}" alt="Olagnika">

                                <div style="color:orange">VICE-PRESIDENT -Zone 3</div>
                                <div style="color:green;font-weight:bold">Me Germain DJOMIA</div>
                                <p class="text-center"><i>[Tchad]</i></p>
                            </div>

                            <div class="profile-card">
                                <img src="{{ asset('assets/img/media/composition-caaf/Me-Linda-BENALI.jpeg') }}" alt="Olagnika">

                                <div style="color:orange">VICE-PRESIDENT -Zone 4</div>
                                <div style="color:green;font-weight:bold">Me Linda BENALI</div>
                                <p class="text-center"><i>[Maroc]</i></p>
                            </div>

                        </div>

                    <div style="width:50%;display:block;margin:0 auto;">
                         <div style="margin-top:30px;display:flex;justify-content:center;align-items:center;flex-wrap:wrap">


                            <div class="profile-card">
                                <img src="{{ asset('assets/img/media/composition-caaf/Me-Daouda-ADAMOU-HAROUNA.jpeg') }}" alt="Olagnika">

                                <div style="color:orange">SECRETAIRE GENERAL</div>
                                <div style="color:green;font-weight:bold">Me Daouda ADAMOU HAROUNA</div>
                                <p class="text-center"><i>[Niger]</i></p>
                            </div>

                            <div class="profile-card">
                                <img src="{{ asset('assets/img/media/composition-caaf/Me-Francine-VITTIN.jpeg') }}" alt="Olagnika">

                                <div style="color:orange">TRESORIERE</div>
                                <div style="color:green;font-weight:bold">Me Francine VITTIN</div>
                                <p class="text-center"><i>[Bénin]</i></p>
                            </div>

                        </div>
                    </div>


                     <div style="margin-top:30px;display:flex;justify-content:center;align-items:center;flex-wrap:wrap">


                            <div class="profile-card">
                                <img src="{{asset('assets/img/media/composition-caaf/Me-Ida-Geneviève-SANYAN.jpeg') }}" alt="Olagnika">

                                <div style="color:orange">Déléguée Sectorielle</div>
                                <div style="color:green;font-weight:bold">Me Ida Geneviève SANYAN</div>
                                <p class="text-center"><i>[Burkina Faso]</i></p>
                            </div>

                            <div class="profile-card">
                                <img src="{{asset('assets/img/media/commite-organisation/foldah.png') }}" alt="Olagnika">

                                <div style="color:orange">Déléguée Sectorielle</div>
                                <div style="color:green;font-weight:bold">Me Yolande FOLDAH KOUASSI</div>
                                <p class="text-center"><i>[Côte d’Ivoire]</i></p>
                            </div>


                                <div class="profile-card">
                                <img src="{{ asset('assets/img/media/commite-organisation/me-Note.png') }}" alt="Olagnika">

                                <div style="color:orange">Déléguée Sectorielle</div>
                                <div style="color:green;font-weight:bold">Me Esther Nanette NOTE</div>
                                <p class="text-center"><i>[Congo]</i></p>
                            </div>


                             <div class="profile-card">
                                <img src="{{asset('assets/img/media/composition-caaf/Me-Daniella-LOF.jpeg') }}" alt="Olagnika">

                                <div style="color:orange">Déléguée Sectorielle</div>
                                <div style="color:green;font-weight:bold">Me Daniella LOF</div>
                                <p class="text-center"><i>[Madagascar]</i></p>
                            </div>



                            <div class="profile-card">
                                <img src="{{asset('assets/img/media/composition-caaf/Me-Thioye-Mamadou-SOW.jpg') }}" alt="Olagnika">


                                <div style="color:orange">Délégué Sectoriel</div>
                                <div style="color:green;font-weight:bold">Me Thioye Mamadou SOW</div>
                                <p class="text-center"><i>[Mauritanie]</i></p>
                            </div>

                        </div>
                    </section>

                </div>
            </div>

        </div>
    @endsection