diff --git a/app/views/preferences/customer-view/verify/verify-your-email.html b/app/views/preferences/customer-view/verify/verify-your-email.html
index 7b0b88d..d82ede8 100644
--- a/app/views/preferences/customer-view/verify/verify-your-email.html
+++ b/app/views/preferences/customer-view/verify/verify-your-email.html
@@ -21,10 +21,10 @@ <h1 class="govuk-heading-l">Verify your email</h1>
 
 
         <div class="govuk-form-group">
-          <label class="govuk-label" for="one-quarter">
+          <label class="govuk-label" for="security-code">
             6 digit code
           </label>
-          <input class="govuk-input govuk-!-width-one-quarter" id="one-quarter" name="oneQuarter" type="text">
+          <input class="govuk-input govuk-input--width-4 govuk-input--extra-letter-spacing" id="security-code" name="securityCode" type="text" autocomplete="one-time-code" inputmode="numeric">
         </div>
 
         <p><a href="resend-code">Resend email</a></p>
diff --git a/app/views/preferences/customer-view/verify/verify-your-mobile-phone-number.html b/app/views/preferences/customer-view/verify/verify-your-mobile-phone-number.html
index 4c795fa..6808694 100644
--- a/app/views/preferences/customer-view/verify/verify-your-mobile-phone-number.html
+++ b/app/views/preferences/customer-view/verify/verify-your-mobile-phone-number.html
@@ -21,10 +21,10 @@ <h1 class="govuk-heading-l">Verify your phone number</h1>
 
 
         <div class="govuk-form-group">
-          <label class="govuk-label" for="one-quarter">
+          <label class="govuk-label" for="security-code">
             6 digit code
           </label>
-          <input class="govuk-input govuk-!-width-one-quarter" id="one-quarter" name="oneQuarter" type="text">
+          <input class="govuk-input govuk-input--width-4 govuk-input--extra-letter-spacing" id="security-code" name="securityCode" type="text" autocomplete="one-time-code" inputmode="numeric">
         </div>
 
         <p><a href="resend-code">Resend text message</a></p>