  <?php include "include/header.php" ;?>
  
<div class="parallax inverse-text page-title-wrapper" data-parallax-img="<?php echo base_url();?>assets/images/pattern.jpg" data-parallax-img-width="1920" data-parallax-img-height="455">
    <div class="container inner text-center pt-40 pb-40">
      <h1 class="section-title">Contact Us</h1>
      <div class="space10"></div>
      <div class="meta breadcrumbs text-center mb-0"><span><a href="<?php echo base_url();?>">Home</a></span><span><a href="#">Contact Us</a></span></div>
    </div>
    <!-- /.container --> 
  </div>
  <!-- /.parallax -->
  <div class="wrapper light-wrapper">
    <div class="row row-eq-height row-eq-height-map no-gutter">
      <div class="col-md-6">
        <div class="map full">
              <iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d15008.591937199568!2d73.9720359!3d19.8759722!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x8b7ce9e8ebc6b08d!2sMarsman%20India%20Cranes%20Pvt.Ltd!5e0!3m2!1sen!2sin!4v1567056146510!5m2!1sen!2sin" width="100%" height="800" frameborder="0" style="border:0;" allowfullscreen=""></iframe>
        </div>
      </div>
      <!--/column -->
      <div class="col-md-6">
        <div class="p-90 pb-0">
          <h2 class="section-title">Contact information</h2>
          <p class="lead2">If you have any query, please feel free to contact us.</p>
          <?php foreach($contact as $crow);?>
          <ul class="icon-list list-inline">
            <li><i class="et-location-pin"></i> <?php echo $crow->c_address;?> </li>
            <li><i class="et-mail"></i> <a href="mailto:first.last@email.com" class="nocolor"> <?php echo $crow->c_email;?> </a> </li>
            <li><i class="et-old-phone"></i> <?php echo $crow->c_phone;?>  </li>
            <li><i class="et-old-phone"></i> <?php echo $crow->c_mobile;?> </li>
          </ul>
          <div class="space10"></div>
          <div class="form-container">
            <form action="<?php echo base_url();?>enquiry/contact_us" method="post" class="vanilla vanilla-form" id="form" novalidate>
              <div class="row">
                <div class="col-sm-6 pr-10">
                  <div class="form-group">
                    <input type="text" class="form-control" id="name" name="name" placeholder="Your name" required="required">
                  </div>
                  <!--/.form-group --> 
                </div>
                <!--/column -->
                <div class="col-sm-6 pl-10">
                  <div class="form-group">
                    <input type="text" class="form-control" id="email" name="email" placeholder="Your e-mail" required="required">
                  </div>
                  <!--/.form-group --> 
                </div>
                <!--/column -->
                <div class="col-sm-6 pr-10">
                  <div class="form-group">
                    <input type="text" class="form-control" id="mobile" name="mobile" placeholder="Phone">
                  </div>
                  <!--/.form-group --> 
                </div>
                <!--/column -->
                <div class="col-sm-6 pl-10">
                  <div class="form-group">
                    <label class="custom-select">
                      <select name="department" required>
                        <option>Select Department</option>
                        <option value="Sales">Sales</option>
                        <option value="Marketing">Marketing</option>
                        <option value="Support">Customer Support</option>
                        <option value="Other">Other</option>
                      </select>
                      <span><!-- fake select handler --></span> </label>
                  </div>
                  <!--/.form-group --> 
                </div>
                <!--/column -->
                
                <div class="col-sm-12">
                  <div class="form-group">
                  <textarea name="message" id="message" class="form-control" rows="3" placeholder="Type your message here..." required></textarea>
                  </div>
                  <button type="submit" class="btn btn-rounded" >Submit</button>
                  
                </div>
                <!--/column --> 
                
              </div>
              <!--/.row -->
              
            </form>
            <!--/.vanilla-form --> 
          </div>
          <!--/.form-container --> 
          
        </div>
        <!--/.p-90 --> 
      </div>
      <!--/column --> 
      
    </div>
    <!--/.row --> 
    
  </div>
  <?php include "include/footer.php" ;?>
<script src="<?php echo base_url(); ?>assets/plugins/jquery-validation/js/jquery.validate.min.js"></script>
    <script>
    $().ready(function() {
   // validate signup form on keyup and submit
    $("#form").validate({
        rules: {
            name:{
              required: true
            },
            email:{
                email:true,
                required:true,
            },
            mobile:{
              required: true,
              minlength:10,
              maxlength:10,
            },
           
        },
        messages: {
            mobile: "Please enter 10 digits number",
            name: "Your name is required",
            email: "Please enter valid Email address"
        },
        submitHandler: function(form) {
          form.submit();
        }
    });

});
</script>