@extends('front.layout.app')
@section('content')

    <section class="innerBanner">
        <div class="container">
            <div class="row">
                <div class="col-md-12 text-center">
                    <div class="mainContent">
                        <h1>Contact</h1>
                    </div>
                </div>
            </div>
        </div>
        <img src="{{asset('assets/images/innerbanimg.png')}}" class="img-fluid mainImg" alt="">
    </section>

    <section class="reviewInner contactInner">
        <div class="container">
            <div class="row">
                <div class="col-md-8">
                    <form class="contactForm">
                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <input type="text" class="form-control" placeholder="Name">
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <input type="text" class="form-control" placeholder="Email">
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <input type="text" class="form-control" placeholder="Subject">
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <input type="text" class="form-control" placeholder="Phone Number">
                                </div>
                            </div>
                            <div class="col-md-12">
                                <div class="form-group">
                                    <textarea name="" class="form-control" rows="3"></textarea>
                                </div>
                            </div>
                            <div class="col-md-12">
                                <div class="form-group form-check">
                                    <input type="checkbox" class="form-check-input" id="exampleCheck1">
                                    <label class="form-check-label" for="exampleCheck1">Save my name, email, and website
                                        in this browser for the next time I comment.</label>
                                </div>
                                <button class="themeBtn">Send Message</button>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="col-md-3">
                    <div class="vallBoxs">
                        <figure>
                            <img src="{{asset('assets/images/callImgs.png')}}" class="img-fluid" alt="">
                        </figure>
                        <div class="callsText">
                            <span><img src="{{asset('assets/images/phone.png')}}" class="img-fluid" alt=""></span>
                            <h3>Emergency Call</h3>
                            <a href="#">+91 0236 9032 125</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="mapSec">
        <iframe
            src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d7445691.0399597995!2d-103.05959419447913!3d39.98262537624138!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x54eab584e432360b%3A0x1c3bb99243deb742!2sUnited%20States!5e0!3m2!1sen!2s!4v1727281013235!5m2!1sen!2s"
            width="100%" height="885" style="border:0;" allowfullscreen="" loading="lazy"
            referrerpolicy="no-referrer-when-downgrade"></iframe>
        <div class="container">
            <div class="row">
                <div class="col-md-4">
                    <div class="countryBox">
                        <img src="{{asset('assets/images/country1.png')}}" class="img-fluid" alt="">
                        <h3>United state of america</h3>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="countryBox">
                        <img src="{{asset('assets/images/country2.png')}}" class="img-fluid" alt="">
                        <h3>Singapure</h3>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="countryBox">
                        <img src="{{asset('assets/images/country3.png')}}" class="img-fluid" alt="">
                        <h3>South Africa</h3>
                    </div>
                </div>
            </div>
        </div>
    </section>

@endsection