/* 	
	UPDATES

	* by Jordan Dobson Oct 20th 2008 - Added Label Adjustments for New & Sale
	* by Andrew Kelly Jan 29th 2009 - Added More Items transition styles - (See comments beginning with the letter A) 
	* by Brandon Herbe March 12th 2009 - Added padding and styling to Artist Name on Product Detail
	
*/


	/*<dl class="alert bad">
		<dt><font color="#ff0000"><b><span>! </span>Sorry </b>No Items were found.</font></dt>
		<dd>It may have been removed or the URL may be incorrect. Please choose another category or <a href="/i-set-my-friends-on-fire/">View Featured Items</a></dd>
	</dl>*/



/* OVERALL PAGE STRUCTURE */
																				/* Page Content */
form{
	width: 700px;
}
																				/* Image & Thumbnails */
fieldset{
	width: 400px;
	float: right;
}
																				/* Item Price */
form h3{	
	float: left;
	width: 300px;
}

/* Preorder Notice */
form h3 span{
	font-size: .65em;
	color: #FF0000 !important;
	overflow: hidden;
	width: 500px;
	position: absolute;
	margin: 9px 0px 0px 10px;
	/* xborder: 1px solid #666666;*/
}

form h3 span a{
    color: #FF0000 !important;
}
																				/* Options */
form dl{
	float: left;
	width: 300px;
}
																				/* More Info */
form #info{
	float: left;
	width: 250px;
}
																				/* Other Items */
form #other{
	width: 400px;
	float: right;
}

/* GLOBAL ADJUSTMENTS */

div#menu p{
	margin-top: 0px; /* Override Global Setting of 15px */
}
																				/* Remove the Bad Religion Header */
h2 i{
	display: none;
}

/* PAGE SPECIFIC LAYOUT */
																				/* Form */
form{
	margin-top: 50px;
	border-top: 1px solid #ffffff;
}

																				/* Form > Image BG & Text Settings */
form img{		
	color: #eeeeee;
	font-size: .75em;
}
																				/* Photo Wrapper */
fieldset{																	
	overflow: hidden;
}
																				/* Photo Wrapper > Alert Labels */
fieldset legend{
	width: 400px;
	display: block;
	margin: 0;
	padding: 0;
}
																				/* Photo Wrapper > Label Wrapper */
fieldset legend small{
	width: 400px;
	display: block;
	height: 1.125em;			/* 18px */
	position: absolute;
	margin-top: -1.125em;		/* 18px */
	overflow: hidden;
}
																				/* Photo Wrapper > Label Wrapper > Labels */
fieldset legend strong,
fieldset legend i{
	height: 1.8em;
	font-size: .625em;
	line-height: 1.9em;
	float: right;
	padding: 0em .2em 0em .3em;
	margin-left: .2em;
	font-style: normal;
	font-weight: bold;
	color: #ffffff;
	text-transform: Uppercase;
	letter-spacing: 1px;
	font-family: arial;
	
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	-webkit-border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}
																				/* Photo Wrapper > Label Wrapper > Labels - FireFox hacks */
/* FireFox 3 for PC Hack */
html>/**/body fieldset legend strong, x:-moz-any-link, x:default { 
	line-height: 1.8em;
}
/* FireFox 3 for PC Hack */
html>/**/body fieldset legend i, x:-moz-any-link, x:default {
	line-height: 1.8em;
}
																				/* Photo Wrapper > Label Wrapper > Labels - BG Colors */
fieldset legend strong{
	background-color: orange;
}

fieldset legend i{
	background-color: green;
}
																				/* Photo Wrapper > Main Photo */
form fieldset div.main{
	background-color: #eeeeee;
	border: 1px solid #666666;
	width: 398px;
	height: 398px;
	overflow: hidden;
	background-image: url("/_site/img/loader.gif");
	background-repeat: no-repeat;
	background-position: center center;
}

																				/*  Photo Wrapper > Thumbnails Wrapper */
fieldset div#thumbnails{
	padding: 10px 0px;
	text-align: center;
	background-color: #dddddd;
	-moz-border-radius-bottomleft: 5px;
	-moz-border-radius-bottomright: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	vertical-align: top;
	height: 70px;
	overflow: hidden;
}
																				/* Photo Wrapper > Thumbnails Wrapper > Link */
fieldset div#thumbnails a{
	border: 1px solid #0099CC;
	margin: 0 4px;
	width: 68px;
	height: 68px;
	background-color: #000000;

	display: inline-block;	
	display: -moz-inline-box;
	vertical-align: top;
}
fieldset div#thumbnails a:hover{
	border: 1px solid #FF00A7;

}
fieldset div#thumbnails a:hover img{
	opacity: 0.25;
	-moz-opacity: 0.25;
	filter:alpha(opacity=25);
}
																				/* Photo Wrapper > Thumbnails Wrapper > Link > Selected */
a.active{
	border: 1px solid #FF00A7 !important;
	visibility: visible !important;
}
																				/* Photo Wrapper > Thumbnails Wrapper > Link > Selected > Image */
a.active img{
	opacity: 0.25;
	-moz-opacity: 0.25;
	filter:alpha(opacity=25);
}

																				/* Item Price */
form h3{
	margin: -41px 0px 0px 0;
	font-size: 1.5em;
}
																				/* Item Price > Label */
form h3 i{
	font-style: normal;
	color: #999999;
	text-transform: Capitalize;
	font-size: .45em;
}

/* OPTIONS */

																				/* Options */
dl{
	width: 300px;
	float: left;
	overflow: hidden;
}
																				/* Options > header */
dl dt{

}
dl dt b{
	line-height: 1.6em;
	padding: 0 .45em;
	text-transform: Uppercase;
	font-family: "Arial Black", Arial, Helvetica, Geneva, sans-serif;
	font-weight: normal;
	background-color: #666666;
	color: #ffffff;
	display: block;
	height: 1.65em;
	-moz-border-radius-topleft: 6px;
	-webkit-border-top-left-radius: 5px;
	border-top-left-radius: 5px;
	letter-spacing: 0px;
}

																				/* Options > Rows */
dl dd{
	border-bottom: 1px solid #cccccc;
	overflow: hidden;
	position: relative;
	z-index: 1;
}
																				/* Options > Label Wrapper / Link */
dl dd label{
	display: block;
	padding: 1.25em .45em;
}
dl dd label:hover,
dl dd label.selected{
	background-color: #E0F3F8;
	cursor: pointer;
}
dl dd label:hover b{
	color: #FF00A7;
}
dl dd label:hover del{
	color: #4d4d4d;
	text-decoration: none;
}

																				/* Options > Rows > Sale Price */
dl dd input{
	vertical-align: middle;
	margin-right: .8em;
	line-height: 1.7em;
	height: 1.1em;
	height: 15px;
	width: 15px;
	font-size: .8em;
	cursor: pointer;
}
																				/* Options > Rows > Sale Price */
dl dd span{
	font-size: .7em;
	color: #33A02C;
	font-weight: bold;
	vertical-align: middle;																				
	margin-right: .85em;
}
																				/* Options > Rows > Option Title */

dl dd big{
	vertical-align: middle;
}
dl dd big b{
	font-size: 1em;
	color: #0099CC;
	line-height: 1em;
}
																				/* Options > Rows > Sale Price Wrapper */
dl dd small{
	vertical-align: middle;
	font-size: .625em;
	margin-left: 1em;
}
																				/* Options > Rows > Sale Price Wrapper > Label */
dl dd small i{
	display: none;
}
																				/* Options > Rows > Sale Price wrapper > Price */
dl dd small del{
	text-decoration: line-through;
	color: #b3b3b3;
	font-style: italic;
}

/* OPTIONS > OUT OF STOCK */
																				/* Options > Rows > Out of Stock */
dl dd del{}
																				/* Options > Rows > Out of Stock > Sale Price */
dl dd del span{
	color: #b3b3b3;
	text-decoration: line-through;
}
																				/* Options > Rows > Out of Stock > Radio Button */
dl dd del input{
	opacity: 0.5;
	-moz-opacity: 0.5;
	filter:alpha(opacity=50);
}
																				/* Options > Rows > Out of Stock > Item Name */
dl dd del big b{

	position: absolute;
	margin-top: -.45em;

	text-decoration: line-through;
	color: #4d4d4d;
	font-size: .7em;
	line-height: 1.25em;
	height: 1.25em;
}
																				/* Options > Rows > Out of Stock > Notify Link */
dl dd.out a{
	font-size: .7em;
	font-weight: bold;
	text-transform: Capitalize;
	position: absolute;
	line-height: 1.25em;
	height: 1.25em;
	margin-top: .6em;
}
/* ON SALE + OUT OF STOCK */
																				/* Options > Rows > Out of Stock + ON SALE > Sale Price */
dl dd.sale.out del small{
	display: none;
}

/* ADD TO CART BUTTON */
																				/* Options > Rows > Add Button Row */

dl dd#add{
	border-bottom: none;
	padding: 20px 0 0 0;
}
																				/* Options > Rows > Add Button Row > Button */

dl dd#add input{
	background-color: #0099CC;
	background-image: url("/_site/img/btn_overlay.png");
	background-position: center center;
	background-repeat: no-repeat;
	
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	
	width: 186px;
	height: 47px;
	margin-left: .45em;

	color: #ffffff;
	text-transform: Uppercase;
	line-height: 47px !important;
	
	font-family: "Arial Black", Arial, Helvetica, Geneva, sans-serif;
	font-size: 1.125em;
	
	cursor: pointer;
	

}
dl dd#add input:hover{
	background-color: #FF00A7 !important;
}

/* MORE INFORMATION */

																				/* Info Wrapper */
div#info{
	clear: left;
	float left;
	padding: 40px 0 0 0;
	width: 250px;
	overflow: hidden;
}
																				/* Info Wrapper > Header */
div#info h4{
	font-family: "Arial Black", Arial, Helvetica, Geneva, sans-serif;
	font-weight: normal;
	border-bottom: 1px solid #cccccc;
	text-transform: Uppercase;
	font-size: .95em;
	margin-bottom: 1.3em;
	padding-bottom: .6em;
	line-height: 1em;
	color: #666666;
}
																				/* Info Wrapper > Info Wrapper */
div#info div{
	margin-left: .8em;
	font-size: .7em;
	color: #ffffff;
	line-height: 1.6em;
}
div#info div *{
	line-height: 1.6em;
}
																				/* Info Wrapper > Paragraph */
div#info p, div#info h5{
	color: #888888;
	margin: 0 0 1em 0;
}
																				/* Info Wrapper > Ordered & UnOrdered List */
div#info ul, div#info ol{
	color: #888888;
	margin: 0 0 1em 0;
}
																				/* Info Wrapper > UnOrdered List */
div#info ul{
	margin-left: 2em;
}
																				/* Info Wrapper > UnOrdered  List > List Item */
div#info ul li{
	list-style: disc;
}
																				/* Info Wrapper > Ordered  List */
div#info ol{
	margin-left: 2em;
}
																				/* Info Wrapper > Ordered  List > List Item */
div#info ol li { 
	list-style: decimal;
}
																				/* Info Wrapper > Ordered & UnOrdered List > List Item */
div#info li{
	color: #888888;
	line-height: 1.3em !important;
}
																				/* Info Wrapper > Bold Text */
div#info b{	
	color: #777777;
}
																				/* Info Wrapper > Italic Text */
div#info i{
	color: #888888;
}
																				/* Info Wrapper > Header */
div#info h5{
	font-family: "Arial Black", Arial, Helvetica, Geneva, sans-serif;
	font-weight: normal;
	text-transform: Uppercase;
	color: #777777;
	font-size: 1em;
	margin-bottom: .7em;
}
																				/* Info Wrapper > Link */
div#info a{}
																				/* Info Wrapper > Image */
div#info img{}



/* MORE PRODUCTS */
																				/* More products */
div#other{
	width: 400px;
	float: right;
	margin-top: 40px;
}
																				/* More products > header */
div#other h4{
	
	font-family: "Arial Black", Arial, Helvetica, Geneva, sans-serif;
	font-weight: normal;
	border-bottom: 1px solid #cccccc;
	text-transform: Uppercase;
	font-size: .95em;
	margin-bottom: 1.3em;
	padding-bottom: .6em;
	line-height: 1em;
	color: #666666;
}
																				/* More Products > No Items  */
div.noItems{}
																				/* More Products > No Items > Header  */
div.noItems h4{
	display: none;
	font-size: 1px;
	color: #ffffff;
}
																				/* More Products > No Items > List Item  */
div.noItems li{
	font-weight: bold;
	font-size: .8em;
	text-align: center;
	border-top: 1px dotted #cccccc;
	border-bottom: 1px dotted #cccccc;
	padding: .8em;
}
																				/* More Products > No Items > List Item > Link  */
div.noItems li a{
	font-family: Arial, Helvetica, Geneva, sans-serif !important;
}
																				/* More products > view more link */
div#other ul li#return{
	position: absolute;
	width: 400px;
	text-align: right;
	font-weight: bold;

	margin-top: -41px;	/* 43px = 11px (text) + 1px (h4 1px border) + 10px (h4 bottom padding) + 20px (h4 bottom margin) */
	font-size: .7em;
}
																				/* More products > Location Numbers */
div#other ul li#location{
	float: right;
	width: 36px;
}
																				/* More products > Location Numbers > Larger */
div#other ul li#location span{
	margin-top: 56px;
	height: 42px;
	color: #666666;
	font-weight: normal;
	font-family: "Arial Black", Arial, Helvetica, Geneva, sans-serif;
	font-size: .85em;
	display: block;
	text-align: center;
	border-top: none;
	border-bottom: none;
}
																				/* More products > Location Numbers > "OF" Text */
div#other ul li#location span small{
	color: #999999;
	display: block;
	text-align: center;
	font-family: verdana, Arial, Helvetica, Geneva, sans-serif;
	font-size: .6em;
	line-height: 1.75em;
}
																	/* A - More products > Back Item Wrapper */
div#other ul li#back{
	width: 182px;
	height: 154px;
	float: left;
	overflow: hidden;
	
	text-align: right;
}
																	/* A - More products > Next Item Wrapper */
div#other ul li#next{
	width: 182px;
	height: 154px;
	float: right;
	overflow: hidden;
	
	text-align: left;
}

														/* A - More products > Back & Next Item Wrapper > Link & Span */
div#other ul li#back a#moveLast,
div#other ul li#back span#moveLast,
div#other ul li#back span.deactive,
div#other ul li#next a#moveNext,
div#other ul li#next span#moveNext,
div#other ul li#next span.deactive{
	display: block;
	background-color: #0099cc;
	background-image: url("/_site/img/arrow.png");
	background-repeat: no-repeat;
	overflow: hidden;
}

div#other ul li#back span#moveLast,
div#other ul li#back span.deactive,
div#other ul li#next span#moveNext,
div#other ul li#next span.deactive{
	cursor: pointer;
	width: 182px;                      /* <---- Added for NonJavascript version - Need to test in IE! */
}

div#other ul li#back a#moveLast,
div#other ul li#back span#moveLast,
div#other ul li#back span#moveLast.deactive{
	background-position: 8px center;
	-moz-border-radius-bottomleft: 5px;
	-moz-border-radius-topleft: 5px;
	-webkit-border-top-left-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}

div#other ul li#next a#moveNext,
div#other ul li#next span#moveNext,
div#other ul li#next span#moveNext.deactive{
	background-position: 142px center;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-topright: 5px;
	-webkit-border-top-right-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}

																	/* A - More products > Back & Next Item Wrapper > Link > Rollover */
div#other ul li#back a#moveLast:hover,
div#other ul li#back span#moveLast:hover,
div#other ul li#next a#moveNext:hover,
div#other ul li#next span#moveNext:hover{
	background-color: #FF00A7;
}


																	/* A - More products > Container for scrolling product images */
div#other span ul.move{
	position: relative;
	width: 462px;
	display: block;
	overflow:hidden;
}

																	/* A - More products > Floats the images left */
div#other span ul li{
	float: left;
}

																	/* A - More products > Back & Next spans contain scrolling images */
div#other ul li#back span#backSlider,
div#other ul li#next span#nextSlider{
	display: block;
	width: 154px;
	height: 154px;
	
	margin-top: -154px;

	overflow: hidden !important;
	position: relative !important;
	
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	
	background-color: #666666;
	xbackground-image: url("/_site/img/loader.gif");   		/* A - !!!!  Do this loader through Javascript !!!!! */
	background-repeat: no-repeat;
	background-position: center center;
}
																	/* A - Image Container Deactivation Bonanza */
div#other ul li#back a#moveLast.deactive,
div#other ul li#back a#moveLast.deactive:hover,
div#other ul li#back span.deactive,
div#other ul li#back span.deactive:hover,
div#other ul li#next a#moveNext.deactive,
div#other ul li#next a#moveNext.deactive:hover,
div#other ul li#next span.deactive,
div#other ul li#next span.deactive:hover{
	cursor: default !important;
	background-color: #dddddd !important;
}

																	/* A - More products > Back span container positioning */
div#other ul li#back span{
	margin-left: 28px;
}

div#other ul li#back span#moveLast{
	margin-left: 0;
	width: 182px;
}
			
																				/* More products > Back & Next Item Wrapper > Text */
div#other ul li b{
	display: none;
}
																				/* More products > Back & Next Item Wrapper > Link & Image */
div#other ul li a,
div#other ul li a img{
	cursor: pointer !important;
}

																				/* More products > Back & Next Item Wrapper > Link & Span > All Images */
div#other ul img{
	width: 150px;
	height: 150px;
	border: 2px solid #dddddd;
	background-color: #dddddd;
	overflow: hidden;
}

																				/* More Items > Image border/bkg */
div#other a img{
	border-color: #0099cc;
}

																	/* A - More products > Back & Next Item Wrapper > Link & Span > Image > Rollover */
div#other ul li a:hover img{
	border-color: #ff00a7;
	background-color: #dddddd;
}

/* ERRORS */

																				/* Out of Stock Error */
dl dd dl.alert{
	overflow: hidden;
	width: 100% !important;
}
dl dd dl.alert dt{
	padding: .6em;
	padding-bottom: .8em;
	text-align: center;
}
dl dd dl.alert dt b{

	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	border-radius: 0px;
	letter-spacing: 0px;

	font-family: "Arial Black", Arial, Helvetica, Geneva, sans-serif;
	font-weight: normal;
	font-size: 1.3em;

}
dl dd dl.alert dd{
	background-color: #ffffff;
	border-bottom: none;
}

																				/* Item Not Found or Error */
dl.alert{
	width: 700px !important;
}
dl.alert b{
	display: inline;
	background-color: transparent !important;
	color: #ff0000 !important;
	text-transform: none !important;
	line-height: 1em !important;
	padding: 0em !important;
	height: auto !important;
}
dl.alert dd a{
	display: inline !important;
	font-weight: normal !important;
	font-size: 1em !important;
	line-height: 1.4em !important;
	position: relative !important;
	height: auto !important;
	margin-top: 0em !important;
}

/* Artist Name On Product Detail Page */

div#wrapper div#content span big{
	color: #999;
	text-transform: uppercase;
	font: bold 16px "arial black";
}

div#content h2{  /* Product Title Padding */
	padding-top: 10px;
}