<div id="app">
  <section class="section">
    <div class="container mt-5">
      <div class="row">
        <div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2 col-lg-8 offset-lg-2 col-xl-8 offset-xl-2">
          <div class="card card-primary">
            <div class="card-header">
              <h4>Register</h4>
            </div>
            <div class="card-body">
              <?= form_open(base_url('sign-up'), 'class="actionForm needs-validation" novalidate=""  data-redirect= "user" ') ?>

              <div class="row">
                <div class="form-group col-6">
                  <label for="frist_name">First Name</label>
                  <input id="frist_name" type="text" class="form-control" name="first_name" autofocus required>
                </div>
                <div class="form-group col-6">
                  <label for="last_name">Last Name</label>
                  <input id="last_name" type="text" class="form-control" name="last_name" required>
                </div>
              </div>
              <div class="row">
                <div class="form-group col-6">
                  <label for="email">Email</label>
                  <input id="email" type="text" class="form-control" name="email" required>
                </div>
                <div class="form-group col-6">
                  <label for="phone">Mobile Number</label>
                  <input id="phone" type="text" class="form-control" name="phone" required>
                </div>
              </div>



              <div class="row">
                <div class="form-group col-6">
                  <label for="password" class="d-block">Password</label>
                  <input id="password" type="password" class="form-control pwstrength" data-indicator="pwindicator" name="password" required>
                  <div id="pwindicator" class="pwindicator">
                    <div class="bar"></div>
                    <div class="label"></div>
                  </div>
                </div>
                <div class="form-group col-6">
                  <label for="password2" class="d-block">Password Confirmation</label>
                  <input id="password2" type="password" class="form-control" name="c_password" required>
                </div>
              </div>
              <div class="form-group">
                <div class="custom-control custom-checkbox">
                  <input type="checkbox" name="agree" class="custom-control-input" id="agree">
                  <label class="custom-control-label" for="agree">I agree with the terms and conditions</label>
                </div>
              </div>
              <div class="form-group">
                <button type="submit" class="btn btn-primary btn-lg btn-block">
                  Register
                </button>
              </div>
              <?= form_open(); ?>
            </div>
            <div class="mb-4 text-muted text-center">
              Already Registered? <a href="<?= base_url('sign-in') ?>">Login</a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
</div>