@charset "utf-8";
/*===================
	COL STYLES
===================*/
#leftcol, #rightcol, #centercol {
	float: left;
	margin: 10px 10px 10px 0;
}

/*===================
	LEFT COL STYLES
===================*/
#leftcol {width: 250px;}
#leftcol div:first-child {margin-top:10px;}
/*===================
	CALL TO ACTION STYLES
===================*/
.callToAction, #serverStatus {
	border: 1px solid #666;
	margin: 5px 10px 10px 10px;
	padding-bottom: 14px;
	position: relative;
	text-align: center;

	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;

	box-shadow: 0px 3px 5px #aaa;	
	-moz-box-shadow: 0px 3px 5px #aaa;
	-webkit-box-shadow: 0px 3px 5px #aaa;
	
}
.callToAction {	background: red url(../images/home/call_bg2.jpg) no-repeat center center;}
.callToAction h1, #serverStatus h1 {
	color: white;
	font-size: 1em;
	line-height: 1.5em;
	margin: 0;
	opacity: 1;
}
.callToAction p {
	color: #ddd;
	font-size: 0.8em;
	line-height: 1.1em;
	margin: 0 0 10px 0;
}
.callToAction a {
	background: url(../images/home/calltoaction_corner.png) no-repeat right top;
	bottom: 0;
	display: block;
	font-size: 0.7em;
	font-weight: bold;
	height: 14px;
	opacity: .75;
	padding-left: 5px;
	position: absolute;
	right: 0;
	text-decoration: none;
	width: 77px;

	border-bottomright-radius: 3px;
	-moz-border-radius-bottomright: 3px;
	-webkit-border-bottomright-radius: 3px;
}
.callToAction a:hover {opacity: 1;}

#serverStatus {	background: red url(../images/home/call_bg.jpg) no-repeat center center;}
	#serverStatus div {
		color: #eee;
		display: inline;
		font-family: Tahoma, Geneva, sans-serif;
		font-size: 0.8em;
		font-weight: bold;
		margin: 0 5px;
	}
	
	.live {}
		.live h1 {color: #6f6 !important;}
	.down {}
		.down h1, .down div {color: red !important;}
		.down .player {display: none !important;}
		.down .version {display: none !important;}

	#serverStatus .player {
		background: url(../images/home/playerIcon.png) no-repeat left center;
		padding-left: 15px;
	}


/*===================
	CENTER COL STYLES
===================*/
#centercol {width: 300px;}

#centercol h1, #rightcol h1, #centercol .h1spacer, #rightcol .h1spacer {
	font-size: 1em;
}
#centercol h1 {margin-bottom: -10px;}
#centercol .h1spacer {margin-top: -10px;}
#centercol ul li h2 {
	font-size: 1em;
	font-variant: normal;
	margin: 0 10px;
	text-transform: none;
}
#centercol ul li p {
	font-size: 0.8em;
	line-height: 1.25;
	margin: 0 20px 0 20px;
}
#eventlist {
	height: 290px;
	overflow: auto;
}
/*===================
	RIGHT COL STYLES
===================*/
#rightcol {width: 400px;}

/* Hero Module */
#hero ul, #hero li {display: block;}
#hero, #hero .tab {	width: 360px;}
#hero {
	background: gray;
	height: 300px;
	margin: -15px 20px;
	position: relative;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
#hero .tab, #hero .tab li {	height: 30px;}
#hero .tab {
	bottom: 0;
	font-size: 10px;
	left: 0;
	position: absolute;
}
#hero .tab li {
	background: #000;
	color: white;
	cursor: pointer;
	cursor: hand;
	float: left;
	font-family: Tahoma, Geneva, sans-serif;
	line-height: 1.25;
	padding: 0 10px;
	text-align: center;
	width: 70px !important;

	filter: alpha(opacity=75);
	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity:0.75;
}
#hero .tab li:first-child {
	-moz-border-radius-bottomleft: 5px;
	-webkit-border-bottomleft-radius: 5px;
}
#hero .tab li:last-child {
	-moz-border-radius-bottomright: 5px;
	-webkit-border-bottomright-radius: 5px;
}
#hero .tab li.active {background: #511;}
#hero .display li {display: none;}
#hero .display li img {
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
	#hero img {
		background: none;
		border: none;
		display: block;
		margin: 0;
		padding: 0;
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		box-shadow: none;
		width: 360px;
	}