@extends('layouts.app')

@section('content')
<div data-bgimage="url({{ asset('front/images/background/bg-service-3.jpg')}}) top center" class="text-light" data-stellar-background-ratio=".1" style="display: block; background: url(&quot;images-photography/bg/1.jpg&quot;) 50% 0px;">

    <!-- subheader begin -->
        <section class="no-bg" style="background-size: cover;">
            <div class="container" style="background-size: cover;">
                <div class="row" style="background-size: cover;">
                    <div class="col-md-12 text-center" style="background-size: cover;">
                        <h1 class="title-2">About Us</h1>
                    </div>
                </div>
            </div>
        </section>    
    <!-- subheader close -->
    
    <!-- content begins -->
    
        <!-- content begin -->
        <section id="section-about-us-2" class="no-bg no-top no-bottom side-bg no-padding">
            <div class="container-fluid">
                <div class="row-fluid">
                    <div class="col-md-6 offset-md-6" data-animation="fadeInRight" data-bgcolor="#111111">
                        <div class="padding80">
                            <h2>Contact Info</h2>
                            <address>
                                <span>{{ $contact->address_one }}</span>
                                <span><strong>Phone 1:</strong>{{ $contact->phone_one }}</span>
                                <span><strong>Phone 2:</strong>{{ $contact->phone_two }}</span>
                                <span><strong>Email:</strong><a href="mailto:{{$contact->email_one}}">{{$contact->email_one}}</a></span>
                                <span><strong>Web:</strong><a href="{{$contact->website}}">{{$contact->website}}</a></span>
                                <!-- <span><strong>Open</strong>Sunday - Friday 08:00 - 18:00</span> -->
                            </address>
                        </div>
                    </div>
                </div>
            </div>

            <div class="container-fluid">
                <div class="row-fluid">
                    <div class="col-md-6" data-animation="fadeInRight" data-bgcolor="#111111">
                        <div class="padding80">
                            <h2>Send Us Message</h2>
                            <form name="contactForm" id="contact_form" method="post" action="{{ route('store_message') }}">
                                @csrf
                                <div class="row">
                                    <div class="col-md-6">
                                        <div id="name_error" class="error">Please enter your name.</div>
                                        <div>
                                            <input type="text" name="name" id="name" class="form-control" placeholder="Your Name" />
                                        </div>

                                        <div id="email_error" class="error">Please enter your valid E-mail ID.</div>
                                        <div>
                                            <input type="text" name="email" id="email" class="form-control" placeholder="Your Email" />
                                        </div>

                                        <div id="phone_error" class="error">Please enter your phone number.</div>
                                        <div>
                                            <input type="text" name="phone" id="phone" class="form-control" placeholder="Your Phone" />
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div id="message_error" class="error">Please enter your message.</div>
                                        <div>
                                            <textarea name="message" id="message" class="form-control" placeholder="Your Message"></textarea>
                                        </div>
                                    </div>

                                    <div class="col-md-12">
                                        <p id="submit">
                                            <input type="submit" id="send_message" value="Submit Form" class="btn btn-line" />
                                        </p>
                                        <div id="mail_success" class="success">Your message has been sent successfully.</div>
                                        <div id="mail_fail" class="error">Sorry, error occured this time sending your message.</div>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- content ends -->
</div>

<script type="text/javascript">
    var $post_message_url = '{{ route("store_message") }}';
</script>

@endsection