<%- include('pages/header') %>


    <!-- Contact Start -->
    <div class="container-fluid py-5">
        <div class="container">
            <div class="row">
                <div class="col-lg-5 pb-4 pb-lg-0">
                    <div class="bg-primary text-dark text-center p-4">
                        <h6 class="m-0"><i class="fa fa-map-marker-alt text-white mr-2"></i> Lagos: 2nd Floor, 71 Payne Crescent, Apapa</h6>
                    </div>
                    <iframe style="width: 100%; height: 470px;"
                        src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3964.634317928219!2d3.3681028750743387!3d6.440982993550286!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x103b8bad136bc141%3A0x136c31db75e5c2ae!2s2nd%20Floor%2C%2071%20Payne%20Cres%2C%20Apapa%20Quays%2C%20Lagos%20102272%2C%20Lagos%2C%20Nigeria!5e0!3m2!1sen!2sbd!4v1739963759823!5m2!1sen!2sbd"
                        frameborder="0" style="border:0;" allowfullscreen="" aria-hidden="false" tabindex="0"></iframe>
                </div>
                <div class="col-lg-7">
                    <h6 class="text-primary text-uppercase font-weight-bold">Get in Touch</h6>
                    <h1 class="mb-4">Have Questions? We're Here to Help!</h1>
                    <div class="contact-form bg-secondary" style="padding: 30px;">
                        <div id="success">
                            <% if (message) { %>
                                <div class="alert <%= status === 'success' ? 'alert-success' : 'alert-danger' %>">
                                    <%= message %>
                                </div>
                            <% } %>
                        </div>
                        <form name="sentMessage"   method="POST" action="/contactUsAuth">
                            <div class="control-group">
                                <input type="text" class="form-control border-0 p-4" id="name" name="name" placeholder="Your Name"
                                    required="required" data-validation-required-message="Please enter your name" />
                                <p class="help-block text-danger"></p>
                            </div>
                            <div class="control-group">
                                <input type="email" name="email" class="form-control border-0 p-4" id="email" placeholder="Your Email"
                                    required="required" data-validation-required-message="Please enter your email" />
                                <p class="help-block text-danger"></p>
                            </div>
                            <div class="control-group">
                                <input type="text" name="subject" class="form-control border-0 p-4" id="subject" placeholder="Subject"
                                    required="required" data-validation-required-message="Please enter a subject" />
                                <p class="help-block text-danger"></p>
                            </div>
                            <div class="control-group">
                                <textarea class="form-control border-0 py-3 px-4" rows="3" name="message" id="message" placeholder="Message"
                                    required="required"
                                    data-validation-required-message="Please enter your message"></textarea>
                                <p class="help-block text-danger"></p>
                            </div>
                            <div>
                                <button class="btn btn-primary py-3 px-4" type="submit">Send
                                    Message</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Contact End -->

   <%- include('pages/footer')%>