feat(mobile): Adds mobile landscape

static/css/order-hardware.css

@@ -139,7 +139,90 @@
   ##Screen = B/w 481px to 767px
 */
 @media (min-width: 481px) and (max-width: 767px) {
+  body {
+    font-size: .8rem;
+  }
 
+  #root-shop .productItem {
+    padding: 2rem 1rem 1rem;
+  }
+
+  #root-shop .productItem .content img {
+    height: 230px;
+  }
+
+  #root-shop .productItem .content .price {
+    padding: .3rem;
+  }
+
+  #root-shop .productItem .content h3 {
+    font-size: 1.1rem;
+  }
+
+  #root-shop .productItem .content ul {
+    font-size: .5rem;
+  }
+
+  #root-shop .panel {
+    padding: 1.3rem;
+  }
+
+  #root-shop .panel .control {
+    flex-direction: column;
+    margin-bottom: 1.5rem;
+  }
+
+  #root-shop .panel .control > .description,
+  #root-shop .panel .control > .crate-mode {
+    width: 100%;
+  }
+
+  #root-shop .panel .control > .crate-mode {
+    text-align: left;
+  }
+
+  #root-shop .panel .summary {
+    flex-direction: column;
+  }
+
+  #root-shop .panel .summary>.summary-price table {
+    font-size: .7rem;
+  }
+
+  #root-shop .panel .summary>.summary-form form {
+    width: 100%;
+  }
+
+  #root-shop .panel .summary>.summary-price tfoot {
+    font-size: .85rem;
+  }
+
+  #root-shop .panel .summary>.summary-form form input[type="submit"] {
+    margin-bottom: 1em;
+  }
+
+  #root-shop .mobileBtnDisplaySideMenu,
+  #root-shop .mobileCloseMenu {
+    display: none !important;
+  }
+
+  #root-shop .mobileBtnDisplaySideMenu button,
+  #root-shop .mobileCloseMenu button {
+    -webkit-appearance: none !important;
+    background: none !important;
+    border: none !important;
+  }
+
+  #root-shop table {
+    width: 100%;
+    max-width: 100%;
+  }
+
+  #root-shop table tr {
+    padding: .8em 0;
+    display: flex !important;
+    justify-content: space-between;
+  }
 }
 /*
   ##Device = Most of the Smartphones Mobiles (Portrait)