@charset "UTF-8";
/* CSS Document */

body  {
	font: 8.25pt Verdana, Arial, Helvetica, sans-serif;
	background: #222222 url(header/BGpattern.jpg);
	margin: 0; 
	padding: 0;
	text-align: center;
	color: #c68341;
}
#container { 
	width: 900px;
	background:#000000 url(header/MAINBG.jpg) repeat-x;
	margin: 0 auto;
	border: 1px solid #5e2e01;
	box-shadow: 0 0 2em rgba( 0, 0, 0, .4 );
	-moz-box-shadow: 0 0 2em rgba( 0, 0, 0, .4 );
	-webkit-box-shadow: 0 0 2em rgba( 0, 0, 0, .4 );
	text-align: left;
} 
#header {
	height:259px;
	background:url(header/top_top.jpg) 0 0px repeat-x;
	/*padding:0 48px 0 49px;*/
	padding:0 0 0 49px;
} 
#header #title {
	width:346px;
	height:183px;
	float:left;

}
#header #title h1{
	text-indent:-9000px;
	margin:0;
	padding:0;
	margin-bottom:4px;
}
#header #title a img {
	width:250px;
	height:73px;
	border:0 none;
}
#header #circle {
	width:110px;
	height:119px;
	margin: 64px 0 0 0;
	float:left;
	clear:none;
}

.actions #header #circle {
 background:Transparent url(header/top_circle_mathias.gif) 0 0 no-repeat;
}

.status #header #circle {
 background:Transparent url(header/top_circle_chial.gif) 0 0 no-repeat;
}

.abilities #header #circle {
 background:Transparent url(header/top_circle_zhuer.gif) 0 0 no-repeat;
}

.equipment #header #circle {
 background:Transparent url(header/top_circle_mirari.gif) 0 0 no-repeat;
}

.items #header #circle {
 background:Transparent url(header/top_circle_nian.gif) 0 0 no-repeat;
}

.formation #header #circle {
 background:Transparent url(header/top_circle_mihaynye.gif) 0 0 no-repeat;
}

.config #header #circle {
 background:Transparent url(header/top_circle_lobo.gif) 0 0 no-repeat;
}

.save #header #circle {
 background:Transparent url(header/top_circle_tjejoljy.gif) 0 0 no-repeat;
}




#header #info {
	float:right;
	clear:right;
	color:#ffffff;
	Text-align:right;
	width:395px;
	height:183px;

}
#header #info p {
	margin: 121px 52px 0 0;
	padding:0;
}

#header #navigation{
	/*width:851px;*/
	width:100%;
	height:55px;
	float:left;
	clear:both;
	background:Transparent url(header/headersecondhalf.gif) 0 0 no-repeat;
}
#header #navigation ul{
	display:block;
	height:28px;
	margin:12px 48px 0 0px;
	padding:0 0px 0 142px;
	list-style-type:none;
	float:left;
}
#header #navigation ul li{
	display:block;
	float:left;
	height:28px;
	margin:0;
	padding:0;
}
#header #navigation ul li a, #header #navigation ul li span span{
	display:block;
	height:28px;
	width:80px;
	overflow:hidden;
	margin:0;
	padding:0;
	border:0 none;
	color:#FFFFFF;
	text-indent:-9000px;
}
#header #navigation #abilities a{ width:73px; background:url(header/menu_extras_off.gif) no-repeat }
#header #navigation #actions a{ width:82px; background:url(header/menu_archive_off.gif) no-repeat }
#header #navigation #equipment a{ width:47px; background:url(header/menu_art_off.gif) no-repeat }
#header #navigation #items a{ width:68px; background:url(header/menu_store_off.gif) no-repeat  }
#header #navigation #status a{ width:56px; background:url(header/menu_cast_off.gif) no-repeat }
#header #navigation #formation a{ width:71px; background:url(header/menu_forum_off.gif) no-repeat }
#header #navigation #config a{ width:58px; background:url(header/menu_info_off.gif) no-repeat  }
#header #navigation #save a{ width:63px; background:url(header/menu_links_off.gif) no-repeat  }

#header #navigation #abilities2 a{ width:73px; background:url(header/menu_extras.gif) no-repeat }
#header #navigation #actions2 a{ width:82px; background:url(header/menu_archive.gif) no-repeat }
#header #navigation #equipment2 a{ width:47px; background:url(header/menu_art.gif) no-repeat }
#header #navigation #items2 a{ width:68px; background:url(header/menu_store.gif) no-repeat  }
#header #navigation #status2 a{ width:56px; background:url(header/menu_cast.gif) no-repeat }
#header #navigation #formation2 a{ width:71px; background:url(header/menu_forum.gif) no-repeat }
#header #navigation #config2 a{ width:58px; background:url(header/menu_info.gif) no-repeat  }
#header #navigation #save2 a{ width:63px; background:url(header/menu_links.gif) no-repeat  }

#header #navigation #abilities a:hover, 
#header #navigation #abilities span{ width:73px; background:url(header/menu_extras_on.gif) no-repeat }

/*hey del, i put a comma in and then called a separate element so you could use the hover state graphic for the "on" state of whatever page you're on. if you want to make another active state just let me know, and we'lll get this all separated for that. -kj*/
#header #navigation #actions a:hover, 
#header #navigation #actions span{ width:82px; background:url(header/menu_archive_on.gif) no-repeat }
#header #navigation #equipment a:hover, 
#header #navigation #equipment span{ width:47px; background:url(header/menu_art_on.gif) no-repeat }
#header #navigation #items a:hover,
#header #navigation #items span{ width:68px; background:url(header/menu_store_on.gif) no-repeat  }
#header #navigation #status a:hover,
#header #navigation #status span{ width:56px; background:url(header/menu_cast_on.gif) no-repeat }
#header #navigation #formation a:hover,
#header #navigation #formation span{ width:71px; background:url(header/menu_forum_on.gif) no-repeat }
#header #navigation #config a:hover,
#header #navigation #config span{ width:58px; background:url(header/menu_info_on.gif) no-repeat  }
#header #navigation #save a:hover,
#header #navigation #save span{ width:63px; background:url(header/menu_links_on.gif) no-repeat  }

#header #linkstatus {
	float:left;
	width:802px;
	color:#813400;
	text-align:center;
	height:21px;
	background:Transparent url(header/bottom_blank.gif) 294px 0 no-repeat;
}