diff --git a/package-lock.json b/package-lock.json
index ff1dbad8e..fa54b9ba3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "name-request",
-  "version": "2.2.3",
+  "version": "2.2.4",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -1161,34 +1161,34 @@
       }
     },
     "@bcrs-shared-components/corp-type-module": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/@bcrs-shared-components/corp-type-module/-/corp-type-module-1.0.3.tgz",
-      "integrity": "sha512-bSdpF3ZDhBgUb1qr37wZsR0f2Jrzl2wCiYx5Y7h9Uku0dPZN67zs3YvT+6geLg+sdHfBRuf0hc7ql0csaCKsUQ=="
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/@bcrs-shared-components/corp-type-module/-/corp-type-module-1.0.4.tgz",
+      "integrity": "sha512-709Wwso0HHH5q31+KUWW22uQyn/Qqz/y7paAg31EWcL70UhnWA2kAKHWJN3GC2IfTrcSjyKsVuvAB1R96b3jcA=="
     },
     "@bcrs-shared-components/enums": {
-      "version": "1.0.11",
-      "resolved": "https://registry.npmjs.org/@bcrs-shared-components/enums/-/enums-1.0.11.tgz",
-      "integrity": "sha512-RyYWqoN0/oA9Rn8wvSGcLcKF9q1xlEZOdqIlprJKkK6tPtZeGMS6p2yI7IqWh/+jBK1ZRUAf5K50MaRFD1vS/A==",
+      "version": "1.0.13",
+      "resolved": "https://registry.npmjs.org/@bcrs-shared-components/enums/-/enums-1.0.13.tgz",
+      "integrity": "sha512-FsKZ0iHE1bQoyTQZsyWffRrpk9zkdBNps3qluGpYDzM1k/JQtGM4dVkQrsAb47/oBw6EG/SDiTYsEQeUY7J7qg==",
       "requires": {
-        "@bcrs-shared-components/corp-type-module": "^1.0.3"
+        "@bcrs-shared-components/corp-type-module": "^1.0.4"
       }
     },
     "@bcrs-shared-components/interfaces": {
-      "version": "1.0.20",
-      "resolved": "https://registry.npmjs.org/@bcrs-shared-components/interfaces/-/interfaces-1.0.20.tgz",
-      "integrity": "sha512-Cmghvf/Yp1RgJ7OemV3mvhy5kvbVjNOwLLbgtXIV3ZtsSXvj3U0n4JIhCznwIyyzzDjdgO4uE24wDlVwXznwMA==",
+      "version": "1.0.22",
+      "resolved": "https://registry.npmjs.org/@bcrs-shared-components/interfaces/-/interfaces-1.0.22.tgz",
+      "integrity": "sha512-tJ7W+2roM3vzTRYhgaGOouTwg2ujEfCshMjJqDSyiaN91DIQx+6QOnjxE12Xd9UUfaESvMI/sJIyX5xZxFZiIg==",
       "requires": {
-        "@bcrs-shared-components/enums": "^1.0.11",
+        "@bcrs-shared-components/enums": "^1.0.13",
         "vue": "^2.6.11"
       }
     },
     "@bcrs-shared-components/staff-payment": {
-      "version": "1.0.24",
-      "resolved": "https://registry.npmjs.org/@bcrs-shared-components/staff-payment/-/staff-payment-1.0.24.tgz",
-      "integrity": "sha512-OSSf0DlPa60t2Fd68p4I8BZ58KMF3ijQIW36St27eT3nuX3yIygzM+CGpxLli3c642CbYjE//kR9AvvjBamulQ==",
+      "version": "1.0.26",
+      "resolved": "https://registry.npmjs.org/@bcrs-shared-components/staff-payment/-/staff-payment-1.0.26.tgz",
+      "integrity": "sha512-rZJtZz4+rrpG4KVD9f0dMdLGILd3HKALV/lM/AW2YJALq+ERyxdMDFIsmotD1Z6JNVm1G5UmLTu0YPEGFDEHvA==",
       "requires": {
-        "@bcrs-shared-components/enums": "^1.0.11",
-        "@bcrs-shared-components/interfaces": "^1.0.20",
+        "@bcrs-shared-components/enums": "^1.0.13",
+        "@bcrs-shared-components/interfaces": "^1.0.22",
         "vue-property-decorator": "^8.4.0"
       }
     },
@@ -5205,9 +5205,9 @@
       }
     },
     "caniuse-lite": {
-      "version": "1.0.30001164",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001164.tgz",
-      "integrity": "sha512-G+A/tkf4bu0dSp9+duNiXc7bGds35DioCyC6vgK2m/rjA4Krpy5WeZgZyfH2f0wj2kI6yAWWucyap6oOwmY1mg==",
+      "version": "1.0.30001230",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001230.tgz",
+      "integrity": "sha512-5yBd5nWCBS+jWKTcHOzXwo5xzcj4ePE/yjtkZyUV1BTUmrBaA9MRGC+e7mxnqXSA90CmCA8L3eKLaSUkt099IQ==",
       "dev": true
     },
     "capture-exit": {
diff --git a/package.json b/package.json
index 4f890aa37..81a79b9c2 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "name-request",
-  "version": "2.2.3",
+  "version": "2.2.4",
   "private": true,
   "appName": "Name Request UI",
   "sbcName": "SBC Common Components",
@@ -14,9 +14,9 @@
   },
   "dependencies": {
     "@babel/compat-data": "^7.12.13",
-    "@bcrs-shared-components/enums": "1.0.11",
-    "@bcrs-shared-components/interfaces": "1.0.20",
-    "@bcrs-shared-components/staff-payment": "1.0.24",
+    "@bcrs-shared-components/enums": "1.0.13",
+    "@bcrs-shared-components/interfaces": "1.0.22",
+    "@bcrs-shared-components/staff-payment": "1.0.26",
     "@mdi/font": "^4.5.95",
     "@sentry/browser": "^6.2.1",
     "@sentry/integrations": "^6.2.1",
diff --git a/src/assets/scss/base.scss b/src/assets/scss/base.scss
index f8298a651..f3ad16422 100644
--- a/src/assets/scss/base.scss
+++ b/src/assets/scss/base.scss
@@ -288,14 +288,6 @@ button.reserve-submit-btn {
   margin: 0 !important;
 }
 
-#submit-back-btn {
-  background-color: white !important;
-  color: $app-blue !important;
-  border: 1px solid $app-blue !important;
-  box-shadow: none !important;
-  text-transform: none !important;
-}
-
 /* CSS TRANSITION/ANIMATION CLASSES */
 .fade-enter, .fade-leave-to {
   opacity: 0;
diff --git a/src/components/common/applicant-info-1.vue b/src/components/common/applicant-info-1.vue
index ba509d160..f031d33f0 100644
--- a/src/components/common/applicant-info-1.vue
+++ b/src/components/common/applicant-info-1.vue
@@ -610,9 +610,9 @@ export default class ApplicantInfo1 extends Mixins(ActionMixin) {
       this.$nextTick(() => {
         if (this.$el?.querySelector instanceof Function) {
           // add classname to button text (for more detail in Sentry breadcrumbs)
-          const applicantBackBtn = this.$el.querySelector('#submit-back-btn > span')
+          const applicantBackBtn = this.$el.querySelector('.submit-back-btn > span')
           if (applicantBackBtn) applicantBackBtn.classList.add('applicant-back-btn')
-          const applicantContinueBtn = this.$el.querySelector('#submit-continue-btn > span')
+          const applicantContinueBtn = this.$el.querySelector('.submit-continue-btn > span')
           if (applicantContinueBtn) applicantContinueBtn.classList.add('applicant-continue-btn')
         }
       })
diff --git a/src/components/common/applicant-info-2.vue b/src/components/common/applicant-info-2.vue
index 6002a79c7..d8b81c3e2 100644
--- a/src/components/common/applicant-info-2.vue
+++ b/src/components/common/applicant-info-2.vue
@@ -364,9 +364,9 @@ export default class ApplicantInfo2 extends Vue {
       this.$nextTick(() => {
         if (this.$el?.querySelector instanceof Function) {
           // add classname to button text (for more detail in Sentry breadcrumbs)
-          const selfReviewBackBtn = this.$el.querySelector('#submit-back-btn > span')
+          const selfReviewBackBtn = this.$el.querySelector('.submit-back-btn > span')
           if (selfReviewBackBtn) selfReviewBackBtn.classList.add('self-review-back-btn')
-          const selfReviewConfirmBtn = this.$el.querySelector('#submit-continue-btn > span')
+          const selfReviewConfirmBtn = this.$el.querySelector('.submit-continue-btn > span')
           if (selfReviewConfirmBtn) selfReviewConfirmBtn.classList.add('self-review-confirm-btn')
         }
       })
diff --git a/src/components/common/applicant-info-3.vue b/src/components/common/applicant-info-3.vue
index 1ec869cb4..35b4e278a 100644
--- a/src/components/common/applicant-info-3.vue
+++ b/src/components/common/applicant-info-3.vue
@@ -391,9 +391,9 @@ export default class ApplicantInfo3 extends Vue {
       this.$nextTick(() => {
         if (this.$el?.querySelector instanceof Function) {
           // add classname to button text (for more detail in Sentry breadcrumbs)
-          const clientReviewBackBtn = this.$el.querySelector('#submit-back-btn > span')
+          const clientReviewBackBtn = this.$el.querySelector('.submit-back-btn > span')
           if (clientReviewBackBtn) clientReviewBackBtn.classList.add('client-review-back-btn')
-          const clientReviewConfirmBtn = this.$el.querySelector('#submit-continue-btn > span')
+          const clientReviewConfirmBtn = this.$el.querySelector('.submit-continue-btn > span')
           if (clientReviewConfirmBtn) clientReviewConfirmBtn.classList.add('client-review-confirm-btn')
         }
       })
diff --git a/src/components/common/applicant-info-nav.vue b/src/components/common/applicant-info-nav.vue
index 21ddbcc16..caefe3674 100644
--- a/src/components/common/applicant-info-nav.vue
+++ b/src/components/common/applicant-info-nav.vue
@@ -1,8 +1,7 @@
 <template>
   <v-col cols="5" class="text-right py-0">
     <v-btn x-large
-           id="submit-back-btn"
-           class="mr-3"
+           class="submit-back-btn mr-3"
            v-if="showBack"
            @click="back()">
       {{ backText }}
@@ -10,7 +9,7 @@
     <v-btn x-large
            @click="nextAction()"
            :loading="getIsLoadingSubmission"
-           id="submit-continue-btn">
+           class="submit-continue-btn">
       {{ nextText }}
     </v-btn>
   </v-col>
@@ -75,3 +74,15 @@ export default class ApplicantInfoNav extends Vue {
   private nextAction () : void {}
 }
 </script>
+
+<style lang="scss" scoped>
+@import "@/assets/scss/theme";
+
+.submit-back-btn {
+  background-color: white !important;
+  color: $app-blue !important;
+  border: 1px solid $app-blue !important;
+  box-shadow: none !important;
+  text-transform: none !important;
+}
+</style>
diff --git a/src/components/common/names-capture.vue b/src/components/common/names-capture.vue
index 6d9184d9d..b3f243c79 100644
--- a/src/components/common/names-capture.vue
+++ b/src/components/common/names-capture.vue
@@ -856,7 +856,7 @@ export default class NamesCapture extends Vue {
       this.$nextTick(() => {
         if (this.$el?.querySelector instanceof Function) {
           // add classname to button text (for more detail in Sentry breadcrumbs)
-          const choicesContinueBtn = this.$el.querySelector('#submit-continue-btn > span')
+          const choicesContinueBtn = this.$el.querySelector('.submit-continue-btn > span')
           if (choicesContinueBtn) choicesContinueBtn.classList.add('choices-continue-btn')
         }
       })
diff --git a/src/components/common/request-details.vue b/src/components/common/request-details.vue
index f4b821dbd..dff1f2d01 100644
--- a/src/components/common/request-details.vue
+++ b/src/components/common/request-details.vue
@@ -1,6 +1,6 @@
 <template>
   <div id="request-details">
-    <div class="mt-4">
+    <section>
       <h4>Requested Name <span v-if="nameChoices.name2">Choices</span></h4>
       <ul class="pl-0">
         <li v-if="name && !nameChoices.name2">{{name}}</li>
@@ -10,7 +10,7 @@
           <li v-if="nameChoices.name3">3. {{nameChoices.name3}}</li>
         </template>
       </ul>
-    </div>
+    </section>
 
     <v-row>
       <v-col col="6">
diff --git a/src/components/dialogs/advanced-search.vue b/src/components/dialogs/advanced-search.vue
index 732801cf9..22e245261 100644
--- a/src/components/dialogs/advanced-search.vue
+++ b/src/components/dialogs/advanced-search.vue
@@ -96,31 +96,31 @@
       </v-tabs>
 
       <v-card-actions id="advanced-search-actions" class="justify-center pa-0">
-          <v-btn
-            id="adv-search-btn-1"
-            class="mr-2"
-            :class="{ 'button-blue': isTabResultsTable || isTabRetrieve }"
-            text
-            outlined
-            @click="advSearchBtn1Actions()"
-          >
-            <span :class="isTabSearchForm ? 'pl-2' : 'pr-2'">
-              <v-icon v-if="!isTabSearchForm">mdi-chevron-left</v-icon>
-              {{ advSearchBtn1Text }}
-              <v-icon v-if="isTabSearchForm">mdi-chevron-right</v-icon>
-            </span>
-          </v-btn>
-          <v-btn
-            id="adv-search-btn-2"
-            :class="{ 'button-blue' : !isTabRetrieve }"
-            text
-            outlined
-            @click="advSearchBtn2Actions()"
-          >
-            <span class="px-3">
-              {{ advSearchBtn2Text }}<v-icon v-if="isTabRetrieve">mdi-chevron-right</v-icon>
-            </span>
-          </v-btn>
+        <v-btn
+          id="adv-search-btn-1"
+          class="mr-2"
+          :class="{ 'button-blue': isTabResultsTable || isTabRetrieve }"
+          text
+          outlined
+          @click="advSearchBtn1Actions()"
+        >
+          <span :class="isTabSearchForm ? 'pl-2' : 'pr-2'">
+            <v-icon v-if="!isTabSearchForm">mdi-chevron-left</v-icon>
+            {{ advSearchBtn1Text }}
+            <v-icon v-if="isTabSearchForm">mdi-chevron-right</v-icon>
+          </span>
+        </v-btn>
+        <v-btn
+          id="adv-search-btn-2"
+          :class="{ 'button-blue' : !isTabRetrieve }"
+          text
+          outlined
+          @click="advSearchBtn2Actions()"
+        >
+          <span class="px-3">
+            {{ advSearchBtn2Text }}<v-icon v-if="isTabRetrieve">mdi-chevron-right</v-icon>
+          </span>
+        </v-btn>
       </v-card-actions>
     </v-card>
 
diff --git a/src/components/dialogs/payment-complete.vue b/src/components/dialogs/payment-complete.vue
index 979f484f8..39b33b876 100644
--- a/src/components/dialogs/payment-complete.vue
+++ b/src/components/dialogs/payment-complete.vue
@@ -9,7 +9,7 @@
       </v-card-title>
 
       <v-card-text class="copy-normal pt-4">
-        <payment-confirm
+        <PaymentConfirm
           :nrNum="getNrNum"
           :applicant="getApplicant"
           :nameChoices="getNameChoices"
@@ -35,7 +35,6 @@
 import { Component, Mixins, Watch } from 'vue-property-decorator'
 import { Action, Getter } from 'vuex-class'
 import PaymentConfirm from '@/components/payment/payment-confirm.vue'
-import RequestDetails from '@/components/common/request-details.vue'
 import { NameRequestPayment } from '@/modules/payment/models'
 import errorModule from '@/modules/error'
 import { PaymentStatus, SbcPaymentStatus } from '@/enums'
@@ -58,7 +57,6 @@ const DEBUG_RECEIPT = false
 
 @Component({
   components: {
-    RequestDetails,
     PaymentConfirm
   }
 })
diff --git a/src/components/dialogs/payment.vue b/src/components/dialogs/payment.vue
index 19bf43716..ed999d83b 100644
--- a/src/components/dialogs/payment.vue
+++ b/src/components/dialogs/payment.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-dialog max-width="45rem" :value="isVisible" persistent>
+  <v-dialog min-width="32rem" max-width="45rem" :value="isVisible" persistent>
     <v-card>
       <v-tabs id="payment-tabs">
         <v-tabs-items v-model="paymentTab">
@@ -12,25 +12,24 @@
               </v-btn>
             </v-card-title>
 
-            <v-card-text class="copy-normal pt-0">
+            <v-card-text class="copy-normal pt-5">
               <StaffPayment
-                :doValidate="validateStaffPayment"
+                ref="staffPaymentComponent"
                 @isValid="isStaffPaymentValid = $event"
               />
             </v-card-text>
 
-            <v-card-actions class="justify-center pa-0">
+            <v-card-actions class="justify-center pt-6">
+              <v-btn
+                @click="goBack()"
+                id="payment-close-btn"
+                class="button-blue"
+                :disabled="isLoadingPayment">Back</v-btn>
               <v-btn
                 @click="confirmPayment()"
                 id="payment-pay-btn"
                 class="primary px-4"
-                text
                 :loading="isLoadingPayment">Submit Name Request</v-btn>
-              <v-btn
-                @click="hideModal()"
-                id="payment-close-btn"
-                class="button-blue"
-                :disabled="isLoadingPayment">Exit Payment</v-btn>
             </v-card-actions>
           </v-tab-item>
 
@@ -42,7 +41,7 @@
               </v-btn>
             </v-card-title>
 
-            <v-card-text class="copy-normal pt-4">
+            <v-card-text class="copy-normal pt-5">
               <RequestDetails
                 :applicant="getApplicant"
                 :name="getName"
@@ -61,14 +60,12 @@
                 @click="cancelPayment()"
                 id="payment-cancel-btn"
                 class="button-red px-4"
-                text
                 :disabled="isLoadingPayment">Cancel Name Request</v-btn>
               <v-spacer />
               <v-btn
                 @click="confirmPayment()"
                 id="payment-pay-btn"
                 class="primary px-4"
-                text
                 :loading="isLoadingPayment">Continue to Payment</v-btn>
               <v-btn
                 @click="hideModal()"
@@ -118,6 +115,11 @@ export default class PaymentDialog extends Mixins(
   readonly TAB_STAFF_PAYMENT = 0
   readonly TAB_CONFIRM_NAME_REQUEST = 1
 
+  // Refs
+  $refs!: {
+    staffPaymentComponent: StaffPayment
+  }
+
   @Prop({ default: async () => {} })
   readonly onCancel: Function
 
@@ -159,12 +161,6 @@ export default class PaymentDialog extends Mixins(
 
   /** Clears store property to hide this modal. */
   async hideModal () {
-    // go to previous page
-    if (this.paymentTab === this.TAB_STAFF_PAYMENT) {
-      this.paymentTab = this.TAB_CONFIRM_NAME_REQUEST
-      return
-    }
-
     this.isLoadingPayment = false
     await this.togglePaymentModal(false)
   }
@@ -193,19 +189,27 @@ export default class PaymentDialog extends Mixins(
     }
   }
 
+  /** Called when user clicks "Back" button. */
+  goBack () {
+    // disable validation
+    this.$refs.staffPaymentComponent && this.$refs.staffPaymentComponent.setValidation(false)
+    // go to previous tab
+    this.paymentTab = this.TAB_CONFIRM_NAME_REQUEST
+  }
+
   /** Called when user clicks "Continue to Payment" button. */
-  private async confirmPayment () {
+  async confirmPayment () {
     if (this.isRoleStaff && getFeatureFlag('staff-payment-enabled')) {
       if (this.paymentTab === this.TAB_CONFIRM_NAME_REQUEST) {
-        // reset validation
-        this.validateStaffPayment = false
-        // go to next page
+        // disable validation
+        this.$refs.staffPaymentComponent && this.$refs.staffPaymentComponent.setValidation(false)
+        // go to next tab
         this.paymentTab = this.TAB_STAFF_PAYMENT
         return
       }
       if (this.paymentTab === this.TAB_STAFF_PAYMENT) {
         // enable validation
-        this.validateStaffPayment = true
+        this.$refs.staffPaymentComponent && this.$refs.staffPaymentComponent.setValidation(true)
         // if invalid then stop, else continue
         if (!this.isStaffPaymentValid) return
       }
@@ -276,7 +280,7 @@ export default class PaymentDialog extends Mixins(
   display: none;
 }
 
-// top whitespace so 'X' button is not cropped
+// adjust top whitespace so 'X' button is not cropped
 .v-tabs-items {
   padding-top: 0.5rem;
   margin-top: -0.5rem;
diff --git a/src/components/payment/payment-confirm.vue b/src/components/payment/payment-confirm.vue
index 27f6fdc71..a79f7d47d 100644
--- a/src/components/payment/payment-confirm.vue
+++ b/src/components/payment/payment-confirm.vue
@@ -12,6 +12,7 @@
     </ul>
 
     <RequestDetails
+      class="mt-4"
       :applicant="applicant"
       :nameChoices="nameChoices"
       :name="name"
diff --git a/src/components/payment/staff-payment.vue b/src/components/payment/staff-payment.vue
index 91daf266d..b03c8e7d5 100644
--- a/src/components/payment/staff-payment.vue
+++ b/src/components/payment/staff-payment.vue
@@ -1,8 +1,8 @@
 <template>
-  <div id="staff-payment" class="pt-6">
-    <staff-payment-component
+  <div id="staff-payment" :class="{'invalid-section': showStaffPaymentInvalidSection}">
+    <StaffPaymentShared
       :staffPaymentData="getStaffPayment"
-      :validate="doValidate"
+      :validate="validate"
       :displaySideLabel="false"
       :displayPriorityCheckbox="false"
       @update:staffPaymentData="onStaffPaymentDataUpdate($event)"
@@ -12,11 +12,11 @@
 </template>
 
 <script lang="ts">
-import { Component, Emit, Prop, Vue } from 'vue-property-decorator'
+import { Component, Emit, Vue } from 'vue-property-decorator'
 import { Action, Getter } from 'vuex-class'
 
 // Components
-import { StaffPayment as StaffPaymentComponent } from '@bcrs-shared-components/staff-payment'
+import { StaffPayment as StaffPaymentShared } from '@bcrs-shared-components/staff-payment'
 
 // Interfaces and Enums
 import { ActionBindingIF } from '@/interfaces/store-interfaces'
@@ -25,7 +25,7 @@ import { StaffPaymentOptions } from '@/enums'
 
 @Component({
   components: {
-    StaffPaymentComponent
+    StaffPaymentShared
   }
 })
 export default class StaffPayment extends Vue {
@@ -36,12 +36,27 @@ export default class StaffPayment extends Vue {
   @Action setStaffPayment!: ActionBindingIF
 
   /** Whether to validate the data. */
-  @Prop({ default: false }) readonly doValidate: boolean
+  private validate = false
+
+  /** Whether to show the staff payment invalid section styling. */
+  private get showStaffPaymentInvalidSection (): boolean {
+    const option = this.getStaffPayment.option ?? StaffPaymentOptions.NONE
+    // True if no option is selected
+    return this.validate && (option === StaffPaymentOptions.NONE)
+  }
+
+  /** Called externally to set validation state. */
+  public setValidation (val: boolean) {
+    this.validate = val
+  }
 
   /** Called when component's staff payment data has been updated. */
   private onStaffPaymentDataUpdate (val: StaffPaymentIF) {
     let staffPaymentData: StaffPaymentIF = { ...this.getStaffPayment, ...val }
 
+    // disable validation
+    this.validate = false
+
     switch (staffPaymentData.option) {
       case StaffPaymentOptions.FAS:
         staffPaymentData = {
@@ -90,7 +105,14 @@ export default class StaffPayment extends Vue {
 </script>
 
 <style lang="scss" scoped>
-// override internal whitespace so we can specify it above
+@import "@/assets/scss/theme";
+
+// error border
+.invalid-section {
+  border-left: 3px solid $app-red !important;
+}
+
+// override internal whitespace
 ::v-deep #staff-payment-container {
   padding: 0 !important;
   margin: 0 !important;
@@ -100,4 +122,14 @@ export default class StaffPayment extends Vue {
 ::v-deep .v-input--radio-group__input {
   background-color: white;
 }
+
+// remove margin below radio group
+::v-deep .v-input--radio-group > .v-input__control > .v-input__slot {
+  margin-bottom: 0 !important;
+}
+
+// hide messages below radio group
+::v-deep .v-input--radio-group > .v-input__control > .v-messages {
+  display: none;
+}
 </style>
diff --git a/tests/unit/applicant-info-1.spec.ts b/tests/unit/applicant-info-1.spec.ts
index 97c64638c..58cf51462 100644
--- a/tests/unit/applicant-info-1.spec.ts
+++ b/tests/unit/applicant-info-1.spec.ts
@@ -31,6 +31,6 @@ describe('applicant-info-1', () => {
   //   expect(wrapper.find('#applicant-info-1-form').element).toBeTruthy()
   // })
   // it('Initially renders the enabled continue button', () => {
-  //   expect(wrapper.find('#submit-continue-btn').classes().includes('v-btn')).toBeTruthy()
+  //   expect(wrapper.find('.submit-continue-btn').classes().includes('v-btn')).toBeTruthy()
   // })
 })
diff --git a/tests/unit/names-capture.spec.ts b/tests/unit/names-capture.spec.ts
index fa329e23b..55d733015 100644
--- a/tests/unit/names-capture.spec.ts
+++ b/tests/unit/names-capture.spec.ts
@@ -38,14 +38,14 @@ describe('names-capture', () => {
   //   })
   //   it('Initially renders the enabled continue button', () => {
   //     expect(wrapper.vm.isValid).toBe(false)
-  //     expect(wrapper.find('#submit-continue-btn').classes().includes('v-btn')).toBeTruthy()
+  //     expect(wrapper.find('.submit-continue-btn').classes().includes('v-btn')).toBeTruthy()
   //   })
   //   it('demonstrates correct validation logic when designation-1 is entered', async () => {
   //     store.mutateNameChoices({ key: 'name1', value: 'A Really Nice Name' })
   //     store.mutateNameChoices({ key: 'designation1', value: 'INC.' })
   //     await wrapper.vm.$nextTick()
   //     expect(wrapper.vm.isValid).toBe(true)
-  //     expect(wrapper.find('#submit-continue-btn').element).toBeTruthy()
+  //     expect(wrapper.find('.submit-continue-btn').element).toBeTruthy()
   //   })
   //   it('calls showNextComponent() when continue button is clicked and form is valid', async () => {
   //     store.mutateNameChoicesToInitialState()
@@ -53,7 +53,7 @@ describe('names-capture', () => {
   //     store.mutateNameChoices({ key: 'name1', value: 'LALA NAME' })
   //     store.mutateNameChoices({ key: 'designation1', value: 'INC.' })
   //     await wrapper.vm.$nextTick()
-  //     let btn = wrapper.find('#submit-continue-btn')
+  //     let btn = wrapper.find('.submit-continue-btn')
   //     btn.trigger('click')
   //     await wrapper.vm.$nextTick()
   //     expect(wrapper.vm.isValid).toBeTruthy()