@extends('layouts.app')

@section("page-style")
<link href="{{ asset('front-assets/css/pages_css/get-support.css') }}" rel="stylesheet">
@endsection
@section('content')
    <!----------|| Get Support Section ||---------->
    <section class="w-100 clearfix ContactUs py-5 bg-gray" id="ContactUs">
      <div class="ContactUsInner py-md-5">
        <div class="container">
          <div class="privacyPolicyContant">
            <div class="headingTitle text-center">
              <div class="titleLine textCenterLine">
                <p class="mb-0"><span>We aim to help all peoples</span></p>
              </div>
              <h1>get support</h1>
              <p class="HeadingP">Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type.</p>
            </div>
          </div>
          <div class="ContactsData w-100 clearfix pt-3">
            <div class="row">
              <div class="col-lg-4 col-sm-8 mx-auto p-3">
                <div class="ContactBox w-100 text-center">
                  <img src="{{ asset('front-assets/images/icons/available.png') }}" class="img-fluid">
                  <h4>Always Available</h4>
                  <p>Lorem ipsum dolor sit amet nam consectetur elit.</p>
                </div>
              </div>
              <div class="col-lg-4 col-sm-8 mx-auto p-3">
                <div class="ContactBox w-100 text-center">
                  <img src="{{ asset('front-assets/images/icons/sup.png') }}" class="img-fluid">
                  <h4>Professional Support</h4>
                  <p>Lorem ipsum dolor sit amet nam consectetur elit.</p>
                </div>
              </div>
              <div class="col-lg-4 col-sm-8 mx-auto p-3">
                <div class="ContactBox w-100 text-center">
                  <img src="{{ asset('front-assets/images/icons/exp.png') }}" class="img-fluid">
                  <h4>High Experience</h4>
                  <p>Lorem ipsum dolor sit amet nam consectetur elit.</p>
                </div>
              </div>
            </div>
          </div>
          <!----------profSupport---------->
          <div class="profSupport d-flex align-items-center mt-5">
            <div class="profSupportImg position-relative">
              <img src="{{ asset('front-assets/images/get-support.jpg') }}" class="w-100">
              <div class="profSupportCallIcon position-absolute">
                <img src="{{ asset('front-assets/images/icons/get-supports-call.png') }}" class="img-fluid">
              </div>
            </div>
            <div class="profSupportNo d-flex justify-content-center">
              <div class="profSupportNumaber d-flex">
                <p class="mb-0">Call us for Professional Support</p>
                <h4 class="mb-0">+91-11-41615985</h4>
                <h4 class="mb-0">+91-11-41011291</h4>
              </div>
            </div>
          </div>
          <!----------profSupport---------->
        </div>
      </div>
    </section>
    <!----------|| Get Support Section ||---------->
@endsection
@section("page-js-script")
    <!---------------|| Js Files ||--------------->
    <!----------|| Scripts ||---------->
    <script type="text/javascript">
      $('.playVideo').on('click', function(e) {
          e.preventDefault();
          
          var video_url = $(this).closest(".knowVIdeoHere").find('.video_url').val();   

          $('#video-overlay').addClass('open');
          $("#video-overlay").append('<iframe width="560" height="315" src="'+video_url+'" frameborder="0" allowfullscreen></iframe>');
      });
      $('.video-overlay, .video-overlay-close').on('click', function(e) {
          e.preventDefault();
          close_video();
      });
      $(document).keyup(function(e) {
          if (e.keyCode === 27) {
              close_video();
          }
      });
      function close_video() {
          $('.video-overlay.open').removeClass('open').find('iframe').remove();
      };
    </script>
@endsection