@extends('layout.master')
@section('contactactive', 'active')
@section('content')
    <!--==============================
    Breadcumb
============================== -->
    <div class="breadcumb-wrapper " data-bg-src="template/assets/img/breadcumb/bg.jpg">
        <div class="container">
            <div class="breadcumb-content">
                <h1 class="breadcumb-title">Contactez-nous</h1>
                <div class="breadcumb-menu-wrapper">
                    <ul class="breadcumb-menu">
                        <li><a href="{{url('/')}}">Accueil</a></li>
                        <li>Contactez-nous</li>
                    </ul>
                </div>
            </div>
        </div>
    </div>

    <div class="space">
        <div class="container">
            <div class="row gy-40 flex-row-reverse">
                <div class="col-xl-8">
                    <div class="contact-form-wrapper">
                        <form action="mail.php" method="POST" class="contact-form ajax-contact">
                            <h2 class="form-title">Envoyez nous un message <span class="shape"></span></h2>
                            <div class="row">
                                <div class="form-group col-md-6">
                                    <input type="text" class="form-control" name="name" id="name" placeholder="Votre nom">
                                    <i class="fal fa-user"></i>
                                </div>
                                <div class="form-group col-md-6">
                                    <input type="email" class="form-control" name="email" id="email" placeholder="Votre Email">
                                    <i class="fal fa-envelope"></i>
                                </div>
                                <div class="form-group col-md-6">
                                    <input type="tel" class="form-control" name="number" id="number" placeholder="Numéro de téléphone">
                                    <i class="fa-regular fa-phone-flip"></i>
                                </div>
                                <div class="form-group col-md-6">
                                    <input type="text" class="form-control" name="number" id="number4" placeholder="Sujet">
                                    <i class="fa-light fa-tag"></i>
                                </div>
                                <div class="form-group col-12">
                                    <textarea name="message" id="message" cols="30" rows="3" class="form-control" placeholder="Votre message"></textarea>
                                    <i class="fal fa-comment"></i>
                                </div>
                                <div class="btn-group style2">
                                    <a href="javascript:void(0)" class="themeholy-btn">Envoyer<span class="icon"><i class="fa-sharp fa-regular fa-paper-plane"></i></span></a>
                                </div>
                            </div>
                            <p class="form-messages mb-0 mt-3"></p>
                        </form>
                    </div>
                </div>
                <div class="col-xl-4">
                    <div class="contact-info-wrap">
                        <div class="title-area">
                            <span class="sub-title">Contactez-nous</span>
                            <h2 class="sec-title mb-0">Nous sommes Disponible</h2>
                        </div>
                        <div class="contact-info">
                            <div class="contact-info_icon">
                                <i class=""><img src="template/assets/img/icon/location_5.svg" alt=""></i>
                            </div>
                            <div class="media-body">
                                <h4 class="contact-info_title">Siège Social</h4>
                                <span class="contact-info_text">Bè-Kpota, Rue passage des bœufs à côté de la pharmacie fidelia</span>
                            </div>
                        </div>
                        <div class="contact-info">
                            <div class="contact-info_icon">
                                <i class=""><img src="template/assets/img/icon/phone.svg" alt=""></i>
                            </div>
                            <div class="media-body">
                                <h4 class="contact-info_title">Téléphone</h4>
                                <span class="contact-info_text">
                                    <a href="tel:+22822716248">(+228) 22 71 62 48</a>
                                </span>
                            </div>
                        </div>
                        <div class="contact-info">
                            <div class="contact-info_icon">
                                <i class=""><img src="template/assets/img/icon/email.svg" alt=""></i>
                            </div>
                            <div class="media-body">
                                <h4 class="contact-info_title">Email</h4>
                                <span class="contact-info_text">
                                    <a href="mailto:trinitastransit@yahoo.fr">trinitastransit@yahoo.fr</a>
                                </span>
                            </div>
                        </div>
                        <div class="themeholy-social author-social">
                            <h4 class="info-title">Suivez-nous</h4>
                            <a href="https://www.facebook.com/"><i class="fab fa-facebook-f"></i></a>
                            <a href="https://www.twitter.com/"><i class="fab fa-twitter"></i></a>
                            <a href="https://www.linkedin.com/"><i class="fab fa-linkedin-in"></i></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="map-sec">
        <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3966.734158404014!2d1.2617038756092371!3d6.166343911305317!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x1023e3f54244c809%3A0x6212eebb5bbdfc42!2sPharmacie%20Fidelia!5e0!3m2!1sfr!2stg!4v1710922336370!5m2!1sfr!2stg" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
    </div>

    


@endsection