/**
 * responsive.css
 *
 * Contains media queries for various device widths.
 */

#utility-top,
.container {
	width: 96%;
	max-width: 980px;
}

/* ---------------------------------------------------------------
 * 1. TABLET
 * CSS fallback for device width 768px or below
 * ------------------------------------------------------------ */

@media only screen and (max-width: 768px) {

	.secondary-nav,
	#search-bar,
	#callout-bar,
	#callout-bar.callout-left,
	.brand,
	.header_widget_area {
		float: none;
		width: auto;
		max-width: 100%;
		margin-bottom: 20px;
		text-align: center;
	}
	
	.secondary-nav,
	#callout-bar,
	#callout-bar.callout-left {
		margin-bottom: 0;
	}
	
	#search-bar {
		padding: 4px;
		margin: 0;
	}

	.brand {
		padding: 10px 0 0;
		margin-bottom: 10px;		
	}
	
	.brand img {
		margin: 0 auto;
	}

	.container {
		margin-top: 2%;
	}

	.header_wrap {
		padding-top: 20px;
	}

	.secondary-nav .sec-menu,
	.primary-nav ul.nav-menu,
	.primary-nav div.nav-menu > ul {
		display: none;
	}
	
	#main-nav-2 {
		display: none !important;
	}
	
	.primary-nav.do-not-hide .nav-menu {
		display: block;
	}

	#responsive-menu {
		display: block;
	}	
	/* WooCommerce cart navigation */	
	.cart-nav {
		text-align: center;
	}
	.abc .sidebar1,
	.abc .sidebar2,
	.bac .sidebar1,
	.bac .sidebar2 {
		width: 47.9%;
	}

	.bca .sidebar1,
	.acb .sidebar2,
	.abc .content,
	.bac .content,
	.cab .sidebar2,
	.cba .sidebar1 {
		float: none;
		clear: both;
		padding-top: 20px;
		width: 97.9166%
	}

	.cab .sidebar1,
	.cba .sidebar2,
	.bca .sidebar2,
	.acb .sidebar1,
	.sb-b .sidebar2 {
		width: 31.25%;
	}

	.cab .content,
	.cba .content,
	.bca .content,
	.acb .content,
	.sb-b .content_large {
		width: 64.5833%;
	}
	
	/* WooCommerce responsive styles */
	
	.woocommerce ul.products li.product,
	.woocommerce-page ul.products li.product,
	.woocommerce .related ul.products li.product,
	.woocommerce-page .related ul.products li.product,
	.woocommerce .upsells.products ul.products li.product,
	.woocommerce-page .upsells.products ul.products li.product,
	.woocommerce .related ul li.product,
	.woocommerce-page .related ul li.product,
	.woocommerce .upsells.products ul li.product,
	.woocommerce-page .upsells.products ul li.product {
		width: 48% !important;
		margin: 0 0 2em;
	}
	.woocommerce ul.products li.product:nth-child(2n), .woocommerce-page ul.products li.product:nth-child(2n) {
	 float: right;
	 clear: none !important;
	}
	 .woocommerce ul.products li.product:nth-child(2n+1), .woocommerce-page ul.products li.product:nth-child(2n+1) {
	 clear: both;
	}
	.woocommerce #content table.cart .product-thumbnail,
	.woocommerce table.cart .product-thumbnail,
	.woocommerce-page #content table.cart .product-thumbnail,
	.woocommerce-page table.cart .product-thumbnail {
		display:none
	}
	.woocommerce #content table.cart td.actions,
	.woocommerce table.cart td.actions,
	.woocommerce-page #content table.cart td.actions,
	.woocommerce-page table.cart td.actions {
		text-align:left
	}
	.woocommerce #content table.cart td.actions .coupon,
	.woocommerce table.cart td.actions .coupon,
	.woocommerce-page #content table.cart td.actions .coupon,
	.woocommerce-page table.cart td.actions .coupon {
		float: none;
	 *zoom: 1;
		padding-bottom: 0.5em;
	}
	.woocommerce #content table.cart td.actions .coupon:after,
	.woocommerce #content table.cart td.actions .coupon:before,
	.woocommerce table.cart td.actions .coupon:after,
	.woocommerce table.cart td.actions .coupon:before,
	.woocommerce-page #content table.cart td.actions .coupon:after,
	.woocommerce-page #content table.cart td.actions .coupon:before,
	.woocommerce-page table.cart td.actions .coupon:after,
	.woocommerce-page table.cart td.actions .coupon:before {
		content: "";
		display: table;
	}
	.woocommerce #content table.cart td.actions .coupon:after,
	.woocommerce table.cart td.actions .coupon:after,
	.woocommerce-page #content table.cart td.actions .coupon:after,
	.woocommerce-page table.cart td.actions .coupon:after {
		clear: both;
	}
	.woocommerce #content table.cart td.actions .button,
	.woocommerce #content table.cart td.actions .input-text,
	.woocommerce #content table.cart td.actions input,
	.woocommerce table.cart td.actions .button,
	.woocommerce table.cart td.actions .input-text,
	.woocommerce table.cart td.actions input,
	.woocommerce-page #content table.cart td.actions .button,
	.woocommerce-page #content table.cart td.actions .input-text,
	.woocommerce-page #content table.cart td.actions input,
	.woocommerce-page table.cart td.actions .button,
	.woocommerce-page table.cart td.actions .input-text,
	.woocommerce-page table.cart td.actions input {
		width: 48%;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
	.woocommerce #content table.cart td.actions .button.alt,
	.woocommerce #content table.cart td.actions .input-text+.button,
	.woocommerce table.cart td.actions .button.alt,
	.woocommerce table.cart td.actions .input-text+.button,
	.woocommerce-page #content table.cart td.actions .button.alt,
	.woocommerce-page #content table.cart td.actions .input-text+.button,
	.woocommerce-page table.cart td.actions .button.alt,
	.woocommerce-page table.cart td.actions .input-text+.button {
		float: right;
	}
	.woocommerce .cart-collaterals .cart_totals,
	.woocommerce .cart-collaterals .cross-sells,
	.woocommerce .cart-collaterals .shipping_calculator,
	.woocommerce-page .cart-collaterals .cart_totals,
	.woocommerce-page .cart-collaterals .cross-sells,
	.woocommerce-page .cart-collaterals .shipping_calculator {
		width: 100%;
		float: none;
		text-align: left;
	}
	.woocommerce-page.woocommerce-checkout form.login .form-row,
	.woocommerce.woocommerce-checkout form.login .form-row {
		width:100%;
		float:none;
	}
	.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;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
		margin-bottom:1em;
	}
	.woocommerce .lost_reset_password .form-row-first,
	.woocommerce .lost_reset_password .form-row-last,
	.woocommerce-page .lost_reset_password .form-row-first,
	.woocommerce-page .lost_reset_password .form-row-last {
		width:100%;
		float:none;
		margin-right:0;
	}
}


/* ---------------------------------------------------------------
 * 2. MOBILE
 * CSS fallback for device width 600px or below
 * ------------------------------------------------------------ */

@media only screen and (max-width: 600px) {

	.content,
	.content_medium,
	.content_large,
	.sidebar1,
	.sidebar2,
	.abc .sidebar1,
	.abc .sidebar2,
	.bac .sidebar1,
	.bac .sidebar2,
	.bca .sidebar1,
	.acb .sidebar2,
	.abc .content,
	.bac .content,
	.cab .sidebar2,
	.cba .sidebar1,
	.cab .sidebar1,
	.cba .sidebar2,
	.bca .sidebar2,
	.acb .sidebar1,
	.sb-b .sidebar2,
	.cab .content,
	.cba .content,
	.bca .content,
	.acb .content,
	.sb-b .content_large {
		float: none;
		width: 97.9166% !important;
		max-width: 97.9166%;
		text-align: left;
		margin: 0 auto 18px;
	}

	.content_full ul.grid_list.col4 li,
	ul.grid_list.col4 li,
	ul.grid_list.col5 li,
	ul.grid_list.col6 li,
	.notes_left,
	.notes_right,
	.column,
	.content .column {
		float: none;
		width: 100%;
		max-width: 100%;
		margin: 0 0 18px;
	}

	#commentform input[type="text"],
	#contactform input[type="text"],
	#commentform textarea,
	#contactform textarea {
		width: 100%;
		max-width: 100%;
	}

	.secondary .column,
	.notes_left,
	.notes_right,
	.commentlist ul.children {
		margin: 0;
	}

	.notes_left,
	.notes_right {
		text-align: left;
	}

}

/* ---------------------------------------------------------------
 * 3. MOBILE
 * CSS fallback for device width 480px or below
 * ------------------------------------------------------------ */

@media only screen and (max-width: 480px) {

	ul.grid_list.col2 li,
	ul.grid_list.col3 li,
	.content_medium ul.grid_list.col2 li,
	.content_full ul.grid_list.col3 li,
	.content_full ul.grid_list.col4 li,
	.thumb_medium,
	.post_content {
		float: none;
		width: 100%;
		max-width: 100%;
		margin: 0 0 18px;
	}
	
	/* WooCommerce Responsive styles */
	
	.woocommerce .cart-collaterals .cart_totals,
	.woocommerce-page .cart-collaterals .cart_totals,
	.woocommerce .cart-collaterals .shipping_calculator,
	.woocommerce-page .cart-collaterals .shipping_calculator,
	.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%;
		margin: 0 0 2em 0;
	}
	
	.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%;
		margin: 0 0 1.5em;
	}

}