/*
 *
 * Axner/Laguna Clay Company
 * http://www.axner.live
 * http://www.lagunaclay.com
 *
 * Copyright 2019 Axner/Laguna Clay Company
 * Division of TerraKotta, Inc.
 * 
 * CSS by Nikki Navaille, copyright 2019
 *
 * SVG Icons: http://www.flaticon.com
 *
 */


@media only screen 
	and (max-width: 1550px) {
		
	#ctl00_columns, .pagewidth { width: 80%; }
		
}

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


}

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


}

@media only screen and (max-width: 1300px) {
	
	#ctl00_columns, .pagewidth { width: 90%; }
	
	.homepage-image-links .hmpglink { width: 30%; margin: 0 0 25% 0; }
	
}

@media only screen and (max-width: 1150px) {
	
	.logo-icon { margin: 15px 10px 0 0; }
	
	.icon-parent { height: 50px; width: 50px; padding: 10px; }
	
	.logo-text .axner-laguna { font-size: 1.5rem; }
	.logo-text span.slash { font-size: 1.75rem; }
	.logo-text .tagline { font-size: 1rem; }
	
	#sidebar { display: none; }
	.page-body-columns .page-column-left { width: 0; margin: 0; }
	.page-body-columns .page-column-center { width: 100%; }
	
	#topbar { display: none; }
	
	#headercontainer { padding: 15px 0 !important; margin-top: 0px !important; }
	
	nav ul.module-list.cat-nav > li > a,
	nav ul.module-list.cat-nav > li > span {font-size: 0.95rem;display: block;padding: 0 10px 0 40px !important;margin: 0 !important;border: 0;}
	
}

@media only screen and (max-width: 1050px) {
	
	#ctl00_columns, .pagewidth { width: 93%; }
	
	.icon-parent { height: 47px; width: 47px; padding: 10px; }
	
	.category-page-type .category-sub-categories .category-list tr,
	.category-page-type .product-list tbody tr,
	#featured .product-list tr { width: 33.33% !important; }
	
	
	
	#footer { display: block !important; text-align: center; }
	
	.footer-column,
	.footer-column.logos-container { width: 33.33% !important; display: inline-block !important; }
	
	.homepage-image-links .hmpglink { width: 30%; margin: 0 0 25% 0; }
	
	
}

@media only screen and (max-width: 1020px) {
		
	.logo-icon { margin: 12px 8px 0 0; left: 6px; }
	
	.icon-parent { height: 38px; width: 38px; padding: 7px; }
	
	.logo-text .axner-laguna { font-size: 1.4rem; }
	.logo-text span.slash { font-size: 1.45rem; }
	.logo-text .tagline { font-size: 0.9rem; }
	
}

@media only screen and (max-width: 1024px) {
	
	li.header-account { width: 45px; }
	
}

@media only screen and (max-width: 1020px) {
	
	li.header-account { margin: 0 2px 0 0; }

}

@media only screen and (max-width: 920px) {
	
	nav ul.module-list.cat-nav > li > ul { padding: 15px 20px; width: 95%; left: 0; }
	
	nav ul.module-list.cat-nav > li > ul > li { max-width: 33.33%; }
	
	.homepage-image-links .hmpglink { width: 30%; margin: 0 0 25% 0; }
	
}

@media only screen and (max-width: 875px) {
	
	#headercontainer { margin: 18px 0 75px 0; }
	
	header { padding-bottom: 25px; }
	
	.header-item.logo { width: 100%; text-align: center; }
		.logo-text { text-align: left; }
	
	.header-item.search {position: absolute;width: 100%;top: 75px;margin: 10px 0;}
		td.custom-search-button { top: -5px; }
	
	.header-item.account { position: absolute; right: 0; }
	
	span.header-icon { top: 10px; }
	span.header-label { display: none; }
	
	/* nav reset */
	
		nav { display: block !important; }
	
		nav > ul > li > ul { left: 0 !important; }
			nav > ul > li > ul a {  }
		
		nav * { display: block !important; }
		
		nav a { font-size: 0.9em !important; line-height: 3em !important; -webkit-touch-callout: none;
		-webkit-user-select: none;
		-khtml-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none; }
		
		nav > ul { padding: 0; }
		
		nav ul > li {  }

		nav ul li,
		nav ul li a,
		nav ul li ul,
		nav ul li ul li,
		nav > ul > li > ul {
			display: block !important;
			position: relative !important;
			width: 100% !important;
			padding: 0 !important;
			margin: 0 !important;
			opacity: 1;
			visibility: visible;
			top: 0;
			left: 0;
			box-shadow: none;
		}
	
	/* responsive nav */
	
	#navbg.open { display: block; position: fixed; top: 0; height: 100%; width: 100%; background-color: #555; opacity: 0.5; z-index: 998; }
	
	nav.closed { height: 0; overflow: hidden; }
	
	#open-button,
	nav.open #close-button { display: block; visibility: visible; position: absolute; top: 20px; }
	
	#open-button { left: 0; }
	
	nav.open #close-button { z-index: 999; right: 10px; top: 5px; /* position: fixed; */ }
	
		#open-button.closed a { /* background-color: transparent; */ }
		#open-button.open a {/* background-color: #ff3399; */}
		
			#open-button a svg,
			#close-button a svg {height: 20px;width: 20px;fill: #555;}
	
	nav.open {display: block;position: fixed;top: 0;left: 0;width: 65%;background-color: #fff;z-index: 999;}
	
	nav.open .pagewidth { width: 100%; top: 40px; margin: 0 0 50px 0; /* border-top: 5px solid #fff; *//* border-bottom: 5px solid #fff; */}

	nav.open ul.module-list.cat-nav { display: block; top: 10px; margin: 0 15px; }
		nav.open ul.module-list.cat-nav li a { position: relative; z-index: 97; }
		
		nav.open ul.module-list.cat-nav li div.li-a-toggle { display: inline-block !important; position: absolute; height: 100%; width: 100%; z-index: 99; }
		nav.open ul.module-list.cat-nav li div.li-a-toggle:hover { cursor: pointer; }
		
		nav a.li-a-anchor { display: none; }
			nav ul.module-list.cat-nav > li .li-a-toggle a.li-a-anchor { display: block; height: 100%; background-color: transparent !important; }
			
		nav ul.module-list.cat-nav > li a { background-color: #eee; border-radius: 0.25rem; padding: 0 15px !important; margin: 0 0 10px 0 !important; }
			nav ul.module-list.cat-nav > li:hover > a { }
			
			nav ul.module-list.cat-nav > li a.open {  }
			
		nav.open ul.module-list.cat-nav > li > ul { display: block !important; visibility: visible; opacity: 1; height: 0; box-shadow: none; transition: none; left: 0 !important; }
		
			nav.open ul.module-list.cat-nav > li > ul.open { box-sizing: border-box; height: auto; max-height: 100%;margin: 0 !important; padding: 15px 10px 15px 10px !important; margin: -15px 0 15px 0 !important; border: 1px solid #eee; border-radius: 0.25rem !important; background-color: transparent; }
			
				nav ul.module-list.cat-nav > li > ul > li > a { background-color: #feb52f !important; border-radius: 0.25rem; position: relative; z-index: 97; }
					nav ul.module-list.cat-nav > li > ul > li .li-a-toggle { z-index: 99; }
					nav ul.module-list.cat-nav > li > ul > li > a:hover { border-radius: 0.25rem; }
				
				nav.open ul.module-list.cat-nav > li > ul.open > ul {  }
				
					nav.open ul.module-list.cat-nav > li > ul.open > li > ul > li { background-color: transparent; position: relative; z-index: 100; }
					
						nav.open ul.module-list.cat-nav > li > ul.open > li > ul > li > a { background-color: transparent; }
							nav ul.module-list.cat-nav > li > ul > li > a:hover { background-color: #febebe; }
						
		nav.open ul.module-list.cat-nav li ul li.selected span { padding: 0; }
			
		nav.open ul.module-list.cat-nav > li:after { display: none; background-color: transparent; }
		
	nav.open { height: 100vh; /* Fallback for browsers that do not support Custom Properties */ height: calc(var(--vh, 1vh) * 100); overflow-y: auto; }
		nav.open * {  }
	
		nav.open ul ul.closed { height: 0; overflow: hidden; }
		nav.open ul ul.open { height: auto; overflow: visible; }
		nav.open ul ul:before {  }
		
		nav ul ul.submenu a { background-color: #fff !important; color: #333 !important; }

		nav ul > a:hover,
		nav ul ul > a:hover {  }
		
			nav.open ul > li > a.closed:before,
			nav.open ul > li > a.open:before { position: absolute; right: 15px; z-index: 98; }
		
			nav.open ul > li > a.closed:before { content: '+'; }
			nav.open ul > li > a.open:before { content: '-'; }
			
				nav.open ul ul > li > a.closed:before,
				nav.open ul ul > li > a.open:before { position: absolute; right: 15px; z-index: 98; }
		
				nav.open ul ul > li > a.closed:before { content: '+'; }
				nav.open ul ul > li > a.open:before { content: '-'; }
			
			nav.open ul.module-list.cat-nav > li > ul > li > ul.closed { display: none !important; }
			nav.open ul.module-list.cat-nav > li > ul > li > ul.open { background-color: transparent; border: 1px solid #feb52f !important; border-radius: 0.25rem; position: relative; margin: -10px 0 15px 0 !important;padding: 10px !important; }
			
		nav.open > ul > li:hover > ul { top: 0 !important; }
		
			nav.open ul.module-list.cat-nav > li {font-size: 1.2rem;text-align: left;padding: 0;margin: 0 !important; border: 0; /* height: auto !important; */}
				nav.open ul.module-list.cat-nav > li.open {  }
			
		nav.open ul.module-list.cat-nav > li > ul > li { max-width: 100%; background-color: transparent; }
		
		nav.open ul.module-list.cat-nav > li > ul.open > li > ul > li > a { border: 1px solid #eee; margin: 0 0 10px 0 !important; border-radius: 0.25rem !important; }
		
	/* product & category widths */
		
	.category-page-type .category-sub-categories .category-list tr,
	.category-page-type .product-list tbody tr,
	#featured .product-list tr { width: 50% !important; }
	
	.homepage-image-links .hmpglink { width: 100%; margin: 0 0 25% 0; }

}

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

	
}

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

	
}

@media only screen and (max-width: 525px) {
	
	.category-page-type .category-sub-categories .category-list tr,
	.category-page-type .product-list tbody tr,
	#featured .product-list tr { width: 100% !important; }


}

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

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