diff --git a/src/fmg-components/cart/cart.vue b/src/fmg-components/cart/cart.vue
index 3a3a00598..4342b687f 100644
--- a/src/fmg-components/cart/cart.vue
+++ b/src/fmg-components/cart/cart.vue
@@ -5,10 +5,10 @@
                 class="row vin-toggle flex align-items-center pt-4"
                 :class="[isExpanded ? 'expanded' : '']"
                 @click="toggleIsExpanded()">
-                <div class="col d-flex justify-content-between">
-                    <span class="label">{{ amountDueText }}</span
-                    ><span class="label amount-due">{{ getFormattedAmount("", amountDue) }}</span>
-                </div>
+                <a href="#!" class="col d-flex justify-content-between py-0">
+                    <span class="label">{{ amountDueText }}</span>
+                    <span class="label amount-due">{{ getFormattedAmount("", amountDue) }}</span>
+                </a>
             </div>
             <div class="price-table">
                 <div class="service-type">
@@ -789,6 +789,7 @@ export default {
         color: $gray;
     }
     .label {
+        color: $black;
         font-weight: 500;
     }
     .amount-due {
@@ -798,6 +799,7 @@ export default {
         max-height: 0;
         transition: all 350ms ease-in;
         overflow: hidden;
+        visibility: hidden;
 
         div {
             display: flex;
@@ -901,6 +903,10 @@ export default {
             transition: all 150ms ease-in;
             overflow: hidden;
             padding-top: 1rem;
+            visibility: visible;
+        }
+        a {
+            text-decoration: none;
         }
     }
 }