/* Media Queries */

/* Desktop defaults which are overriden in mobile below */
.mobileOnly { display:none; }


/* Note:Design for a width of 767px */
@media only screen and (max-width:767px) {
	.show { display:none; }
	.hide { display:block; }
	.desktopOnly { display:none; }
	.mobileOnly { display:block; }
	
	.sidebar .menu article ul li a { width:96%; }
	
	.wrapper { width:94%; float:left; padding:0 3%; }
	
	/* header */
	header { padding:unset; }
	header .logo,
	header aside { float:unset; padding:unset; }
	header .logo a { display:block; }
	header .phone { text-align:unset; font-weight:unset; font-size:inherit; }
	header aside p,
	header aside ul,
	header aside ul li,
	header aside ul li a,
	header aside ul li a .cartText { font-size:inherit; line-height:inherit; float:unset; padding:unset; font-weight:unset; color:inherit; background:unset; }
	header aside ul li a { display:block; }
	header aside ul { flex-direction:column; }
	header aside ul li a.logout { float:unset; background-position:-5px 5px; padding:0 0 0 22px; }
	header .wrapper { display:flex; flex-direction:column-reverse; padding-top:60px; font-size:14px; line-height:32px; }
	header .wrapper .logo { position:absolute; top:0; left:0; right:0; display:flex; justify-content:center; padding:5px 0; background:#FFFFFF; }
	header .wrapper .logo img { height:50px; }
	header .wrapper .logo a.mobilePhone { color:inherit; align-self:flex-end; margin:0 -50px -10px -60px; display:flex; align-items:center; }
	header .wrapper .logo a.mobilePhone img { height:unset; margin-left:5px; }
	
	/* nav */
	nav,
	#nav > p,
	nav ul,
	nav ul li,
	nav ul li a,
	nav ul li.bordernone a { background:unset; border:unset; height:unset; padding:unset; float:unset; font-size:inherit; line-height:inherit; color:inherit; display:block; }
	#nav > p { text-align:center; font-size:18px; }
	.nav-collapse { text-align:unset; margin-bottom:unset; }
	header hr { margin:10px 0; border: 0; border-bottom:2px solid #f26321; }
	hamburger { display:flex; position:absolute; left:0; top:0; padding:12px 0 17px 0; }
	hamburger bread { background:#999; width:40px; height:4px; border-radius:2px; margin:6px 10px; display:block; }
	header aside,
	header #nav { display:none; }
	nav ul li,
	nav ul li.bordernone,
	header aside ul li,
	header aside ul li.nodivider { background:url('/images/arrow03.gif') no-repeat center right; }
	.expand-hamburger header aside,
	.expand-hamburger header #nav { display:block; }

	
	/* language */
	header .mobileLang { display:none; }
	header .mobileLang label { display:flex; padding:0 20px; }
	header .mobileLang input { -webkit-appearance: none; height:25px; width:20px; margin-right:10px; }
	header .mobileLang input:checked { background: url('/images/icon_tick.gif') no-repeat 0 0; }
	


	/* searchbar */
	.searchbar { min-height:0; padding:20px 0 60px 0; }
	.searchbar fieldset div { display:none; align-items:center; flex-direction:column; }
	.searchbar .input,
	.searchbar label { height:unset; margin:unset; width:unset; text-align:unset; float:unset; display:block; margin-bottom: 10px; }
	.searchbar .input { width: 100%; }
	.searchbar .button { margin-bottom: 20px; }
	
	/* content */
	#bgcontentbox { width:100%; background:none; padding:0; margin:-70px 0 0 0; }
	#content { width:94%; padding:10px 3%; margin:0; position:relative; }
	
	/* leftpanel */
	#leftpanel { display:none; }
	
	.newinfo article { width:96%; float:left; padding:50px 2% 20px 2%; }
	.newinfo article h2 { text-align:center; padding:0; }
	.newinfo article figure { width:100%; text-align:center; margin-bottom:20px; }
	.newinfo article aside { width:100%; padding:0; }
	.newinfo article .close { position:absolute; top:10px; right:2%; }
	
	/* rightpanel */
	#rightpanel { width:unset; float:unset; }
	
	.tableinfo { padding-top:30px; }
	.tableinfo h3 { font-size:14px; font-weight:bold; padding-bottom:0; }

	/* breadcrumb */
	.breadcrumbWrapper { padding:0; }
	.breadcrumb,
	.catalog { width:unset; float:unset; padding:0 0 10px 0; text-align:unset; }
	.breadcrumb ul,
	.breadcrumb ul li { float:unset; line-height:unset; }
	
	/* footer */
	footer { width:96%; border-top:1px solid #CCCCCC; padding:15px 5% 25px 5%; margin:0 -3%; }
	footer .footerlogo { width:100%; text-align:center; padding-bottom:15px; }
	footer p { float:none; text-align:center; }
	footer p span.right { width:100%; float:left; padding:10px 0 0 0; }
	
	/* category list */
	.categorylist { width:100%; margin:0; }
	.categorylist article { width:100%; margin:0 0 20px 0; }
	.categorylist article aside { width:96%; padding:2%; }
	
	/* product detail */
	.productdetails { width:100%; padding:0; }
	.productdetails article { width:97.5%; }
	.productdetails article figure { width:250px; text-align:center; }
	.productdetails article aside { width:94%; float:right; padding:15px 3%; }
	.productdetails article p .left { width:90px; }
	.productdetails article p .right { width:60%; }
	.productdetails article .bgbutton { width:100%; float:left; }
	
	/* product list */
	.productlist article figure { width:250px; float:left; text-align:center; background:#FFFFFF; border:3px solid #eeeeee; }
	.productlist article figure img { float:none; line-height:.5em; border:none; }
	.productlist article aside { width:100%; float:left; padding:20px 0 0 0; margin:0; }
	.productlist article aside p .left { width:80px; }
	.productlist article aside p .right { width:150px; }
	.productlist article .priceinfo { width:100%; padding:25px 0 0 0; }
	
	/* shopping cart */
	.shoppingcart { width:100%; float:left; }
	.shoppingcart table.tablesorter .heading { font-size:12px; }
	.shoppingcart table.tablesorter td { font-size:12px; }
	.shoppingcart .tableinfo .column1 { width:51%; }
	.shoppingcart .tableinfo .column2 { width:8%; }
	.shoppingcart .tableinfo .column3 { width:22%; }
	.shoppingcart .tableinfo .column4 { width:13%; }
	
	.shoppingcart aside { display:flex; flex-wrap:wrap; justify-content:space-around; }
	.shoppingcart aside span { font-size:14px; }
	.shoppingcart aside .column01 { width:25%; box-sizing:border-box; }
	.shoppingcart aside .column02 { display:block; order:4; padding:0; }
	.shoppingcart aside .column03 { width:50%; box-sizing:border-box; }
	.shoppingcart aside .column04 { width:25%; box-sizing:border-box; }
	/* Make title not wrap */
	.shoppingcart h2 span { font-size:18px; margin-bottom:10px; }
	/* Hide Excel Upload */
	.shoppingcart h2 .load { display:none; }

	/* Increase border between rows. */
	.shoppingcart .tableinfo tr,
	.shoppingcart table.tablesorter tbody tr { background:#EEE;  
		display:flex; position:relative; flex-wrap:wrap; }
	.shoppingcart .tableinfo > tr,
	.shoppingcart table.tablesorter > tbody > tr { border-bottom: 2px solid #DDD; }
	/* Hide Name TH */
	.shoppingcart .tableinfo th.column1 { display:none; }
	/* Make first column (name) full width */
	.reviewMaterials.shoppingcart .tableinfo .column1,
	.shoppingcart .tableinfo .column1 { box-sizing:border-box; padding:5px; width:100%; order:6; }
	/* Cut remarks off on right to make room for delete button */
	.shoppingcart .tableinfo .cart_remarks { box-sizing:border-box; padding-right:27px;}
	/* Make remarks input and remarks link same height */
	.shoppingcart .tableinfo .cart_remarks .remarksLink { padding-top: 5px; }
	/* Make last 4 columns spaced evenly along bottom of row */
	.reviewMaterials.shoppingcart .tableinfo .column2,
	.shoppingcart .tableinfo .column2 { box-sizing:border-box; padding:5px; line-height:25px; width:35%; }
	.reviewMaterials.shoppingcart .tableinfo .column3,
	.shoppingcart .tableinfo .column3 { box-sizing:border-box; padding:5px; line-height:25px; width:20%; }
	.reviewMaterials.shoppingcart .tableinfo .column4,
	.shoppingcart .tableinfo .column4 { box-sizing:border-box; padding:5px; line-height:25px; width:20%; }
	.reviewMaterials.shoppingcart .tableinfo .column5,
	.shoppingcart .tableinfo .column5 { box-sizing:border-box; padding:5px; line-height:25px; width:25%;  }

	
	.shoppingcart article p { width:100%; text-align:center; }
	.shoppingcart article p span { font-weight:bold; }
	.shoppingcart article .bgbuttons { width:100%; float:right; } 
	.shoppingcart article .button { width:100%; text-align:center; padding:15px 0; margin:10px 0 0 0; }
	
	.shoppingcart .tableinfo .cart_remarks input { width:68%!important; }

		/* Make loading indicator not blow out page width */
		div.inprogress_img { width:110px; line-height:26px; margin-left:-40px; }

		/* Make availability modal not blow out page width */
		.ui-dialog { box-sizing:border-box; }

	/* SnapEngage Button */
	body #SnapABug_Button.SnapABug_Button {
		display: none;
	}
}

@media only screen and (min-width:400px) and (max-width:767px) { .searchbar form .input { width:65%; } }
@media only screen and (min-width:450px) and (max-width:767px) { .searchbar form .input { width:70%; } }
@media only screen and (min-width:480px) and (max-width:767px) {
	.searchbar form .input { width:70%; }
	
	/* category list */
	.categorylist { width:102%; margin:0 -2% 0 0; }
	.categorylist article { width:48%; margin:0 2% 20px 0; }
	.categorylist article h3 { font-size:17px; }
	.categorylist article p { font-size:13px; }
}
@media only screen and (min-width:500px) and (max-width:767px) {
	.categorylist article { width:48%; margin:0 2% 20px 0; }
	.categorylist article h3 { font-size:18px; }
	.categorylist article p { font-size:14px; }
}
@media only screen and (min-width:530px) and (max-width:767px) { .searchbar form .input { width:71%; } }