@extends('layouts.main')
@section('title', $title)
@section('meta')
    @foreach($meta as $tag)
        <meta name="{{$tag->name}}" content="{{$tag->content}}">
    @endforeach
@stop

@section('content')
    <main id="contact-page">

        <div class="map-bg" title="Open map">
        </div>
        <div class="request-form-container">
            <div class="row">
                <div class="col-md-6">
                    <div class="corner-title ls invise overflow-visible">
                        <div class="text-center">
                            <h1 class="font--lg text-uppercase font-weight-bold">Get in <span
                                    class="txt-blue">Touch</span>
                            </h1>
                        </div>
                    </div>
                    <form id="contact-form" method="POST" action="/contact">
                        <div class="form-group">
                            <label class="" for="email">Name *</label>
                            <input class="form-control" type="text" name="name" placeholder="Type your name">
                            <small class="text-danger hidden"></small>
                        </div>

                        <div class="form-group">
                            <label class="" for="email">Email *</label>
                            <input class="form-control" type="text" name="email" placeholder="Contact Email">
                            <small class="text-danger hidden"></small>
                        </div>

                        <div class="form-group">
                            <label class="" for="email">Message *</label>
                            <textarea rows="4" id="message" class="form-control" name="message"
                                      placeholder="Write your message"></textarea>
                            <small class="text-danger hidden"></small>
                        </div>

                        <div class="form-row">
                            <div id="re-captcha"></div>
                            <div class="captcha-err">
                                <small class="text-danger"></small>
                            </div>
                        </div>

                        <div class="form-group text-center mt-2">
                            <button id="get-in-touch" class="btn__outline btn ">
                                Request
                            </button>
                        </div>

                        <div id="contact-success" class="hidden">
                            <div class="alert alert-success" role="alert">
                                Thank you. We will get back to you within 24 hours.
                            </div>
                        </div>
                    </form>
                </div>
                <div class="col-md-6 d-xs-none d-sm-none d-md-block">
                    <div class="contact-info-container">
                        <div class="corner-title ls invise overflow-visible">
                            <div class="text-center">
                                <h1 class="font--lg p-0 text-uppercase font-weight-bold">Don't Hesitate To <span
                                        class="txt-blue">Contact Us</span>
                                </h1>
                            </div>
                        </div>

                        <div class="address-block ">
                            <div class="d-flex flex-wrap size1 p-b-15">
                                <div class="txt1 p-r-25">
                                    <span class="lnr lnr-map-marker"></span>
                                </div>

                                <div class="d-flex flex-column size2">
                                <span class="txt1 ">
                                    Address
                                </span>

                                    <a href="#" title="Open Map" class="txt2" data-toggle="modal"
                                       data-target="#mapModal">
                                        Hakob Hakobyan 3/2, Yerevan, Armenia
                                    </a>
                                </div>
                            </div>

                            <div class="d-flex size1 p-b-15">
                                <div class="txt1 p-r-25">
                                    <span class="lnr lnr-phone-handset"></span>
                                </div>

                                <div class="d-flex flex-column size2">
						<span class="txt1 ">
							Phone
						</span>

                                    <span class="txt3">
							<a href="tel:+1 800 1236879">(+374) 60-54-00-04</a>
						</span>
                                </div>
                            </div>

                            <div class="d-flex size1 p-b-15">
                                <div class="txt1 p-r-25">
                                    <span class="lnr lnr-envelope"></span>
                                </div>

                                <div class="d-flex flex-column size2">
						<span class="txt1 ">
							Email
						</span>

                         <span class="txt3">
							<a href="mailto:support@inscope-llc-com">contact@inscope-llc.com</a>
						</span>
                                </div>
                            </div>
                        </div>
                        <div class="social-icons">
                            <div>
                                <a href="https://www.linkedin.com/company/inscope-llc-am-/about" target="_blank"
                                   class="icon linkedin-icon">
                                    <i class="fab fa-linkedin"></i>
                                </a>

                                <a href="https://facebook.com/inscope.llc" target="_blank" class="icon">
                                    <i class="fab fa-facebook-square"></i>
                                </a>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="modal fade" id="mapModal" tabindex="-1" role="dialog" aria-labelledby="Contact Form"
             aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content border-shadow">
                    <div class="modal-body p-0">
                        <iframe
                            src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3047.473954208634!2d44.48773731570169!3d40.19851897680502!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x406abddfae875e51%3A0x4036c401d7d1f24f!2sInScope%20LLC!5e0!3m2!1sru!2s!4v1588932136907!5m2!1sru!2s"
                            width="100%" height="500" frameborder="0" style="border:0;" allowfullscreen=""
                            aria-hidden="false" tabindex="0"></iframe>
                    </div>

                </div>
            </div>
        </div>
    </main>

@stop