<div class="row">
    <div class="col-xl-6">
        <div class="form-group">
            <label for="Name">{{"FirstName" | localize}} <span class="text-danger">*</span></label>
            <input id="Name" class="form-control" type="text" name="Name" [(ngModel)]="fName" required maxlength="32">
            <!-- <validation-messages [formCtrl]="nameInput"></validation-messages> -->
        </div>
    </div>
    <div class="col-xl-6">
        <div class="form-group">
            <label for="Surname">{{"LastName" | localize}} <span class="text-danger">*</span></label>
            <input id="Surname" type="text" name="Surname" class="form-control" [(ngModel)]="sName" required
                maxlength="32">
            <!-- <validation-messages [formCtrl]="surnameInput"></validation-messages> -->
        </div>
    </div>
</div>

<div class="row">
    <div class="col-xl-6">
        <div class="form-group">
            <label for="PhoneNumber">{{"PhoneNumber" | localize}} </label>
            <input id="PhoneNumber" type="number" name="PhoneNumber" class="form-control" [(ngModel)]="pNumber"
                maxlength="24">
            <!-- <validation-messages [formCtrl]="phoneInput"></validation-messages> -->
        </div>
    </div>
    <div class="col-xl-6">
        <div class="form-group">
            <label for="EmailAddress">{{"EmailAddress" | localize}} <span class="text-danger">*</span></label>
            <input id="EmailAddress" type="email" name="EmailAddress" class="form-control" [(ngModel)]="emailAddress"
                required maxlength="256" email />
        </div>
    </div>
</div>