</div>
  </section>
  <div class="for-fixed"></div>
  <section id="driver-documents mctop75" style="">
    <div class="container">
      <div class="row driver-lice pdbot150" style="">
        <div class="col-md-12 col-sm-12 col-xs-12">
          <h2 class="text-center">Upload Documents</h2>
          <p class="text-center">Upload the following documents for verification.</p>
          <?php if($this->session->flashdata('success_msg')) { ?>
          <div class="alert alert-info text-center">
            <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
            <strong><?php echo $this->session->flashdata('success_msg'); ?></strong>
          </div>
          <?php } ?>
          <?php if($this->session->flashdata('error_msg')) { ?>
          <div class="alert alert-danger text-center">
            <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
            <strong><?php echo $this->session->flashdata('error_msg'); ?></strong>
          </div>
          <?php } ?>
          <?php if(validation_errors() != FALSE) { ?>
          <div class="alert alert-danger text-center">
            <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
            <strong><?php echo validation_errors(); ?></strong>
          </div>
          <?php } ?>
          <?php $validator = array('role' => 'form', 'data-toggle' => 'validator'); echo form_open_multipart('applydriveronline', $validator); ?>
          <div class="col-md-12 docbak">
            <div class="col-md-4 text-center">
              <div class="form-group">
                <label>Profile Image</label>
                <div class="clearfix"></div>
                <div class="btn btn-success btn-file bakfile">
                  <i class="fa fa-paperclip"></i> Choose File
                  <input name="driver_photo" type="file" data-error="Please choose profile image to upload" onchange="upload_profile(this)" required="">
                </div>
                <div id="uploaded_profile_img"></div>
                <div style="margin-top: 10px;">(File types: .png and .jpg)</div>
                <div class="help-block with-errors"></div>
              </div>
            </div>
            <div class="col-md-4">
              <div class="form-group text-center">
                <label>Drivers License</label>
                <div class="clearfix"></div>
                <div class="btn btn-success btn-file bakfile">
                  <i class="fa fa-paperclip"></i> Choose File
                  <input name="driver_license_photo" type="file" data-error="Please choose license photo to upload" onchange="upload_license(this)" required="">
                </div>
                <div id="uploaded_license_img"></div>
                <div style="margin-top: 10px;">(File types:  .png, .jpg, .jpeg and .pdf)</div>
                <div class="help-block with-errors"></div>
              </div>
            </div>
            <div class="col-md-4">
              <div class="form-group text-center">
                <label>Insurance Policy</label>
                <div class="clearfix"></div>
                <div class="btn btn-success btn-file bakfile">
                  <i class="fa fa-paperclip"></i> Choose File
                  <input name="driver_insurance_photo" type="file" data-error="Please choose insurance photo to upload" onchange="upload_insurance(this)" required="">
                </div>
                <div id="uploaded_insurance_img"></div>
                <div style="margin-top: 10px;">(File types:  .png, .jpg, .jpeg and .pdf)</div>
                <div class="help-block with-errors"></div>
              </div>
            </div>
            <div class="clearfix"></div>
            <!-- <p style="font-size: 14px; text-align: center;">Only .png, .jpg and .jpeg filetypes are allowed for profile image, and .png, .jpg, .jpeg and .pdf filetypes are allowed for license and insurance documents.</p> -->
            <div class="col-md-12 text-center" style="margin-top: 20px;">
                <label class="checkbox-inline hide" style="margin-bottom: 15px;">
                    <input name="newsletter_signup" id="newsletter_signup" type="checkbox" class="checkbox">
                    <input name="newsletter_subscriber" value="2" type="hidden">
                    Subscribe Newsletter
                </label>
                <div class="clearfix"></div>
              <input type="hidden" name="form_name" value="driver_apply_files">
              <input type="hidden" name="driver_id" value="<?=isset($driver_id)?$driver_id:''?>">
              <button type="submit" class="btn btn-info nxt-btn">Upload</button>
              <button type="button" onclick="window.location.href='<?=base_url();?>applydriveronline/thankyou'" class="btn btn-info nxt-btn">Finish</button>
            </div>
          </div>
          </form>
          <div class="clearfix"></div>
        </div>
      </div>
    </div>
  </section>

  <script type="text/javascript">
  function upload_license(input) {
    if (input.files && input.files[0]) {
      var reader = new FileReader();
      reader.onload = function (e) {
        $('#uploaded_license_img').text(input.files[0].name);
      }
      reader.readAsDataURL(input.files[0]);
    }
  }
  function upload_profile(input) {
    if (input.files && input.files[0]) {
      var reader = new FileReader();
      reader.onload = function (e) {
        $('#uploaded_profile_img').text(input.files[0].name);
      }
      reader.readAsDataURL(input.files[0]);
    }
  }
  function upload_insurance(input) {
    if (input.files && input.files[0]) {
      var reader = new FileReader();
      reader.onload = function (e) {
        $('#uploaded_insurance_img').text(input.files[0].name);
      }
      reader.readAsDataURL(input.files[0]);
    }
  }
  </script>