@extends('front.template.header')
@section('content')
<style>
   .error-message {
    color: red;               
    font-size: 12px;          
    margin-top: 5px;          
    font-weight: bold;        
}

</style>   
<div id="content" class="site-content ">

            <section class="contact-section">
               <!--===============spacing==============-->
               <div class="pd_top_90"></div>
               <!--===============spacing==============-->
               <div class="container">
                  <div class="row align-items-center">
                     <div class="col-xl-6 col-lg-6 mb-5 mb-lg-5 mb-xl-0">
                        <div class="contact_form_box_all type_one">
                           <div class="contact_form_box_inner">
                              <div class="contact_form_shortcode">
                              <form id="contact-form" method="post" action="{{ route('contact.save') }}" role="form">
                                 @csrf  <!-- CSRF Token -->
                                 <div class="messages"></div>

                                 <div class="controls">
                                    <div class="row">
                                          <div class="col-sm-12">
                                             <div class="form-group">
                                                <label> Your Name<br /></label>
                                                <input type="text" name="name" placeholder="Your Name *" required="required" data-error="Enter Your Name">
                                                <div class="help-block with-errors"></div>
                                             </div>
                                          </div>
                                          <div class="col-sm-12">
                                             <div class="form-group">
                                                <label> Your Email<br /></label>
                                                <input type="text" name="email" required="required" placeholder="Email *" data-error="Enter Your Email Id">
                                                <div class="help-block with-errors"></div>
                                             </div>
                                          </div>
                                          <div class="col-sm-12">
                                             <div class="form-group">
                                                <label> Your Subject<br /></label>
                                                <input type="text" name="subject" required="required" placeholder=" Subject  ">
                                             </div>
                                          </div>
                                          <div class="col-sm-12">
                                             <div class="form-group">
                                                <label> Your Message<br /></label>
                                                <textarea name="message" placeholder="Additional Information... " rows="3" required="required" data-error="Please, leave us a message."></textarea>
                                                <div class="help-block with-errors"></div>
                                             </div>
                                          </div>
                                          <div class="col-sm-12">
                                             <div class="form-group mg_top apbtn">
                                                <button class="theme_btn" type="submit">Send Message</button>
                                             </div>
                                          </div>
                                    </div>
                                 </div>
                              </form>

                                    
                      

                              </div>
                           </div>
                        </div>
                     </div>
                     <div class="col-xl-6 col-lg-6 pd_left_30">
                        <div class="title_all_box style_one dark_color">
                           <div class="title_sections left">
                              <div class="before_title">Contact Info to</div>
                              <h2>Reach Our Expert Team</h2>
                              <p>Send a message through given form, If your enquiry is time sensitive please use below
                                 contact details.</p>
                           </div>
                        </div>

                        <div class="contact_box_content style_one">
                           <div class="contact_box_inner icon_yes">
                              <div class="icon_bx">
                                 <span class=" icon-placeholder"></span>
                              </div>
                              <div class="contnet">
                                 <h3> Email </h3>
                                 <p>
                                   sendmail@classifieds.ps
                                 </p>
                              </div>
                           </div>
                        </div>
                        <!--===============spacing==============-->
                        <div class="pd_bottom_15"></div>
                        <!--===============spacing==============-->
                        <div class="contact_box_content style_one">
                           <div class="contact_box_inner icon_yes">
                              <div class="icon_bx">
                                 <span class="icon-phone-call"></span>
                              </div>
                              <div class="contnet">
                                 <h3> Mobile number </h3>
                                 <p>
                                      +972 56 220 0190
                                 </p>
                              </div>
                           </div>
                        </div>
                        <!--===============spacing==============-->
                        <div class="pd_bottom_15"></div>
                        <!--===============spacing==============-->
                        <div class="contact_box_content style_one">
                           <div class="contact_box_inner icon_yes">
                              <div class="icon_bx">
                                 <span class="fa fa-clock-o"></span>
                              </div>
                              <div class="contnet">
                                 <h3> Landline </h3>
                                 <p>
                                    0 229 1234
                                 </p>
                              </div>
                           </div>
                        </div>
                        <!--===============spacing==============-->
                        <div class="pd_bottom_40"></div>
                        <!--===============spacing==============-->
                        <div class="social_media_v_one style_two">
                           <ul>
                              <li>
                                 <a href="#"> <span class="fa fa-whatsapp"></span>
                                    <small>WhatsApp</small>
                                 </a>
                              </li>
                              <li>
                                 <a href="#"> <span class="fa fa-facebook"></span>
                                    <small>facebook</small>
                                 </a>
                              </li>
                              <li>
                                 <a href="#"> <span class="fa fa-instagram"></span>
                                    <small>instagram</small>
                                 </a>
                              </li>
                           </ul>
                        </div>
                     </div>
                  </div>
               </div>
               <!--===============spacing==============-->
               <div class="pd_top_70"></div>
               <!--===============spacing==============-->
            </section>
         </div>
@endsection