diff --git a/src/iss-components/cart-dropdown/__snapshots__/cart-dropdown.spec.js.snap b/src/iss-components/cart-dropdown/__snapshots__/cart-dropdown.spec.js.snap
index 9ade738d..eccaa6d2 100644
--- a/src/iss-components/cart-dropdown/__snapshots__/cart-dropdown.spec.js.snap
+++ b/src/iss-components/cart-dropdown/__snapshots__/cart-dropdown.spec.js.snap
@@ -2,6 +2,7 @@
 
 exports[`cart-dropdown component initial data rendered as expected 1`] = `
 Object {
+  "availableVaps": Array [],
   "cartItemType": Object {
     "MOBILE_FEE": "MOBILE FEE",
     "RECYCLE_FEE": "RECYCLE FEE",
diff --git a/src/iss-components/cart-dropdown/cart-dropdown.spec.js b/src/iss-components/cart-dropdown/cart-dropdown.spec.js
index 80ee78d9..43a354d2 100644
--- a/src/iss-components/cart-dropdown/cart-dropdown.spec.js
+++ b/src/iss-components/cart-dropdown/cart-dropdown.spec.js
@@ -57,7 +57,11 @@ beforeEach(() => {
 describe('cart-dropdown component', () => {
     test('initial data rendered as expected', () => {
         // Arrange
-        const { wrapper } = getMountedComponent({});
+        const { wrapper } = getMountedComponent({
+            order: {
+                availableVaps: []
+            }
+        });
 
         // Assert
         expect(wrapper.vm.$data).toMatchSnapshot();
@@ -74,6 +78,30 @@ describe('cart-dropdown component', () => {
             // Assert
             expect(head.exists()).toBeTruthy();
         });
+        test('cart dropdown head is visible', () => {
+            // Arrange
+            const reference = '#cart-dropdown-head';
+            const { wrapper } = getMountedComponent(cartDropdown, {}, { showDropdownHeader: true });
+
+            // Act
+            const head = wrapper.find(reference);
+
+            // Assert
+            expect(head.exists()).toBeTruthy();
+            expect(head.classes()).toContain('cart-toggle');
+        });
+        test('cart dropdown head is not visible', () => {
+            // Arrange
+            const reference = '#cart-dropdown-head';
+            const { wrapper } = getMountedComponent(cartDropdown, {}, { showDropdownHeader: false });
+
+            // Act
+            const head = wrapper.find(reference);
+
+            // Assert
+            expect(head.exists()).toBeTruthy();
+            expect(head.classes()).not.toContain('cart-toggle');
+        });
         test('cart table', () => {
             // Arrange
             const reference = '#cart-table';
@@ -797,8 +825,8 @@ describe('cart-dropdown component', () => {
             test('returns expected when availableVaps null', async () => {
                 // Arrange
                 const availableVaps = [{ partNumber: 'vaps1' }];
-                const propsData = { availableVaps };
-                const { wrapper } = getMountedComponent({}, {}, propsData);
+                const initialData = { availableVaps };
+                const { wrapper } = getMountedComponent({}, initialData, {});
                 const expected = availableVaps;
 
                 // Act
@@ -825,10 +853,10 @@ describe('cart-dropdown component', () => {
                         }
                     }
                 };
-                const propsData = {
+                const initialData = {
                     availableVaps: [part4, part5]
                 };
-                const { wrapper } = getMountedComponent(storeData, {}, propsData);
+                const { wrapper } = getMountedComponent(storeData, initialData, {});
                 const sortByPartType = (a, b) => {
                     const typeA = a.partType.toUpperCase();
                     const typeB = b.partType.toUpperCase();
diff --git a/src/iss-components/cart-dropdown/cart-dropdown.vue b/src/iss-components/cart-dropdown/cart-dropdown.vue
index 5d1505e0..494753d9 100644
--- a/src/iss-components/cart-dropdown/cart-dropdown.vue
+++ b/src/iss-components/cart-dropdown/cart-dropdown.vue
@@ -1,8 +1,9 @@
 <template>
     <div>
         <div
+            v-if="showDropdownHeader"
             id="cart-dropdown-head"
-            class="row cart-toggle flex align-items-center pt-4"
+            class="row flex align-items-center pt-4 cart-header cart-toggle"
             :class="[isExpanded ? 'expanded' : '']"
             @click="toggleIsExpanded">
             <a
@@ -13,6 +14,11 @@
                 <span class="color-green">{{ getDisplayed(amountDue) }}</span>
             </a>
         </div>
+        <div
+            v-else
+            id="cart-dropdown-head"
+            class="expanded cart-header">
+        </div>
         <div
             id="cart-table"
             class="cart-table">
@@ -169,11 +175,13 @@ export default {
         showAsPaid: Boolean,
         readOnly: Boolean,
         recyclingModalCmsWidgetName: String,
-        availableVaps: Array
+        showDropdownHeader: Boolean,
+        isInitiallyExpanded: Boolean
     },
     data() {
         return {
-            isExpanded: false,
+            isExpanded: this.isInitiallyExpanded,
+            availableVaps: useMainStore().order.availableVaps,
             widget: {
                 amountDue: 'AmountDueTextWidget',
                 deductible: 'DeductibleWidget',
@@ -535,25 +543,30 @@ export default {
     text-align: center;
 }
 
-.cart-toggle {
-    font-weight: $font-weight-bold;
+.cart-header {
+    &.cart-toggle {
+        font-weight: $font-weight-bold;
 
-    &:after {
-        content: "";
-        transition: all 0.5s ease;
-        background-image: url($svg-payment-method-review-toggle);
-        background-repeat: no-repeat;
-        background-position: right center;
-        width: 1rem;
-        height: 0.5625rem;
-        display: inline-flex;
-        position: relative;
-        right: 0.75rem;
-        margin: 0.5rem 0 0.5rem 1rem;
-        cursor: pointer;
-    }
-    &.expanded:after {
-        transform: rotate(180deg);
+        &:after {
+            content: "";
+            transition: all 0.5s ease;
+            background-image: url($svg-payment-method-review-toggle);
+            background-repeat: no-repeat;
+            background-position: right center;
+            width: 1rem;
+            height: 0.5625rem;
+            display: inline-flex;
+            position: relative;
+            right: 0.75rem;
+            margin: 0.5rem 0 0.5rem 1rem;
+            cursor: pointer;
+        }
+        &.expanded:after {
+            transform: rotate(180deg);
+        }
+        a {
+            text-decoration: none;
+        }
     }
     &.expanded + .cart-table {
         max-height: 50rem;
@@ -561,9 +574,6 @@ export default {
         overflow: hidden;
         visibility: visible;
     }
-    a {
-        text-decoration: none;
-    }
 }
 
 :deep(#recycle-fee-label a){
diff --git a/src/layouts/payment-method/payment-method.vue b/src/layouts/payment-method/payment-method.vue
index cb5605a5..6bf7bb79 100644
--- a/src/layouts/payment-method/payment-method.vue
+++ b/src/layouts/payment-method/payment-method.vue
@@ -22,9 +22,10 @@
                 <cartDropdown
                     :showAsPaid="false"
                     :readOnly="false"
+                    :showDropdownHeader="true"
+                    :isInitiallyExpanded="false"
                     recyclingModalCmsWidgetName="RecycleModal"
-                    servicePackageTitleWidgetName="ServicePackageTitle"
-                    :availableVaps="availableVaps" />
+                    servicePackageTitleWidgetName="ServicePackageTitle" />
                 <hr class="mt-0 mb-5" />
                 <alert
                     v-if="displayPayInAdvanceAlert"
@@ -79,6 +80,7 @@ import { Form } from 'vee-validate';
 import issPageValues from '@/router/router-constants/issPage-values';
 import bailoutMessage from '@/constants/bailoutMessage';
 import { AppointmentTypeStrings } from '@/constants/schedule-constants';
+import VehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
 
 export default {
     name: 'payment-method',
@@ -91,7 +93,8 @@ export default {
         reviewDropdown,
         cartDropdown,
         paymentMethodQuestion,
-        alert
+        alert,
+        VehicleBanner
     },
     mixins: [baseFormMixin],
     async beforeRouteEnter(to, from, next) {
@@ -142,13 +145,12 @@ export default {
                 vm.setCmsContent(resultMap.cmsContent);
                 vm.updateFooterButtonText(vm.customCallToActionButtonCopy);
                 vm.$refs.reviewDropdown.initializeComponent(resultMap.reviewDropdownData);
-                vm.setAvailableVaps(pricedVaps ?? []);
+                vm.storeAvailableVaps(pricedVaps ?? []);
             });
         }
     },
     data() {
         return {
-            availableVaps: [],
             paymentMethodInternalModel: this.getPaymentMethodFromStore(),
             rules: {
                 optionRequired: globalRules.OPTION_REQUIRED
@@ -291,8 +293,8 @@ export default {
                 );
             }
         },
-        setAvailableVaps(vaps) {
-            this.availableVaps = vaps;
+        storeAvailableVaps(vaps) {
+            useMainStore().order.availableVaps = vaps;
         }
     }
 };
diff --git a/src/layouts/payment-page/payment-page.vue b/src/layouts/payment-page/payment-page.vue
index 83e878ea..ce8aec40 100644
--- a/src/layouts/payment-page/payment-page.vue
+++ b/src/layouts/payment-page/payment-page.vue
@@ -40,6 +40,16 @@
                         :isForwardButtonHidden="true"
                         @ForwardClicked="forwardButtonAction"
                         @backClicked="backButtonAction" />
+
+                    <div class="px-2">
+                        <cartDropdown
+                            :showAsPaid="false"
+                            :readOnly="true"
+                            :showDropdownHeader="false"
+                            :isInitiallyExpanded="true"
+                            recyclingModalCmsWidgetName="RecycleModal"
+                            servicePackageTitleWidgetName="ServicePackageTitle" />
+                    </div>
                 </div>
             </div>
 
@@ -390,10 +400,12 @@ import { hopPaymentMethods, paymentMethods } from '@/constants/payment-method-co
 import { AppointmentTypeStrings } from '@/constants/schedule-constants.js';
 import queryStrings from '@/constants/query-strings';
 import alert from '@/ux-components/alert/alert.vue';
+import cartDropdown from "@/iss-components/cart-dropdown/cart-dropdown.vue";
 
 export default {
     name: 'payment-page',
     components: {
+        cartDropdown,
         siteHeader,
         siteFooter,
         // eslint-disable-next-line vue/no-reserved-component-names
diff --git a/src/store/index.js b/src/store/index.js
index 9e06815c..c419b8a8 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -206,7 +206,8 @@ export const getDefaultState = () => ({
         currentDeductible: null,
         carrierPhoneNumber: null,
         loadedFromDupeCheck: null,
-        loadedSessionClearedPreviousData: null
+        loadedSessionClearedPreviousData: null,
+        availableVaps: null
     },
     applicationUser: {
         experiments: [],