woocommerce/assets/css/woocommerce-smallscreen.scss

/**
 * This stylesheet optimises the default WooCommerce layout when viewed on smaller screens.
 */

/* =Imports
-------------------------------------------------------------- */
@import "bourbon";
@import "mixins";

.woocommerce, .woocommerce-page {

	table.shop_table_responsive {
		thead {
			display: none;
		}

		tbody {
			tr:first-child {
				td:first-child {
					border-top: 0;
				}
			}
			th {
				display: none;
			}
		}

		tr {
			display: block;

			td {
				display: block;

				&:before {
					content: attr(data-title) ': ';
					font-weight: 700;
				}
			}

			&:nth-child(2n) {
				td {
					background-color: rgba(0,0,0,0.025);
				}
			}
		}
	}

	table.my_account_orders {
		tr {
			td {
				&.order-actions {
					text-align: left;

					&:before {
						display: none;
					}

					.button {
						float: none;
						margin: .125em .25em .125em 0;
					}
				}
			}
		}
	}

	/**
	 * General layout
	 */
	.col2-set {
		.col-1, .col-2 {
			float: none;
			width:100%;
		}
	}

	/**
	 * Products
	 */
	ul.products {
		li.product {
			width:48%;
			float: left;
			clear:both;
			margin:0 0 2.992em;
			&:nth-child(2n) {
				float: right;
				clear:none !important;
			}
		}
	}

	/**
	 * Product Details
	 */
	div.product, #content div.product {
		div.images, div.summary {
			float: none;
			width:100%;
		}
	}

	/**
	 * Cart
	 */
	table.cart, #content table.cart {
		.product-thumbnail {
			display: none;
		}
		td.actions {
			text-align: left;
			.coupon {
				float:none;
				@include clearfix();
				padding-bottom:.5em;
			}
			input, .button, .input-text {
				width:48%;
				@include box-sizing(border-box);
			}
			.input-text + .button, .button.alt {
				float: right;
			}
		}
	}
	.cart-collaterals {
		.cart_totals, .shipping_calculator, .cross-sells {
			width:100%;
			float: none;
			text-align: left;
		}
	}

	/**
	 * Checkout
	 */
	&.woocommerce-checkout {
		form.login {
			.form-row {
				width: 100%;
				float: none;
			}
		}
	}

	#payment {
		.terms {
			text-align: left;
			padding:0;
		}
		#place_order {
			float: none;
			width:100%;
			@include box-sizing(border-box);
			margin-bottom:1em;
		}
	}

	/**
	 * Account
	 */
	.lost_reset_password {
		.form-row-first,
		.form-row-last {
			width: 100%;
			float: none;
			margin-right: 0;
		}
	}
}

/* =Twenty Thirteen Specific styles
-------------------------------------------------------------- */
.single-product {
	.twentythirteen {
		.panel {
			padding-left: 20px !important;
			padding-right: 20px !important;
		}
	}
}