diff --git a/static/css/order-hardware.css b/static/css/order-hardware.css index bc35dcf..542b573 100644 --- a/static/css/order-hardware.css +++ b/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)