@extends('layouts.front.front')
@section('title', 'Get in touch with us | Apsys Network')
{{-- main content --}}
@section('content')

    <main id="static">
        <section class="common-banner-wrapper" style="background-image: url('./assets/images/page-banners/contact-us.jpg');">
            <div class="container">
                <h1 data-aos="fade-down" data-aos-delay="800">Sale Support</h1>
            </div>
        </section>
        <!---->
        <div class="container">
            <nav aria-label="breadcrumb" data-aos="fade-right" data-aos-delay="400">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item">
                        <a href="{{ route('home') }}">
                            <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 576 512"><path d="M575.8 255.5c0 18-15 32.1-32 32.1h-32l.7 160.2c0 2.7-.2 5.4-.5 8.1V472c0 22.1-17.9 40-40 40H456c-1.1 0-2.2 0-3.3-.1c-1.4 .1-2.8 .1-4.2 .1H416 392c-22.1 0-40-17.9-40-40V448 384c0-17.7-14.3-32-32-32H256c-17.7 0-32 14.3-32 32v64 24c0 22.1-17.9 40-40 40H160 128.1c-1.5 0-3-.1-4.5-.2c-1.2 .1-2.4 .2-3.6 .2H104c-22.1 0-40-17.9-40-40V360c0-.9 0-1.9 .1-2.8V287.6H32c-18 0-32-14-32-32.1c0-9 3-17 10-24L266.4 8c7-7 15-8 22-8s15 2 21 7L564.8 231.5c8 7 12 15 11 24z"/></svg>
                        </a>
                    </li>
                    <li class="breadcrumb-item active" aria-current="page">Sale Support</li>
                </ol>
            </nav>
        </div>

        <section class="py-5">
            <div class="container">
                <!--<h3 class="header" data-aos="fade-up" data-aos-delay="300">Our Office locations</h1>-->
                <!--    <p class="mb-5 lead" data-aos="fade-up" data-aos-delay="400">Lorem, ipsum dolor sit amet consectetur-->
                <!--        adipisicing elit. Quos ab, est soluta reiciendis-->
                <!--        voluptatem eveniet officiis! Laudantium expedita</p>-->
                    <!--<hr>-->
                    <div class="row mt-5">
                        <div class="col-md-6">
                            <h3 class="header" data-aos="fade-up" data-aos-delay="300">Send your enquiry</h1>
                                <!--<p class="mb-5 lead" data-aos="fade-up" data-aos-delay="400">Lorem, ipsum dolor sit amet-->
                                <!--    consectetur adipisicing elit. Quos ab, est soluta-->
                                <!--    reiciendis voluptatem eveniet officiis! Laudantium expedita</p>-->
                                <form class="mt-4" action="{{ route('saleSupport.mail') }}" method="POST">
                                    @if(session("message"))
                                        <div class="alert alert-success">{{session("message")}}</div>
                                    @endif

                                    @csrf
                                    <div class="partner-inner-section">
                                        <div class="row g-4">
                                            <div class="col-md-6" data-aos="fade-up" data-aos-delay="300">
                                                <input type="text" name="name" id="name" class="form-control"
                                                    placeholder="Name*" required />
                                            </div>
                                            <div class="col-md-6" data-aos="fade-up" data-aos-delay="400">
                                                <input type="email" name="email" id="email" class="form-control"
                                                    placeholder="Email*" required />
                                            </div>
                                            <div class="col-12" data-aos="fade-up" data-aos-delay="500">
                                                <input type="text" name="subject" id="subject" class="form-control"
                                                    placeholder="Subject*" required />
                                            </div>
                                            <div class="col-12" data-aos="fade-up" data-aos-delay="600">
                                                <textarea name="message" id="message" rows="5" class="form-control" placeholder="Message*" required></textarea>
                                            </div>
                                            <div class="col-12" data-aos="fade-up" data-aos-delay="700">
                                                <button type="submit" class="btn-brand">SEND</button>
                                            </div>
                                        </div>
                                    </div>
                                </form>
                        </div>

                        <div class="col-md-6" data-aos="fade-left" data-aos-delay="600">
                            <iframe
                                src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d15551.615558355914!2d77.6396303!3d12.9779987!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x6b92ab3d5a89c18c!2sApsys%20Networks!5e0!3m2!1sen!2sin!4v1629832390713!5m2!1sen!2sin"
                                width="100%" height="100%" style="border:0;" allowfullscreen="" loading="lazy"></iframe>
                        </div>
                    </div>
            </div>
        </section>

    @endsection