/* CSS Document */

/*************************************************************************************************************/
/*   _______ 
/*  |_     _|
/*   _|   |_ 
/*  |_______|  Main Styles
/*	
/*	Main body styles, link styles, and miscellaneous font and extra styles.
/*
/*************************************************************************************************************/

	/** 1.1 Body and main content styles **/
	
	body, td, th {
	
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		color: #FFFFFF;
		
	}
	
	body {
	
		background-color: #777777;
		margin: 0px;
		text-align: center;
		
	}
	
	#container {

		width: 996px;
		margin: 0 auto;
		text-align: left;
		
	}

	/** 1.2 Link styles **/
	a, a:link, a:visited {
	
		color: #FFCC00;
		text-decoration: none;
		
	}
	
	a:active, a:hover {
	
		color: #FFFFFF;
		text-decoration: none;
		
	}

	/** 1.3 Miscellaneous styles **/
	form {
	
		margin: 0px 0px;
		padding: 0px 0px;
		
	}

	image {
	
		margin: 0px;
		padding: 0px;
		
	}
	
	.hr {
	
		height: 0px;
		border: 0px solid #888888;
		border-top-width: 1px;
		
	}
	
	/** 1.4 Font styles **/
	.page_header {
	
		font-size: 18px;
		color: #FFCC00;
		font-weight: bold;
	
	}
	
	.article_date {
	
		font-size: 12px;
		color: #FFFFFF;
		font-weight: bold;
		float: right;
		padding-top: 5px;
		
	}
	
	.small_details {
	
		font-size: 10px;
		color: #CCCCCC;
		font-weight: normal;
		
	}
	
	.hilite {
	
		color: #FFCC00;
		
	}

/*************************************************************************************************************/
/*   _______ _______ 
/*  |_     _|_     _|
/*   _|   |_ _|   |_ 
/*  |_______|_______|  Input table styles
/*	
/*	Styles for pages with forms that the user needs to fill out
/*
/*************************************************************************************************************/
	
	/** 2.1 Input table styles **/
	.input_form {
	
		width: 100%;
		
	}
	
	.input_form th {
	
		width: 110px;
		text-align: right;
		
	}
	
	.input_form td, th {
	
		padding: 5px;
		font-size: 12px;
		
	}
	
	.input_tl {
		
		background: #333333 url( ../images/forms/input/input_tl_bg.gif ) no-repeat top left;
		
	}
	
	.input_tr {
		
		background: #444444 url( ../images/forms/input/input_tr_bg.gif ) no-repeat top right;
		
	}
	
	.input_bl {
		
		background: #333333 url( ../images/forms/input/input_bl_bg.gif ) no-repeat bottom left;
		
	}
	
	.input_br {
		
		background: #444444 url( ../images/forms/input/input_br_bg.gif ) no-repeat bottom right;
		
	}
	
	.input_left {
		
		background: #333333;
		
	}
	
	.input_right {
		
		background: #444444;
		
	}
	
	/** 2.2 Form input box styles **/
	
	input {
	
		font-size: 12px;
		border: 1px solid #999999;
		background: #222222;
		padding: 2px;
		color: #FFFFFF;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		
	}
	
	select {
	
		font-size: 12px;
		border: 1px solid #999999;
		background: #222222;
		padding: 1px;
		color: #FFFFFF;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		
	}
	
	textarea {
	
		font-size: 12px;
		border: 1px solid #999999;
		background: #222222;
		padding: 2px;
		color: #FFFFFF;
		width: 99%;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		
	}
	
	.submit {
	
		padding: 1px;
		
	}
	
	/** 2.3 Input form font styles **/
	
	.required {
	
		color: #FFCC00;
		
	}
	
	.input_title {
	
		font-weight: bold;
		color: #FFFFFF;
		
	}

/*************************************************************************************************************/
/*   _______ _______ _______ 
/*  |_     _|_     _|_     _|
/*   _|   |_ _|   |_ _|   |_ 
/*  |_______|_______|_______|  Body table styles
/*	
/*	Styles for pages where general content needs to be laid out with tables
/*
/*************************************************************************************************************/
	
	/** 3.1 Body table styles **/
	
	.body_table {
	
		width: 100%;
		
	}
	
	.body_table td, th {
	
		font-size: 12px;
		
	}
	
	.body_tl {
		
		background: #333333 url( ../images/forms/input/input_tl_bg.gif ) no-repeat top left;
		
	}
	
	.body_tr {
		
		background: #444444 url( ../images/forms/input/input_tr_bg.gif ) no-repeat top right;
		
	}
	
	.body_bl {
		
		background: #333333 url( ../images/forms/input/input_bl_bg.gif ) no-repeat bottom left;
		
	}
	
	.body_br {
		
		background: #444444 url( ../images/forms/input/input_br_bg.gif ) no-repeat bottom right;
		
	}
	
	.body_cell_1 {
		
		background: #333333;
		
	}
	
	.body_cell_2 {
		
		background: #444444;
		
	}
	
	.body_spacer {
	
		background: #444444;
		border-top: 2px solid #555555;
		border-bottom: 2px solid #555555;
		height: 5px;
		
		font-size: 1px;
		line-height: 1px;
		
	}
	
	.body_header {
	
		border-top: 2px solid #666666;
		border-bottom: 2px solid #666666;
		background: #555555;
		padding: 5px;
		vertical-align: middle;
		
	}
	
	/** 3.2 Body table font styles **/
	
	.body_small_text {
	
		font-size: 10px;
		color: #CCCCCC;
		
	}
	
	.body_small_hilite {
	
		font-size: 10px;
		color: #FFFFFF;
		
	}

/*************************************************************************************************************/
/*   _______ ___ ___ 
/*  |_     _|   |   |
/*   _|   |_|   |   |
/*  |_______|\_____/   Header styles
/*	
/*	Styles for the header that appears on all pages
/*
/*************************************************************************************************************/

	/** 4.1 Player card **/
	
	#player_card {
	
		width: 240px;
		height: 136px;
		display: block;
		float: right;
		
		background-color: #444444;
		background-image: url( ../images/layout/main/character_footer.gif );
		background-repeat: no-repeat;
		background-position: bottom;
		
		padding: 4px 4px 0px 4px;
		
	}
	
	#player_card #player_name {
	
		width: 160px;
		height: 17px;
		display: block;
		float: left;
		
		background-color: #222222;
		background-image: url( ../images/layout/header/player_name_cap.gif );
		background-repeat: no-repeat;
		
		padding: 3px 0px 0px 6px;
		
	}
	
	#player_card #player_avatar {
	
		width: 70px;
		height: 105px;
		display: block;
		float: right;
		
		border: 2px solid #222222;
		
		position: relative;
		
	}
	
	#player_card #player_avatar #avatar_image {
		
		position: absolute;
		top: 0px;
		left: 0px;
		
	}
	
		/** 4.1.1 Logged in styles **/
		
		#player_card #player_avatar #level_image {
		
			position: absolute;
			bottom: 5px;
			right: 5px;
			
		}
		
		#player_card #player_stats {
		
			width: 166px;
			height: 108px;
			display: block;
			float: left;
			
			padding: 4px 0px 0px 0px;
			
		}
		
		.stat_box {
		
			width: 79px;
			height: 48px;
			display: block;
			float: left;
			
			padding: 0px 4px 0px 0px;
			
		}
		
		.stat_box #header {
			
			width: 79px;
			height: 16px;
			
			display: block;
			float: left;
			
			clear: both;
			
		}
		
		.stat_box #content {
			
			width: 79px;
			height: 22px;
			display: block;
			float: left;
		
			background-color: #222222;
			
			padding: 2px 0px 0px 0px;
			
			font-size: 14px;
			font-weight: bold;
			color: #FFCC00;
			
			text-align: center;
			
		}
		
		.stat_box #stat_bar {
		
			display: block;
			float: left;
			
			width: 72px;
			height: 2px;
			
			background-image: url( ../images/layout/header/stat_box_bar_top.gif );
			background-repeat: no-repeat;
			
			padding: 2px 3px 0px 4px;
			
			line-height: 1px;
			font-size: 1px;
			
		}
		
		.stat_box #footer {
			
			display: block;
			float: left;
			
			clear: both;
			
		}
		
		#player_card #player_stats #stat_bars {
		
			width: 145px;
			height: 52px;
			display: block;
			float: left;
			
			background-image: url( ../images/layout/header/stat_bg.gif );
			background-repeat: no-repeat;
			background-position: 0px 4px;
			background-color: #444444;
			
			padding: 8px 10px 0px 9px;
			
			line-height: 10px;
			font-size: 10px;
			
		}
		
		#player_card #player_stats #stat_bars .max_stat {
		
			color: #FFCC00;
			
		}
		
		#player_card #player_stats #stat_bars .stat_bar {
		
			width: 46px;
			height: 7px;
			display: block;
			float: right;
			
			background-color: #886600;
			
			margin: 2px 0px 0px 0px;
			
			line-height: 1px;
			font-size: 1px;
			
		}
		
		#player_card #logout {
		
			width: 74px;
			height: 19px;
			display: block;
			float: right;
			
			padding: 4px 0px 0px 0px;
			
		}
	
		/** 4.1.2 Logged out styles **/
		
		#player_card #secure_login {
		
			width: 162px;
			height: 108px;
			display: block;
			float: left;
			
			background: #444444 url( '../images/layout/header/player_card_box_footer.gif' ) bottom left no-repeat;
			
			padding: 4px 0px 0px 0px;
			
		}
		
		#player_card #secure_login #header {
		
			width: 162px;
			height: 12px;
			display: block;
			float: left;
			
		}
		
		#player_card #secure_login #content {
		
			width: 154px;
			height: 89px;
			display: block;
			float: left;
			
			background-color: #222222;
			
			padding: 4px 4px 0px 4px;
			
			font-size: 10px;
			
		}
		
		#player_card #secure_login #content .secure_login_input {
		
			display: block;
			float: left;
		
			width: 152px;
			height: 14px;
			
			border: 1px solid #FFCC00;
			background-color: #000000;
			
			padding: 0px;
			margin: 0px 0px 2px 0px;
			
			font-size: 10px;
			color: #FFFFFF;
			
		}
		
		#player_card #secure_login #content #remember {
			
			width: 90px;
			display: block;
			float: left;
			
			padding: 2px 0px 0px 0px;
			
		}
		
		#player_card #secure_login #content #need_help {
		
			width: 59px;
			display: block;
			float: right;
			
			padding: 2px 1px 0px 0px;
			
			text-align: right;
			
		}
		
		#player_card #secure_login #content #create_character {
		
			width: 150px;
			display: block;
			float: right;
			
			padding: 0px 1px 0px 0px;
			
			text-align: right;
			
		}
		
		#player_card #secure_login #content .secure_login_check {
			
			display: block;
			float: left;
			cursor: pointer;
			
		}
		
		#player_card #login {
		
			width: 74px;
			height: 19px;
			display: block;
			float: right;
			
			background: #444444;
			
			padding: 4px 0px 0px 0px;
			margin: 0px;
			
		}

	/** 4.2 Navigation dock **/
	
	#navigation_dock {
	
		width: 744px;
		height: 76px;
		display: block;
		float: left;
		
		background-color: #444444;
		
		padding: 4px 0px 0px 4px;
		
		line-height: 1px;
		font-size: 1px;
		
		overflow: hidden;
		
	}
	
	#navigation_dock #logo {
	
		width: 85px;
		height: 72px;
		display: block;
		float: left;
		
	}
	
	#navigation_dock #quickbar {
		
		width: 659px;
		height: 39px;
		display: block;
		float: left;
		clear: right;
		
		margin: 0 auto;
		
	}
	
	#navigation_dock #quickbar #text_logo {
	
		width: 163px;
		height: 39px;
		display: block;
		float: left;
		
	}
	
	#navigation_dock #buttons {
		
		width: 658px;
		height: 29px;
		display: block;
		float: left;
	
		background-image: url( ../images/layout/header/logo_curve.gif );
		background-repeat: no-repeat;
		
		padding-top: 4px;
		margin: 0 auto;
		
		overflow: hidden;
		white-space: nowrap;
		
	}
	
	.quickbar_icon {
	
		width: 41px;
		height: 39px;
		display: block;
		float: left;
		
		padding-left: 4px;
		
	}
	
	.navigation_button {
	
		width: 90px;
		height: 24px;
		display: block;
		float: left;
		
		margin: 0;
		padding: 0px 0px 0px 4px;
		
	}

/*************************************************************************************************************/
/*   ___ ___ 
/*  |   |   |
/*  |   |   |
/*   \_____/   Main body styles
/*	
/*	Styles that affect the main content area
/*
/*************************************************************************************************************/

	/** 5.1 Main body styles **/
	
	#main_body {
	
		width: 748px;
		display: block;
		float: left;
		
		margin: 0;
		padding: 8px 0px 0px 0px;
		background: url( ../images/layout/body/main_body_bg.gif ) no-repeat top left;
			
	}
	
	#main_footer {
	
		width: 744px;
		text-align: left;
		float: left;
		
		margin: 0;
		padding: 0 0 12px;
		background: #444444 url( ../images/layout/footer/footer_bot.gif ) no-repeat bottom left;
		
	}
	
	#main_footer .content {
	
		width: 736px;
		
		margin: 0;
		padding: 6px 0px 0px 0px;
		border-left: 4px solid #444444;
		text-align: center;
		background: #222222 url( ../images/layout/footer/footer_top.gif ) no-repeat top left;
		
		font-size: 10px;
		
	}
	
	#main_content {
	
		width: 740px;
		display: block;
		float: left;
		
		margin: 0;
		padding: 0px 0px 4px 4px;
		background: #444444;
			
	}

	/** 5.2 Featured items **/
	
	#featured_items {
	
		width: 736px;
		height: 210px;
		display: block;
		clear: both;
		
		margin: 0px 0px 0px 0px;
		
		line-height: 1px;
		font-size: 1px;
		
	}
	
	#featured_items #spotlight {
	
		width: 555px;
		height: 210px;
		display: block;
		float: left;
		
	}
	
	#featured_items #alerts {
	
		width: 177px;
		height: 103px;
		display: block;
		float: right;
		
		background: #222222 url( ../images/layout/main/alerts_bg.gif ) no-repeat top right;
		
		margin: 0px 0px 4px 0px;
		
	}
	
	#featured_items #functions {
	
		width: 177px;
		height: 103px;
		display: block;
		float: right;
		
		background: #222222 url( ../images/layout/main/functions_bg.gif ) no-repeat bottom right;
		
	}
	
	#featured_items #advertisement {
	
		width: 177px;
		height: 210px;
		display: block;
		float: right;
		
	}
	
	#featured_items .header {
	
		width: 177px;
		height: 11px;
		display: block;
		clear: both;
		
	}
	
	#featured_items .content {
	
		width: 169px;
		display: block;
		clear: both;
		
		padding: 4px;
		
		line-height: 11px;
		font-size: 10px;
		
		
	}
	
	#featured_items .content img {
	
		padding: 0;
		margin: 0;
		
	}
	
	#featured_items .content ul {
		
		text-indent: -6px;
		padding: 0px 0px 0px 7px;
		margin: 0px 0px 0px 0px;
		
		list-style: none;
		
	}
	
	#featured_items .content li.right {
		
		text-align: right;
		
		padding: 4px 4px 0px 0px;
		
	}

	/** 5.3 Content entries **/
	
		/** 5.3.1 Sub-entry, for the main news articles **/
		
		.sub_entry {
		
			width: 716px;
			display: block;
			float: left;
			clear: both;
			
			background: #222222 url( ../images/layout/main/main_body_bg.gif ) no-repeat top left;
			
			padding: 10px;
			margin: 4px 0px 0px 0px;
			
		}
		
		.sub_entry .comment_box {
			
			margin: 0px 0px 4px 0px;
			
		}
		
		.sub_entry .comment_border {
		
			border-right: 1px dotted #FFCC00;
			
		}
		
		.sub_entry .comment_show {
			
			background: url( ../images/layout/main/comment_tier.gif ) no-repeat top left;
			
			padding-left: 14px;
			
		}
		
		.sub_entry .comment_box .header {
		
			font-weight: bold;
			
		}
		
		.sub_entry .comment_box .postmetadata {
		
			font-size: 10px;
			
		}
		
		.sub_entry .comment_box .postmetadata a, .sub_entry .comment_box .postmetadata a:hover, .sub_entry .comment_box .postmetadata a:active {
		
			background: none;
			padding: 0;
			margin: 0;
			
		}
		
		.sub_entry .comment_hide {
			
			background: url( ../images/layout/main/comment_tier.gif ) no-repeat top left;
			
			padding-left: 14px;
			padding-top: 1px;
			
		}
		
		.sub_entry .comment_hide a {
		
			padding-left: 15px;
			background-position: left 50%;
			background-repeat: no-repeat;
			
		}
		
		.sub_entry .comment_hide a {
		
			background-image: url( ../images/comments/comment_bullet.gif );
			
		}
		
		.sub_entry .comment_hide a:hover {
		
			background-image: url( ../images/comments/comment_bullet_hover.gif );
			
		}
		
		.sub_entry .comment_hide a:visited {
		
			background-image: url( ../images/comments/comment_bullet_visited.gif );
			
		}
		
		.sub_entry .comment_body {
		
			background: #444444 url( ../images/layout/main/comment_show_bg.gif ) no-repeat top left;
			
			padding: 5px;
			
			font-size: 12px;
			
		}
		
		.sub_entry .comment_body_new {
		
			background: #666666 url( ../images/layout/main/comment_show_new_bg.gif ) no-repeat top left;
			
			padding: 5px;
			
			font-size: 12px;
			
		}
		
		.sub_entry .comment_footer {
		
			background: #333333 url( ../images/layout/main/comment_show_footer_bg.gif ) no-repeat bottom left;
			
			padding: 5px 8px 5px 5px;
			
			font-size: 10px;
			text-align: right;
			
		}
		
		.sub_entry .comment_footer .comment_links {
		
			display: block;
			float: left;
			
		}
		
		.article_extras {
		
			width: 150px;
			display: block;
			float: right;
			clear: right;
			
			margin: 0px 0px 8px 8px;
			
		}
		
		.article_extras .header {
		
			clear: both;
			
		}
		
		.article_extras .content {
		
			border-left: 1px dotted #FFFFFF;
			border-bottom: 1px dotted #FFFFFF;
			
			padding: 0px 0px 4px 4px;
			
			clear: both;
			
			font-size: 10px;
			
		}

		/** 5.3.2 Body entries - For the main content pages **/
		
		.body_entry {
		
			width: 716px;
			display: block;
			float: left;
			clear: both;
			
			background: #222222 url( ../images/layout/main/main_body_bg.gif ) no-repeat top left;
			
			padding: 10px;
			
		}
		
		.body_footer {
		
			width: 716px;
			display: block;
			float: left;
			clear: both;
			
			background: #222222 url( ../images/layout/main/body_footer_bg.gif ) no-repeat bottom left;
			
			padding: 0px 10px 6px 10px;
			
			font-size: 10px;
			text-align: right;
		
		}
		
		.body_metadata {
		
			width: 716px;
			display: block;
			float: left;
			clear: both;
			
			background: #111111 url( ../images/layout/main/entry_metadata_bg.gif ) no-repeat bottom left;
			
			padding: 6px 10px 6px 10px;
			
			font-size: 10px;
			text-align: right;
			
		}
		
		.body_metadata .meta_right {
		
			display: block;
			float: right;
			
		}
		
		.body_metadata .meta_left {
		
			display: block;
			float: left;
			
		}
	
	/** 5.5 Rating styles **/

	.rating_value {
	
		display: block;
		float: right;
		overflow: visible;
		position: relative;
		font-size: 10px;
		
	}
	
	.rating_value a {
		
		width: 18px;
		height: 16px;
		display: block;
		
		background: url( ../images/layout/main/rating_value_bg.gif );
		
		padding-right: 2px;
		
		text-align: center;
		
	}
	
	.rating_value .rating_dropdown {
		
		position: absolute;
		top: -45px;
		left: 0;
		
		display: none;
		
	}
	
	.rating_value .rating_dropdown .rating_number {
		
		width: 18px;
		height: 15px;
		display: block;
		
	}
	
	.rating_value .rating_dropdown .rating_bottom {
		
		width: 18px;
		height: 16px;
		display: block;
		
	}
	
	.rating_value .rating_dropdown a:hover, .body_metadata .rating_value .rating_dropdown a:active {
	
		background: url( ../images/layout/main/rating_value_bg_hilite.gif );
		
	}
	
	.positive_rating {

		color: #00FF00;
		
	}
	
	.negative_rating {
	
		color: #FF0000;
		
	}

/*************************************************************************************************************/
/*   ___ ___ _______ 
/*  |   |   |_     _|
/*  |   |   |_|   |_ 
/*   \_____/|_______|  Bulletin board styles
/*	
/*	Styles that affect the bulletin board system
/*
/*************************************************************************************************************/

	/** 6.1 Post view styles **/
	
	.bb_post_button {
	
		display: block;
		float: right;
		margin: 0px 0px 0px 5px;
		border: 0;
		
	}
	
	.bb_post_avatar {
	
		display: block;
		float: left;
		margin: 5px 3px 5px 0px;
		border: 1px solid #222222;
		
	}
	
	.bb_quick_reply_box {
	
		width: 696px;
		margin-bottom: 4px;
		
	}
	
	.bb_post_awards {
		
		display: block;
		float: right;
		margin-top: 6px;
		
	}
	
	.bb_post_award {
		
		display: block;
		cleaR: both;
		margin-bottom: 2px;
		
	}
	
	.bb_post_author_info {
	
		clear: both;
		
	}
	
	.bb_quote {
	
		width: 96%;
		padding: 5px;
		background: #333333;
		border: 1px solid #555555;
		margin: 10px auto;
		
	}
	
	.bb_button {
	
		margin: 0px 4px;
		
	}
	
	.bb_quote_header {
	
		background: url( ../images/layout/misc/quote_bg.gif );
		padding: 2px 5px;
		display: block;
		float: left;
		margin-top: -14px;
		
	}
	
	.pagination {
	
		text-align: right;
		padding: 5px;
		
	}
	
/*************************************************************************************************************/
/*   ___ ___ _______ _______ 
/*  |   |   |_     _|_     _|
/*  |   |   |_|   |_ _|   |_ 
/*   \_____/|_______|_______|  Sidebar styles
/*	
/*	Styles that affect the sidebar
/*
/*************************************************************************************************************/

	/** 7.1 Sidebar styles **/
	
	#right_column {
	
		width: 248px;
		display: block;
		float: right;
		clear: right;
		
		padding: 0;
		margin: 0;
		
	}
	
	.sidebar {
	
		width: 248px;
		display: block;
		float: left;
		clear: both;
		
		padding: 0;
		margin-top: 4px;
		
	}
	
	.sidebar .header {
	
		width: 248px;
		
		background-color: #444444;
		background-image: url( ../images/layout/main/sidebar_header.gif );
		background-repeat: no-repeat;
		background-position: top;
		
	}
	
	.sidebar .footer {
	
		width: 240px;
		
		background-image: url( ../images/layout/main/sidebar_footer.gif );
		background-repeat: no-repeat;
		background-position: bottom;
		
		padding: 4px 4px 8px 4px;
		margin: 0px;
		
	}
	
	.sidebar .content {
	
		width: 224px;
		
		background-color: #222222;
		background-image: url( ../images/layout/main/sidebar_content_header.gif );
		background-repeat: no-repeat;
		background-position: top;
		
		padding: 8px 8px 4px 8px;
		
		font-size: 11px;
		color: #FFFFFF;
		
	}
	
	.sidebar .title {
	
		color: #FFCC00;
		font-size: 12px;
		font-weight: bold;
		
	}