/** ------------------------------------------------------ **/
/** -------------------2 column layout -------------------- **/
body {
	background-color: #000000;	
	color:#ffffff;
	font-family: Verdana, Helvetica, sans-serif; 
	font-size: 0.8em;
	margin: 0px;
	text-align: center;
}

#wrap{
	background-color: #000000;
	margin: 0 auto;
	margin-top: 10px;
	text-align: left;
	width: 1180px;
}

#header{
	position: relative;
}

#banner {
	padding-bottom: 20px;
}

#contentwrap {
	width: 1180px;
}

#centerc{
	display: inline;
	float:left;
	padding-left: 2%;
	padding-right: 2%;
	padding-bottom: 10px;
	width:96%;
}

#foot{
	background-color: #000000;
	padding-top: 10px;
	width: 1180px;
	text-align: left;
}

.clearboth {
	clear: both;
}

/** ------------------------------------------------------ **/
/** ------------------- header --------------------------- **/

#header_container {
	margin-bottom: 0px;
	padding-bottom: 0px;
}


#header_left {
	float: left;
}

#header_graphic img {
	display: block;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

#header_links {
	float: right;
	margin-right: 20px;
	text-align: center;
}

#navigation {
	margin-top: 20px;
	margin-bottom: 20px;
	margin-left: 20px;
	margin-right: 20px;
	border-bottom: 1px solid #cccccc;
}


/** ------------------------------------------------------ **/
/** -------------------navigation ------------------------ **/

#navigation ul {
	list-style: none;
	margin: 0px;

	padding: 0px;
}


#navigation ul li {
	display: inline;
	margin: 0px; 
	font-size: 16px;
	text-transform: uppercase;
}
#navigation ul li a, #navigation ul li a:visited {
	color:#ffffff;
	display: block;
	float: left;
	font-size: 0.9em;  
	padding-bottom: 5px;
	padding-left: 7px;
	padding-right: 7px;
	padding-top: 5px;
	text-decoration: none;
}
#navigation ul li a:hover, #navigation ul li a:active {	
	color:#ffffff;
	text-decoration:underline;
}

#navtitle {
	color:#cccccc;
	display: block;
	float: left;
	font-size: 0.9em !important;  
	padding-bottom: 5px;
	padding-left: 7px;
	padding-right: 7px;
	padding-top: 5px;
}

#nav-right {
	float: right;
}

#mobile-nav {
	display: block; /* show for all */
	padding-bottom: 20px;
}
#mobile-nav ul li {
	display: inline;
	margin-right: 20px;
}

/** ------------------------------------------------------ **/
/** ------------------------ menu ------------------------ **/
.menu {
	background-color: #333333;
	font-size: 12px;
	color: #cccccc;
	margin-bottom: 20px;
	padding-top: 5px;
	padding-bottom: 5px;
}

.menu p {
	margin: 0px;
	margin-left: 15px;
	margin-right: 5px;
	padding: 0px;
	padding-top: 3px;
	padding-bottom: 3px;
}

.menu p a, .menu p a:visited {
	color: #ffffff;
	font-weight: bold;
	text-decoration: none;
}

.menu p a:active, .menu p a:hover {
	color:#cccccc;
}


.menu ul {
	list-style: none;
	margin: 0px;
	margin-left: 15px;
	margin-right: 5px;
	padding: 0px;	
}
.menu ul li {
	margin: 0; 
	padding: 0; 
	padding-top: 3px;
	padding-bottom: 3px;
}

.menu ul li a, .menu ul li a:visited {
	color: #ffffff;
	font-weight: bold;
	display: block;
	padding-bottom: 2px;
	padding-left: 0px;
	padding-right: 0px;
	padding-top: 2px;
	text-decoration: none;
}

.menu ul li a:active, .menu ul li a:hover {
	color:#cccccc;
}
	
.menu_header {
	border-bottom: 1px solid #666666;
	display: block;  	
	font-size: 12px !important; 
	padding-bottom: 5px; 
	padding-left: 0px;	
	padding-right: 0px;	
	padding-top: 5px; 
	text-decoration: none;	
	text-transform: uppercase;
	/*width avoids extra whitespace in ie5-6*/
	width: 180px;
}
* html .menu_header {  /* This is the Tan hack */
	width: 180px; 
	w\idth: 180px; 
	}


/** ------------------------------------------------------ **/
/** ------------------- HTML elements -------------------- **/

h1 {
	color:#ffffff;
	font-size: 1.3em;	
	margin-top: 0px;
	padding-top: 0px;
}

h2 {
	color:#ffffff;
	font-size: 1.1em;
}

h3 {
	color: #ffffff;
	font-size: 1em; 
}

a {
	color: #6699ff;
	text-decoration: none;
}
a:visited {
	color: #6699ff;
}
a:hover {
	color: #336699;
}
img {
	border: 0px;
}

th {
	font-weight: bold;
	text-align: left;	
}

ul {
	list-style: none;
	margin: 0px;
	margin-left: 15px;
	padding: 0px;	
}

.separator {
height: 2px;
margin-top:10px;
margin-bottom: 10px;
padding:0px;
background-color: #666666;
}

/** ------------------------------------------------------ **/
/** ------------------- home -------------------------- **/

#homepage-player {
	 width: 560px; 
	 margin-left: auto; 
	 margin-right: auto;
}
	
.list-nobullets {
	list-style-type:none;
	margin: 0px;
	padding: 0px;
}

.centerc-left {
	float: left;
	margin-right: 10px;
	width: 220px;
}
.centerc-right {
	float: left;
	width: 595px;
}


.musicpage-albums {
	float: left;
	margin-bottom: 20px;
	margin-right: 40px;
	text-align: center;
	width: 200px;
}

.slider {
	margin-top: 10px;
}

.slide {
	float: left;
	height: 230px;
	margin-right: 20px;
	text-align: center;
	width: 185px;
}
* html .slide {  /* This is the Tan hack */
	width: 185px; 
	w\idth: 185px; 
	}
	
.slide img {
	border: 1px solid #cccccc;
}

#trancenews-left {
	float: none;
	/* width: 366px; */
}

#trancenewsplayer {
	float: none;
	margin-left: 0px;
}

#albumpage-left {
	float: left;
	margin-right: 10px;
	width: 430px;
}
#albumpage-right {
	float: right;
	width: 400px;
}
.homepage-album {
	float: none;
	margin-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	width: 400px;
}
.albumpage-album {
	float: none;
	margin-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	width: 400px;
}
.musicpage-albums {
	float: left;
	margin-bottom: 20px;
	margin-right: 40px;
	text-align: center;
	width: 400px;
}

#trance-album-releases-list dt {
	margin-top: 10px;
}



/*--------------- Useful for block switching --------------*/
/*---------------------------------------------------------*/
	
.hideOnPhone{
	display:block;
}
.hideOnSmallTablet{
	display:block;
}
.showOnPhone{
	display:none;
}
.showOnSmallTablet{
	display:none;
}

/*Apply to all Responsive*/
@media (max-width: 1300px) {
	/*--------------- Structure --------------*/
	/*----------------------------------------*/
	img{
		max-width: 100%;
		height: auto;
	}

	
	.centerc-left {
		margin-right: 2%;
		width: 35%;
	}
	.centerc-right {
		width: 63%;
	}

	#wrap {
		width: 100%;
	}
	
	#contentwrap {
		width: 100%;
	}
	
	.wrapper-inner {
		width: 98%;
	}
	
	#navigation{
		margin-left: 2%;
		margin-right: 2%;
		width:96%;
	}
	
	#foot{
		padding-left: 2%;
		padding-right: 2%;
		width:96%;
	}
	
	#albumpage-left {
		float: left;
		margin-right: 2%;
		width: 49%;
	}
	#albumpage-right {
		float: right;
		width: 49%;
	}
	
}
	
/*Apply to all Responsive*/
/*Large Tablet Sized */
@media (max-width: 999px) {
	/*--------------- Structure --------------*/
	/*----------------------------------------*/
	
	.menu_header {
		width:100%;
	}

	#wrap{
		padding-left:1%;
		padding-right:1%;
		width:98%;
	}

	#header_graphic{
		margin-left:10px;
		z-index:600;
	}
	
	#navigation ul li a, #navigation ul li a:visited {
		font-size: 13px;
		margin-right: 6px;
		margin-left: 0px;
		padding-left: 10px;
		padding-right: 10px;
	}
	
	#nav-right {
		float: none;
	}
		
	#menu ul li a, #menu ul li a:visited {
		height:auto;
		padding-left: 2%;
		width: 98%;
	}

	.menu_header {
		padding-left: 2%;
		width: 98%;
	}
	
	#trancenews-left {
		float: none;
		width: 98%;
		margin-right: 0px;
	}
	
	#trancenewsplayer {
		float: none;
		margin-left: 0px;
		width: 310px;
	}
	
}

/*Small Tablet Sized */
@media (max-width: 767px) {
	/*--------------- Structure --------------*/
	/*----------------------------------------*/
	
	.hideOnSmallTablet{
		display:none;
	}
	.showOnSmallTablet{
		display:block;
	}
	
	#wrap{
		padding-left:2%;
		padding-right:2%;
		width:96%;
	}
	
	#header_graphic{
		z-index:700;
	}
	
		
	#centerc {
		display: block;
		float: none;
		min-height:auto;
		margin-left: 0px;
		padding-right:2%;
		padding-left:2%;
		width:96%;
	}
	
	.centerc-left {
		float: none;
		width: 96%;
	}
	.centerc-right {
		float: none;
		width: 96%;
	}

	label{
		float:none;
	}
	
	#albumpage-left {
		float: none;
		margin-right: 0px;
		width: 96%;
	}
	#albumpage-right {
		float: none;
		width: 96%;
	}
	
	#homepage-player {
	 width: 100%; 
	 margin-left: auto; 
	 margin-right: auto;
	}
	
	#homepage-player iframe {
	 width: 100%; 
	 height: auto;
	}
	
}

/*Small Tablet 2 Sized */
@media (max-width: 639px) {
 	/*--------------- Structure --------------*/
	/*----------------------------------------*/
	
	#header_left {
		width:100%;
	}
	
	#header_links{
		width:100%;
	}

	#navigation-wrapper {
		text-align: center;
		width: 100%;
	}
	#navigation {
		width: 80%;
		margin: 0 auto; 
		margin-bottom: 20px;
	}
	
	.youtube-playlist {
		overflow:hidden;
		padding-bottom:56.25%;
		position:relative;
		height:0;
	}
	.youtube-playlist iframe {
		left:0;
		top:0;
		height:100%;
		width:100%;
		position:absolute;
	}
	
		
	.musicpage-albums {
		float: none;
		margin-bottom: 20px;
		margin-left: auto;
		margin-right: auto;
		text-align: center;
		width: 400px;
	}

}	
/*Mobile Sized */
@media (max-width: 480px) {
 	/*--------------- Structure --------------*/
	/*----------------------------------------*/
	
	.hideOnPhone{
		display:none;
	}
	.showOnPhone{
		display:block;
	}
	
	img.ImgFloatRightNoBorder, img.ImgFloatLeftNoBorder, img.ImgFloatNoneNoBorder, img.alignRight, img.alignLeft{
		float:none;
		display:block;
		margin:0px;
		margin-bottom:12px;
	}
	
	#wrapper-header {
		height:auto;
	}
	
	#header_left, #header_links {
		float:none;
		margin-bottom:6px;
		width: 100%;
	}
	
	#header_links a {
		margin-right: 10px;
	}
	
	#header_graphic{
		z-index:800;
	}
	
	#navigation {
		text-align: left;
		width: 100%;
		margin: 0;
		margin-bottom: 20px;
	}	
	#navigation ul li {
		display: block;
	}
	#navigation ul li a {
		padding-left: 3px;
		padding-right: 3px;
	}
	
	#mobile-nav {
		display: block;
	}
	#mobile-nav ul li {
		display: block;
		margin-bottom: 10px;
	}
	
	.homepage-album {
		float: none;
		margin-bottom: 20px;
		margin-left: auto;
		margin-right: auto;
		text-align: center;
		width: 96%;
	}
	.homepage-album img {
		width: 100%;
		height: auto;
	}
	.albumpage-album {
		float: none;
		margin-bottom: 20px;
		margin-left: auto;
		margin-right: auto;
		text-align: center;
		width: 96%;
	}
	.albumpage-album img {
		width: 100%;
		height: auto;
	}
	
	.musicpage-albums {
		float: none;
		margin-bottom: 20px;
		margin-left: auto;
		margin-right: auto;
		text-align: center;
		width: 96%;
	}
	.musicpage-albums img {
		width: 100%;
		height: auto;
	}

	
}