@extends('layouts.main')
@section('main-section')
<section class="page-banner-area pt-50 pb-35 rel z-1 bgs-cover" style="background-image: url(assets/images/banner/banner.jpg);">
    <div class="container">
        <div class="banner-inner text-white">
            <h2 class="page-title mb-10" data-aos="fade-left" data-aos-duration="1500" data-aos-offset="50">Contact</h2>
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb justify-content-center mb-20" data-aos="fade-right" data-aos-delay="200" data-aos-duration="1500" data-aos-offset="50">
                    <li class="breadcrumb-item"><a href="/">Home</a></li>
                    <li class="breadcrumb-item active">Contact</li>
                </ol>
            </nav>
        </div>
    </div>
</section>
<!-- Contact Info Area start -->
<section class="contact-info-area pt-100 rel z-1">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-lg-4">
                <div class="contact-info-content mb-30 rmb-55" data-aos="fade-up" data-aos-duration="1500" data-aos-offset="50">
                    <div class="section-title mb-30">
                        <h2>Let’s Talk Our Expert Travel Guides</h2>
                    </div>
                    <p>Our dedicated support team is always ready to assist you with any questions or issues, offering prompt and personalized solutions to meet your needs.</p>
                </div>
            </div>
            <div class="col-lg-8">
                <div class="row">
                    <div class="col-md-6">
                        <div class="contact-info-item" data-aos="fade-up" data-aos-duration="1500" data-aos-offset="50" data-aos-delay="50">
                            <div class="icon"><i class="fas fa-envelope"></i></div>
                            <div class="content">
                                <h5>Need Help & Support</h5>
                                <div class="text"><i class="far fa-envelope"></i> <a href="mailto:mashivtourandtravels@gmail.com">mashivtourandtravels@gmail.com</a></div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="contact-info-item" data-aos="fade-up" data-aos-duration="1500" data-aos-offset="50" data-aos-delay="100">
                            <div class="icon"><i class="fas fa-phone"></i></div>
                            <div class="content">
                                <h5>Need Any Urgent</h5>
                                <div class="text"><i class="far fa-phone"></i> <a href="tel:9410313766">+91 9410313766</a></div>
                                <div class="text"><i class="far fa-phone"></i> <a href="tel:9897998277">+91 9897998277</a></div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-9">
                        <div class="contact-info-item" data-aos="fade-up" data-aos-duration="1500" data-aos-offset="50" data-aos-delay="50">
                            <div class="icon"><i class="fas fa-map-marker-alt"></i></div>
                            <div class="content">
                                <h5>Our Office Location</h5>
                                <div class="text"><i class="fal fa-map-marker-alt"></i> Shipra Vihar Canal Road Kishanpur Dehradun</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- Contact Info Area end -->


<!-- Contact Form Area start -->
<section class="contact-form-area py-70 rel z-1">
    <div class="container">
        <div class="comment-form bgc-lighter z-1 rel mb-30 rmb-55">
            <form id="contactForm" class="contactForm" name="contactForm" action="assets/php/form-process.php" method="post" data-aos="fade-left" data-aos-duration="1500" data-aos-offset="50">
                <div class="section-title">
                    <h2>Get In Touch</h2>
                </div>
                <p>Your email address will not be published. Required fields are marked *</p>
                <div class="row mt-35">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="name">Full Name</label>
                            <input type="text" id="name" name="name" class="form-control" placeholder="Randy J. Thomas" value="" required="" data-error="Please enter your Name">
                            <div class="help-block with-errors"></div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="phone_number">Phone Number</label>
                            <input type="text" id="phone_number" name="phone_number" class="form-control" placeholder="Phone" value="" required="" data-error="Please enter your Phone">
                            <div class="help-block with-errors"></div>
                        </div>
                    </div>
                    <div class="col-md-12">
                        <div class="form-group">
                            <label for="email">Email Address</label>
                            <input type="email" id="email" name="email" class="form-control" placeholder="enter email" value="" required="" data-error="Please enter your Email">
                            <div class="help-block with-errors"></div>
                        </div>
                    </div>
                    <div class="col-md-12">
                        <div class="form-group">
                            <label for="message">Your Message</label>
                            <textarea name="message" id="message" class="form-control" rows="5" placeholder="Message" required="" data-error="Please enter your Message"></textarea>
                            <div class="help-block with-errors"></div>
                        </div>
                    </div>
                    <div class="col-md-12">
                        <div class="form-group mb-0">
                            <ul class="radio-filter mb-25">
                                <li>
                                    <input class="form-check-input" type="radio" name="terms-condition" id="terms-condition">
                                    <label for="terms-condition">Save my name, email, and website in this browser for the next time I comment.</label>
                                </li>
                            </ul>
                            <button type="submit" class="theme-btn style-two">
                                <span data-hover="Send Comments">Send Comments</span>
                                <i class="fal fa-arrow-right"></i>
                            </button>
                            <div id="msgSubmit" class="hidden"></div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</section>
<!-- Contact Form Area end -->

@endsection