<form class="p-20" id="two-column">
    <h5 class="underline mt-n">Account Info</h5>

    <div class="row">
        <div class="col-md-6">
            <div class="form-group">
                <label for="name13">Full Name <sup class="color-danger">*</sup></label>
                <input type="text" class="form-control" id="name13" placeholder="Enter Your Full Name" data-validation="required">
            </div>
        </div>
        <!-- /.col-md-6 -->

        <div class="col-md-6">
            <div class="form-group">
                <label for="username13">Username <sup class="color-danger">*</sup></label>
                <input type="text" class="form-control" id="username13" placeholder="Enter Desired Username" data-validation="length" data-validation-length="min5">
            </div>
        </div>
        <!-- /.col-md-6 -->
    </div>

    <div class="row">
        <div class="col-md-6">
            <div class="form-group">
                <label for="exampleInputEmail13">Email address <sup class="color-danger">*</sup></label>
                <input type="email" class="form-control" id="exampleInputEmail13" placeholder="Enter Your Email Id" data-validation="email" >
            </div>
        </div>
        <!-- /.col-md-6 -->

        <div class="col-md-6">
            <div class="form-group">
                <label for="contact13">Contact Number</label>
                <input type="text" class="form-control" id="contact13" placeholder="Enter Your Mobile Phone Number">
            </div>
        </div>
        <!-- /.col-md-6 -->
    </div>

    <div class="row">
        <div class="col-md-6">
            <div class="form-group">
                <label for="exampleInputPassword13">Password <sup class="color-danger">*</sup></label>
                <input type="password" class="form-control" id="exampleInputPassword13" name="pass" placeholder="Enter Strong Password" data-validation="length" data-validation-length="min8">
            </div>
        </div>
        <!-- /.col-md-6 -->

        <div class="col-md-6">
            <div class="form-group">
                <label for="exampleInputPassword14">Confirm Password <sup class="color-danger">*</sup></label>
                <input type="password" class="form-control" id="exampleInputPassword14" placeholder="Confirm your password" data-validation="confirmation" data-validation-confirm="exampleInputPassword13">
            </div>
        </div>
        <!-- /.col-md-6 -->
    </div>

    <div class="row">
        <div class="col-md-12">
            <div class="form-group checkbox">
                <label>
                    <input type="checkbox" data-validation="required"> I accept <a href="#" class="color-primary">terms & conditions</a>
                </label>
            </div>
        </div>
        <!-- /.col-md-12 -->

        <div class="col-md-12">
            <div class="btn-group pull-right mt-10" role="group">
                <button type="reset" class="btn btn-gray btn-wide"><i class="fa fa-times"></i>Cancel</button>
                <button type="submit" class="btn bg-black btn-wide"><i class="fa fa-arrow-right"></i>Submit</button>
            </div>
            <!-- /.btn-group -->
        </div>
        <!-- /.col-md-12 -->
    </div>

</form>

<!-- ========== JAVASCRIPT ========== -->
<script src="js/form-validator/jquery.form-validator.min.js"></script>

<script>
    $(function($) {
        $.validate({
            form : '#two-column',
            modules : 'security'
        });
    });
</script>