@extends('layouts.app')
@section('content')
<section class="contact-banner">
        <div class="container-fluid">
            <h1>Get in Touch</h1>
            <h6>Want to get in touch ? We'D love to hear from you. Here's how you can reach us</h6>
        </div>
    </section>

    <section class="form">
        <div class="container">
            <div class="row form-item">
                <div class="col-lg-6">
                    <h3>Give us a Shout</h3>
                    <form action="#">
                        <div class="row">
                            <div class="col form-group">
                              <input type="text" class="form-control" placeholder="First Name" name="FName" id="FName" required> 
                            </div>
                            <div class="col form-group">
                              <input type="text" class="form-control" placeholder="Last Name" name="LName" id="LName" required>
                            </div>
                          </div>
                          <div class="row">
                            <div class="col form-group mt-3">
                                <input type="text" class="form-control" id="Mobile" name="Mobile" placeholder="Mobile Number" required>
                            </div>
                            <div class="col form-group mt-3">
                                <input type="email" class="form-control" id="email" name="email" placeholder="Email" required>
                            </div>
                          </div>
                          <div class="form-group mt-3">
                            <textarea class="form-control" placeholder="Enter Your Query" name="message" id="message" cols="30" rows="6"></textarea>
                          </div>
                          <div class="text-center"><button type="submit">Send Message</button></div>
                    </form>
                </div>
                <div class="col-lg-6">
                    <h3>Get in touch</h3>
                    <div class="row">
                        <div class="col-sm-6">
                            <div class="card text-center">
                              <div><i class="fas fa-map-marked-alt"></i></div>
                              <div class="card-body">
                                <div>
                                  <h5 class="card-title">Our Office Address</h5>
                                </div>
                                <div>
                                  <p class="text-center">110 Railside Avenue, Henderson, Auckland 0612</p>
                                </div>
                              </div>
                            </div>
                          </div>
                        <div class="col-sm-6">
                          <div class="card text-center">
                            <div><i class="fas fa-envelope-open-text"></i></div>
                            <div class="card-body">
                              <div>
                                <h5 class="card-title">General Enquiries</h5>
                              </div>
                              <div>
                                <p class="text-center">freight@trustmovers.co.nz<br> <br></p>
                              </div>
                            </div>
                          </div>
                        </div>
                        <div class="col-sm-6">
                          <div class="card text-center">
                            <div><i class="fas fa-headset"></i></div>
                            <div class="card-body">
                              <div>
                                <h5 class="card-title">Call Us</h5>
                              </div>
                              <div>
                                <p class="text-center">022 027 7234 <br> <br></p>
                              </div>
                            </div>
                          </div>
                        </div>
                        <div class="col-sm-6">
                          <div class="card text-center">
                            <div><i class="far fa-clock"></i></div>
                            <div class="card-body">
                              <div>
                                <h5 class="card-title">Our Timings</h5>
                              </div>
                              <div>
                                <p class="text-center" style="font-size: 15px;">Mon-Sun: 09:00 AM-09:00 PM <br><br></p>
                              </div>
                            </div>
                          </div>
                        </div>
                </div>
            </div>
        </div>
    </section>

      <!--.........................footer............................ -->



    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.5.1.js"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"
    integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy"
    crossorigin="anonymous"></script>

    <script type="text/javascript">
    $(function () {
      var navbar = $('.header-inner');
      $(window).scroll(function () {
        if ($(window).scrollTop() <= 40) {
          navbar.removeClass('navbar-scroll');
        } else {
          navbar.addClass('navbar-scroll');
        }
      });
    });
    </script>

    <!--<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-migrate/3.3.2/jquery-migrate.min.js" integrity="sha512-3fMsI1vtU2e/tVxZORSEeuMhXnT9By80xlmXlsOku7hNwZSHJjwcOBpmy+uu+fyWwGCLkMvdVbHkeoXdAzBv+w==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>-->
@endsection