 
<link href="<?php echo WEB_ROOT; ?>library/spry/passwordvalidation/SpryValidationPassword.css" rel="stylesheet" type="text/css" />
<script src="<?php echo WEB_ROOT; ?>library/spry/passwordvalidation/SpryValidationPassword.js" type="text/javascript"></script>

<link href="<?php echo WEB_ROOT; ?>library/spry/textfieldvalidation/SpryValidationTextField.css" rel="stylesheet" type="text/css" />
<script src="<?php echo WEB_ROOT; ?>library/spry/textfieldvalidation/SpryValidationTextField.js" type="text/javascript"></script>

<link href="<?php echo WEB_ROOT; ?>library/spry/confirmvalidation/SpryValidationConfirm.css" rel="stylesheet" type="text/css" />
<script src="<?php echo WEB_ROOT; ?>library/spry/confirmvalidation/SpryValidationConfirm.js" type="text/javascript"></script>


   <div class="element-wrapper">
<div class="element-box"> 
	
                  <h2><img src="<?php echo WEB_ROOT; ?>assets/onetouch-white-bg.png" > Change 2FA Account PIN</h2>
                  <p>Dear Customer, kindly use the below form to change your 2FA account Personal Identification Number PIN</p>
               
                 <form action="<?php echo WEB_ROOT; ?>view/process.php?action=changepin" method="post">
                    
					
						  <input type="hidden" class="form-control" style="height:40px; background-color:white;" value="<?php echo $_SESSION['hlBank_user_name'];  ?>" disabled="disabled" />
							<input type="hidden" name="id" value="<?php echo $_SESSION['hlBank_user']['user_id'];?>" />
                       
						  <input type="hidden" class="form-control" style="height:40px; background-color:white;" size="40" value="<?php echo $_SESSION['hlBank_user']['acc_no'] ?>" disabled="disabled"/>
                          
                        
                        <div class="form-group" style="font-size:12px;">
                          <label class="bmd-label-floating">Enter New 2FA Account PIN:</label> 
						  <span id="sprytf_pin">
						  <input type="text" class="form-control" style="height:40px; background-color:white;"  name="pin"/>
						  <br/>
            <span class="textfieldRequiredMsg">2FA Account Pin is required.</span>
			<span class="textfieldMinCharsMsg">min of 4 characters.</span>
			<span class="textfieldMaxCharsMsg">max of 6 characters.</span>
			<span class="textfieldInvalidFormatMsg">must be Integer.</span>
		</span>
							
                        </div>
                      
                      
                        <div class="form-group" style="font-size:12px;">
                          <label class="bmd-label-floating">Confirm 2FA New Account PIN:</label>
						  <span id="sprytf_cpin" >
						  <input type="text"  name="cpin" class="form-control" style="height:40px; background-color:white; "   />
						  <br/>
           	<span class="confirmRequiredMsg">Confirm 2FA PIN is required.</span>
			<span class="textfieldRequiredMsg">2FA Account Pin is required.</span>
			<span class="confirmInvalidMsg">Confirm 2FA PIN values don't match</span>
		</span>
                          
                        </div>
                      
                   
                 
                    <input  name="submitButton" type="submit" value="Update 2FA Account PIN"  id="submitButton" class="btn btn-primary"/>
                    <div class="clearfix"></div>
                  </form>
                
  </div></div>
<script type="text/javascript">
<!--
var spry_pin = new Spry.Widget.ValidationTextField("sprytf_pin", 'integer', {minChars:4, maxChars: 6, validateOn:["blur", "change"]});
//Confirm Password
var spry_cpin = new Spry.Widget.ValidationConfirm("sprytf_cpin", "sprytf_pin", {minChars:4, maxChars: 6, validateOn:["blur", "change"]});
//-->
</script>