vf-site/pages/contact.html

{% extends "layouts/layout.html" %}
{% block  content %}
<!-- Header -->
<header class="ex-header bg-gray">
    <div class="container">
        <div class="row">
            <div class="col-xl-10 offset-xl-1">
                <h1 class="green">Nous contacter</h1>
            </div> <!-- end of col -->
        </div> <!-- end of row -->
    </div> <!-- end of container -->
</header> <!-- end of ex-header -->
<!-- end of header -->


<!-- Form -->
<div class="ex-form-1 bg-gray pb-6">
    <div class="container">
        <div class="row">
            <div class="col-xl-10 offset-xl-1">
                <p class="mb-5">Voici l'occasion de nous contacter si vous êtes à la recherche d'une location capable
                    d'offrir une expérience étonnante en termes de confort et de détente <a
                            href="mailto:location.villafleurie@gmail.com">location.villafleurie@gmail.com</a> ou
                    appelez-nous quand vous le pouvez <a href="tel:+33658961279">+33 6 58 96 12 79</a>.</p>
                <p>

                    <!-- Contact Form -->
                <form id="contactForm" name="contactForm" data-toggle="validator" data-focus="false" method="post"
                      action="/reservation.html" netlify>
                    <div class="form-group">
                        <input type="text" class="form-control-input" id="cname" name="name" required>
                        <label class="label-control" for="cname">Nom complet</label>
                        <div class="help-block with-errors"></div>
                    </div>
                    <div class="form-group">
                        <input type="email" class="form-control-input" id="cemail" name="email" required>
                        <label class="label-control" for="cemail">Email</label>
                        <div class="help-block with-errors"></div>
                    </div>
                    <div class="form-group">
                        <textarea class="form-control-textarea" id="cmessage" name="message" required></textarea>
                        <label class="label-control" for="cmessage">Votre message</label>
                        <div class="help-block with-errors"></div>
                    </div>
                    <div class="form-group">
                        <button type="submit" class="form-control-submit-button">Envoyer</button>
                    </div>
                    <div class="form-message">
                        <div id="cmsgSubmit" class="h3 text-center hidden"></div>
                    </div>
                </form>
                <!-- end of contact form -->

            </div> <!-- end of col -->
        </div> <!-- end of row -->
    </div> <!-- end of container -->
</div> <!-- end of ex-form-1 -->
<!-- end of form -->


<!-- Basic -->
<div class="ex-basic-1 pt-5">
    <div class="container">
        <div class="row">
            <div class="col-xl-10 offset-xl-1">
                <h2 class="mt-3 mb-4">Où nous trouver</h2>
                <p class="mb-5">Notre mission à VillaFleurie est de nous concentrer sur tous les détails pour faire de
                    votre séjour une expérience extraordinaire. une expérience inoubliable. Nous avons formé notre
                    personnel pour qu'il réponde à vos attentes et les dépasse, afin que votre expérience à la
                    VillaFleurie ne soit pas un simple souvenir, mais l'un de vos meilleurs souvenirs.
                    Nous sommes passionnés et nous ne vous décevrons pas.</p>

                <div class="map-responsive mb-5">
                    <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3831.2598078323063!2d-61.48991482394046!3d16.20707768449259!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x8c134f148764f5d5%3A0x981bb218cee8b16c!2sVillaFleurie!5e0!3m2!1sfr!2sde!4v1685258248016!5m2!1sfr!2sde"
                            width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy"
                            referrerpolicy="no-referrer-when-downgrade"></iframe>
                </div>

                <a class="btn-solid-reg mb-6" href="index.html#header">Réserver</a>
            </div> <!-- end of col -->
        </div> <!-- end of row -->
    </div> <!-- end of container -->
</div> <!-- end of ex-basic-1 -->
<!-- end of basic -->
{% endblock %}