@charset "utf-8";

/* CSS Document */
/* Created: Kean Onn See*/
html{
	padding:0;
	margin:0;
}

body{
	font-family:  Helvetica, Verdana, Arial, sans-serif;
	font-size: 12px;
	color: #333333;
	text-align:center;
	margin:0;
	padding:0;
/*	background: green url(images/bg/bg_top.jpg) top center no-repeat;*/
	background: black url(images/bg/bg.jpg) top center;
}

p, ul, ol, em{
	line-height: 1.4em;
	font-size: 12px;
}

h1, h2, h3, h4{
	font-weight: bold;
	color: #c4161c;
	font-family: Helvetica,Arial, sans-serif
}

p{
	padding: 5px 0px;
	text-align:justify;
}

ul, ol{
	padding-left: 60px;
	padding-right: 60px;
	margin:0;
}



h2{	
	font-size: 16px;
	padding-bottom:0;
	margin-bottom:0;
}

h3{
	font-size: 14px;

}

#Frame{
	width: 100%;
	background: url(images/bg/bg_top.jpg) top center no-repeat;*/
}

#SiteWrapper{
	position:relative;
	margin: 0 auto 0px auto;
	padding: 0 0 100px 0;
	width: 974px;
	text-align: left;
	background: url(images/bg/page_bg.jpg) top center no-repeat;
}

#Brand{
	float:left;
	display: block;	
	width: 974px;
	height: 150px;	
	background:black;
	
}
	
	/*#Brand a:link, #Brand a:visited{
		float:left;
		margin-left: 30px;
		margin-top: 60px;
		width: 200px;
		height: 115px;
		display: block;
		text-indent: -999em;
		overflow:hidden;		
	}*/
	#Brand h1 a:link,  #Brand  h1 a:visited{
			
		background: url(images/logo.gif) no-repeat top left;
		float:left;
		margin-left: 30px;
		margin-top: 60px;
		width: 200px;
		height: 115px;
		display: block;
		text-indent: -999em;
		overflow:hidden;
	}
	
	.musicals #Brand a:link, .musicals #Brand a:visited{
			
		/*background: url(images/heading_musicals.gif) no-repeat top left;*/
	}

	
	* HTML #Brand a:link, * HTML #Brand a:visited {

		margin-left: 15px;
	}
	
	
	#Brand h1, h2{
		margin: 0;
		padding: 0;
	}

#BodyWrapper{
	float:left;
	width: 974px;
	padding:20px 0px;
	background:#818286 url(images/bg/bg_body.jpg) no-repeat 0px -200px;
}
	
#ContentWrapper{
	width: 754px;
	float:right;
	display:block;
	margin: 0px 30px 0px 0px;
}
	
	* HTML #ContentWrapper{
		margin-right: 10px;	
	}

#Stage{
	float:left;
	width: 754px;
	height: 260px;
	margin-bottom:20px;
	background: url(images/bg/bg_stage_white.gif) no-repeat top left;
}

	#Stage.black{
		background: url(images/bg/bg_stage_black.gif) no-repeat top left;
	}

	* HTML #Stage{
		margin-bottom: 0px;
	}
	
	#dnn_HeaderPane{
		margin-top: 50px;
		margin-left: 30px;
	}
	
		.admin #dnn_HeaderPane{
			margin-top: 0px;
			display:block;
		}	
	
	#dnn_PromoPane{
		float:left;
		width: 410px;
		height: 260px;
		padding:0;
	}
	#dnn_PromoPane p{
		margin:0px;
		padding:0px;
	}
	
	
	.home #dnn_ContentPane{
		/*float:left;*/
		width: 750px;
		padding:0px;
		/*height: 260px;*/
	}
	
	#dnn_ContentPane.OneCol{
		float:left;
		width: 750px;
		padding:0 0 10px 0;
		min-height: 240px;
		height:auto;
	}
	
	#dnn_ContentPane.OneCol .ContentPane{
		padding:15px;
	}
	
	* html #dnn_ContentPane.OneCol {
		height: 240px;
	}
	
	#dnn_ContentPane.long{
		float:left;
		width:735px;
		padding:10px 0px 10px 10px;
		height: 240px;
		color:#FFFFFF;
	}
	
	.grey #dnn_ContentPane{
		color: #686868;
	}
	
	.display #dnn_ContentPane{
		color: #686868;
	}
	
	.home 	#dnn_ContentPane h2.h2Normal .Head{
		color: #CC0000;
		padding-left: 10px;
	}
	
	.panel{
		width: 240px;
		height: 190px;
		float:left;
		margin-right: 16px;
		background: url(images/bg/bg_panel_body.gif) bottom left no-repeat;
	}
	
	.panel_long{
		width: 750px;
		float:left;
	}
	
	
	.panel_long .body{
	
		padding:0px 0px 10px;
		background: url(images/bg/bg_panel_body_long.gif) repeat-y left top;
	width:750px;
 	}
	
	.panel_long .footer{
		height: 20px;
		background: url(images/bg/bg_panel_long_footer.gif) no-repeat bottom left;
		width:750px;
	}
	
	.panel_mid{
		width: 350px;
		float:left;
		margin-bottom:15px;

	}	
	
	.panel_mid .body{	
		width: 330px;
		padding:10px;
		background: url(images/bg/bg_panel_body_mid.gif) repeat-y left top;
	
 	}
	
	* html .panel_mid .body {
		width: 350px;
		padding:10px;
	}
	
	.panel_mid .footer{
		height: 20px;
		background: url(images/bg/bg_panel_footer_mid.gif) no-repeat bottom left;
	}
	
	

/* Musical */
	
	.musicals #ShowDetails{
		width: 385px;
	
	}
		
		.musicals #Stage{
			width: 750px;
			height:auto;
			background: none;
		}
		
		.musicals #Stage h2.h2Normal .Head{
			color:white;
			
		}
		
		.musicals #dnn_ContentPane{
			width: 750px;
			padding:0px;
			height:auto;
		}
		
		
		
		.musicals #Stage .ContentPane{
			margin-top: 10px;
			background: url(images/bg/bg_stage_black.gif) no-repeat top left;
			
		}
		
		.musicals #Stage.display .ContentPane{
			margin-top: 10px;
			background: none;
			
		}
		
			.musicals #Stage .ContentPane p{
				padding:0px;
			}
		
		.musicals.admin  #ShowDetails, .musicals.admin  #RightColumn{
			margin-top: 60px;
		}
		
		.musicals #ShowDetails h2.h2Normal .Head{
			padding-left:5px;
			Color: #CC0000;
		}
		
		.musicals #ShowDetails .header{
			height:20px;
			background: url(images/bg/bg_info_head_mid.gif) no-repeat top left;
			padding: 0px 20px;
		}
		
			
		.musicals #ShowDetails .body{		
			background: url(images/bg/bg_info_body_mid.gif) repeat-y top left;
			padding: 0px 25px 25px 25px;
			text-align:justify;
		}
		
		.musicals #ShowDetails .footer{
			height:20px;
			background: url(images/bg/bg_info_footer_mid.gif) no-repeat bottom left;
		}
		
		.musicals #ShowDetails h3 
		{
			padding-top:0;
			margin-top:0;
			padding-left:5px;
			Color: #CC0000;
			text-transform:uppercase;
				
		}
	
	.musicals #RightColumn{
		width: 350px;

	}
	
	.musicals #RightColumn .panel_mid{
		float:right;
		clear:both;
	}
	
	.musicals #RightColumn .panel_mid .body p{
		padding-top:0;
		margin-top:0;
	}

	
	.panel p{
		
	}
	
	#RightPanel{
		margin-right: 0px;
	
	}
	
	.panel h2.h2Normal{
		padding: 5px 0px 5px 0px;
		text-transform: uppercase;
		text-align:center;
		background: url(images/bg/bg_panel.jpg) top left no-repeat;
	}
	
	* html .panel h2.h2Normal{
		padding: 4px 0px 2px 0px;
	}
	
	.panel_mid .similarheader{
			height:27px;
			background: url(images/title_similarshows.gif) no-repeat top left;
			padding: 0px 20px;
		}
	.panel_mid .merchandiseheader{
			height:27px;
			background: url(images/title_merchandise.gif) no-repeat top left;
			padding: 0px 20px;
		}
	.panel_mid .writerheader{
			height:27px;
			background: url(images/title_writers.gif) no-repeat top left;
			padding: 0px 20px;
		}
	
	.panel_long h2.h2Normal{
		padding: 5px 0px 5px 0px;
		text-transform: uppercase;
		text-align:center;
		background: url(images/bg/bg_panel_long.gif) top left no-repeat;
	}
	
	.panel_mid h2.h2Normal{
		padding: 5px 0px 5px 0px;
		text-transform: uppercase;
		text-align:center;
		background: url(images/bg/bg_panel_mid.gif) top left no-repeat;
	}
	
		
	.panel h2.h2Normal .Head, .panel_mid h2.h2Normal .Head{
		padding: 0px 0px;
		color: white;
		font-size:12px;
		font-weight: bold;
		
	}
	/*{
		padding: 0px 0px;
		color: white;
		font-size:12px;
		font-weight: bold;
		
	}*/
	
	.panel_long h2.h2Normal .Head{
		padding: 0px 0px;
		color: white;
		font-size:12px;
		font-weight: bold;
		
	}
	

#LeftColumn{
	float:left;
	padding-left: 30px;
	width:150px;
}	
	

	
#Footer{
	float:left;
	display:block;
	padding: 5px 30px 5px 30px;
	width: 914px;
	background: black;
	text-align: right;
	
}

	#Footer ul, #Footer ul li{
		padding:0px;
		margin:0;
		display:inline;
		list-style:none;
	}
	
	#Footer ul li{
		padding: 0px 10px;
	}
	
	#Footer a:link, #Footer a:visited{
		font-weight: bold;
		color: white;
		text-decoration: none;
	}
	
	#Footer a:hover{
		text-decoration: underline;
	}
	
	
#dnn_HeaderPane{
	width:430px;
	float:left;
}

 * html #dnn_HeaderPane{
	width:390px;
	float:left;
}

.newsitem{
	width: 725px;
	height: 175px;
	margin: 0px 10px 10px 10px;
	background: url(images/bg/bg_gray_panel_long.gif) no-repeat top left;
	
}

.newsitem h3{
	padding:3px 0 4px 10px;
	color: #990000;
	margin:0;
}	

.newsitem p {
	padding: 2px 5px 0px 10px;
	margin:0;
}



/*Clearfix*/
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;


}

.clear{
	float:left;
	clear:both;
}

.right{
	float:right;
}
.left{
	float:left;
}




#newsletter{
	float:left;
	width: 149px;
	background:white;
}



#newsletter .header{
		font-size:12px;
		font-weight: bold;
	width: 135px;
	padding: 5px 7px 5px 7px;
	color:white;
	background:black;
}

#newsletter .body{
	width: 135px;
	padding: 5px 7px 5px 7px;

}

#newsletter .body input{
	color:#666666;
	width: 130px;
	margin-bottom:5px;
	padding: 2px;
}

#newsletter a#joinnow:link, #newsletter a#joinnow:visited{
	text-align:center;
	font-size: 10px;
	display:block;
	background: url(images/bg/bg_button.gif) no-repeat top left;
	padding-top:2px;
	height: 16px;
	width: 136px;
	color:white;
	
}

a.button:link, a.button:visited{
	text-align:center;
	font-size: 10px;
	display:block;
	background: url(images/bg/bg_button.gif) no-repeat top left;
	padding-top:0px;
	height: 18px;
	width: 136px;
	color:white;

}

/* Merchandise*/

#marchandise{
	width: 748px;
}

.panel_white .header{
	height:15px;
	background: url(images/bg/bg_panel_white_header.gif) no-repeat top left;	
}
.panel_white .body{
	background: url(images/bg/bg_panel_white_body.gif) repeat-y top left;
}

.panel_white .footer{
	height:15px;
	background: url(images/bg/bg_panel_white_footer.gif) no-rpeat bottom left;	
}

#browser{

}

#Brand #search {
	float:left;
	margin-top:15px;
}

* html #Brand #search {
	width: 280px;
}

a:link.keyword, a.keyword, a:hover.keyword, a:visited.keyword, a:active.keyword {
	padding:0;
	margin:0;
}

#Brand #welcome {
	float:left;
	width: 670px;
	margin-right:20px;
}

* html .home #Brand h1 a:link, * html .home #Brand h1 a, * html .home #Brand h1 a:visited {
	width:160px;
}

a:link, a, a:visited {
	color:#000000
	text-decoration:none;
}

a:hover, a:active {
 	text-decoration:underline;
	color:#c4161c;
 }
 
 
#loadedframe{
	height: 60px;
	/*background: #01796D;*/
	padding-top: 20px;
	width: 100%;
}

a#loaded:link, a#loaded:visited, a#loaded:hover{
	width: 80px;
	/*float:right;
	margin-right: 20px;*/
	display:block;
	height: 30px;
	text-indent: -999em;
	overflow: hidden;
	background: url(images/site_by_loaded_gray.gif) no-repeat top left;


}

#loadeddiv{
	width: 80px;
	float:right;
	margin-right: 20px;
	display:block;
	height: 50px;


}

a#loadedwebdesign:link, a#loadedwebdesign:visited, a#loadedwebdesign:hover{
	color: #666;
	font-size:10px;
}

#LeftPanel.panel p, #MidPanel.panel p, #RightPanel.panel p{
	padding: 0px !important;
	margin: 0px !important;
}