body
{
	margin: 0; padding: 0; background-image: url('/images/gray-background-texture.jpg');		
}

body.noscroll
{
	overflow: hidden;
}

.header_text
{
	text-align: center; 
	height: 100px; 
	padding-top: 20px; 
	box-sizing: border-box;
}

.header_text > div:first-child
{
	display: inline-block; 
	font-family: 'fairplex-wide'; 
	font-weight: 500; 
	font-size: 46px; 
	padding-left: 30px; 
	padding-right: 30px; 
	height: 60px; 
	border-bottom: 2px solid #4d4342; 
	color: #4d4342;
}

.hero_text
{
	position: absolute; 
	top: 50%; 
	left: 50%; 
	margin-top: -40px; 
	margin-left: -180px; 
	height: 80px; 
	width: 360px; 
	text-align: center;
	color: white;
}

.hero_text > div:nth-child(1) > span
{
	font-family: 'Oswald'; font-size: 42px;
}

.hero_text > div:nth-child(2)
{
	margin-top: -14px;
}

.hero_text > div:nth-child(2) > span
{
	font-family: 'Oswald'; font-size: 16px; font-weight: 300;
}

/*Desktop*/
@media screen and (min-width: 800px)
{
	.header_text
	{
		text-align: center; 
		height: 140px; 
		padding-top: 35px; 
		box-sizing: border-box;
	}

	.header_text > div:first-child
	{
		display: inline-block; 
		font-family: 'fairplex-wide'; 
		font-weight: 500; 
		font-size: 54px; 
		padding-left: 40px; 
		padding-right: 40px; 
		height: 70px; 
		border-bottom: 2px solid #4d4342; 
		color: #4d4342;
	}

	.hero_text
	{
		margin-top: -60px; 
		margin-left: -180px; 
		height: 120px; 
		margin-left: -350px; 
		width: 700px; 
	}

	.hero_text > div:nth-child(1) > span
	{
		font-family: 'Oswald'; font-size: 60px;
	}

	.hero_text > div:nth-child(2)
	{
		margin-top: -14px;
	}

	.hero_text > div:nth-child(2) > span
	{
		font-family: 'Oswald'; font-size: 24px;
	}
}	

#popup.shown{display: block;}
#popup.hidden{display: none;}


.post_load_module_container
{
	margin-bottom: 10px;
}

.post_load_module_container > div:first-child
{
	text-align: center; margin-bottom: 10px;
}

.post_load_module_container > div:first-child > span:first-child
{
	font-family: 'Oswald'; font-size: 22px; font-weight: 300; letter-spacing: 1px;
}

.post_load_module
{
	position: relative;
	width:			100%;
}

.post_load_module > div[class~="placeholder"]
{
	position:		relative;
	height:			333px;
	width:			100%;
	border-top:		1px solid #CCC;
	border-bottom:	1px solid #CCC;
	text-align: 	center;
}

.post_load_module > div[class~="placeholder"] > img
{
	position:		absolute;
	top:			50%;
	left:			50%;
	height:			32px;
	width:			32px;
	margin-top:		-16px;
	margin-left:	-16px;
}


.module_container
{
	position:			relative;
	overflow:			hidden;
	/*height: 			332px;*/
	width: 				100%;
	box-sizing: 		border-box;
	padding-top:		10px;
	border-top:			1px solid #CCC;
	border-bottom:		1px solid #CCC;
}

.module
{
	/*position:			relative;*/
	white-space: 		nowrap;
	overflow-x: 		scroll;
	margin-left: 0px;
}

.module > .product:last-child
{
	margin-right: 		0;
}

.module > div:nth-child(1n)
{
	white-space: normal;
}

.module_container ~ button
{
	position: 				absolute;
	top: 					50%; 
	margin-top: 			-32px; 
	font-size: 				32px; 
	line-height: 			64px;
	border:					0;
	background-color:		rgba(255,255,255,0);
	opacity:				.85;
	cursor:					pointer;
}

.module_container ~ button[class~="previous"]
{
	left:					0;
	display: none;
	outline: none;
}

.module_container ~ button[class~="next"]
{
	right: 					0;
	display: none;
	outline: none;
}

.module_container + button[class~="disabled"]
{
	opacity:				.25;
}

@media screen and (min-width: 1020px)
{
	.post_load_module
	{
		padding-left: 50%; margin-left: -450px; width: 900px;
	}

	.module
	{
		position:			absolute;
		overflow: 			hidden;
	}

	.module_container ~ button[class~="previous"]
	{
		left: 				auto;
		margin-left: 		-60px;
		display: inherit;
	}

	.module_container ~ button[class~="next"]
	{
		right: 				-60px;
		display: inherit;
	}
}

.product
{
	position: relative; display: inline-block; width: 170px; text-align: center; vertical-align: top; box-sizing: border-box; padding: 10px; margin-right: 5px;
}

@media screen and (min-width: 800px)
{
	.product
	{
		width: 270px; margin-right: 5px;
	}

	.product > div:nth-of-type(1) > img
	{
		width: 100%; height: 100%;
	}

	.module_container
	{
		height: 420px;
	}
}

/*Image*/
.product > div:nth-of-type(1)
{

}

.product > div:nth-of-type(1) > img:nth-of-type(1)
{
	display: inline;
}

.product > div:nth-of-type(1) > img:nth-of-type(2)
{
	display: none;
}


.product:hover > div:nth-of-type(1) > img:nth-of-type(1)
{
	display: none;
}

.product:hover > div:nth-of-type(1) > img:nth-of-type(2)
{
	display: inline;
}

/*Swatches*/
.product > div:nth-of-type(2)
{
	text-align: left;
	margin-bottom: 8px;
}

.swatch
{
	display: inline-block; border-radius: 10px; height: 20px; width: 20px; margin-right: 4px; border: 1px solid #CCC; box-sizing: border-box;
}

/*Info*/
.product > div:nth-of-type(3)
{
	text-align: left;
	margin-bottom: 8px;
}

.product > div:nth-of-type(3) > span:nth-of-type(1)
{
	display: block; font-family: 'Oswald'; font-size: 16px; font-weight: 400; letter-spacing: .75px;
}

.product > div:nth-of-type(3) > span:nth-of-type(2)
{
	display: block; font-family: 'Oswald'; font-size: 14px; font-weight: 400; color: #9f6414;
}

.product > a:last-of-type
{
	position: absolute; top: 0; left: 0; right: 0; bottom: 0;
}

.multirow_container .product
{
	width: 50%; margin-right: 0;
}

@media screen and (min-width: 800px)
{

	.multirow_container .product
	{
		width: 33.33333333%; margin-right: 0;
	}

}

.multirow_container .product > div:nth-of-type(1) 
{
	margin-bottom: 10px;
}

.multirow_container .product > div:nth-of-type(1) img
{
	width: 100%; height: 100%; vertical-align: top;
}


.sub-headers.desktop
{
	display: table; padding-left: 50%; margin-left: -350px; width: 700px;
}	

@media screen and (min-width: 900px)
{
	.sub-headers.desktop
	{
		display: table; padding-left: 50%; margin-left: -450px; width: 900px;
	}	
}





.sub-headers.desktop > div:nth-of-type(1n)
{
	display: table-row;
}

.sub-headers.desktop > div:nth-of-type(1) > div:nth-of-type(1)
{
	display: table-cell; width: 50%; text-align: right; padding: 10px; height: 200px; box-sizing: border-box; vertical-align: middle;
}

.sub-headers.desktop > div:nth-of-type(1) > div:nth-of-type(2)
{
	display: table-cell; min-width: 20px;
}

.sub-headers.desktop > div:nth-of-type(1) > div:nth-of-type(3)
{
	display: table-cell; width: 50%; height: 200px; box-sizing: border-box; vertical-align: middle;
}

.sub-headers.desktop > div:nth-of-type(1n) > div:nth-of-type(1n) > img:first-child
{
	max-height: 200px; width: 100%; max-width: 430px;
}

.sub-headers.desktop > div:nth-of-type(1n) > div:nth-of-type(1n) > span:first-child
{
	font-family: 'fairplex-wide'; font-size: 20px; line-height: 29px;
}

.sub-headers.desktop > div:nth-of-type(2) > div:nth-of-type(1)
{
	display: table-cell; width: 50%; text-align: right; height: 200px; box-sizing: border-box; vertical-align: middle;
}

.sub-headers.desktop > div:nth-of-type(2) > div:nth-of-type(2)
{
	display: table-cell; min-width: 20px;
}

.sub-headers.desktop > div:nth-of-type(2) > div:nth-of-type(3)
{
	display: table-cell; width: 50%; text-align: left; padding: 10px; height: 200px; box-sizing: border-box; vertical-align: middle;
}