#mainshell {
	height: 600px;
	width: 793px;
	font-family: Arial, Helvetica, sans-serif;
	color: #730475;
	font-size: 12px;
	padding-top: 130px;
	background-repeat: no-repeat;
	font-weight: normal;
	margin-right: auto;
	margin-left: auto;
}
.back {
	background-image: url(back.jpg);
	background-repeat: no-repeat;
	padding-top: 300px;
	padding-left: 60px;
	font-family: "Century Gothic", Arial;
	color: #FFFFFF;
	background-color: #999;
	width: 699px;
}
.back table {
	padding-top: 5px;
	color: #FFFFFF;
}
.back table td {
	height: 25px;
}

input {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	font-family: "Century Gothic", Arial;
	color: #FFFFFF;
	background-repeat: no-repeat;
	font-size: 12px;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	background-color: #BB92D6;
}
.backinput {
	background-image: url(backinput.gif);
	background-repeat: no-repeat;
	height: 26px;
	width: 236px;
	padding-top: 7px;
	padding-left: 18px;
	float: left;
}
select {
	background-color: #BB92D6;
	font-family: "Century Gothic", Arial;
	color: #FFF;
	margin-left: 15px;
	border: 0px solid #000000;
}
form {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	font-size: 12px;
}
.side {
	width: 600px;
	float: left;
}
.style1 {
	color: #B789D1;
	font-weight: bold;
}
.bgr {
	height: 28px;
}
.inputHighlighted {
	background-color: #AF4D26;
}
input:-webkit-autofill {
	background-color: #AF4D26;
}
#mainshellthanks {
	background-image: url(images/thanks_19.jpg);
	height: 907px;
	width: 794px;
	font-family: Arial, Helvetica, sans-serif;
	color: #FFF;
	font-size: 12px;
	padding-top: 250px;
	background-repeat: no-repeat;
	font-weight: normal;
}
.input22 {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	font-family: "Century Gothic", Arial;
	color: #333;
	background-repeat: no-repeat;
	width: 180px;
}
body {
	background-color: #000;
	background-image: url(images/background.jpg);
	background-repeat: no-repeat;
	background-position: 50% 0;
}
.bodyFirst {
	background-image: url(images/backgroundPre.jpg);
	background-position: 50% 0px;
	background-repeat: no-repeat;
}
body.home {background-image: none;}
.overall {
	width: 986px;
	margin: 0 auto;
	padding-bottom: 200px;
	font: normal 12px arial, helvetica, verdana, sans-serif;
	color: #505050;
	}
	::-moz-selection {
		background: #393939;
		color: #fff;
		}
	::selection {
		background: #393939;
		color: #fff;
		}
	:focus {outline: none;}
	a,
	a:link,
	a:visited {
	color: #730475;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
		}
	a:hover,
	a:active,
	a:focus {
	text-decoration: none;
	color: #000;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
		}
a img {
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}
#header {
	width: 986px;
	height: 171px;
	}
	.home #header {margin: 0 auto;}
	/* replace this ID w/ flash */
	.non_flash_bg {
		background: transparent url(../assets/images/main_nav_non_flash.png) no-repeat bottom left;
		height: 171px;
		position: relative;
		font: normal 11px 'Century Gothic', Futura, 'Apple Gothic', helvetica, sans-serif;
		}
		#phpbb .non_flash_bg {
			background: transparent url(../assets/images/main_nav_non_flash_community.png) no-repeat bottom left;
			}

/****************************************************
Generic items - NON FLASH
****************************************************/
	#header ul {
		padding: 10px 0 0 0;
		margin: 0;
		list-style: none outside;
		width: 100%;
		text-align: center;
		}
		#header ul li {display: inline;}
/****************************************************
Logo and home link - NON FLASH
****************************************************/
		#header h1 {
			width: 110px;
			height: 85px;
			position: absolute;
			left: 445px;
			top: 40px;
			}
			#header h1 a {
				display: block;
				width: 110px;
				height: 85px;
				text-indent: -9999px;
				}
/****************************************************
Language select - NON FLASH
****************************************************/
		#header ul.lang_select_non {
			width: 220px;
			position: absolute;
			top: 35px;
			left: 200px;
			text-align: left;
			}
			#header ul.lang_select_non li {
				outline: 0px solid #ff0000;
				padding: 2px 5px;
				display: block;
				float: left;
				width: 50px;
				text-align: center;
				}
				#header ul.lang_select_non a:link,
				#header ul.lang_select_non a:visited {
					color: #a1a0a0;
					text-decoration: none;
					}
				#header ul.lang_select_non a:hover,
				#header ul.lang_select_non a:active,
				#header ul.lang_select_non a:focus,
				#header ul.lang_select_non li.current a:link,
				#header ul.lang_select_non li.current a:visited {
					color: #585858;
					text-decoration: none;
					}
/****************************************************
Register / login - NON FLASH
****************************************************/
		#header ul.register_non {
			width: 220px;
			position: absolute;
			top: 38px;
			left: 612px;
			text-align: left;
			}
			#header ul.register_non li {
				outline: 0px solid #ff0000;
				padding: 2px 5px;
				display: inline;
				color: #fff;
				font-size: 13px;
				}
				#header ul.register_non a:link,
				#header ul.register_non a:visited {
					padding-right: 4px;
					color: #fff;
					text-decoration: none;
					}
				#header ul.register_non a:hover,
				#header ul.register_non a:active,
				#header ul.register_non a:focus {
					color: #fff;
					text-decoration: underline;
					}
/****************************************************
MAIN NAV - NON FLASH
****************************************************/
		#header ul.main_nav_non {
			position: absolute;
			top: 126px;
			font-size: 16px;
			font-weight: bold;
			text-transform: uppercase;
			}
			#header ul.main_nav_non li {
				padding: 0 30px;
				color: #787878;
				}
				#header ul.main_nav_non a:link,
				#header ul.main_nav_non a:visited {
					color: #787878;
					text-decoration: none;
					}
				#header ul.main_nav_non a:hover,
				#header ul.main_nav_non a:active,
				#header ul.main_nav_non a:focus {
					color: #367ddd;
					text-decoration: none;
					}
/****************************************************/
#main_content {
	width: 986px;
	overflow: hidden;
	background: transparent url(../assets/images/main_content_bg.png) repeat-y 0 0;
	}
	body.home #main_content {
		background-image: none;
		width: 100%;
		height: auto;
		}
	#content {
		width: 789px;
		float: left;
		min-height: 400px;
		}
		/* most pages open w/ an hero img */
		#content img.hero {display: block;}
		/* others open w/ hero content */
		#content div.hero {
			display: block;
			padding: 53px 0 0 30px;
			height: 100px;
			background: transparent url(../assets/images/news_hero_bg.jpg) no-repeat 0 0;
			}
			#content div.hero h2 {
				font: normal 24px Calibri, helvetica, arial, sans-serif;
				color: #eaeaea;
				width: 62%;
				margin: 0 0 11px 0;
				line-height: 24px;
				}
			#content div.hero h4 {
				font: normal 11px myriad, myriad-pro, arial, helvetica, verdana, sans-serif;
				color: #a9a9a9;
				}
			#content div.hero h4 span {color: #f03333;}
		#content div.article {
			float: left;
			padding: 25px 0 0 30px;
			width: 465px;
			color: #000;
			line-height: 21px;
			}
			#content div.article a,
			#content div.article a:link,
			#content div.article a:visited {
				color: #DA0000;
				text-decoration: underline;
				}
			#content div.article a:hover,
			#content div.article a:active,
			#content div.article a:focus {
				text-decoration: underline;
				color: #000;
				}
		/* 2 possible left side columns */
		.column_one {
			width: 463px;
			float: left;
			}
		.column_one_wide {
			width: 513px;
			float: left;
			}
		/* 2 possible right side columns */
		.column_two {
			width: 276px;
			float: left;
			}
		.column_two_wide {
			width: 276px;
			float: left;
			}
		/* add to .column_one for textual content
				can this be folded into .column_one?
			*/
			.textual {
				width: 470px;
				padding: 25px 16px 18px 27px;
				line-height: 23px;
				}
			.textual h2 {
				color: #4e7abb;
				font: bold 15px arial, helvetica, verdana, sans-serif;
				}
			.textual ul {
				list-style-position: outside;
				}
				.textual ul li {
					margin-bottom: 9px;
					}

				p.learn_more {
					width: 228px;
					padding: 36px 0 0 18px;
					color: #919191;
					line-height: 23px;
					background: transparent url(../assets/images/game_dj_hero_101.png) no-repeat 0 0;
					clear: both;
					display: block;
					/* text-transform: italic; */
					}
/**********************************
RENEGADE PAGE within /game/
***********************************/
	.textual ul.renegade_list {margin: 0;padding: 0;}
	.textual ul.renegade_list li {
		list-style: none outside;
		background: transparent url(../assets/images/li_asterisk.png) no-repeat 4px 11px;
		margin: 0;
		padding: 3px 9px 3px 22px;
		}
		.textual ul.renegade_list li.stripe {
			background-color: #eee;
			}
			.textual ul.renegade_list li:hover {color: #000;}
/************************************************************************
MUSIC PAGES
	- can the video player be shared w/ the media/video page?
************************************************************************/
.track_wrap {
	overflow: auto;
	border-bottom: 1px solid #a9a9a9;
	border-top: 1px solid #dadada;
	clear: both;
	width: 780px;
	padding: 9px 0;
	}
	/* see global.js where add this CSS3 as JS */
	#tracks .track_wrap:first-child {
		border-top-style: none;
		padding-top: 0;
		}
	#tracks .track_wrap:last-child {
		border-bottom-style: none;
		}
	/* left side video player container */
	.video_container {
		width: 463px;
		float: left;
		}
		/* temp img, swf holder */
		.track_video_container img {display: block;}
	/* right side sample audio player container */
	.sample_container {
		width: 309px;
		float: left;
		margin-left: 8px;
		}
		/*********************
		these have a little
		left margin, let's keep
		it.
		*********************/
		/* track title */
		.sample_container h2 {
			color: #ea9501;
			font: bold 11px arial, helvetica, verdana, sans-serif;
			margin: 18px 9px 2px 9px;
			}
			.media .sample_container h2 {
				color: #56a418;
				}
			.game .sample_container h2 {
				color: #1a64c9;
				}
			.game a,.game a:link,.game a:visited {color: #4E7ABB;}
			.game a:hover,.game a:active {color: #000;}
		/* track description */
		.sample_container p {
			color: #505050;
			font: normal 10px arial, verdana, helvetica, sans-serif;
			width: 90%;
			margin-left: 9px;
			}
		.sample_container ul li {
			font: normal 10px arial, verdana, helvetica, sans-serif;
			}


/* Subtitles */
/* difficulty selector, gallery, videos, etc */
h3.subtitle {
	width: 432px;
	padding: 8px 0 8px 30px;
	float: left;
	background-color: #171717;
	color: #fff;
	font: normal 13px 'Century Gothic', Futura, 'Apple Gothic', helvetica, sans-serif;
	border: 1px solid #dcdcdc;
	border-left-style: none;
	margin-bottom: 2px;
	}
	h3.subtitle strong {
		padding-left: 4px;
		color: #d3a62f;
		}

/*
	difficulty selector drop down container (/music/)
	pagination container
	- can these be combined?
*/
div.difficulty_selector,
div.pagination_container {
	float: left;
	width: 304px;
	margin: 0 0 2px 0;
	padding: 8px 0 5px 10px;
	background-color: #393939;
	font: normal 13px 'Century Gothic', Futura, 'Apple Gothic', helvetica, sans-serif;
	color: #fff;
	border: 1px solid #dcdcdc;
	position: relative;
	}

	div.pagination_container_bigger {
		float: left;
		width: 648px;
		margin: 0 0 2px 0;
		padding: 8px 0 5px 10px;
		background-color: #171717;
		font: normal 13px 'Century Gothic', Futura, 'Apple Gothic', helvetica, sans-serif;
		color: #fff;
		border: 1px solid #dcdcdc;
		border-left-style: none;
		position: relative;
		}
		/* back to #top link */
		p.top {
			float: left;
			width: 108px;
			border: 1px solid #dcdcdc;
			padding: 8px 0 8px 10px;
			background-color: #393939;
			font: normal 13px 'Century Gothic', Futura, 'Apple Gothic', helvetica, sans-serif;
			margin-bottom: 0;
			}

			p.top a:link,
			p.top a:visited {
				color: #fff;
				text-decoration: none;
				background: #393939 url(../assets/images/arrow_up.png) no-repeat right 7px;
				padding-right: 18px;
				}
			p.top a:hover,
			p.top a:active,
			p.top a:focus {
				color: #5eca24;
				text-decoration: none;
				background-position: right 6px;
				}

/*
	Pagintaion, shared on both small and large versions of the pagingation (as seeon on /media/screenshots/)
	- change colors based on the class used on the <body> tag (but we may not be using this pagination outside of the /media/ section for awhile)\
*/
	ol.pagination {
		list-style: none outside;
		margin: 0;
		padding: 0 0 3px 0;
		overflow: auto;
		}
		div.pagination_container_bigger ol.pagination {width: 45%;}

		ol.pagination li {
			display: block;
			float: left;
			font: normal 13px 'Century Gothic', Futura, 'Apple Gothic', helvetica, sans-serif;
			color: #fff;
			padding: 0 4px;
			}
			ol.pagination li:first-child {padding-left: 3px;}

			ol.pagination li.prev {padding-right: 12px;}
			ol.pagination li.next {padding-left: 12px;}
			ol.pagination li.view_all {
				display: block;
				float: right;
				margin-right: 11px;
				padding-right: 13px;
				background: transparent url(../assets/images/arrow_right.png) no-repeat 99% 4px;
				}
				ol.pagination li.view_all:hover {background-position: 97% 4px;}

		ol.pagination li a:link,
		ol.pagination li a:visited {
			color: #5eca24;
			}
			ol.pagination li a.current:link,
			ol.pagination li a.current:visited,
			ol.pagination li.prev a:link,
			ol.pagination li.next a:link,
			ol.pagination li.view_all a:link,
			ol.pagination li.prev a:visited,
			ol.pagination li.next a:visited,
			ol.pagination li.view_all a:visited {
				color: #fff;
				text-decoration: none;
				}
			ol.pagination li.prev a:hover,
			ol.pagination li.next a:hover,
			ol.pagination li.view_all a:hover,
			ol.pagination li.prev a:active,
			ol.pagination li.next a:active,
			ol.pagination li.view_all a:active {
				color: #5eca24;
				}

		ol.pagination li a:hover,
		ol.pagination li a:active,
		ol.pagination li a:focus {
			color: #fff;
			}
/*
	difficulty selector drop_down menu (/music/), pagination
	- see global.js
*/
	div.difficulty_selector ul {
		margin: 0;
		padding: 0;
		background: transparent url(../assets/images/arrow_down.png) no-repeat right 8px;
		width: 90%;
		list-style: none outside;
		width: 287px;
		background-color: #393939;
		border-style: none;
		}
		/* keep the padding on the LI to improve its :hover performance */
		div.difficulty_selector ul li {padding-bottom: 3px;}

		div.difficulty_selector ul ul {
			background-image: none;
			margin: 0;
			width: 282px;
			padding: 9px 9px 9px 23px;
			list-style: none outside;
			font: normal 13px 'Century Gothic', Futura, 'Apple Gothic', helvetica, sans-serif;
			position: absolute;
			left: -1px;
			top: 28px;
			background-color: #393939;
			border: 1px solid #dcdcdc;
			border-top: 0px dotted #dcdcdc;
			display: none;
			}
			.music .difficulty_selector a,
			.music .difficulty_selector a:link,
			.music .difficulty_selector a:visited {
				color: #fff;
				text-decoration: none;
				display: block;
				width: 100%;
				}
			.music .difficulty_selector a:hover,
			.music .difficulty_selector a:active,
			.music .difficulty_selector a.current {
				color: #d3a62f;
				text-decoration: none;
				cursor: pointer;
				}
	/*********************
	screenshot container
	*********************/
	ul.media_container {
		list-style: none outside;
		margin: 0;
		padding: 0;
		}
		ul.media_container li {
			display: block;
			float: left;
			margin: 0 2px 4px 0;
			border-bottom: 1px solid #d2d2d2;
			}
			ul.media_container li img {
				display: block;
				border: 3px solid #d2d2d2;
				margin: 0 0 4px 0;
				}
	/*********************
	SET LIST page
	*********************/
	.music a,.music a:link,.music a:visited {color: #e9a81c;}
	.music a:hover,.music a:active {color: #000;}
	#setlist {
		width: 770px;
		}
		#setlist td {border: 0px solid #00f000;}
		#setlist tr td.setlist_title {padding-top: 30px; border-bottom: 1px solid #ccc;}
	
	#setlist .setlist_title {
		color: #ea9501;
		font-weight: bold;
		padding: 18px 0 10px 0;
		}
	#setlist h3.subtitle,
	#artist_list h3.subtitle {width: 749px;}
	#setlist h2,
	#artist_list h2 {
		clear: both;
		font: bold 14px arial, helvetica, verdana, sans-serif;
		color: #6d6d6d;
		border-bottom: 1px solid #dadada;
		width: 410px;
		padding: 20px 0 17px 0;
		margin: 0 0 0 22px;
		}
		#setlist h2:last-child {border-bottom-style: none;}
		#setlist h2 span {color: #e9a81c;}
		
		table.table_setlist {
			margin-left: 14px;
			clear: both;
			font: normal 11px arial, helvetica, verdana, sans-serif;
			width: 90%;
			}
			table.table_setlist td {
				padding-top: 20px;
				padding-bottom: 10px;
				}

				.vs {
					color: #e9a81c;
					text-transform: uppercase;
					font: bold 14px arial, helvetica, verdana, sans-serif;
					display: block;
					padding: 0 10px 30px 10px;
					}
					.vs_link {padding: 0;}
					
					.vs_link a {
						clear: both;
						height: 55px;
						padding: 0 10px 35px 10px;
						color: #e9a81c;
						text-decoration: none;
						z-index: 2;
						position: relative;
						background: transparent url(../assets/images/music_setlist_vs.png) no-repeat 50% 15px;
						}
						.vs_link a:hover {background-position: 50% -56px;}
			td.main_artist {
				text-align: right;
				}
	/*********************
	ARTITSTS page
	*********************/
	#artist_list {
		width: 770px;
		background: transparent url(../assets/images/music_artists_blaaam.jpg) no-repeat right 80px;
		}
	h4.artist_list_title {
		color: #ea9501;
		font-weight: bold;
		padding: 18px 0 10px 15px;
		width: 760px;
		clear: both;
		font-size: 11px;
		}
		ul.artist_list {
			clear: both;
			margin: 0 0 0 15px;
			width: 600px;
			overflow: auto;
			padding-top: 18px;
			padding-bottom: 18px;
			}
			ul.artist_list li {
				font: bold 11px arial, helvetica, verdana, sans-serif;
				color: #6d6d6d;
				display: block;
				float: left;
				width: 165px;
				padding-left: 10px;
				padding-right: 10px;
				padding-bottom: 4px;
				background: transparent url(../assets/images/music_artists_li.png) no-repeat 0 7px;
				}
		

/*********************
Buy Page
*********************/
.buy_item {
	width: 789px;
	padding-bottom: 9px;
	overflow: auto;
	}
	.item_bottom {background: transparent url(../assets/images/buy_item_bg.png) no-repeat bottom center;}
	.buy_item h2 {
		color: #3e3e3e;
		font: bold 15px arial, helvetica, verdana, sans-serif;
		margin: 23px 0 10px 28px;
		}
	.buy_item h2 strong {color: #e35b00;}
	.game .buy_item h2 strong {color: #4E7ABB;}
	.game .buy_item h2 a,
	.game .buy_item h2 a:link,
	.game .buy_item h2 a:visited {
		color: #3e3e3e;
		text-decoration: none;
		}
	.game .buy_item h2 a:hover,
	.game .buy_item h2 a:active,
	.game .buy_item h2 a:hover strong,
	.game .buy_item h2 a:active	strong {
		color: #000;
		}
	
	.buy_item p {
		margin-left: 28px;
		}
	.item_info {
		padding: 0;
		float: left;
		}
	.item_links {
		float: left;
		text-align: center;
		padding: 33px 0 0 0;
		width:409px;
		}
		/* .item_links * {border: 1px solid #ff0000;} */
		.item_links table {
			margin: 0 auto;
			width: 430px;
			}
		.item_links table td {
			text-align: center;
			}
		.item_links table td p {
			margin-left: 0;
			padding: 0 10px;
			}

		.item_links table tr {
			}

			.item_links img {
				padding: 10px;
				}

		.item_links a {
			text-decoration: none;
			color: #6c6c6c;
			}
		.item_links a:hover {
			text-decoration: underline;
			color: #000;
			}


	/**********************************************************************************
	DEFAULT REGISTRATION FORM VALUES
		- we get very specific here, enjoy
		- PHP error msgs get put in UL's Javascript error msgs get put in labels (label.error)
	**********************************************************************************/
			.registration_bg {
				background: transparent url(../assets/images/registration_bg.jpg) no-repeat 15px 0;
				}
				.registration_bg_no_line {background: transparent url(../assets/images/registration_bg_no_line.jpg) no-repeat 15px 0;}
			.error,
			.register label.error {
				background-color: #980000;
				color: #fff;
				}
			form ul.error,
			ul.error {
				margin: 0 0 9px 20px;
				padding: 0;
				width: 30%;
				}
				form ul.error li {
					margin: 0;
					padding: 0;
					list-style: disc inside;
					background-image: none ! important;
					}
			legend {display: none;}
			.register label {
				font-size: 11px;
				display: block;
				float: left;
				color: #fff;
				margin-top: 7px;
				}
				label:hover {cursor: pointer;}
				label.error {
					width: 170px;
					clear: both;
					margin: 0 0 4px 0;
					position: relative;
					top: -2px;
					}
			/* computed width = 224px */
			.register input,
			input#page_jump,
			.register textarea,
			#comments textarea {
				border: 1px solid #d9d9d9;
				width: 212px;
				height: 14px;
				padding: 6px 4px;
				color: #1d1d1d;
				font: normal 10px verdana, arial, sans-serif;
				display: block;
				float: right;
				background-color: #e2e2e2;
				}
				input[type="hidden"] {display: none ! important;}
				textarea {
					width: 342px;
					height: 95px;
					background-image: none;
					}
					#comments textarea {
						width: 500px;
						height: 100px;
						float: none;
						margin-bottom: 18px;
						background-image: none;
						color: #e6e5e5;
						}
				/* do not make the inputs w/ errors red, it looks weird */
				input.error,select.error {color: #1d1d1d;}
				input.small,
				ul.platforms li input.small {
					height: 14px;
					padding: 2px 4px;
					width: 157px;
					}

				/* force ALL inputs to have a pretty border when we say so */
				input:focus,
				input:hover,
				textarea:hover,
				form div:hover input,
				form div:hover select,
				form div:hover textarea,
				select:focus,
				form div:hover .platforms li:hover input {
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
					}

				form input[type='checkbox'],
				form input[type='radio'],
				form div:hover input[type='checkbox'],
				form div:hover input[type='radio'],
				.platforms input[type='checkbox'],
				form div:hover .platforms li:hover input[type='checkbox'],
				form div:hover .platforms li input[type='checkbox'] {
					background-color: transparent;
					border-style: none ! important;
					}
				/* keep gamertags from :hovering on parent div:hover */
				form div:hover .platforms li input {border: 1px solid #9e9e9e ! important;}

			.register select {
				float: right;
				color: #1d1d1d;
				font: normal 10px verdana, arial, sans-serif;
				border: 1px solid #d9d9d9;
				background-color: #e2e2e2;
				padding-top: 2px;
				height: 26px;
				width: 222px;
				}
			.register form div {
				display: block;
				clear: both;
				border: 0px solid #ffff00;
				width: 410px;
				overflow: auto;
				background-color: #1d1d1d;
				padding: 0 0 0 8px;
				margin-bottom: 2px;
				margin-left: 0;
				}
				form fieldset.wider div {width: 540px;}

				form fieldset.display_profile div {float: left;}

				form div.display_profile {
					clear: none;
					width: auto;
					border: 1px solid #ff0000;
					float: left;
					background-color: #090909;
					border: 1px solid #262626;
					height: 26px;
					overflow: hidden;
					padding-right: 7px;
					}
			.register form small {color: #686868; padding-top: 6px;display: block;}

			.register form ul {
				margin: 0 0 0 0px;
				padding: 0;
				}
			/* see exploder.css, where we set a height */
			.register form ul li {
				list-style: none outside;
				margin: 0;
				padding: 0 0 0 10px;
				background: transparent url(../assets/images/li_asterisk.png) no-repeat 0 8px;
				overflow: auto;
				display: block;
				clear: both;
				}
				form ul.optional li {
					background: transparent url(../assets/images/li_dash.png) no-repeat 0 14px;
					}
				form div.date_wrap {
					float: right;
					border: 0px solid #ff0000;
					width: 222px;
					margin: 0;
					padding: 0;
					clear: none;
					background-color: #e2e2e2;
					}
					.date_wrap select {
						width: 72px;
						float: left;
						margin-right: 3px;
						}
						.date_wrap select#year {margin-right: 0;}

					/* all buttons default to "login" image
						see greybox.css for greybox buttons
						see exploder.css
					*/
					button {
						display: block;
						height: 24px;
						border-style: none;
						border-right: 1px solid #9c9c9c;
						color: #9d9b9b;
						background: #fff url(../assets/images/button.png) no-repeat 0 0;
						padding: 0 10px 0 25px;
						text-align: left;
						text-transform: uppercase;
						}
						button.login {margin-top: 9px;}
						a.home,
						a.button {
							display: block;
							width: 45px;
							color: #9d9b9b;
							text-transform: uppercase;
							background: transparent url(../assets/images/button.png) no-repeat 0 0;
							border-style: none;
							font: 12px bold tahoma, arial, verdana, sans-serif;
							text-decoration: none;
							height: 14px;
							padding: 5px 10px 5px 30px;
							border-right: 1px solid #9c9c9c;
							}

						button:hover,
						a.home:hover,
						a.button:hover {
							cursor: pointer;
							color: #1d1d1d;
							}
		.subheader {
			font: bold 15px arial, helvetica, sans-serif;
			color: #4e7abb;
			margin: 24px 0 0 28px;
			}
		.subheader_2 {
			font: bold 15px arial, helvetica, sans-serif;
			color: #4e7abb;
			margin: 0 0 0 0;
			}

	div.existing_account {
		margin: 0 0 0 28px;
		}

		p.existing {
			line-height: 19px;
			margin-top: 4px;
			width: 55%;
			}
			/* intro para */
			p.existing span {
				font-weight: bold;
				color: #505050;
				}

		a.register_help {
			color: #3cb7e1;
			margin-left: 12px;
			border-left: 1px solid #fff;
			padding-left: 12px;
			text-decoration: none;
			/* hidden until further notice */
			display: none;
			}
			a.register_help:hover {text-decoration: underline;}

			div.login_button a.register_help {
				display: block;
				float: left;
				margin-top: 10px;
				/* hidden until further notice */
				display: none;
				}

/**********************************************************************************
NEW USER: ACCOUNT CREATION
**********************************************************************************/
	div.account_creation {
		padding: 62px 0 25px 10px;
		min-height: 442px;
		}
		.account_creation fieldset,
		.account_creation_profile fieldset {margin-left: 20px;}

		.account_creation fieldset {margin-left: 10px;}

		/* * required Information */
		p.required {
			padding-left: 11px;
			background: transparent url(../assets/images/li_asterisk.png) no-repeat 0 3px;
			}
		p.optional {
			background: transparent url(../assets/images/li_dash.png) no-repeat 0 6px;
			margin: 16px 0 20px 8px;
			padding-left: 10px;
			}

		div.account_creation button {margin: 9px 0 0 10px;}

/**********************************************************************************
STEP 2 REGISTRATION
ACCOUNT_CREATION_PROFILE
**********************************************************************************/
.twitter {
	float: right;
	position: relative;
	top: 40px;
	left: -45px;
	}
	.news .twitter {
		top: 25px;
		left: -24px;
		}
	.news .article ul {list-style-position: outside;}
	/* platforms list */
	ul.platforms {
		background-color: #090909;
		width: 350px;
		float: right;
		border: 1px solid #262626;
		border-bottom-style: none;
		list-style: none outside;
		}
		.register ul.platforms li {
			clear: both;
			border-bottom: 1px solid #262626;
			padding: 2px 0;
			overflow: hidden;
			background-image: none ! important;
			}
		ul.platforms li input,
		div.display_profile input {
			float: left;
			width: auto;
			height: auto;
			padding: 0;
			}

		ul.platforms li label {margin: 4px 0 0 4px;}
		ul.platforms li label.gamer_tag {margin: 4px 8px 0 12px;}
		div.display_profile label {margin-top: 4px;}

			ul.platforms li label.gamer_tag span {margin-right: 10px;}

		/* RADIO BUTTONS */
		div.radios {
			float: left;
			width: 188px ! important;
			height: 28px ! important;
			}
		div.radios_wrap {
			clear: none ! important;
			width: 342px ! important;
			float: left ! important;
			background-color: #e2e2e2 ! important;
			border: 1px solid #d9d9d9 ! important;
			height: 20px ! important;
			padding-top: 6px ! important;
			}
			div.radios_wrap input,
			div.radios_wrap label {
				width: auto;
				float: left;
				margin: 0 7px 0 0;
				}
				div.radios_wrap label {
					margin-right: 20px;
					color: #1d1d1d;
					}

		form fieldset.wider div.register_step2_footer {
			margin: 10px;
			height: 33px;
			width: 900px;
			padding: 24px 0 0 0;
			background: transparent url(../assets/register_step2_footer.png) no-repeat top right;
			}
/**********************************************************************************
STEP 3 REGISTRATION
**********************************************************************************/
.register_step3 {
	padding-left: 28px;
	/* background: transparent url(../assets/images/registration_bg.jpg) no-repeat 0 -20px; */
	min-height: 600px;
	}
	.register_step3 h4 {
		color: #4e7abb;
		font: bold 11px arial, helvetica, verdana;
		margin: 20px 0 9px 10px;
		}
	div.verification {
		width: 400px;
		height: auto;
		font: normal 11px arial, verdana, helvetica, sans-serif;
		line-height: 18px;
		padding: 20px 10px;
		margin: 0 0 16px 0;
		color: #373737;
		border: 1px solid #dcdcdc;
		}

.register #phpbb label {
	color: #363A3A;
	display: block;
	font-size: 11px;
	margin-top: 7px;
	float: none;
	}

.register #phpbb input {
	margin-bottom: 9px !important;
	float: none ! important;
	}


/**********************************************************************************
STEP 4 REGISTRATION
	- uses most of step 3 declarations
**********************************************************************************/
.register_step4_top {
	height: 143px;
	text-indent: -9999px;
	}

/**********************************************************************************
FOOTER
**********************************************************************************/
	#footer {
	background: transparent url(http://djhero.com/assets/images/main_content_bg.png) repeat-y 0 0;
	clear: both;
		}
	body.home #footer {background-image: none;}
	#footer ul {margin: 0;}
		/* logo garden, hidden */
		.footer_content {
			display: none;
			text-align: center;
			}
		.drawer_top {
			height: 16px;
			background: transparent url(http://djhero.com/assets/images/footer/footer_drawer.png) no-repeat bottom left;
			margin: 0;
			text-align: center;
			padding-top: 3px;
			}
			.drawer_top:hover {cursor: pointer;}
			.drawer_top p {
				text-align: center;
				margin: 0;
				}
				.drawer_top a,
				.drawer_top a:link,
				.drawer_top a:visited {
					background: transparent url(http://djhero.com/assets/images/footer/garden_arrow.png) no-repeat right 4px;
					color: #8e8d8d;
					font: normal 10px tahoma, arial, sans-serif;
					padding-right: 20px;
					text-transform: uppercase;
					text-decoration: none;
					}
					.drawer_top a:hover {
						color: #706f6f;
						}

			#footer ul.logos {
				text-align: center;
				padding: 20px 0 30px 0;
				list-style: none outside;
				overflow: auto;
				border-bottom: 9px solid #d5d3d3;
				}

				ul.logos li {
					display: inline;
					margin: 0 35px 0 0;
					}
					ul.logos img {display: inline;}

		/*************************************************************************************************
			add .logo_garden_home to homepage layout, logo_garden class is NOT used elsewhere
				- ovewrite BG images, set width
		*************************************************************************************************/
		.logo_garden_home {
			width: 986px;
			margin: 0 auto;
			}
			.logo_garden_home .drawer_top {
				background: transparent url(http://djhero.com/assets/images/footer/footer_drawer_home.png) no-repeat bottom left;
				height: 17px;
				padding-top: 2px;
				}
			.logo_garden_home .drawer_top a {
				background: transparent url(http://djhero.com/assets/images/footer/garden_arrow.png) no-repeat right 4px;
				color: #4d4d4d;
				}
			.logo_garden_home .drawer_top a:hover {
				color: #706f6f;
				}
				/*
				.logo_garden_home .drawer_top_current a {
					background-position: right -30px;
					color: #706f6f;
					}
				*/
			.logo_garden_home ul.logos {
				background-color: #fff;
				border: 1px solid #1c1c1c;
				}

	#legal_nav {
		list-style: none outside;
		text-align: center;
		text-transform: uppercase;
		font: normal 9px tahoma, verdana, arial, sans-serif;
		}

		#legal_nav li {
			display: inline;
			border-right: 1px solid #4d4d4d;
			padding: 0 10px;
			}
			#legal_nav li:last-child {border-style: none;}
			#legal_nav a,
			#legal_nav a:link,
			#legal_nav a:visited {
				color: #4d4d4d;
				text-decoration: none;
				}
			#legal_nav a:hover,
			#legal_nav a:active,
			#legal_nav a:focus {
				color: #fff;
				text-decoration: none;
				}

		#ratings_nav {
			text-align: center;
			list-style: none outside;
			margin: 0 auto;
			margin: 0;
			padding: 0;
			}
			#ratings_nav li {
				display: inline;
				padding: 0 10px;
				}
p.legal_statement {
	display: block;
	text-align: center ! important;
	width: 70% ! important;
	margin: 18px auto ! important;
	font-family: tahoma, verdana, arial, sans-serif;
	font-size: 9px;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	color: #606060;
	}
	body.home p.legal_statement {
		color: #4D4D4D;
		}
		
		
		/************************************************************************************************
Handles ALL sub navigation that runs down the left side.
	ul.sub_nav is Shared CSS used for ALL sub_nav's.
	- defaults to the game navigation
	- we use "one, two, three" for classes so we can share those classes on ALL sub_nav li's
	- created with template file: production_source/dj_hero_sub_nav.tpl.psd
	- we use generic class names on each list item to avoid writing a thousand declarations
************************************************************************************************/
ul.sub_nav {
	float: left;
	margin: 0;
	padding: 50px 0 0 0;
	list-style: none outside;
	width: 197px;
	background: transparent url(http://djhero.com/assets/images/sub_nav_empty.png) no-repeat 0 0;
	line-height: normal;
	height: 402px;
	}
	.news ul.sub_nav {height: auto;}
	ul.sub_nav li {
		display: block;
		width: 197px;
		height: 32px;
		position: relative;
		overflow: hidden;
		}
		.news ul.sub_nav li {
			height: auto;
			background: transparent url(http://djhero.com/assets/images/sub_nav_news_li_bg.png) no-repeat bottom right;
			}
		ul.sub_nav li a {
			display: block;
			width: 197px;
			height: 32px;
			text-indent: -9999px;
			color: #000;
			text-decoration: none;
			}
	/* default link values */
	ul.sub_nav li a:link,
	ul.sub_nav li a:visited {
		width: 197px;
		height: 32px;
		background: transparent url(http://djhero.com/assets/images/sub_nav_game_en.png) no-repeat 0 -50px;
		}
	/* overwrite each sub_nav link based on the class used on the <body> tag */
	body.game ul.sub_nav li a:link,
	body.game ul.sub_nav li a:visited {background-image: url(../assets/images/sub_nav_game_en.png);}
	
	body.news ul.sub_nav li a:link,
	body.news ul.sub_nav li a:visited {background-image: url(../assets/images/sub_nav_news_en.png);}
	
	body.music ul.sub_nav li a:link,
	body.music ul.sub_nav li a:visited {background-image: url(../assets/images/sub_nav_music_en.png);}
	
	body.media ul.sub_nav li a:link,
	body.media ul.sub_nav li a:visited {background-image: url(../assets/images/sub_nav_media_en.png);}

	body.buy ul.sub_nav li a:link,
	body.buy ul.sub_nav li a:visited {background-image: url(../assets/images/sub_nav_buy_en.png);}
	
	body.board ul.sub_nav li a:link,
	body.board ul.sub_nav li a:visited {background-image: url(../assets/images/sub_nav_board_en.png);}

	body.register ul.sub_nav li a:link,
	body.register ul.sub_nav li a:visited {background-image: url(../assets/images/sub_nav_register_en.png);}

	body.playitnow ul.sub_nav li a:link,
	body.playitnow ul.sub_nav li a:visited {background-image: url(../assets/images/sub_nav_playitnow_en.png);}

	body.lounge ul.sub_nav li a:link,
	body.lounge ul.sub_nav li a:visited {background-image: url(../assets/images/sub_nav_lounge_en.png);}

	body#phpbb ul.sub_nav li a:link,
	body#phpbb ul.sub_nav li a:visited {background-image: url(../assets/images/sub_nav_lounge_en.png);}
	
	body.news ul.sub_nav li a:link,
	body.news ul.sub_nav li a:visited {
		padding: 18px 8px 18px 42px;
		text-indent: 0;
		background-image: none;
		width: 147px;
		height: auto;
		}	
		
	ul.sub_nav li a:hover,
	ul.sub_nav li a:active,
	ul.sub_nav li a:focus {
		background-position: -197px -50px;
		color: #da0000;
		}

		.news ul.sub_nav li a:hover,
		.news ul.sub_nav li a:active,
		.news ul.sub_nav li a:focus,
		.news ul.sub_nav li.current a:link,
		.news ul.sub_nav li.current a:visited {
			background: transparent url(../assets/images/sub_nav_news_hover.png) no-repeat right 50% ! important;
			color: #da0000;
			}
	/* each link value */
	ul.sub_nav li.sub_1 a:link,
	ul.sub_nav li.sub_1 a:visited {background-position: 0 -50px;}
		ul.sub_nav li.sub_1 a:hover,
		ul.sub_nav li.sub_1 a:active,
		ul.sub_nav li.sub_1 a:focus,
		ul.sub_nav li.sub_1 a.current:link,
		ul.sub_nav li.sub_1 a.current:visited {background-position: -197px -50px;}
		ul.sub_nav li.sub_1 a.coming_soon {background-position: -394px -50px ! important;}
	ul.sub_nav li.sub_2 a:link,
	ul.sub_nav li.sub_2 a:visited {background-position: 0 -82px;}
		ul.sub_nav li.sub_2 a:hover,
		ul.sub_nav li.sub_2 a:active,
		ul.sub_nav li.sub_2 a:focus,
		ul.sub_nav li.sub_2 a.current:link,
		ul.sub_nav li.sub_2 a.current:visited {background-position: -197px -82px;}
		ul.sub_nav li.sub_2 a.coming_soon {background-position: -394px -82px ! important;}
	ul.sub_nav li.sub_3 a:link,
	ul.sub_nav li.sub_3 a:visited {background-position: 0 -114px;}
		ul.sub_nav li.sub_3 a:hover,
		ul.sub_nav li.sub_3 a:active,
		ul.sub_nav li.sub_3 a:focus,
		ul.sub_nav li.sub_3 a.current:link,
		ul.sub_nav li.sub_3 a.current:visited {background-position: -197px -114px;}
		ul.sub_nav li.sub_3 a.coming_soon {background-position: -394px -114px ! important;}
	ul.sub_nav li.sub_4 a:link,
	ul.sub_nav li.sub_4 a:visited {background-position: 0 -146px;}
		ul.sub_nav li.sub_4 a:hover,
		ul.sub_nav li.sub_4 a:active,
		ul.sub_nav li.sub_4 a:focus,
		ul.sub_nav li.sub_4 a.current:link,
		ul.sub_nav li.sub_4 a.current:visited {background-position: -197px -146px;}
		ul.sub_nav li.sub_4 a.coming_soon {background-position: -394px -146px ! important;}
	ul.sub_nav li.sub_5 a:link,
	ul.sub_nav li.sub_5 a:visited {background-position: 0 -178px;}
		ul.sub_nav li.sub_5 a:hover,
		ul.sub_nav li.sub_5 a:active,
		ul.sub_nav li.sub_5 a:focus,
		ul.sub_nav li.sub_5 a.current:link,
		ul.sub_nav li.sub_5 a.current:visited {background-position: -197px -178px;}
		ul.sub_nav li.sub_5 a.coming_soon {background-position: -394px -178px ! important;}
	ul.sub_nav li.sub_6 a:link,
	ul.sub_nav li.sub_6 a:visited {background-position: 0 -210px;}
		ul.sub_nav li.sub_6 a:hover,
		ul.sub_nav li.sub_6 a:active,
		ul.sub_nav li.sub_6 a:focus,
		ul.sub_nav li.sub_6 a.current:link,
		ul.sub_nav li.sub_6 a.current:visited {background-position: -197px -210px;}
		ul.sub_nav li.sub_6 a.coming_soon {background-position: -394px -210px ! important;}
	ul.sub_nav li.sub_7 a:link,
	ul.sub_nav li.sub_7 a:visited {background-position: 0 -242px;}
		ul.sub_nav li.sub_7 a:hover,
		ul.sub_nav li.sub_7 a:active,
		ul.sub_nav li.sub_7 a:focus,
		ul.sub_nav li.sub_7 a.current:link,
		ul.sub_nav li.sub_7 a.current:visited {background-position: -197px -242px;}
		ul.sub_nav li.sub_7 a.coming_soon {background-position: -394px -242px ! important;}
	ul.sub_nav li.sub_8 a:link,
	ul.sub_nav li.sub_8 a:visited {background-position: 0 -274px;}
		ul.sub_nav li.sub_8 a:hover,
		ul.sub_nav li.sub_8 a:active,
		ul.sub_nav li.sub_8 a:focus,
		ul.sub_nav li.sub_8 a.current:link,
		ul.sub_nav li.sub_8 a.current:visited {background-position: -197px -274px;}
		ul.sub_nav li.sub_8 a.coming_soon {background-position: -394px -274px ! important;}
	ul.sub_nav li.sub_9 a:link,
	ul.sub_nav li.sub_9 a:visited {background-position: 0 -306px;}
		ul.sub_nav li.sub_9 a:hover,
		ul.sub_nav li.sub_9 a:active,
		ul.sub_nav li.sub_9 a:focus,
		ul.sub_nav li.sub_9 a.current:link,
		ul.sub_nav li.sub_9 a.current:visited {background-position: -197px -306px;}
		ul.sub_nav li.sub_9 a.coming_soon {background-position: -394px -306px ! important;}
	ul.sub_nav li.sub_10 a:link,
	ul.sub_nav li.sub_10 a:visited {background-position: 0 -338px;}
		ul.sub_nav li.sub_10 a:hover,
		ul.sub_nav li.sub_10 a:active,
		ul.sub_nav li.sub_10 a:focus,
		ul.sub_nav li.sub_10 a.current:link,
		ul.sub_nav li.sub_10 a.current:visited {background-position: -197px -338px;}
		ul.sub_nav li.sub_10 a.coming_soon {background-position: -394px -338px ! important;}
	ul.sub_nav li.sub_11 a:link,
	ul.sub_nav li.sub_11 a:visited {background-position: 0 -370px;}
		ul.sub_nav li.sub_11 a:hover,
		ul.sub_nav li.sub_11 a:active,
		ul.sub_nav li.sub_11 a:focus,
		ul.sub_nav li.sub_11 a.current:link,
		ul.sub_nav li.sub_11 a.current:visited {background-position: -197px -370px;}
		ul.sub_nav li.sub_11 a.coming_soon {background-position: -394px -370px ! important;}
/****************/
.music ul.sub_nav li.sub_3 {height: auto;background: transparent url(../assets/images/sub_nav_empty_tierch.png) repeat-y 0 0;}
	body.music ul.sub_nav .tierch li a:link,
	body.music ul.sub_nav .tierch li a:visited {background-image: none;text-indent: 0;text-align: right;}
ul.tierch {
	margin: 4px 0 0 37px;
	list-style: none outside;
	line-height: normal;
	padding: 0;
	}
	ul.sub_nav ul.tierch li {
		border-bottom: 1px solid #ddd;
		display: block;
		height: 19px;
		position: relative;
		overflow: hidden;
		background-image: none;
		text-indent: 0;
		font: normal 13px "Century Gothic", Helvetica, Arial, sans-serif;
		width: 160px;
		}
		ul.sub_nav ul.tierch li a {
			display: block;
			width: auto;
			height: 18px;
			color: #656565;
			text-decoration: none;
			padding-right: 30px;
			border-bottom: 1px solid #fff;
			}
			ul.sub_nav ul.tierch li a:hover,
			ul.sub_nav ul.tierch li a.current {
				color: #d3a62f;
				text-decoration: none;
				cursor: pointer;
				}
/**************/
		
.head {
	height: 158px;
	background-image: url(images/djhero_01.jpg);
}
#mainshellTY {
	background-image: url(images/ty_03.jpg);
	height: 700px;
	width: 793px;
	font-family: Arial, Helvetica, sans-serif;
	color: #FFF;
	font-size: 12px;
	padding-top: 380px;
	background-repeat: no-repeat;
	font-weight: normal;
}
#ty {
	background-image: url(images/backgroundty.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
#mainshellPRE {
	height: 400px;
	width: 793px;
	font-family: Arial, Helvetica, sans-serif;
	color: #730475;
	font-size: 12px;
	padding-top: 365px;
	background-repeat: no-repeat;
	font-weight: normal;
	margin-right: auto;
	margin-left: auto;
}
.pretable {
	margin-left: 70px;
}
.fttrtext {
	font-size: 9px;
	color: #8A8A8A;
}
