diff --git a/sass/css/_shop.scss b/sass/css/_shop.scss
index 1e066d6..d4330b3 100644
--- a/sass/css/_shop.scss
+++ b/sass/css/_shop.scss
@@ -72,6 +72,8 @@ button {
             overflow-y: scroll;
             overflow-x: hidden;
             position: relative;
+            max-width: calc(3/10 * 100%);
+            min-width: calc(1/4 * 100%);
             /*padding-bottom: 4rem!important;*/
         }
 
@@ -79,7 +81,8 @@ button {
             position: fixed;
             bottom: 0;
             height: 100px;
-            width: calc(2 / 6 * 100%);
+            max-width: calc(3/10 * 100%);
+            min-width: 0;
             content: "";
             background: linear-gradient(
                 to top,
@@ -91,7 +94,7 @@ button {
 
         > section.main {
             flex: 4;
-            max-width: calc(4 / 6 * 100%);
+            max-width: calc(3/4 * 100%);
             overflow-y: scroll;
         }
     }
@@ -100,7 +103,7 @@ button {
 
         display: flex;
         color: white;
-        padding: 3rem 2rem 1rem;
+        padding: 1rem 0rem 1rem 1.5rem;
 
         .content {
             flex: 1;
@@ -119,6 +122,7 @@ button {
 
             h3 {
                 color: white;
+                font-size: 1.5rem;
             }
 
             button {
@@ -282,6 +286,9 @@ button {
 
                 .item-card-name {
                     font-weight: 700;
+                    &.tabbed {
+                        padding-left: 16px;
+                    }
                 }
 
                 .price {
diff --git a/static/css/order-hardware.css b/static/css/order-hardware.css
index 3a009e7..550172e 100644
--- a/static/css/order-hardware.css
+++ b/static/css/order-hardware.css
@@ -55,7 +55,7 @@
   color: white;
   font-weight: bold;
   font-size: 1.75rem;
-  padding: .75rem 2rem;
+  padding: .75rem 1.5rem;
 }
 
 #accordion_categories .accordion-body {
@@ -94,6 +94,10 @@
     height: calc(100vh - 10px - 2.5rem); /* .navbar vertical padding + line height (.navbar-brand.font-size.rem * body.font-size * body.line-height)*/
   }
 
+  #root-shop .layout>aside.aside {
+    min-width: max(300px, 30%);
+  }
+
   #root-shop .productItem {
     padding: 2rem 1rem 1rem;
   }
@@ -111,7 +115,7 @@
   }
 
   #root-shop .productItem .content ul {
-    font-size: .6rem;
+    font-size: .75rem;
   }
 
   #root-shop .panel .control {
@@ -133,7 +137,7 @@
   }
 
   #root-shop .panel .summary>.summary-price table {
-    font-size: 1rem;
+    font-size: 0.8rem;
   }
 
   #root-shop .panel .summary>.summary-form form,
@@ -163,7 +167,7 @@
   }
 
   #root-shop table tr {
-    padding: .8em 0;
+    padding: .2em 0;
     display: flex !important;
     justify-content: space-between;
   }
@@ -192,7 +196,7 @@
   }
 
   body {
-    font-size: .7rem;
+    font-size: .8rem;
   }
 
   #root-shop, #root-shop>div {
@@ -217,7 +221,7 @@
   }
 
   #root-shop table tr {
-    padding: .8em 0;
+    padding: .2em 0;
     display: flex !important;
     justify-content: space-between;
   }
@@ -227,7 +231,7 @@
   }
 
   #root-shop .panel .summary>.summary-price table {
-    font-size: .7rem;
+    font-size: .8rem;
   }
 
   #root-shop .panel .summary>.summary-form form,
@@ -236,7 +240,7 @@
   }
 
   #root-shop .panel .summary>.summary-price tfoot {
-    font-size: .85rem;
+    font-size: 1.0rem;
   }
 
   /*#root-shop .panel .summary>.summary-form form input[type="submit"] {
@@ -288,7 +292,7 @@
   }
 
   body {
-    font-size: .7rem;
+    font-size: .8rem;
   }
 
   #root-shop, #root-shop>div {
@@ -308,11 +312,11 @@
   }
 
   #root-shop .productItem .content h3 {
-    font-size: 1rem;
+    font-size: 1.25rem;
   }
 
   #root-shop .productItem .content ul {
-    font-size: .5rem;
+    font-size: .75rem;
   }
 
   #root-shop .panel {
@@ -345,7 +349,7 @@
   }
 
   #root-shop .panel .summary>.summary-price table {
-    font-size: .7rem;
+    font-size: .8rem;
   }
 
   #root-shop .panel .summary>.summary-form form,
@@ -354,7 +358,7 @@
   }
 
   #root-shop .panel .summary>.summary-price tfoot {
-    font-size: .85rem;
+    font-size: 1rem;
   }
 
   /*#root-shop .panel .summary>.summary-form form input[type="submit"] {
@@ -367,7 +371,6 @@
     border-top-right-radius: 30px;
     width: 80px;
     padding: 5px 0 5px 10px;
-    margin-bottom: -25px;
     margin-left: -1.3rem;
     position: relative;
     z-index: 1;
@@ -386,7 +389,7 @@
   }
 
   #root-shop table tr {
-    padding: .8em 0;
+    padding: .2em 0;
     display: flex !important;
     justify-content: space-between;
   }
@@ -394,14 +397,15 @@
   #root-shop .layout>aside.aside.menu-opened {
     /*transform: translate3d(0, 0, 0);*/
     transition: left .3s;
-    width: 310px;
+    width: min(310px, 60vw);
+    max-width: 60%;
     left: 0;
   }
 
   #root-shop .layout>aside.aside.menu-opened + section.main {
     /*transform: translate3d(310px, 0, 0);*/
     transition: left .3s;
-    left: 310px;
+    left: min(310px, 60vw);
     position: relative;
     z-index: 0;
   }
@@ -422,8 +426,8 @@
     transition: left .3s;
     position: fixed;
     z-index: 1;
-    left: -310px;
-    width: 310px;
+    left: max(-310px, -60vw);
+    width: min(310px, 60vw);
     height: 100%;
   }
 
@@ -460,7 +464,7 @@
   }
 
   #accordion_categories button {
-    font-size: 1rem;
+    font-size: 1.5rem;
     padding: .5rem 0.5rem;
   }
 }
@@ -500,7 +504,7 @@
   }
 
   body {
-    font-size: .7rem;
+    font-size: .8rem;
   }
 
   #root-shop, #root-shop>div {
@@ -516,20 +520,21 @@
   }
 
   #root-shop .productItem .content h3 {
-    font-size: 1rem;
+    font-size: 1.25rem;
   }
 
   #root-shop .layout>aside.aside.menu-opened {
     /*transform: translate3d(0, 0, 0);*/
     transition: left .3s;
-    width: 310px;
+    width: min(310px, 90vw);
+    max-width: 90%;
     left: 0;
   }
 
   #root-shop .layout>aside.aside.menu-opened + section.main {
     /*transform: translate3d(310px, 0, 0);*/
     transition: left .3s;
-    left: 310px;
+    left: min(310px, 90vw);
     position: relative;
     z-index: 0;
   }
@@ -549,8 +554,8 @@
     transition: left .3s;
     position: fixed;
     z-index: 1;
-    left: -310px;
-    width: 310px;
+    left: max(-310px, -90vw);
+    width: min(310px, 90vw);
     height: 100%;
   }
 
@@ -611,7 +616,7 @@
   }
 
   #root-shop .panel .summary>.summary-price table {
-    font-size: .7rem;
+    font-size: .8rem;
   }
 
   #root-shop .panel .summary>.summary-form form,
@@ -620,7 +625,7 @@
   }
 
   #root-shop .panel .summary>.summary-price tfoot {
-    font-size: .85rem;
+    font-size: 1rem;
   }
 
   /*#root-shop .panel .summary>.summary-form form input[type="submit"] {
@@ -633,7 +638,6 @@
     border-top-right-radius: 30px;
     width: 80px;
     padding: 5px 0 5px 10px;
-    margin-bottom: 15px;
     margin-left: -1.3rem;
   }
 
@@ -650,7 +654,7 @@
   }
 
   #root-shop table tr {
-    padding: .8em 0;
+    padding: .2em 0;
     display: flex !important;
     justify-content: space-between;
   }
@@ -669,7 +673,7 @@
   }
 
   #accordion_categories button {
-    font-size: 1rem;
+    font-size: 1.5rem;
     padding: .5rem 0.5rem;
   }
 }
\ No newline at end of file
diff --git a/static/js/shop/SummaryCrateCard.jsx b/static/js/shop/SummaryCrateCard.jsx
index 81018db..3edc55d 100644
--- a/static/js/shop/SummaryCrateCard.jsx
+++ b/static/js/shop/SummaryCrateCard.jsx
@@ -41,11 +41,7 @@ export function SummaryCrateCard({crate_index, card_index}) {
             onClick={() => setHighlight(crate_id, card_index)}
             onMouseEnter={() => setHighlight(crate_id, card_index)}
             onMouseLeave={() => resetHighlight()}>
-            <td className="item-card-name">
-                                    <span style={{
-                                        'display': 'inline-block',
-                                        'width': '16px',
-                                    }}>&nbsp;</span>
+            <td className="item-card-name tabbed">
                 <div>{`${card.name_number} ${card.name} ${card.name_codename}`}</div>
             </td>
 
diff --git a/static/js/shop/SummaryCratePricedOptions.jsx b/static/js/shop/SummaryCratePricedOptions.jsx
index 18ae07a..6cc894b 100644
--- a/static/js/shop/SummaryCratePricedOptions.jsx
+++ b/static/js/shop/SummaryCratePricedOptions.jsx
@@ -23,10 +23,7 @@ export function SummaryCratePricedOptions({crate_index}) {
 
     return options.map((option, _i) => (
         <tr key={"summary_crate_" + crate_id +"option_" + option.id}>
-            <td className="item-card-name">
-                    <span style={{
-                        'display': 'inline-block', 'width': '16px',
-                    }}>&nbsp;</span>
+            <td className="item-card-name tabbed">
                 <div>{option.title}</div>
             </td>