/*
Tales of Vesperia Style Sheet
by Eric Oliver @ Belay Development (BelayDevelopment.com)
©2008 Namco Bandai Games America
*/

/* Main Styles
*******************************/
html {
	height:100%;
}

body {
	margin:0px;
	background: url(/media/bg.jpg) #ffffff top repeat-x;
}

#wrapper {
	margin: 0 auto;
	width:1052px;
}

a {
	color: #998461;
}

a:hover {
	text-decoration: none;
}

/* Default Fonts
*******************************/
* {
	font-family: Georgia, "Times New Roman", Times, serif;
	text-align: left;
	color: #23436c;
	font-size: 10pt;
}

/* Images
*******************************/
img { 
	outline:0;
	border:0; 
}

/* Main Styles
*******************************/

/* HEADER */
#header {
	background: url(/media/bg_nav.jpg) no-repeat left bottom;
	width: 1052px;
	height: 224px;
	margin-top: 7px;
	
}

#home_link {
	float:left; 
	margin: 0 0 0 30px;
	/*
	left:30px; 
	position:relative; 
	top:11px;
	*/
}

#top_nav {
	padding: 6px 0 0 260px;
}

#flash_banner {
	margin: 0px 0 0 27px;
	height: 185px;
}

/* CONTENT */

#main_top {
	background: url(/media/bg_main_top.jpg) top left no-repeat;
	width: 998px;
	margin-left: -6px;
	z-index:5;
	/*
	margin: 0 auto;
	position:relative;
	left: -6px;
	*/
}

#main_border {
	background: url(/media/bg_border.jpg) 0px 234px repeat-y;
	width: 998px;
	margin: 0 0 0 27px;
}

#main {
	background: url(/media/bg_main_mid.jpg) top left repeat-y;
	width: 986px;
	margin-left: 6px;
	/*
	margin: 0 auto;
	*/
}

#main_bottom {
	width: 1010px;
	margin: 0 auto;
}

#content {
	padding: 18px 24px 0 18px;
}

#left_col {
	background: url(/media/bg_left.jpg) top left repeat-y;
}

#leftnav_top {
	position: relative;
	top: -14px;
	left: -12px;
	z-index: 10;
}

#leftnav_text {
	background: url(/media/leftnav_bg.jpg) top repeat-y;
	width: 182px;
	margin: -28px 0 0 12px;
}

	#leftnav_text p{
		padding: 0px 21px 0px 21px;
		color: #5e4740;
		font-size: 11px;
		width: 146px;
	}

#leftnav_bottom {
	margin: -14px 0 0 12px;
	background: url(/media/leftnav_bottom.jpg) top left no-repeat;
	width: 182px;
	height: 369px;
	padding: 46px 0 0 11px;
}

#leftnav_games {
	margin: -14px 0 0 12px;
	background: url(/media/bg_leftnav.jpg) top left no-repeat;
	width: 182px;
	height: 481px;
	padding-left: 11px;
}

#leftnav_media {
	margin: -14px 0 0 12px;
	background: url(/media/bg_leftmedia.jpg) top left no-repeat;
	width: 182px;
	height: 400px;
	padding-left: 11px;
}

#mid_col {
	position:relative;
	left: -8px;
	margin-top: 14px;
}	

#tales_news {
	background: url(/media/bg_content.jpg) top left repeat-y;
	padding: 12px 0 0 17px;
}

	#tales_news .game_news, #tales_news .comm_news{
		width: 434px;
		height: 31px;
		color: #998461;
		font-size: 12pt;
		font-weight: bold;
		padding: 12px 0 0 49px;
	}

.game_news {
	background: url(/media/news_game.jpg) top left no-repeat;
}

.comm_news {
	background: url(/media/news_comm.jpg) top left no-repeat;
}

.game_news_detail{
	background: url(/media/news_detail_game.jpg) top left no-repeat;
	width: 642px;
	height: 32px;
	padding: 12px 0 0 49px;
	color: #998461;
	font-size: 12pt;
	font-weight: bold;
	margin: 27px 0 0 17px;
}

.dotted_line {
	background: url(/media/dotted_line.gif) repeat-x left;
	height: 2px;
	width: 100%;
}

.news_content {
	margin: 8px 38px 0 64px;
}

	.news_content h2{
		font-size: 9pt;
		color: #998461;
	}
	
	.news_content p{
		line-height: 1.4em;
	}

.news_image {
	float:left;
	margin: 13px 19px 8px 0;
	border: 1px solid #ffffff;
}



#right_col {
	padding: 14px 0 0 1px;
	color: #666666;
}

#callout_game {
	background: url(/media/callout_game.jpg) top left no-repeat;
	width: 207px;
	height: 170px;
	margin-top: 7px;
}

	#callout_game h3{
		color: #edd291;
		padding: 9px 0 5px 0px;
		font-size: 7pt;
		text-align:center;
		text-transform: uppercase;
	}
	
	#callout_game div{
		float: left;
		margin: 0px 10px 0 16px;
	}
	
	#callout_game p{
		float: left;
		width: 100px;
		text-align: center;
		color: #563f35;
		font-weight: bold;
		font-size: 9pt;
		margin: 15px 0 5px 0px;
	}

#callout_ss {
	background: url(/media/callout_ss.jpg) top left no-repeat;
	width: 207px;
	height: 219px;
	margin-top: 7px;
	color: #edd291;
	font-size: 9pt;
	text-align: center;
}
	
	#callout_ss div{
		padding: 41px 0 0 13px;
		height: 134px;
		vertical-align: baseline;
	}
	
	#callout_ss img{
		border: 1px solid #625447;
	}
	
	#callout_ss a{
		color: #edd291;
		font-size: 9pt;
	}

#games_bg {
	background: url(/media/games_bg.jpg) top left repeat-y;
	width: 739px;
	margin: 14px 0 0 0px;
	position: relative;
	left: -12px;
}

#game_hdr {
	background: url(/media/games_hdr.jpg) top left no-repeat;
	width: 739px;
	padding: 13px 0 0 4px;
}

#platform_box {
	margin: 28px 0 5px 12px;
	background: url(/media/bg_platform.jpg) top left repeat-y;
}

	#platform_box .ratings {
		margin: 0px 0 0px 4px;
	}

#buy_dropdown {
	display: none;
	background: #ffffff;
	margin: 0 0 0 7px;
	height: 82px;
	width: 136px;
	padding: 7px 0;
	text-align:center;
	position: relative;
	z-index: 100;
}
	
	#buy_dropdown div{
		float:none;
		padding: 0;
	}
	
#game_details {
	padding: 27px 24px 0 60px;
	position: relative;
}

.game_detail_button {
	float: right;
	margin: -4px 0 13px 0;
}

#game_info {
	float: left;
	margin-left:  15px;
	width: 565px;
	position: relative;
}

#game_story{
	float: left;
	position: relative;
}

#game_media {
	background: url(/media/bg_game_media.jpg) top left repeat-y;
	width: 207px;
	float: right;
	text-align: center;
	color: #563f35;
	font-size: 9pt;
	font-weight: bold;
	margin-left: 23px;
	position: relative;
}
	#game_media div{
		text-align:center;
	}

.banner_page p{
	font-size:8pt;
}

.link_box{
	background: #cacac2;
	height: 23px;
	border: 1px solid #ae9b7b;
	padding-left: 8px;
	padding-top: 6px;
}
	.link_box a{
		font-size: 8pt;
		color: #604740;
	}

.available {
	height: 36px;
	background: url(/media/bg_avail.jpg) no-repeat top left;
	margin-top: 9px;
	position: relative;
}

	.available p{
		padding: 11px 0 0 6px;
		float: left;
		margin: 0;
	}
	.available .avail_right{
		float:left;
		padding: 6px 0 0 3px;
	}
	
#char_hdr {
	background: url(/media/char_hdr.jpg) no-repeat top left;
	height: 20px;
	width: 633px;
	padding: 5px 0 0 22px;
	color: #998461;
	font-weight: bold;
}

	#char_hdr a{
		text-decoration: none;
	}
	
	#char_hdr .active{
		text-decoration: none;
		color: #563f35;
	}
	
.characters {
	margin-top: 19px;
}

	.characters div{
		float: left;
		color: #563f35;
		line-height: 1.8em;
		width: 385px;
	}
	
	.characters div strong{
		color: #563f35;
	}

#media_bg {
	background: url(/media/bg_media.jpg) top left no-repeat;
	width: 739px;
}

.media_hdr {
	background: url(/media/media_bg_hdr.jpg) top left no-repeat;
	height: 20px;
	width: 631px;
	padding: 5px 0 0 24px;
	color: #998461;
	margin-bottom: 19px;
}

	.media_hdr strong{
		color: #998461;
	}

.movie_table {
	margin: 0 7px 15px 0px;
	width: 664px;
}

	.movie_table td{
		width: 198px;
		padding: 5px 10px 10px;
		vertical-align: top;
	}
	.movie_table div{
		width: 198px;
		text-align:center;
		color: #563f35;
		font-size: 11px;
		line-height: 1.5em;
		margin: 0 auto;
	}
	.movie_table div img {
		border: 1px solid #ffffff;
	}
	.movie_table h3{
		font-size: 11px;
		font-weight: bold;
		text-align:center;
		margin: 0;
	}
	.movie_table div p{
		font-size: 9px;
		text-align:center;
		margin: 0;
		line-height: 1.4em;
	}

.image_table {
	margin: 0px 7px 15px 0px;
	width: 664px;
	clear: both;
}

	.image_table td{
		width: 146px;
		padding: 5px 8px 10px 10px;
		vertical-align: top;
		line-height: 1.7em;
	}

	.image_table a img {
		border: 1px solid #ffffff;
	}

#sign_up {
	padding: 44px 30px 44px 63px;
}

	#sign_up p{
		font-size: 11pt;
		margin-bottom: 0;
	}
	
	#sign_up h2{
		font-size: 14pt;
		font-weight: normal;
		margin-top: 0;
	}
	
	#sign_up td{
		padding: 4px 0;
		color: #998461;
		font-weight: bold;
		font-size: 9pt;
	}
	#sign_up #code_box{
		width: 264px;
		background: #f5f0e5;
		height:46px;
		text-align: center;
		padding: 12px;
		color: #998461;
		font-weight: bold;
		font-size: 9pt;
	}
	#sign_up #confirmation_box{
		width: 434px;
		background: #f5f0e5;
		text-align: left;
		padding: 24px;
		margin-left: 40px;
	}
	#sign_up #confirmation_box p{margin:0;}
	

#player {
	background: url(/media/thickbox_bg.gif) no-repeat top left #191919;
	text-align:center;
}

#flash_movie {
	text-align: center;
	margin: 60px;
}	

/* FOOTER */
#footer {
	text-align: center;
	font-size: 12px;
	padding-top: 11px;
	color: #666666;
}
	#footer a{
		color: #666666;
		text-decoration:none;
		font-size: 12px;
	}