body {
	background-color: #6d7f8c;
	color: #000;
	font: 11px Verdana, Arial, Helvetica, sans-serif; 
 	line-height: 15px;
 	text-align: center;
}

a { color: #33647D; text-decoration: none; }

div.progressBar {
	border: 1px solid #fff; 
	width: 164px;
	background-image: url(../images/progress_bar_bg);
}

div.progressBar div { height: 8px }
div.gold div { background: #f3e308 url(../images/gold.png); }
div.green div { background: #4bde5c url(../images/green.png); }



#container {
	width: 726px;
	border: 7px solid #fff;
	margin: 20px auto 0 auto;
	text-align: center;
}

#header {
	height: 58px;
	background: #d1e1e5 url(../images/header.jpg) no-repeat top;
}

#navigation {
	height: 20px;
	background: #d1e1e5;
	width: 100%;
	text-align: center;
	border-bottom: 7px solid #fff;
}

	#tmenu { 
		float: left;
		width: 85%;
		position: relative;
		top: 2px;
	}
	#tmenu li { display: inline; }
	#tmenu li a {
		padding-left: 20px;
		background: #d1e1e5 url(../images/separator.gif) no-repeat 5px 3px;
	}
	#tmTime { color: #33647D; }

	#imenu {
		float: right;
		width: 15%;
		background: #d1e1e5;
	}
		#imenu li { float: left; margin-right: 2px; }
		#imenu li a { display: block; float: left; text-indent: -9300px; width: 19px; height: 20px; background-repeat: no-repeat; }
	
		#imPhone { background-image: url(../images/nav/telephone.gif); }
		#imSearch { background-image: url(../images/nav/search.gif); }
		#imForum { background-image: url(../images/nav/forum.gif); }
		#imHelp { background-image: url(../images/nav/rules.gif); }
		#imLogout { background-image: url(../images/nav/exit.gif); }

#page {
	clear: both;
	background: #aec8cf url(../images/faux.png) repeat;
	overflow: auto;
	text-align: left;
}

	#page h4 { font-size: 11px; font-weight: bold; color: #000; }

	#pageLeft {
		float: left;
		width: 489px;
	}
	
		#charInfo { background-color: #d1e1e5; overflow: auto; border-bottom: 7px solid #fff; }
			#charPic { float: left; border-right: 7px solid #fff; }
			#charBlurb { float: right; width: 352px; margin-top: 20px; }
				#charBlurb h2 { font-weight: bold; }
				#charBlurb a { font-weight: bold; }

			#charBubble {
				position: relative;
				top: 15px;
				left: -15px;
				background: url(../images/speecharrow.gif) top left no-repeat;
			}
				#charBubble p { background-color: #fff; margin-left: 15px; padding: 8px; }

		#charSheet { background: url(../images/menu_bg.png) repeat-x; margin-bottom: 5px; }
		#charSheet h2 { height: 34px; line-height: 24px; color: #33647d; font-weight: bold; padding-left: 40px; background: url(../images/Icon_VIP.png) no-repeat; width: 200px; float: left; }

		#charPageLeft { width: 234px; float: left; }
		#charAch { width: 200px;  }
		#charAch span { width: 32px; height: 34px; margin-left: 4px; background-repeat: no-repeat; }
		
		#Ach39 { background-image: url(../images/AchIcon_39.gif); }
		#Ach51 { background-image: url(../images/AchIcon_51.gif); }
		#Ach99 { background-image: url(../images/AchIcon_99.gif); }
		
		#charPageRight { width: 220px; margin-left: 250px; }
			#charDiary p { margin: 3px 0; }

	#pageRight {
		float: right;
		width: 230px;
	}
	
	div.menuBlock { background: url(../images/menu_bg.png) repeat-x; margin-bottom: 10px; }
	div.menuBlock h2 { height: 34px; line-height: 24px; color: #33647d; font-weight: bold; padding-left: 40px; }
	div.menuBlock a { color: #000; display: block; padding: 3px 0px 3px 10px; }
	div.menuBlock a:hover { background-color: #d1e1e5; }
	
	#menuChararacter { background: url(../images/Icon_GoldChar.png) no-repeat; }
	#menuVIP { background: url(../images/Icon_VIP.png) no-repeat; }

#footer { clear: both; }