diff --git a/package/src/components/CartItem/v1/CartItem.js b/package/src/components/CartItem/v1/CartItem.js
index 7016e0db0..7042f1190 100644
--- a/package/src/components/CartItem/v1/CartItem.js
+++ b/package/src/components/CartItem/v1/CartItem.js
@@ -80,7 +80,7 @@ const ItemContentQuantityInput = styled.div`
 `;
 
 const ItemContentPrice = styled.div`
-  position: ${(props) => (props.isMiniCart ? "absolute" : "initial")};
+  position: initial;
   bottom: ${applyTheme("CartItem.paddingBottom")};
   right: 0;
   text-align: right;
@@ -93,7 +93,7 @@ const ItemContentPrice = styled.div`
 `;
 
 const ItemContentSubtotal = styled.div`
-  position: ${(props) => (props.isMiniCart ? "initial" : "absolute")};
+  position: absolute;
   margin-top: ${(props) => (props.isMiniCart ? applyTheme("CartItem.subtotalDisplaySpacingAbove")(props) : "0")};
   bottom: ${applyTheme("CartItem.paddingBottom")};
   right: 0;
diff --git a/package/src/components/CartItem/v1/CartItem.md b/package/src/components/CartItem/v1/CartItem.md
index a5062d02c..096d1052d 100644
--- a/package/src/components/CartItem/v1/CartItem.md
+++ b/package/src/components/CartItem/v1/CartItem.md
@@ -30,7 +30,7 @@ const item = {
     displayAmount: "$40.00",
   },
   title: "A Great Product",
-  quantity: 2
+  quantity: 2,
 };
 
 <CartItem
@@ -92,7 +92,10 @@ const item = {
   productSlug: "product-slug",
   productVendor: "Patagonia",
   title: "A Great Product",
-  quantity: 2
+  quantity: 2,
+  subtotal: {
+    displayAmount: "$40.00",
+  }
 };
 
 <CartItem
@@ -122,7 +125,10 @@ const item = {
   productSlug: "product-slug",
   productVendor: "Patagonia",
   title: "A Great Product",
-  quantity: 2
+  quantity: 2,
+  subtotal: {
+    displayAmount: "$40.00",
+  }
 };
 
 <CartItem
@@ -152,7 +158,10 @@ const item = {
   productSlug: "product-slug",
   productVendor: "Patagonia",
   title: "A Great Product",
-  quantity: 2
+  quantity: 2,
+  subtotal: {
+    displayAmount: "$40.00",
+  }
 };
 
 <CartItem
@@ -183,7 +192,10 @@ const item = {
   productSlug: "product-slug",
   productVendor: "Patagonia",
   title: "A Great Product",
-  quantity: 2
+  quantity: 2,
+  subtotal: {
+    displayAmount: "$40.00",
+  }
 };
 
 <CartItem
@@ -216,7 +228,10 @@ const item = {
   productSlug: "product-slug",
   productVendor: "Patagonia",
   title: "A Great Product",
-  quantity: 2
+  quantity: 2,
+  subtotal: {
+    displayAmount: "$40.00",
+  }
 };
 
 <CartItem
diff --git a/package/src/components/CartItems/v1/CartItems.md b/package/src/components/CartItems/v1/CartItems.md
index 828aaa1c7..ef57cf521 100644
--- a/package/src/components/CartItems/v1/CartItems.md
+++ b/package/src/components/CartItems/v1/CartItems.md
@@ -141,7 +141,10 @@ const items = [{
   productVendor: "Patagonia",
   productSlug: "product-slug",
   title: "A Great Product",
-  quantity: 2
+  quantity: 2,
+  subtotal: {
+    displayAmount: "$40.00",
+  }
 },
 {
   _id: "456",
@@ -192,7 +195,10 @@ const items = [{
   productVendor: "Patagonia",
   productSlug: "product-slug",
   title: "A Great Product",
-  quantity: 2
+  quantity: 2,
+  subtotal: {
+    displayAmount: "$40.00",
+  }
 },
 {
   _id: "456",
diff --git a/package/src/components/CartSummary/v1/CartSummary.js b/package/src/components/CartSummary/v1/CartSummary.js
index 2259940bd..0dc5d3492 100644
--- a/package/src/components/CartSummary/v1/CartSummary.js
+++ b/package/src/components/CartSummary/v1/CartSummary.js
@@ -24,7 +24,7 @@ const Thr = styled.th`
 `;
 
 const Td = styled.td`
-  ${addTypographyStyles("CartSummaryLeftColumn", "bodyText")}
+  ${addTypographyStyles("CartSummaryLeftColumn", "labelText")}
   border-top-color: ${applyTheme("CartSummary.borderColor")};
   border-top-style: solid;
   border-top-width: ${(props) => (props.isBordered ? applyTheme("CartSummary.borderWidth")(props) : "0")};
@@ -36,7 +36,7 @@ const Td = styled.td`
 `;
 
 const TdValue = styled(Td)`
-  ${addTypographyStyles("CartSummaryRightColumn", "bodyText")}
+  ${addTypographyStyles("CartSummaryRightColumn", "labelText")}
   text-align: right;
 `;
 
@@ -45,11 +45,48 @@ const Title = styled.span`
 `;
 
 const Discount = styled.span`
-  ${addTypographyStyles("CartSummaryDiscount", "bodyTextBold")}
+  ${addTypographyStyles("CartSummaryDiscount", "labelTextBold")}
+`;
+
+
+const TdTax = styled.td`
+  ${addTypographyStyles("CartSummaryLeftColumn", "labelText")}
+  border-top-color: ${applyTheme("CartSummary.borderColor")};
+  border-top-style: solid;
+  border-top-width: ${(props) => (props.isBordered ? applyTheme("CartSummary.borderWidth")(props) : "0")};
+  padding-bottom: ${applyTheme("CartSummary.rowPaddingBottom")};
+  padding-left: 0;
+  padding-right: 0;
+  padding-top: ${(props) => (props.isDense ? applyTheme("CartSummary.rowDensePaddingTop")(props) : applyTheme("CartSummary.rowPaddingTop")(props))};
+  text-align: left;
+`;
+
+const TdTaxValue = styled(Td)`
+  ${addTypographyStyles("CartSummaryRightColumn", "labelText")}
+  padding-bottom: ${applyTheme("CartSummary.rowPaddingBottom")};
+  text-align: right;
+`;
+
+const TdTotal = styled.td`
+  ${addTypographyStyles("CartSummaryLeftColumn", "labelText")}
+  border-top-color: ${applyTheme("CartSummary.borderColor")};
+  border-top-style: solid;
+  border-top-width: ${(props) => (props.isBordered ? applyTheme("CartSummary.borderWidth")(props) : "0")};
+  padding-bottom: ${applyTheme("CartSummary.rowPaddingBottom")};
+  padding-left: 0;
+  padding-right: 0;
+  padding-top: ${applyTheme("CartSummary.rowPaddingTop")};
+  text-align: left;
+`;
+
+const TdTotalValue = styled(Td)`
+  text-align: right;
+  padding-bottom: ${applyTheme("CartSummary.rowPaddingBottom")};
+  padding-top: ${applyTheme("CartSummary.rowPaddingTop")};
 `;
 
 const Total = styled.span`
-  ${addTypographyStyles("CartSummaryTotal", "bodyTextBold")}
+  ${addTypographyStyles("CartSummaryTotal", "subheadingTextBold")}
 `;
 
 class CartSummary extends Component {
@@ -119,7 +156,7 @@ class CartSummary extends Component {
 
     return (
       <tr>
-        <Td isDense={isDense}>Promo code applied</Td>
+        <Td isDense={isDense}>Promo code applied:</Td>
         <TdValue isDense={isDense}>
           <Discount>{displayDiscount}</Discount>
         </TdValue>
@@ -152,27 +189,27 @@ class CartSummary extends Component {
         {header}
         <tbody>
           <tr>
-            <Td isDense={isDense}>Item total</Td>
+            <Td isDense={isDense}>Items:</Td>
             <TdValue isDense={isDense}>{displaySubtotal}</TdValue>
           </tr>
           <tr>
-            <Td isDense={isDense}>Shipping</Td>
+            <Td isDense={isDense}>Shipping:</Td>
             <TdValue isDense={isDense}>{shipping}</TdValue>
           </tr>
           {discount}
           <tr>
-            <Td isDense={isDense}>Surcharge</Td>
+            <Td isDense={isDense}>Surcharges:</Td>
             <TdValue isDense={isDense}>{surcharge}</TdValue>
           </tr>
           <tr>
-            <Td isDense={isDense}>Tax</Td>
-            <TdValue isDense={isDense}>{tax}</TdValue>
+            <TdTax isDense={isDense}>Tax:</TdTax>
+            <TdTaxValue isDense={isDense}>{tax}</TdTaxValue>
           </tr>
           <tr>
-            <Td isDense={isDense} isBordered>Order total</Td>
-            <TdValue isDense={isDense} isBordered>
+            <TdTotal isDense={isDense} isBordered>Order total:</TdTotal>
+            <TdTotalValue isDense={isDense} isBordered>
               <Total>{displayTotal}</Total>
-            </TdValue>
+            </TdTotalValue>
           </tr>
         </tbody>
       </Table>
diff --git a/package/src/components/CartSummary/v1/CartSummary.md b/package/src/components/CartSummary/v1/CartSummary.md
index 1c60aed4c..d8db06afc 100644
--- a/package/src/components/CartSummary/v1/CartSummary.md
+++ b/package/src/components/CartSummary/v1/CartSummary.md
@@ -99,8 +99,8 @@ Assume that any theme prop that does not begin with "rui" is within `rui_compone
 
 - The left column header uses `bodyText` style with `rui_components.CartSummaryLeftColumnHeader` override
 - The right column header uses `bodyText` style with `rui_components.CartSummaryRightColumnHeader` override
-- The left column uses `bodyText` style with `rui_components.CartSummaryLeftColumn` override
-- The right column uses `bodyText` style with `rui_components.CartSummaryRightColumn` override
+- The left column uses `labelText` style with `rui_components.CartSummaryLeftColumn` override
+- The right column uses `labelText` style with `rui_components.CartSummaryRightColumn` override
 - The title uses `bodyTextBold` style with `rui_components.CartSummaryTitle` override
 - The discount value uses `bodyTextBold` style with `rui_components.CartSummaryDiscount` override
-- The total value uses `bodyTextBold` style with `rui_components.CartSummaryTotal` override
+- The total value uses `subheadingTextBold` style with `rui_components.CartSummaryTotal` override
diff --git a/package/src/components/CartSummary/v1/__snapshots__/CartSummary.test.js.snap b/package/src/components/CartSummary/v1/__snapshots__/CartSummary.test.js.snap
index 068573032..acd8f03ba 100644
--- a/package/src/components/CartSummary/v1/__snapshots__/CartSummary.test.js.snap
+++ b/package/src/components/CartSummary/v1/__snapshots__/CartSummary.test.js.snap
@@ -47,14 +47,14 @@ exports[`Displays a summary of the current items in the cart 1`] = `
   -webkit-font-smoothing: antialiased;
   color: #3c3c3c;
   font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
-  font-size: 16px;
+  font-size: 14px;
   font-style: normal;
   font-stretch: normal;
   font-weight: 400;
-  -webkit-letter-spacing: .03em;
-  -moz-letter-spacing: .03em;
-  -ms-letter-spacing: .03em;
-  letter-spacing: .03em;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
   line-height: 1;
   border-top-color: #e6e6e6;
   border-top-style: solid;
@@ -66,18 +66,18 @@ exports[`Displays a summary of the current items in the cart 1`] = `
   text-align: left;
 }
 
-.c6 {
+.c10 {
   -webkit-font-smoothing: antialiased;
   color: #3c3c3c;
   font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
-  font-size: 16px;
+  font-size: 14px;
   font-style: normal;
   font-stretch: normal;
   font-weight: 400;
-  -webkit-letter-spacing: .03em;
-  -moz-letter-spacing: .03em;
-  -ms-letter-spacing: .03em;
-  letter-spacing: .03em;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
   line-height: 1;
   border-top-color: #e6e6e6;
   border-top-style: solid;
@@ -93,14 +93,14 @@ exports[`Displays a summary of the current items in the cart 1`] = `
   -webkit-font-smoothing: antialiased;
   color: #3c3c3c;
   font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
-  font-size: 16px;
+  font-size: 14px;
   font-style: normal;
   font-stretch: normal;
   font-weight: 400;
-  -webkit-letter-spacing: .03em;
-  -moz-letter-spacing: .03em;
-  -ms-letter-spacing: .03em;
-  letter-spacing: .03em;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
   line-height: 1;
   text-align: right;
 }
@@ -120,11 +120,80 @@ exports[`Displays a summary of the current items in the cart 1`] = `
   line-height: 1;
 }
 
+.c6 {
+  -webkit-font-smoothing: antialiased;
+  color: #3c3c3c;
+  font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
+  font-size: 14px;
+  font-style: normal;
+  font-stretch: normal;
+  font-weight: 400;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
+  line-height: 1;
+  border-top-color: #e6e6e6;
+  border-top-style: solid;
+  border-top-width: 0;
+  padding-bottom: 16px;
+  padding-left: 0;
+  padding-right: 0;
+  padding-top: 16px;
+  text-align: left;
+}
+
 .c7 {
   -webkit-font-smoothing: antialiased;
   color: #3c3c3c;
   font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
-  font-size: 16px;
+  font-size: 14px;
+  font-style: normal;
+  font-stretch: normal;
+  font-weight: 400;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
+  line-height: 1;
+  padding-bottom: 16px;
+  text-align: right;
+}
+
+.c8 {
+  -webkit-font-smoothing: antialiased;
+  color: #3c3c3c;
+  font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
+  font-size: 14px;
+  font-style: normal;
+  font-stretch: normal;
+  font-weight: 400;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
+  line-height: 1;
+  border-top-color: #e6e6e6;
+  border-top-style: solid;
+  border-top-width: 1px;
+  padding-bottom: 16px;
+  padding-left: 0;
+  padding-right: 0;
+  padding-top: 16px;
+  text-align: left;
+}
+
+.c9 {
+  text-align: right;
+  padding-bottom: 16px;
+  padding-top: 16px;
+}
+
+.c11 {
+  -webkit-font-smoothing: antialiased;
+  color: #3c3c3c;
+  font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
+  font-size: 18px;
   font-style: normal;
   font-stretch: normal;
   font-weight: 700;
@@ -161,7 +230,7 @@ exports[`Displays a summary of the current items in the cart 1`] = `
       <td
         className="c4"
       >
-        Item total
+        Items:
       </td>
       <td
         className="c5 c4"
@@ -173,7 +242,7 @@ exports[`Displays a summary of the current items in the cart 1`] = `
       <td
         className="c4"
       >
-        Shipping
+        Shipping:
       </td>
       <td
         className="c5 c4"
@@ -185,7 +254,7 @@ exports[`Displays a summary of the current items in the cart 1`] = `
       <td
         className="c4"
       >
-        Surcharge
+        Surcharges:
       </td>
       <td
         className="c5 c4"
@@ -195,27 +264,27 @@ exports[`Displays a summary of the current items in the cart 1`] = `
     </tr>
     <tr>
       <td
-        className="c4"
+        className="c6"
       >
-        Tax
+        Tax:
       </td>
       <td
-        className="c5 c4"
+        className="c7 c4"
       >
         -
       </td>
     </tr>
     <tr>
       <td
-        className="c6"
+        className="c8"
       >
-        Order total
+        Order total:
       </td>
       <td
-        className="c5 c6"
+        className="c9 c10"
       >
         <span
-          className="c7"
+          className="c11"
         >
           $300.424
         </span>
@@ -272,14 +341,14 @@ exports[`Displays a summary with FREE shipping 1`] = `
   -webkit-font-smoothing: antialiased;
   color: #3c3c3c;
   font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
-  font-size: 16px;
+  font-size: 14px;
   font-style: normal;
   font-stretch: normal;
   font-weight: 400;
-  -webkit-letter-spacing: .03em;
-  -moz-letter-spacing: .03em;
-  -ms-letter-spacing: .03em;
-  letter-spacing: .03em;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
   line-height: 1;
   border-top-color: #e6e6e6;
   border-top-style: solid;
@@ -291,18 +360,18 @@ exports[`Displays a summary with FREE shipping 1`] = `
   text-align: left;
 }
 
-.c6 {
+.c10 {
   -webkit-font-smoothing: antialiased;
   color: #3c3c3c;
   font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
-  font-size: 16px;
+  font-size: 14px;
   font-style: normal;
   font-stretch: normal;
   font-weight: 400;
-  -webkit-letter-spacing: .03em;
-  -moz-letter-spacing: .03em;
-  -ms-letter-spacing: .03em;
-  letter-spacing: .03em;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
   line-height: 1;
   border-top-color: #e6e6e6;
   border-top-style: solid;
@@ -318,14 +387,14 @@ exports[`Displays a summary with FREE shipping 1`] = `
   -webkit-font-smoothing: antialiased;
   color: #3c3c3c;
   font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
-  font-size: 16px;
+  font-size: 14px;
   font-style: normal;
   font-stretch: normal;
   font-weight: 400;
-  -webkit-letter-spacing: .03em;
-  -moz-letter-spacing: .03em;
-  -ms-letter-spacing: .03em;
-  letter-spacing: .03em;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
   line-height: 1;
   text-align: right;
 }
@@ -345,11 +414,80 @@ exports[`Displays a summary with FREE shipping 1`] = `
   line-height: 1;
 }
 
+.c6 {
+  -webkit-font-smoothing: antialiased;
+  color: #3c3c3c;
+  font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
+  font-size: 14px;
+  font-style: normal;
+  font-stretch: normal;
+  font-weight: 400;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
+  line-height: 1;
+  border-top-color: #e6e6e6;
+  border-top-style: solid;
+  border-top-width: 0;
+  padding-bottom: 16px;
+  padding-left: 0;
+  padding-right: 0;
+  padding-top: 16px;
+  text-align: left;
+}
+
 .c7 {
   -webkit-font-smoothing: antialiased;
   color: #3c3c3c;
   font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
-  font-size: 16px;
+  font-size: 14px;
+  font-style: normal;
+  font-stretch: normal;
+  font-weight: 400;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
+  line-height: 1;
+  padding-bottom: 16px;
+  text-align: right;
+}
+
+.c8 {
+  -webkit-font-smoothing: antialiased;
+  color: #3c3c3c;
+  font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
+  font-size: 14px;
+  font-style: normal;
+  font-stretch: normal;
+  font-weight: 400;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
+  line-height: 1;
+  border-top-color: #e6e6e6;
+  border-top-style: solid;
+  border-top-width: 1px;
+  padding-bottom: 16px;
+  padding-left: 0;
+  padding-right: 0;
+  padding-top: 16px;
+  text-align: left;
+}
+
+.c9 {
+  text-align: right;
+  padding-bottom: 16px;
+  padding-top: 16px;
+}
+
+.c11 {
+  -webkit-font-smoothing: antialiased;
+  color: #3c3c3c;
+  font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
+  font-size: 18px;
   font-style: normal;
   font-stretch: normal;
   font-weight: 700;
@@ -386,7 +524,7 @@ exports[`Displays a summary with FREE shipping 1`] = `
       <td
         className="c4"
       >
-        Item total
+        Items:
       </td>
       <td
         className="c5 c4"
@@ -398,7 +536,7 @@ exports[`Displays a summary with FREE shipping 1`] = `
       <td
         className="c4"
       >
-        Shipping
+        Shipping:
       </td>
       <td
         className="c5 c4"
@@ -410,7 +548,7 @@ exports[`Displays a summary with FREE shipping 1`] = `
       <td
         className="c4"
       >
-        Surcharge
+        Surcharges:
       </td>
       <td
         className="c5 c4"
@@ -420,27 +558,27 @@ exports[`Displays a summary with FREE shipping 1`] = `
     </tr>
     <tr>
       <td
-        className="c4"
+        className="c6"
       >
-        Tax
+        Tax:
       </td>
       <td
-        className="c5 c4"
+        className="c7 c4"
       >
         -
       </td>
     </tr>
     <tr>
       <td
-        className="c6"
+        className="c8"
       >
-        Order total
+        Order total:
       </td>
       <td
-        className="c5 c6"
+        className="c9 c10"
       >
         <span
-          className="c7"
+          className="c11"
         >
           $300.424
         </span>
@@ -497,14 +635,14 @@ exports[`Displays a summary with applied discount 1`] = `
   -webkit-font-smoothing: antialiased;
   color: #3c3c3c;
   font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
-  font-size: 16px;
+  font-size: 14px;
   font-style: normal;
   font-stretch: normal;
   font-weight: 400;
-  -webkit-letter-spacing: .03em;
-  -moz-letter-spacing: .03em;
-  -ms-letter-spacing: .03em;
-  letter-spacing: .03em;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
   line-height: 1;
   border-top-color: #e6e6e6;
   border-top-style: solid;
@@ -516,18 +654,18 @@ exports[`Displays a summary with applied discount 1`] = `
   text-align: left;
 }
 
-.c7 {
+.c11 {
   -webkit-font-smoothing: antialiased;
   color: #3c3c3c;
   font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
-  font-size: 16px;
+  font-size: 14px;
   font-style: normal;
   font-stretch: normal;
   font-weight: 400;
-  -webkit-letter-spacing: .03em;
-  -moz-letter-spacing: .03em;
-  -ms-letter-spacing: .03em;
-  letter-spacing: .03em;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
   line-height: 1;
   border-top-color: #e6e6e6;
   border-top-style: solid;
@@ -543,14 +681,14 @@ exports[`Displays a summary with applied discount 1`] = `
   -webkit-font-smoothing: antialiased;
   color: #3c3c3c;
   font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
-  font-size: 16px;
+  font-size: 14px;
   font-style: normal;
   font-stretch: normal;
   font-weight: 400;
-  -webkit-letter-spacing: .03em;
-  -moz-letter-spacing: .03em;
-  -ms-letter-spacing: .03em;
-  letter-spacing: .03em;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
   line-height: 1;
   text-align: right;
 }
@@ -574,22 +712,91 @@ exports[`Displays a summary with applied discount 1`] = `
   -webkit-font-smoothing: antialiased;
   color: #0db781;
   font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
-  font-size: 16px;
+  font-size: 14px;
   font-style: normal;
   font-stretch: normal;
   font-weight: 700;
-  -webkit-letter-spacing: .03em;
-  -moz-letter-spacing: .03em;
-  -ms-letter-spacing: .03em;
-  letter-spacing: .03em;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
   line-height: 1;
 }
 
+.c7 {
+  -webkit-font-smoothing: antialiased;
+  color: #3c3c3c;
+  font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
+  font-size: 14px;
+  font-style: normal;
+  font-stretch: normal;
+  font-weight: 400;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
+  line-height: 1;
+  border-top-color: #e6e6e6;
+  border-top-style: solid;
+  border-top-width: 0;
+  padding-bottom: 16px;
+  padding-left: 0;
+  padding-right: 0;
+  padding-top: 16px;
+  text-align: left;
+}
+
 .c8 {
   -webkit-font-smoothing: antialiased;
   color: #3c3c3c;
   font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
-  font-size: 16px;
+  font-size: 14px;
+  font-style: normal;
+  font-stretch: normal;
+  font-weight: 400;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
+  line-height: 1;
+  padding-bottom: 16px;
+  text-align: right;
+}
+
+.c9 {
+  -webkit-font-smoothing: antialiased;
+  color: #3c3c3c;
+  font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
+  font-size: 14px;
+  font-style: normal;
+  font-stretch: normal;
+  font-weight: 400;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
+  line-height: 1;
+  border-top-color: #e6e6e6;
+  border-top-style: solid;
+  border-top-width: 1px;
+  padding-bottom: 16px;
+  padding-left: 0;
+  padding-right: 0;
+  padding-top: 16px;
+  text-align: left;
+}
+
+.c10 {
+  text-align: right;
+  padding-bottom: 16px;
+  padding-top: 16px;
+}
+
+.c12 {
+  -webkit-font-smoothing: antialiased;
+  color: #3c3c3c;
+  font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
+  font-size: 18px;
   font-style: normal;
   font-stretch: normal;
   font-weight: 700;
@@ -626,7 +833,7 @@ exports[`Displays a summary with applied discount 1`] = `
       <td
         className="c4"
       >
-        Item total
+        Items:
       </td>
       <td
         className="c5 c4"
@@ -638,7 +845,7 @@ exports[`Displays a summary with applied discount 1`] = `
       <td
         className="c4"
       >
-        Shipping
+        Shipping:
       </td>
       <td
         className="c5 c4"
@@ -650,7 +857,7 @@ exports[`Displays a summary with applied discount 1`] = `
       <td
         className="c4"
       >
-        Promo code applied
+        Promo code applied:
       </td>
       <td
         className="c5 c4"
@@ -666,7 +873,7 @@ exports[`Displays a summary with applied discount 1`] = `
       <td
         className="c4"
       >
-        Surcharge
+        Surcharges:
       </td>
       <td
         className="c5 c4"
@@ -676,27 +883,27 @@ exports[`Displays a summary with applied discount 1`] = `
     </tr>
     <tr>
       <td
-        className="c4"
+        className="c7"
       >
-        Tax
+        Tax:
       </td>
       <td
-        className="c5 c4"
+        className="c8 c4"
       >
         -
       </td>
     </tr>
     <tr>
       <td
-        className="c7"
+        className="c9"
       >
-        Order total
+        Order total:
       </td>
       <td
-        className="c5 c7"
+        className="c10 c11"
       >
         <span
-          className="c8"
+          className="c12"
         >
           $300.424
         </span>
@@ -753,14 +960,14 @@ exports[`Displays a summary with calculated taxes 1`] = `
   -webkit-font-smoothing: antialiased;
   color: #3c3c3c;
   font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
-  font-size: 16px;
+  font-size: 14px;
   font-style: normal;
   font-stretch: normal;
   font-weight: 400;
-  -webkit-letter-spacing: .03em;
-  -moz-letter-spacing: .03em;
-  -ms-letter-spacing: .03em;
-  letter-spacing: .03em;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
   line-height: 1;
   border-top-color: #e6e6e6;
   border-top-style: solid;
@@ -772,18 +979,18 @@ exports[`Displays a summary with calculated taxes 1`] = `
   text-align: left;
 }
 
-.c6 {
+.c10 {
   -webkit-font-smoothing: antialiased;
   color: #3c3c3c;
   font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
-  font-size: 16px;
+  font-size: 14px;
   font-style: normal;
   font-stretch: normal;
   font-weight: 400;
-  -webkit-letter-spacing: .03em;
-  -moz-letter-spacing: .03em;
-  -ms-letter-spacing: .03em;
-  letter-spacing: .03em;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
   line-height: 1;
   border-top-color: #e6e6e6;
   border-top-style: solid;
@@ -799,14 +1006,14 @@ exports[`Displays a summary with calculated taxes 1`] = `
   -webkit-font-smoothing: antialiased;
   color: #3c3c3c;
   font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
-  font-size: 16px;
+  font-size: 14px;
   font-style: normal;
   font-stretch: normal;
   font-weight: 400;
-  -webkit-letter-spacing: .03em;
-  -moz-letter-spacing: .03em;
-  -ms-letter-spacing: .03em;
-  letter-spacing: .03em;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
   line-height: 1;
   text-align: right;
 }
@@ -826,11 +1033,80 @@ exports[`Displays a summary with calculated taxes 1`] = `
   line-height: 1;
 }
 
+.c6 {
+  -webkit-font-smoothing: antialiased;
+  color: #3c3c3c;
+  font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
+  font-size: 14px;
+  font-style: normal;
+  font-stretch: normal;
+  font-weight: 400;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
+  line-height: 1;
+  border-top-color: #e6e6e6;
+  border-top-style: solid;
+  border-top-width: 0;
+  padding-bottom: 16px;
+  padding-left: 0;
+  padding-right: 0;
+  padding-top: 16px;
+  text-align: left;
+}
+
 .c7 {
   -webkit-font-smoothing: antialiased;
   color: #3c3c3c;
   font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
-  font-size: 16px;
+  font-size: 14px;
+  font-style: normal;
+  font-stretch: normal;
+  font-weight: 400;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
+  line-height: 1;
+  padding-bottom: 16px;
+  text-align: right;
+}
+
+.c8 {
+  -webkit-font-smoothing: antialiased;
+  color: #3c3c3c;
+  font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
+  font-size: 14px;
+  font-style: normal;
+  font-stretch: normal;
+  font-weight: 400;
+  -webkit-letter-spacing: .02em;
+  -moz-letter-spacing: .02em;
+  -ms-letter-spacing: .02em;
+  letter-spacing: .02em;
+  line-height: 1;
+  border-top-color: #e6e6e6;
+  border-top-style: solid;
+  border-top-width: 1px;
+  padding-bottom: 16px;
+  padding-left: 0;
+  padding-right: 0;
+  padding-top: 16px;
+  text-align: left;
+}
+
+.c9 {
+  text-align: right;
+  padding-bottom: 16px;
+  padding-top: 16px;
+}
+
+.c11 {
+  -webkit-font-smoothing: antialiased;
+  color: #3c3c3c;
+  font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,sans-serif;
+  font-size: 18px;
   font-style: normal;
   font-stretch: normal;
   font-weight: 700;
@@ -867,7 +1143,7 @@ exports[`Displays a summary with calculated taxes 1`] = `
       <td
         className="c4"
       >
-        Item total
+        Items:
       </td>
       <td
         className="c5 c4"
@@ -879,7 +1155,7 @@ exports[`Displays a summary with calculated taxes 1`] = `
       <td
         className="c4"
       >
-        Shipping
+        Shipping:
       </td>
       <td
         className="c5 c4"
@@ -891,7 +1167,7 @@ exports[`Displays a summary with calculated taxes 1`] = `
       <td
         className="c4"
       >
-        Surcharge
+        Surcharges:
       </td>
       <td
         className="c5 c4"
@@ -901,27 +1177,27 @@ exports[`Displays a summary with calculated taxes 1`] = `
     </tr>
     <tr>
       <td
-        className="c4"
+        className="c6"
       >
-        Tax
+        Tax:
       </td>
       <td
-        className="c5 c4"
+        className="c7 c4"
       >
         $24.88
       </td>
     </tr>
     <tr>
       <td
-        className="c6"
+        className="c8"
       >
-        Order total
+        Order total:
       </td>
       <td
-        className="c5 c6"
+        className="c9 c10"
       >
         <span
-          className="c7"
+          className="c11"
         >
           $300.424
         </span>
diff --git a/styleguide.config.js b/styleguide.config.js
index 448ba35d1..d69ebe770 100644
--- a/styleguide.config.js
+++ b/styleguide.config.js
@@ -455,15 +455,13 @@ module.exports = {
         }),
         generateSection({
           componentNames: [
-            "BadgeOverlay",
-            "CatalogGridItem",
-            "CatalogGrid",
-            "InventoryStatus",
-            "Price",
-            "StockWarning"
+            "AccountProfileInfo",
+            "AddressBook",
+            "ProfileImage",
+            "ViewerInfo"
           ],
-          content: "styleguide/src/sections/Product.md",
-          name: "Product"
+          content: "styleguide/src/sections/Account.md",
+          name: "Account"
         }),
         generateSection({
           componentNames: [
@@ -511,13 +509,15 @@ module.exports = {
         }),
         generateSection({
           componentNames: [
-            "AccountProfileInfo",
-            "AddressBook",
-            "ProfileImage",
-            "ViewerInfo"
+            "BadgeOverlay",
+            "CatalogGridItem",
+            "CatalogGrid",
+            "InventoryStatus",
+            "Price",
+            "StockWarning"
           ],
-          content: "styleguide/src/sections/Account.md",
-          name: "Account"
+          content: "styleguide/src/sections/Product.md",
+          name: "Product"
         })
       ]
     }