/** * This stylesheet optimises the default WooCommerce layout when viewed on smaller screens. */ .clear { clear: both; } .nobr { white-space: nowrap; } /** * Objects */ .woocommerce, .woocommerce-page { /** * General layout */ /** * Products */ /** * Product Details */ /** * Cart */ /** * Checkout */ } .woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1, .woocommerce .col2-set .col-2, .woocommerce-page .col2-set .col-2 { float: none; width: 100%; } .woocommerce ul.products li.product, .woocommerce-page ul.products li.product { width: 48%; float: left; clear: both; margin: 0 0 2.992em; } .woocommerce ul.products li.product:nth-child(2n), .woocommerce-page ul.products li.product:nth-child(2n) { float: right; clear: none !important; } .woocommerce div.product div.images, .woocommerce-page div.product div.images, .woocommerce #content div.product div.images, .woocommerce-page #content div.product div.images, .woocommerce div.product div.summary, .woocommerce-page div.product div.summary, .woocommerce #content div.product div.summary, .woocommerce-page #content div.product div.summary { float: none; width: 100%; } .woocommerce table.cart .product-thumbnail, .woocommerce-page table.cart .product-thumbnail, .woocommerce #content table.cart .product-thumbnail, .woocommerce-page #content table.cart .product-thumbnail { display: none; } .woocommerce table.cart td.actions, .woocommerce-page table.cart td.actions, .woocommerce #content table.cart td.actions, .woocommerce-page #content table.cart td.actions { text-align: left; } .woocommerce table.cart td.actions .coupon, .woocommerce-page table.cart td.actions .coupon, .woocommerce #content table.cart td.actions .coupon, .woocommerce-page #content table.cart td.actions .coupon { float: none; padding-bottom: .5em; } .woocommerce table.cart td.actions .coupon:after, .woocommerce-page table.cart td.actions .coupon:after, .woocommerce #content table.cart td.actions .coupon:after, .woocommerce-page #content table.cart td.actions .coupon:after { content: ""; display: block; clear: both; } .woocommerce table.cart td.actions input, .woocommerce-page table.cart td.actions input, .woocommerce #content table.cart td.actions input, .woocommerce-page #content table.cart td.actions input, .woocommerce table.cart td.actions .button, .woocommerce-page table.cart td.actions .button, .woocommerce #content table.cart td.actions .button, .woocommerce-page #content table.cart td.actions .button, .woocommerce table.cart td.actions .input-text, .woocommerce-page table.cart td.actions .input-text, .woocommerce #content table.cart td.actions .input-text, .woocommerce-page #content table.cart td.actions .input-text { width: 48%; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ } .woocommerce table.cart td.actions .input-text + .button, .woocommerce-page table.cart td.actions .input-text + .button, .woocommerce #content table.cart td.actions .input-text + .button, .woocommerce-page #content table.cart td.actions .input-text + .button, .woocommerce table.cart td.actions .button.alt, .woocommerce-page table.cart td.actions .button.alt, .woocommerce #content table.cart td.actions .button.alt, .woocommerce-page #content table.cart td.actions .button.alt { float: right; } .woocommerce .cart-collaterals .cart_totals, .woocommerce-page .cart-collaterals .cart_totals, .woocommerce .cart-collaterals .shipping_calculator, .woocommerce-page .cart-collaterals .shipping_calculator, .woocommerce .cart-collaterals .cross-sells, .woocommerce-page .cart-collaterals .cross-sells { width: 100%; float: none; text-align: left; } .woocommerce #payment .terms, .woocommerce-page #payment .terms { text-align: left; padding: 0; } .woocommerce #payment #place_order, .woocommerce-page #payment #place_order { float: none; width: 100%; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ margin-bottom: 1em; }