Verification: revises copy and layout of the review step's confirm/next actions UI

lms/static/sass/views/_verification.scss

@@ -1672,17 +1672,34 @@
 
     .nav-wizard {
 
-      .help-inline {
-        width: flex-grid(4,12);
-        margin-top: 0
+      .prompt-verify {
+        float: left;
+        width: flex-grid(6,12);
+        margin: 0 flex-gutter() 0 0;
+
+        .title {
+          @extend .hd-lv4;
+          margin-bottom: ($baseline/4);
+        }
+
+        .copy {
+          @extend .t-copy-sub1;
+          @extend .t-weight3;
+        }
+
+        .list-actions {
+          margin-top: ($baseline/2);
+        }
+
+        .action-verify label  {
+          @extend .t-copy-sub1;
+        }
       }
 
       .wizard-steps {
-        float: right;
-        width: flex-grid(8,12);
+        margin-top: ($baseline/2);
 
         .wizard-step {
-          width: flex-grid(4,8);
           margin-right: flex-gutter();
           display: inline-block;
           vertical-align: middle;
@@ -1693,13 +1710,6 @@
         }
       }
 
-      .step-match {
-
-        label {
-          @extend .t-copy-sub1;
-        }
-      }
-
       .step-proceed {
 
       }

lms/templates/verify_student/photo_verification.html

@@ -369,13 +369,20 @@
               </div>
 
               <nav class="nav-wizard">
-                <span class="help help-inline">${_("Once you verify your details match the requirements, you can move on to step 4, payment on our secure server.")}</span>
+                <div class="prompt-verify">
+                  <h3 class="title">Before proceeding, please confirm that your details match</h3>
+
+                   <p class="copy"> ${_("Once you verify your details match the requirements, you can move on to step 4, payment on our secure server.")}</p>
+
+                  <ul class="list-actions">
+                    <li class="action action-verify">
+                      <input type="checkbox" name="match" id="confirm_pics_good" />
+                      <label for="confirm_pics_good">${_("Yes! My details all match.")}</label>
+                    </li>
+                  </ul>
+                </div>
 
                 <ol class="wizard-steps">
-                  <li class="wizard-step step-match">
-                    <input type="checkbox" name="match" id="confirm_pics_good" />
-                    <label for="confirm_pics_good">${_("Yes! My details all match.")}</label>
-                  </li>
                   <li class="wizard-step step-proceed">
                     <form id="pay_form" method="post" action="${purchase_endpoint}">
                       <input type="hidden" name="csrfmiddlewaretoken" value="${ csrf_token }">