@extends('frontend.layouts.master')
@section('main-section')
<div class="rts-bread-crumbarea-1 rts-section-gap bg_image" style="background-image: url({{url('/frontend/assets/img/about-banner.jpg');}})">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <div class="breadcrumb-main-wrapper">
                    <h1 class="title">Contact us</h1>                    
                    <div class="pagination-wrapper">
                        <a href="{{url('/')}}">Home</a>
                        <i class="fa-regular fa-chevron-right"></i>
                        <a class="active" href="#">Contact us</a>
                    </div>                    
                </div>
            </div>
        </div>
    </div>
</div>

<div class="rts-contact-area rts-section-gapTop pt-5 bg-light">
    <div class="container">
        <div class="row g-5 d-flex justify-content-center">
            <div class="col-xl-6">                
                <div class="contact-left-area-start bg-white">
                    <div class="title-area-left-style mb-5">                        
                        <h2 class="title text-center">
                            <span>Get in touch!</span>
                        </h2>
                    </div>
                    <form action="#" method="post" class="contact-page-form" id="contact-form">
                        <div class="row">
                            <div class="col-md-6">
                                <div class="single-input">
                                    <label for="name">Your Name*</label>
                                    <input id="name" name="name" type="text" placeholder="Andrew Davis ...." required="">
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="single-input">
                                    <label for="email">Your Email*</label>
                                    <input id="email" name="email" type="email" placeholder="Email" required>
                                </div>
                            </div>
                        </div>
                        
                        <div class="single-input">
                            <label for="subject">Subject</label>
                            <input id="text" name="subject" type="subject" placeholder="Subject" required>
                        </div>

                        <div class="single-input">
                            <label for="message">Message*</label>
                            <textarea id="message" name="message" placeholder="Message" required></textarea>
                        </div>

                        <button class="rts-btn btn-danger mt--30 text-white">Send Message</button>
                    </form>
                    <div id="form-messages" class="mt--20"></div>
                </div>                
            </div>
            
        </div>        
    </div>
</div>

<div class="row">
    <div class="col-md-12">
        <div class="map">
            <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3549.8483756916357!2d78.00891067490367!3d27.161060449374855!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x397476ce3603582b%3A0x3977f15b29020364!2sExcel%20Computer%20Education%20-%20Best%20Computer%20Training%20Center%20in%20Agra%20-%20Computer%20Classes%20in%20Agra!5e0!3m2!1sen!2sin!4v1715660648669!5m2!1sen!2sin" width="100%" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
        </div>
    </div>
</div>


@endsection