{% extends 'base.html' %}
{% load static %}

{% block a %}
<div class="row slider ">
<div class="col-sm-12 p-0 pb-0">
    <!--start slider-->
    <div id="carouselExampleCaptions" class="carousel slide" data-bs-ride="true">
        <div class="carousel-indicators">
            <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="0" class="active"aria-current="true" aria-label="Slide 1"></button>
            <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="1"aria-label="Slide 2"></button>
            <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="2"
                    aria-label="Slide 3"></button>
        </div>
        <div class="carousel-inner">
            <div class="carousel-item active">
                <img src="{% static 'images/mail1.jpg' %}" class="d-block w-100" style="max-height:700px;" alt="...">
                <div class="carousel-caption d-none d-md-block">

                </div>
            </div>
            <div class="carousel-item">
                <img src="{% static 'images/mailsend.gif' %}" class="d-block w-100" style="max-height:700px;" alt="...">
                <div class="carousel-caption d-none d-md-block">

                </div>
            </div>
            <div class="carousel-item">
                <img src="{% static 'images/d3.webp' %}" class="d-block w-100" style="max-height:700px;" alt="...">
                <div class="carousel-caption d-none d-md-block">

                </div>
            </div>
        </div>
        <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleCaptions"
                data-bs-slide="prev">
            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
            <span class="visually-hidden">Previous</span>
        </button>
        <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleCaptions"
                data-bs-slide="next">
            <span class="carousel-control-next-icon" aria-hidden="true"></span>
            <span class="visually-hidden">Next</span>
        </button>
    </div>
    <!--end slider-->
</div>
</div>
<div class="row bg-primary st">
    <div class="col-sm-12">
        <p class="fw-bold">Find the Email of Anyone on Earth directly from your Gmail/Google <br/>Suite account
        </p>
        <div class="w-25 std fs-5 bg-light pt-2 mt-3 mb-5"><a href="https://chrome.google.com" title="click to open chrome"
                                                              class="f text-primary">Add to Chrome * <i
                class="fa-brands fa-chrome text-success"></i></a>
        </div>
    </div>
</div>
<div class="row service bg-warning">
    <div class="col-sm-6">
        <span class="text-center fs-2 text-dark mt-4 mb-5 fw-bold" style="margin-left:42%;">Instant Enquiry</span>
        {% if msg %}
                <div class="alert alert-success">
                    Your Data Saved Successfully...
                </div>
                {% endif %}
        <form method="post">
            {% csrf_token %}
<div class="input-group mb-3" style="margin-left:42%;">

                        <i class="input-group-text bg-primary text-white">
                            <i class="fa-solid fa-user"></i>
                        </i>
                        <input required type="text" placeholder="Enter Your name*" class="form-control" name="name" style="height:50px;"/>
                    </div>
        <div class="input-group mb-3" style="margin-left:42%;">

                        <i class="input-group-text bg-primary text-white">
                            <i class="fa-solid fa-at"></i>
                        </i>
                        <input required type="email" placeholder="Enter Your email*" class="form-control" name="email" style="height:50px;"/>
                    </div>
        <div class="input-group mb-3" style="margin-left:42%;">

                        <i class="input-group-text bg-primary text-white">
                            <i class="fa-solid fa-phone"></i>
                        </i>
                        <input required type="text" placeholder="Enter Your contact no.*" class="form-control" name="mob" style="height:50px;"/>
                    </div>
        <div class="input-group mb-3" style="margin-left:42%;">
                        <input type="submit" value="Send requested mail"
                               class=" text-primary border-2 border-primary mt-1 fs-4 x1"/>
                    </div>
        </form>
    </div>
</div>
<div class="row section1"></div>
<div class="row section2"></div>
{% endblock %}