/* tablet ----------- */
@media only screen and (max-width : 1100px) {
	header.body .logo #tagline {font-size: 15px; margin: 99px 0 0 -144px; width: 279px;}
	
	/*skip link for accessibility*/
	header.body .skip-link {background: #FFFFFF;height: 30px;left: 50%;padding: 8px;position: absolute;transform: translateY(-100%);transition: transform 0.3s;}
	header.body .skip-link:focus {transform: translateY(0%);}
}
@media only screen and (max-width : 1060px){
	.categories.view #content .cols.two .col.image { display: none; }
	.categories.view #content .cols.two .col.details { width: 100%; }

	/*skip link for accessibility*/
	header.body .skip-link {background: #FFFFFF;height: 30px;left: 50%;padding: 8px;position: absolute;transform: translateY(-100%);transition: transform 0.3s;}
	header.body .skip-link:focus {transform: translateY(0%);}
}
@media only screen and (max-width : 1024px) {}

@media only screen and (max-width : 960px) { 
	header.body > .w { padding: 20px; }

	header.body .right .call { float: right; vertical-align: inherit; width: auto; display: inline-block; padding-right: 0; border-right: 0px;}
	header.body .call p { font-size: 3rem; }
	header.body .logo { text-align: left; width: 40%; }
	header.body .right{width: auto;}
	header.body .account { display: none; }

	header.body .mobile-menu { display: block; }
	header.body .nav.w{ margin: 0; width: 100%; padding:0;}
	header.body .cart-count-mobile { position: absolute; top: 5px; right: 80px; background: #6eb29b; border-radius: 40px; width: auto; color: white; text-align: center; font-size: 11px; min-width: 13px; line-height: 1; padding: 4px 4px; text-align: center; }

	header.body #menu-trigger { display: block; }
	header.body .navigation { display: none; text-align: left; }
	header.body .navigation ul { list-style: none; }
	header.body .navigation ul li { display: block; }
	header.body .navigation ul li a { display: block; color: #fff; text-decoration: none; font-weight: bold; padding: 10px; }
	header.body .navigation ul li a:hover { color: #00A652; }
	header.body .navigation ul li ul.subnav { display: none; }
	header.body .navigation ul li ul.subnav li { display: none; }
	header.body .navigation ul li:hover ul.subnav { display: none; }
	.pages.contact #content .cols{display: block;}
	.pages.contact #content .cols .col.one{margin-right: 30px;}
	.users.clr #content .clrs.index table tr td.actions:nth-child(3) a.button:nth-child(n+2){margin-top: 12px;}

	/*skip link for accessibility*/
	header.body .skip-link {background: #FFFFFF;height: 30px;left: 50%;padding: 8px;position: absolute;transform: translateY(-100%);transition: transform 0.3s;}
	header.body .skip-link:focus {transform: translateY(0%);}
}
/* smaller than a tablet bigger than a phone */
@media only screen and (max-width : 890px) {
	#content .main { width: 100%; float: none; padding-bottom: 20px; }
	#content .sidebar { width: 100%; float: none; }
	#content .sidebar .widget { box-shadow: none; border: 1px solid #dedede; }

	header.body .cart-count-mobile { position: absolute; top: 5px; right: 60px; background: #6eb29b; border-radius: 40px; width: auto; color: white; text-align: center; font-size: 11px; min-width: 13px; line-height: 1; padding: 4px 4px; text-align: center; }
	
	/*skip link for accessibility*/
	header.body .skip-link {background: #FFFFFF;height: 30px;left: 50%;padding: 8px;position: absolute;transform: translateY(-100%);transition: transform 0.3s;}
	header.body .skip-link:focus {transform: translateY(0%);}
}

@media only screen and (max-width : 840px) {
	header.body > .w { padding: 20px 0; }
	body.home #slider li .content p { width: 100%; float: none; }

	/*skip link for accessibility*/
	header.body .skip-link {background: #FFFFFF;height: 30px;left: 50%;padding: 8px;position: absolute;transform: translateY(-100%);transition: transform 0.3s;}
	header.body .skip-link:focus {transform: translateY(0%);}
}
/* smaller than a tablet bigger than a phone */
@media only screen and (max-width : 767px) {
	header.body .logo { width: 100%; margin: 0 auto; display: block; text-align: center; }
	header.body .logo img{display:block; margin:0 auto;}
	header.body .logo #tagline{position: relative; margin: 0; }
	header.body .right .search { width: 330px; margin: 0 auto;max-width: 100%;}
	header.body.loggedout .right .top, header.body .right,header.body .right .search.group {display: block;float: none; margin: 0 auto;}
	header.body .right .top{ justify-content: space-around;}
	header.body .call div.language_links{justify-content: center;}
	header.body .call p.spanish{width:auto;}
	header.body .w.sitewide_block {padding: 14px 0 0 0;}
	header.body .cart-count-mobile { position: absolute; top: 5px; right: 40px; background: #6eb29b; border-radius: 40px; width: auto; color: white; text-align: center; font-size: 11px; min-width: 13px; line-height: 1; padding: 4px 4px; text-align: center; }
	body.home .w{width:100%;}
	body.home #splash div.col{float:none; width: 100%;}
	body.home #splash div.col .title a{ max-width: 100%; }
	body.home #pricing, 
	body.home #popular .grid, 
	body.home #triCTAs,
	body.home #copy .row,
	body.home #bottom_copy{display: block;}
	body.home #copy .row.one{padding-bottom: 15px;}
	body.home #copy .row img{float:none !important; display:block; margin: 3px auto!important; max-height: 200px;}
	body.home #triCTAs a img{float:none !important; display:block; margin: 25px auto!important;}
	body.home #popular .test:after { visibility: hidden; display: block; content: ""; clear: both;height: 0;}
	body.home #copy{ padding: 10px 3.8%; }
	body.home #review .trustlogos{display: }
	header.body .right .call { float: none; display: block; text-align:  center; padding: 0 0 10px; border:0; }
	header.body .right .call p { font-size: 2.4rem; text-align:center; }
	header.body .search .all-products { float: none; margin: 0 auto 17px; text-align: center; }
	body.home #topImages img, body.home #topImages #countdown{display: none;}
	body.home #topImages img.mobile{display: block; margin: 10px 0 10px 0; }
	body.home #top_banner .col.one {-ms-grid-columns: 1fr; grid-template-columns: 1fr;}
	body.home #top_banner {display: block !important;}

	body .sitewide_block img{display: none;}
	body .sitewide_block img.mobile{display: block !important; }

	body .site_notice img{display: none;}
	body .site_notice img.mobile{display: block !important; margin-top:15px;}	
	#content .cols.two .col { width: 97%; }
	#content .cols.three .col { width: 97%; }

	header.body .call { padding-top: 18px; }
	header.body .logo{padding-top: 0;}
	footer .footer-top-content #row .left,
	footer .footer-top-content #row .right{float: none; width: 100%; padding: 0 25px; box-sizing: border-box;}
	footer .footer-top-content #row .logo-social-footer *, footer .footer-top-content #row .footer_info *{box-sizing: border-box;}
	footer .footer-top-content #row .footer_links{display: block; }
	footer .footer-top-content #row .footer_links div{padding: 0; text-align: center;}
	footer .footer-top-content p.trustlogos {-ms-flex-pack: distribute; justify-content: space-around;}
	footer .footer-top-content p.trustlogos img { margin: 11px 3%; max-width: 95%;}
	footer .footer-top-content #row .footer_links ul{column-count: initial; margin:0 auto;}
	footer .footer-top-content #row .footer_links ul li{padding: 7px 0; margin:7px 0;text-align: center;}
	footer .footer-top-content #row .left form{text-align: center;}
	
	.products.view #content .main .lab_options{display:block;}
	.products.view #content .main .lab_options .option{margin-bottom: 30px; border: 0;}
	
	header.body.loggedout .right{ width: 100%; float:none; }
	
	.categories.view #content .main .details ul#children li a{margin: 0 auto;}
	.categories.view #content .main .details .labs .laboptions button, .search #content .main .labs .laboptions button{ display:block; width: 230px; margin: 25px auto !important;}
	#content .product-list li .add-to-cart-box input[type=submit]:first-child{margin: -10px 0 20px;}
	
	.categories.view #content .main .pagn .options{display:none;}
	.categories.view #content .main .pagn .options_select{padding: 0 3%;}
	.categories.view #content .main .pagn .options_select select{margin: 14px 10px 14px 0;}
	.categories #content .main .details ul#children{ grid-template: auto / repeat(3, 1fr);}

	body.home #splash{padding-bottom: 20px}
	body.home #splash div.col#one .title a{padding: 0;}
	body.home #splash div.col h3{font-size:16px}
	body.home #splash div.col span{font-size:50px;}
	body.home #splash div.col{width:100%; margin: 0 auto 0;}
	body.home #splash div.col#two img{margin-top:0}
	body.home #splash div.col button,body.home #splash div.col ul{margin: 22px auto;}
	body.home #splash div.col ul{list-style: none; text-align: center;}

	body.home #splash div.lower{text-align: center;}
	body.home #splash div.lower ul, body.home #splash div.lower button {float:none; margin: 0 auto 20px;}
	body.home #splash div.lower ul li{list-style: none; }
	body.home #pricing .range{margin: 0 3% 10px;}
	body.home .grey_bg{padding:30px 3% 1px;}
	body.home .grey_bg .col{ margin-bottom: 45px;}

	.carts.index #content .main .grid{ grid-template-columns: repeat(2, 1fr);}
	.carts.index #content .main .grid .col:last-child{ grid-column: 1 / span 2;}
	.carts.index #content .main #CartIndexForm tr td:first-child{justify-content: flex-end;}
	body.carts #CartIndexForm table, body.carts #CartIndexForm thead, body.carts #CartIndexForm tbody, body.carts #CartIndexForm tfoot, body.carts #CartIndexForm th, body.carts #CartIndexForm td, body.carts #CartIndexForm tr { display: block; }
	body.carts #CartIndexForm thead tr { position: absolute; top: -9999px; left: -9999px;}
	body.carts #CartIndexForm tr { border: 1px solid #ccc; }
	body.carts #CartIndexForm td { border: none; border-bottom: 1px solid #eee; position: relative; width: 100%; box-sizing: border-box; text-align: right;}
	body.carts #CartIndexForm td:before { position: absolute; top: 6px; left: 6px; width: 45%; padding-right: 10px; white-space: nowrap; text-align: left;}
	body.carts #CartIndexForm td:nth-of-type(1):before { content: "Name"; }
	body.carts #CartIndexForm td:nth-of-type(2):before { content: "Options"; }
	body.carts #CartIndexForm td:nth-of-type(3):before { content: "Price"; text-align: left; }
	body.carts #CartIndexForm td img{margin-top: 25px;}
	body.carts #CartIndexForm tfoot td { padding: 15px!important; }
	body.carts #CartIndexForm tfoot td:before { content: ""!important; }
	.carts.index #content .main #CartIndexForm tr td:first-child{justify-content: space-around;}
	.carts.index #content .main #CartIndexForm table tfoot td:last-child{text-align: center;}

	body.carts .emptycart #CartIndexForm td:nth-of-type(1):before { content: "";}
	.carts.index #content  .emptycart .main #CartIndexForm tr td:last-child, .carts.index #content  .emptycart .main #CartIndexForm tr th:last-child{ padding-left: 14px !important;}

	.checkout #content .main{width: 100%; float:none;}
	.checkout #content .sidebar{display: none;}
	.checkout #content .w.group.default{display:table;}	
	.checkout #content .main{display: table-footer-group;}

	#sidebar .cta img{max-width: 100%!important;width: initial!important;}
	.categories.view #content .main .details .labs p.header span, .search #content .main .labs p.header span{display: block;}
	#locatorForm {display: block}
	#locatorForm label{min-width: unset;}
	#content #flash_box #flash_content{min-width: initial; width: 85%;}

	/*skip link for accessibility*/
	header.body .skip-link {background: #FFFFFF;height: 30px;left: 50%;padding: 8px;position: absolute;transform: translateY(-100%);transition: transform 0.3s;}
	header.body .skip-link:focus {transform: translateY(0%);}
}	

/* phone ----------- */
@media only screen and (max-width : 568px) {

	header.body .cart-count-mobile { position: absolute; top: 5px; right: 5px; background: #6eb29b; border-radius: 40px; width: auto; color: white; text-align: center; font-size: 11px; min-width: 13px; line-height: 1; padding: 4px 4px; text-align: center; }

	.users.login #content .login .create_login a {min-width: auto;}

	footer.body .w { width: 100%;  }
	footer.body ul { list-style: none; border-top: 1px solid #ccc; }
	footer.body ul li { display: block; }
	footer.body ul li a { display: block; padding: 10px 0;}
	
	.view #content .main .secure div{display:block; height:auto;}
	.products.view #content .related ul.related-product-list, .products.view #content .related h4,#content .sidebar h3, #content .sidebar a,#content .sidebar ul{display:block; text-align:center;}
	.products.view #content .related ul.related-product-list li{padding-left:0;}
	.categories.view #content .main .pagn .options_select{ padding-bottom: 10px; text-align:center;}
	.categories.view #content .main .pagn .options_select .current{ line-height: 25px; float: none;}
	.categories #content .main .details ul#children{ grid-template: auto / repeat(2, 1fr);}

	#content .product-list li{display: block;}
	#content .product-list, #content .product-list li .add-to-cart-box, #content .product-list li .title{float:none; text-align:center;width: 100%;}
	#content .product-list li .title{margin-bottom: 14px;}

	.carts.index #content .main .grid{ grid-template-columns: repeat(1, 1fr);}
	.carts.index #content .main .grid .col:last-child{ grid-column: unset;}
	

	.top-link{ margin: 0 8px 5em 0; width: 50px; height: 50px;}
	iframe#launcher{margin-right: 8px!important;}
	.index #content .main .secure img{margin: 15px 5%;}
	#sidebar img{ margin: 15px auto; display: block;}
	#content #flash_box.product_added #continue_shopping{ margin: 0 0 16px;}
	.products.view #content .main .lab_options .option .button_con{display: block;}
	.products.view #content .main .lab_options .option .button_con button, .products.view #content .main .lab_options .option .button_con a.sample{margin-bottom: 16px;}


	.users.clr #content .table-responsive table, .users.clr #content .table-responsive thead, .users.clr #content .table-responsive tbody, .users.clr #content .table-responsive th, .users.clr #content .table-responsive td, .users.clr #content .table-responsive tr { display: block; }
	.users.clr #content .table-responsive thead tr { display: flex}
	.users.clr #content .table-responsive thead tr:first-child th:nth-child(n+3){display: none} 
	.users.clr #content .table-responsive thead tr:last-child th:nth-child(n+2){display: none} 
	.users.clr #content .table-responsive tr { border: 1px solid #ccc; }
	.users.clr #content .table-responsive td { border: none; border-bottom: 1px solid #eee; position: relative; padding-left: 50%; min-height: 30px; }
	.users.clr #content .table-responsive td:before { position: absolute; top: 6px; left: 6px; width: 45%; padding-right: 10px; white-space: nowrap; color: #31569d; }
	.users.clr #content .table-responsive td:nth-of-type(1):before { content: "Order #"; }
	.users.clr #content .table-responsive td:nth-of-type(2):before { content: "Upload Date"; }
	.users.clr #content .table-responsive td:nth-of-type(3):before { content: "View"; }
	.users.clr #content .table-responsive td:nth-of-type(4):before { content: "Fax"; }
	.users.clr #content .table-responsive td:nth-of-type(5):before { content: "Reorder"; }

	.orders.index #content .table-responsive table, .orders.index #content .table-responsive thead, .orders.index #content .table-responsive tbody, .orders.index #content .table-responsive th, .orders.index #content .table-responsive td, .orders.index #content .table-responsive tr { display: block; }
	.orders.index #content .table-responsive thead tr { display:flex;}
	.orders.index #content .table-responsive tr { border: 1px solid #ccc; }
	.orders.index #content .table-responsive td { border: none; border-bottom: 1px solid #eee; position: relative; padding-left: 50%; min-height: 30px; text-align: right; }
	.orders.index #content .table-responsive td:before { position: absolute; top: 6px; left: 6px; width: 45%; padding-right: 10px; white-space: nowrap; color: #31569d; text-align: left; }
	.orders.index #content .table-responsive td:nth-of-type(1):before { content: "Order #"; }
	.orders.index #content .table-responsive td:nth-of-type(2):before { content: "PO #"; }
	.orders.index #content .table-responsive td:nth-of-type(3):before { content: "First Name"; }
	.orders.index #content .table-responsive td:nth-of-type(4):before { content: "Last Name"; }
	.orders.index #content .table-responsive td:nth-of-type(5):before { content: "Grand Total"; }
	.orders.index #content .table-responsive td:nth-of-type(6):before { content: "Ordered On"; }
	.orders.index #content .table-responsive td:nth-of-type(7):before { content: ""; }

	/*skip link for accessibility*/
	header.body .skip-link {background: #FFFFFF;height: 30px;left: 50%;padding: 8px;position: absolute;transform: translateY(-100%);transition: transform 0.3s;}
	header.body .skip-link:focus {transform: translateY(0%);}
}
