diff --git a/src/digital-components/button-question/button-question.vue b/src/digital-components/button-question/button-question.vue
index 2bb4bec7f..e1df5cba1 100644
--- a/src/digital-components/button-question/button-question.vue
+++ b/src/digital-components/button-question/button-question.vue
@@ -213,7 +213,7 @@ export default {
                     classes = "ui-checkbox d-flex";
                     break;
                 case "servicePackageRadio":
-                    classes = "package-main d-md-flex justify-content-center";
+                    classes = "package-main d-md-flex justify-content-md-center";
                     break;
             }
             return classes;
@@ -255,7 +255,7 @@ export default {
                 buttonFooterCopy: answer.buttonFooterCopy ?? answer.buttonFooterCopy,
                 buttonImage: answer.buttonImage ?? answer.AnswerImageUrl,
                 buttonImageId: answer.buttonImageId ?? answer.ImageId,
-                additionalButtonData: answer.additionalButtonData,
+                additionalButtonData: answer.additionalButtonData ?? answer.additionalButtonData,
                 groupName: this.formatString(this.groupName),
                 value:
                     answer.value ??
diff --git a/src/layouts/quote/quote.vue b/src/layouts/quote/quote.vue
index 414c62149..a85fd7d29 100644
--- a/src/layouts/quote/quote.vue
+++ b/src/layouts/quote/quote.vue
@@ -1,7 +1,7 @@
 <template>
     <Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
         <loadingModal ref="loadingModal" />
-        <div class="container-fluid page-container-grouped-styles quote">
+        <div class="container-fluid page-container-grouped-styles">
             <div class="row justify-content-center">
                 <div class="col-md-6">
                     <funnelHeader cmsWidgetName="FunnelHeaderWidget" ref="funnelHeader" />
@@ -23,7 +23,7 @@
                 </div>
             </div>
             <div class="row justify-content-center">
-                <div class="col-md-6 col-lg-4">
+                <div class="col-md-12 col-xl-8">
                     <servicePackageQuestion
                         ref="servicePackage"
                         cashCmsWidgetName="CashServicePackageQuestionWidget"
@@ -49,13 +49,14 @@
                         :lineItems="lineItems" />
 
                     <recalDisclaimer
+                        class="mb-0"
                         cmsWidgetName="RecalDisclaimerWidget"
                         v-if="isRecalibrationOnOrder"
                         v-on="{ textLinkClicked: openModalAction }"
                         alertClass="alert-info" />
 
                     <promoModalQuestion
-                        class="small mt-4"
+                        class="small mt-6 d-md-flex justify-content-md-center"
                         v-model="lineItems"
                         :addableVaps="addableVaps"
                         pageName="quote"
@@ -67,7 +68,7 @@
                         cmsWidgetName="quoteDisclaimer"
                         justifyText="left"
                         typeStyle="caption"
-                        class="mt-4" />
+                        class="mt-6" />
 
                     <contentGroupModal ref="RainDefenseModal" cmsWidgetName="RainDefenseModal" />
                     <contentGroupModal ref="FrontWiperModal" cmsWidgetName="FrontWiperModal" />
diff --git a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
index 15993f87c..867baded2 100644
--- a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
+++ b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
@@ -12,9 +12,7 @@
             ]"
             for="testradio">
             <div class="package-specs">
-                <div
-                    v-if="this.additionalButtonData.servicePackageDiscount"
-                    class="row justify-content-between">
+                <div v-if="this.additionalButtonData.servicePackageDiscount" class="row">
                     <div class="col md-6">
                         <p class="m-0">
                             <span v-html="this.buttonLabel"></span>
@@ -140,18 +138,24 @@ export default {
 <style lang="scss">
 .package-main {
     .package-wrapper {
-        margin: 1rem 0;
-        @include media-breakpoint-up(md) {
-            margin: 0.5rem 0;
-        }
-        position: relative;
+        margin: 0.5rem 0;
         @include media-breakpoint-up(md) {
             margin: 1rem 0.5rem;
+            display: flex;
+            flex-direction: column;
+            align-self: flex-end;
         }
 
         label {
             display: block;
-            height: 100%;
+            @include media-breakpoint-up(md) {
+                display: flex;
+                min-height: 320px;
+            }
+            @include media-breakpoint-up(xl) {
+                display: flex;
+                min-height: 276px;
+            }
         }
 
         input[type="radio"] {
@@ -172,21 +176,13 @@ export default {
                 border-radius: 0.5rem;
                 overflow: hidden;
                 min-height: 60px;
-                @include media-breakpoint-up(md) {
-                    max-height: 500px;
-                    height: 100%;
-                }
 
                 &.has-subheader {
                     min-height: 80px;
                 }
                 &.has-text {
                     border-radius: 0 0 0.5rem 0.5rem;
-                    border: 1px solid #469d2a;
-                    @include media-breakpoint-up(md) {
-                        border-radius: 0.5rem;
-                        padding-top: 3.75rem;
-                    }
+                    border: 1px solid #469d2a; //Temp color
                 }
 
                 &:before {
@@ -283,6 +279,15 @@ export default {
                     &.pricing-info {
                         color: $green;
                         font-size: 0.875rem;
+                        @include media-breakpoint-up(md) {
+                            position: absolute;
+                            bottom: 0.75rem;
+                            left: 0;
+                            width: 100%;
+                            text-align: center;
+                            font-size: 1.125rem;
+                            color: $gray-500;
+                        }
                         span.strikethrough-price {
                             text-decoration: line-through;
                             font-size: 0.75rem;
@@ -300,23 +305,30 @@ export default {
             }
             span {
                 &.service-package-discount {
-                    color: #469d2a;
+                    color: #469d2a; //Temp color
                     text-align: end;
                     font-weight: 500;
                     font-size: 13px;
                     div.strikethrough-discount-price {
                         text-decoration: line-through;
                         margin-right: 0;
-                        font-weight: 500;
-                        font-size: 14px;
+                        font-weight: 400;
+                        font-size: 0.875rem;
                         line-height: 20px;
-                        color: $gray-550;
+                        color: $gray-500;
                         padding-right: 2px;
                     }
                     div.discount-price {
-                        color: #469d2a;
+                        color: #469d2a; //Temp color
                         font-weight: 600;
-                        font-size: 26px;
+                        font-size: 1.625rem;
+                    }
+                    @include media-breakpoint-up(md) {
+                        position: absolute;
+                        bottom: 0.75rem;
+                        left: 0;
+                        width: 100%;
+                        text-align: center;
                     }
                 }
             }
@@ -353,28 +365,15 @@ export default {
             }
         }
         .discount-text {
-            line-height: 36px;
+            height: 2rem;
             display: flex;
             border-top-right-radius: 0.5rem;
             border-top-left-radius: 0.5rem;
-            background-color: #469d2a;
+            background-color: #469d2a; //Temp color
             align-items: center;
             justify-content: center;
-            padding: 5px;
             width: 100%;
             color: white;
-            height: 2.875rem;
-            @include media-breakpoint-up(md) {
-                position: absolute;
-                z-index: 1;
-                ~ label {
-                    .package-label {
-                        &:after {
-                            top: 68px;
-                        }
-                    }
-                }
-            }
         }
     }
 }
diff --git a/src/styles/common-styles.scss b/src/styles/common-styles.scss
index be01f3ed8..730712297 100644
--- a/src/styles/common-styles.scss
+++ b/src/styles/common-styles.scss
@@ -37,18 +37,9 @@ body {
                 max-width: 100%;
             }
         }
-        // Quote page desktop
-        &.quote {
-            .col-md-6,
-            .col-lg-4 {
-                max-width: 1200px;
-            }
-            .col-md-6.col-lg-4 {
-                @include media-breakpoint-up(lg) {
-                    width: 100%;
-                    max-width: 910px;
-                }
-            }
+        //Quote page max-width for service packages
+        .col-xl-8 {
+            max-width: 1200px;
         }
         //END set max-width on columns
     }