/* ###############################################################################

If there are any questions concerning the code for this site/UI, please contact:

	Shane Thompson
	206.234.4974
	shane@tickerdesign.com

############################################################################### */


* { margin: 0; padding: 0; }

html { margin-bottom: 1px; height: 100% } /* To avoid page shifting. This keeps a persistant scrollbar on the right side of the browser window */

body {
	height:100%;
	background: #181818 url(images/background.gif) repeat-x;
	font-size: 62.5%; /* makes 1.0em mesurments equal to 10px */
	font-family: "Lucida Grande", Verdana, Arial, Helvetica, san-serif;
	color: #eeeeee;
}

.clear {
	clear: both;
}

.wide {
	/*background-color: red;*/
}

.top {
	/*border-bottom: 1px solid #000;*/
}
.bottom {
	/*border-top: 1px solid #000;*/
}

.master {
	/*min-width: 404px;*/
}

.wrapper {
	background: url(images/background_upperleft.gif) top left no-repeat;
}

.outer {
	margin-left: 220px;  /* L */
}
.center {
	float: right;
	width: 100%;
	margin-left: 0px;
}
.left {
	float: left;
	position: relative;
	width: 220px;  /* L */
	margin-left: -220px;  /* -L-1 */
	margin-right: 0px;
	height: 100%;
}


/* BROWSER HIDE CONCERNING IE/MAC ------------(DO NOT COMMENT ANYTHING OUT IN HERE DUE TO THESE COMMENT MARKS HERE --> )---- \*//*/

	.inleft, .incenter {
		width: 100%;
		overflow: hidden;
	}
	.center {
		margin-left: 0;
	}
	.left {
		margin-right: 0px;
	}

/* ------------------------------------------- */

.outer {
	word-wrap: break-word;
}

.outer, .wide, h2, .wrapper, .master {
	height: 0;
	he\ight: auto;
	zoom: 1;
}


#main {
	padding: 20px 12px 0px 0px;
}

#nav {
	padding: 20px 0px 0px 20px;
}

/* Hiding from IE5/Mac. Only IE sees this. \*/

* html #main { min-height:100%; margin-left: 0; }
* html #nav { margin-right: -3px; }

/* End Hack */



/* END OF MAIN CONTRUCT ################################################################################## */


hr {
	margin-top: 10px;
	margin-bottom: 10px;
	color: #999;
}

p {
	color: #aaaaaa;
	font-size: 1em;
	line-height: 1.25em;
	padding-bottom: .75em;
}


p.head{
	font-family: Times, Georgia, "Times New Roman", Times, serif;
	color: #ffffff;
	font-weight: bold;
	font-size: 1.1em;
	line-height: 1.5em;
	
}

p.bio {
	font-family: Times, Georgia, "Times New Roman", Times, serif;
	text-transform: uppercase capitalize;
	font-size: 1.1em;
	line-height: 1.5em;
	
}

h1	{
	font-size: 2em;
	color: #fff;
	font-family: Times, Georgia, "Times New Roman", Times, serif;
	padding-bottom: .75em;

}








.data {
	font-weight: bold;
	color: #3a61a7;
	font-size: 1em;
	line-height: 20px;
}


a { 
	color: #9cccff; 
	text-decoration: underline; 
}

a:visited {
	color : #9cccff;
	text-decoration : underline;
}

a:hover {
	color : #ffffff;
	text-decoration : underline;
}


/* MAIN HEADER BAR ---------------------------------------------- */

#header {
	height: 111px;
	min-width: 1000px;
}

#logotitle {
	float: left;
	position: absolute;
	padding: 20px;
	height: 71px;
}

.headline{
	padding-top: 20px;
	color: #fff;
	font-size: 1.4em;
	font-weight: bold;
}

#banner {
	float: right;
	position: relative;
	background: url(images/game_freestyle.jpg) top right no-repeat;
	white-space: nowrap;
}

/* LOGIN/LOGOUT AREA ------------------------------------------------------- */


#login {
	padding: 20px 0px 10px 20px;
	border: 0px solid #000000;
	text-align: center;
}

#login p.headline {
	padding: 0px 0px 10px 0px;
	color: #fff;
	font-size: 1.2em;
	text-align: center;

}

#login p {
	padding: 0px 0px 3px 0px;
	color: #fff;
	font-size: 1.2em;
	text-align: center;
}

#login input {
	text-align: center;
	margin-bottom: 10px;
}

/* USER AREA ------------------------------ */

.username {
	font-size: 1.2em;
	font-weight: bold;
	color: #ffffff;
	line-height: 24px;
}

#userarea {
	padding-bottom: 10px;
}


/* SERVER STATS ---------------------------- */

#serverstats {
	font-weight: bold;
	text-align: left;
}

.serverstats_high { color: red; font-weight: bold; }
.serverstats_med { color: orange; font-weight: bold;  }
.serverstats_low { color: #32CD32; font-weight: bold;  }
.serverstats_down { color: black; font-weight: bold;  }


/* MODULES / MAIN LEFT NAV------------------------------ */

/* module_01 -------------------------*/
	#module_01 { width: 200px; float: left; background: url(images/module_topright_01.gif) no-repeat top right; }
	#module_01 .moduleTop { background: url(images/module_topleft_01.gif) no-repeat top left; padding-top: 10px; }
	#module_01 .moduleBottom { background: url(images/module_bottomright_01.gif) no-repeat bottom right; }
	#module_01 .moduleBottomContent { height: 20px; background: url(images/module_bottomleft_01.gif) no-repeat bottom left; }
	
/* module_02 -------------------------*/
	#module_02 { width: 200px; float: left; background: url(images/module_topright_02.gif) no-repeat top right; }
	#module_02 .moduleTop { background: url(images/module_topleft_02.gif) no-repeat top left; padding-top: 10px; }
	#module_02 .moduleBottom { background: url(images/module_bottomright_02.gif) no-repeat bottom right; }
	#module_02 .moduleBottomContent { height: 20px; background: url(images/module_bottomleft_02.gif) no-repeat bottom left; }
	
/* module_03 -------------------------*/
	#module_03 { width: 200px; float: left; background: url(images/module_topright_03.gif) no-repeat top right; }
	#module_03 .moduleTop { background: url(images/module_topleft_03.gif) no-repeat top left; padding-top: 10px; }
	#module_03 .moduleBottom{ background: url(images/module_bottomright_03.gif) no-repeat bottom right; }
	#module_03 .moduleBottomContent{ height: 20px; background: url(images/module_bottomleft_03.gif) no-repeat bottom left; }
			
/* module_04 -------------------------*/
	#module_04 { width: 200px; float: left; background: url(images/module_topright_04.gif) no-repeat top right; }
	#module_04 .moduleTop{ background: url(images/module_topleft_04.gif) no-repeat top left; padding-top: 10px; }
	#module_04 .moduleBottom{ background: url(images/module_bottomright_04.gif) no-repeat bottom right; }
	#module_04 .moduleBottomContent{ height: 20px; background: url(images/module_bottomleft_04.gif) no-repeat bottom left; }
	
		
/* module_main -------------------------*/
	#main .moduleBack_01{ /*width: 500px; float: left;*/ background: url(images/module_topright_01.gif) no-repeat top right; }
	#main .moduleBack_02{ /*width: 500px; float: left;*/ background: url(images/module_topright_02.gif) no-repeat top right; }
	#main .moduleBack_03{ /*width: 500px; float: left;*/ background: url(images/module_topright_03.gif) no-repeat top right; }
	#main .moduleBack_04{ /*width: 500px; float: left;*/ background: url(images/module_topright_04.gif) no-repeat top right; }
	
	/* module_main TOP --- */
	
	.moduleBack_01 .moduleTop { background: url(images/module_topleft_01.gif) no-repeat top left; padding-top: 10px; height: 26px; }
	.moduleBack_02 .moduleTop { background: url(images/module_topleft_02.gif) no-repeat top left; padding-top: 10px; height: 26px; }
	.moduleBack_03 .moduleTop { background: url(images/module_topleft_03.gif) no-repeat top left; padding-top: 10px; height: 26px; }
	.moduleBack_04 .moduleTop { background: url(images/module_topleft_04.gif) no-repeat top left; padding-top: 10px; height: 26px; }

	/* module_main MIDDLE --- */
	
	#module_main .moduleMiddle { background: #fff url(images/module_middleright_main.gif) repeat-y top right; }
	#module_main .moduleMiddleContent{ padding: 10px 20px 0px 10px; background: url(images/module_middleleft_main.gif) repeat-y top left; }
	
	/* module_main BOTTOM --- */
	#module_main .moduleBottom{ background: url(images/module_bottomright_main.gif) no-repeat bottom right; }
	#module_main .moduleBottomContent { height: 20px; background: url(images/module_bottomleft_main.gif) no-repeat bottom left; }

/* GLOBAL MODULE CODE ------------------------------ */

.moduleTop {
	padding: 0px 20px 0px 10px;
}

.moduleTop p.moduleHead{
	font-size: 1.3em;
	color: #ffffff;
	font-weight: bold;
	padding-bottom: 0 0 5px 0;
	text-transform: capitalize;
}

.moduleTop ul{
	list-style: none;
}

.moduleTop a, .moduleTop a:visited {
	color: #cccccc;
	font-weight: bold;
	line-height: 20px;
	padding: 0 1em;
	text-decoration: none;
}

.moduleTop a:hover, .moduleTop a:active{
	color : #ffffff;
	font-weight: bold;
	text-decoration: none;
	background: url(images/bullet_over.gif) no-repeat left 50%;
}

/* NOTE: SELECTED NAV ITEMS IN THE MODULES ARE GOVERNED VIA JAVASCRIPT/CSS CODE FOUND IN THE "index.php" FILE  */

/* NEW TABS -------------------------------------- */

#tabnav {
	height: 28px;
	line-height: 20px;
	display: block;
	margin-bottom: 10px;
	background: #ffffff url("images/horz_line.gif") repeat-x right bottom;
}

#tabnav ul {
	list-style-type: none;
}

#tabnav li {
	display: inline;
	margin: 0;
	padding: 0;
	
}
		
#tabnav a {
	display: inline-block;
	float: left;
	background: #cccccc url("images/tabs.gif") no-repeat left top;
	padding-left: 10px;
	text-decoration:none;
	font-weight: bold;
	white-space: nowrap;
}

#tabnav a span {
	float: left; /* float required for IE MAC */
	display: block;
	background: #cccccc url("images/tabs.gif") no-repeat right top;
	padding: 4px 12px 3px 0px;
	color: #666666;
}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabnav a span {float: none;}
/* End IE5-Mac hack */

 #tabnav a:hover, #tabnav a:hover span {
	background-color: #dddddd;
	color: #333333;
}

#tabnav.selectedTab01 #tab01 a span,
#tabnav.selectedTab02 #tab02 a span,
#tabnav.selectedTab03 #tab03 a span,
#tabnav.selectedTab04 #tab04 a span,
#tabnav.selectedTab05 #tab05 a span,
#tabnav.selectedTab06 #tab06 a span {
	padding-bottom: 4px;
	color: #333333;
}

#tabnav.selectedTab01 #tab01 a, #tabnav.selectedTab01 #tab01 a span, 
#tabnav.selectedTab02 #tab02 a, #tabnav.selectedTab02 #tab02 a span, 
#tabnav.selectedTab03 #tab03 a, #tabnav.selectedTab03 #tab03 a span, 
#tabnav.selectedTab04 #tab04 a, #tabnav.selectedTab04 #tab04 a span, 
#tabnav.selectedTab05 #tab05 a, #tabnav.selectedTab05 #tab05 a span, 
#tabnav.selectedTab06 #tab06 a, #tabnav.selectedTab06 #tab06 a span {
	background-color:#ffffff;
	font-weight: bold;

}

/* FORMS ------------------------------------------------ */

fieldset{
	background:#eee url(images/background_fieldset.gif) repeat-x;
	border: 1px solid #cccccc;
	margin-top: .5em;
	padding-top: .5em;
	padding-bottom: 1em;
}

label {
	display: block;
	padding-bottom: 2px;
}

.column {
	padding-left: 10px;
	padding-bottom: 5px;
}

input.text {
	font-size: 1em;
	/* included for input box consistency accross browsers and OSs. */
	border-top: 1px solid #999;
	border-left: 1px solid #999;
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	padding: 3px;
}

input.formButton {
	margin-top: 5px;
	margin-bottom: 5px;
}

input.radio, input.checkbox {
	margin-right: 10px;
	margin-bottom: 5px;
}



/* CURRENT ACCOUNT ----------------------------------------*/

#currentAccount {
	margin: 0 0 10px 0;
	padding: 1em;
	border: 1px solid #ccc;
	background: #333333;
	color: #fff;
}

#currentAccount p {
	color: #aaaaaa;
}

#currentAccount p span {
	color: #fff;
	font-weight: bold;
}



/* MININAV --------------------------------------------------------- */

#miniNav {
	/*float: left;*/
	display: block;
	width: 150px;
	list-style-type: none;
}


#miniNav a { 
	padding-left: 10px;
	color: #999999; 
	text-decoration: none; 
	line-height: 20px;
	font-weight: bold;
}

#miniNav a:visited {
	color : #999999;
	text-decoration : none;
}

#miniNav a:hover{
	background: url(images/bullet_over.gif) no-repeat left 50%;
	text-decoration: none;
	font-weight: bold;
	color: #666666;
}

/* THIS DETERMINES WHICH MININAV ITEMS ARE CURRENTLY SELECTED. */
#section01 #miniNav li.section01 a,
#section02 #miniNav li.section02 a,
#section03 #miniNav li.section03 a,
#section04 #miniNav li.section04 a,
#section05 #miniNav li.section05 a,
#section06 #miniNav li.section06 a
{
	color: #333333;
	background: url(images/bullet_selected.gif) no-repeat left 50%;
	font-weight: bold;
}

/* THE MAIN CONTENT OF THE PAGES --------------------------------- */
#theMeat {
	display: block;
	border: 0px solid #000000;
}

/* BASIC BAR GRAPH ------------------------------------------------ */

.graph { 
	position: relative; /* IE is dumb */
	width: 200px; 
	border: 1px solid #3a61a7; 
	padding: 1px;
	margin-bottom: .5em;
	margin-left: 5px;					
}
.graph .bar { 
	display: block;	
	position: relative;
	background: #9cccff; 
	text-align: center; 
	color: #333; 
	height: 2em; 
	line-height: 2em;									
}
.graph .bar span { position: absolute; left: 1em; } /* This extra markup is necessary because IE doesn't want to follow the rules for overflow: visible */
 
 
/* -- NEW TABLES -------------------------- */

.newTable {
	background: #cccccc;
	margin-right: 15px;
	margin-left: 15px;
	margin-top: 5px;
	margin-bottom: 10px;
}

.newTable table {
	position: relative;
	top: -5px;
	left: -5px;
	width: 100%;
	border: 1px solid #333;
	background: #fff;
}

.newTable table th, .newTable table td {
	margin: 0;
	padding: 5px 5px;
	text-align: center;
	border-bottom: 1px solid #b5b5b5;
	border-right: 1px solid #ccc;
}

.newTable table th {
	color: #ccc;
	background: #666;
}

.newTable table .col_left {
	text-align: left;
}

.newTable table .col_center {
	text-align: center;
}

.newTable table .col_right {
	text-align: right;
}

.newTable table .last_col {
	border-right: none;
}

.newTable table tr {
	background: #e6e6e6;
}

.newTable table tr.odd {
	background: #f1f1f1;
}

.newTable table td a {
	display: block;
	font-weight: bold;
}

.newTable p {
	padding-left: 10px;
	padding-bottom: 5px;
}



.newTable a:link, .newTable a:visited { 
	color: #3a61a7; 
	text-decoration: underline; 
}

.newTable a:hover {
	color : #9cccff;
	text-decoration : underline;
}

.newTable thead a:link, .newTable thead a:visited  { 
	color: #9cccff; 
	text-decoration: underline; 
}

.newTable thead a:hover {
	color : #ffffff;
	text-decoration : underline;
}


/* LEFT NAV TABLE --------------------------------- */

#navTable table {
	position: relative;
	width: 100%;
	border: 1px solid #999;
	background: #fff;
	padding: 0px;
}

#navTable table th{
	color: #ccc;
	background: #666;
}

#navTable table th, #navTable table td {
	margin: 0;
	padding: 5px 5px;
	text-align: center;
	border-bottom: 1px solid #b5b5b5;
	border-right: 1px solid #ccc;
}

#navTable table .last_col {
	border-right: none;
}