/* @override 
	http://trunk.mechduels.local/css/home.css
	http://dev.mechduels.com/css/home.css
	http://ie.mechduels.local/css/home.css
	http://dev.mechduels.local/css/home.css
	http://beta.mechduels.local/css/home.css
*/

body {
	/*background: #16150d url(/img/ui/home_skin/background.jpg) no-repeat 50% top;*/
	/*background: #333;*/
	
	font-family: verdana, arial, sans-serif;
	color: #c9be7d;
	
	background: #0a0a06;
}
/*body * {background: none;}*/

h1.h2,h3 {font-family: arial, verdana, sans-serif; color: #8b8356;}
a:link,
a:active,
a:visited,
a:hover {text-decoration: none; color: #e2ca20;}
a:hover {color: #fff;} /*#eeebab*/

tr.even {background-color: #000;}

#logo {
	position: absolute;
	left: 339px;
}

#content h1 {margin: 0px;}
#content {
	background: url(/img/ui/home_skin/banners/build-deploy-destroy-bg.jpg) no-repeat;
	height: 400px;
	z-index: 1;
	overflow: hidden;
	/*@todo @test*/
}

#register_button,
#play_now_button {position: absolute; top: 360px; left: 703px;}

#play_now_button.centered {
	top: 280px;
	left: 460px;
}
#replay_movie_button {
	position: absolute;
	top: 370px;
	left: 840px;	
}

#get_flash {position: absolute; top: 283px; left:  672px;;}

/*#get_flash {position: absolute; bottom: -44px;}*/

#wrapper {
	padding: 0 32px 10px;
	background: #1b1811 url(/img/ui/home_skin/background.jpg) no-repeat 50% 0%;
}

/* NAVIGATION */
#wrapper .top {
	height: 40px;
}

.nav li {position: absolute;}
.nav li a {display: block;} /*Force width in IE*/

#nav_home {
	overflow: hidden;
	left: 136px;
}
#nav_home a {
	background: url(/img/ui/home_skin/nav-home.png) no-repeat;
	height: 36px;
	width: 98px;
}
#nav_home.hover a {background-position: 0px -34px;}

#nav_news {
	overflow: hidden;
	left: 242px;
}
#nav_news a {
	background:transparent url(/img/ui/home_skin/nav-news.png) no-repeat scroll 0 0;
	height:34px;
	width:99px;
}
#nav_news.hover a {background-position: 0px -32px;}

#nav_register {
	overflow: hidden;
	left: 624px;
}
#nav_register a {
	background: url(/img/ui/home_skin/nav-register.png) no-repeat;
	height: 35px;
	width: 103px;
}
#nav_register.hover a {background-position: 0px -33px;}

#nav_forums {
	overflow: hidden;
	left: 764px;
}
#nav_forums a {
	background: url(/img/ui/home_skin/nav-forums.png) no-repeat;
	height: 37px;
	width: 99px;	
}
#nav_forums.hover a {background-position: 0px -35px;}

#nav_facebook {
	left: 960px;
	padding-top: 10px;
}

/****** FORMS *******/
div.input, div.checkbox, div.submit { clear:left; margin:0px}
div.submit input {font-size: 1.2em;}
div.submit input:active { padding: 2px 0 0 2px;}
/*div.submit input {min-width: 120px; min-height: 30px}*/ /*TODO apply IE min-h/w fix*/
div.submit input.image {min-width: 0px; min-height: 0px;}
/*div.input label { float:left; display:inline; width:115px; text-align:right; }*/
div.input input, div.input textarea, div.input select, div.input span { float:none; display:block; width:180px; }
div.input {padding-bottom: 13px;}
div.input .error-message {float: left;}
div.checkbox input { float:left; display:inline; padding-left:125px;margin-left:125px; }
div.checkbox label { float:none; display:block; width:200px; padding-left:150px; text-align:left; }

/* Login */
#login {
	background-color: transparent;
	width: 315px;
	padding: 0px 5px;
	position: absolute;
	left: 30px;
	top: 0px;
}
#login form {position: relative;}
#login .password input {width: 92px;}
#login label,
#login .text input{width: 130px;}
#login div.submit {
	position:absolute;
	right:25px;
	top:-6px; /* bottom: -35px*/
}
#login div.input {margin: 0px; padding: 0px;}
#login .submit input {margin-top: 1.5em;}
#login label,
#facebook_login_wrapper span {color: #fff; background-color:#000;}
#content #login p {margin: 0px;}

/* /users/login box */
#login.below_nav {top: 25px;}

/* Registration page login box */
.column #login {float: none;}
#login div.group {float: left; margin-right: 5px;}
#login #facebook_login_wrapper {margin: 5px 0px 0px 0px;}
#login #facebook_login_wrapper span {float: left; margin: 0px 35px 0px 0px;}
#login #fb_login_image {margin-bottom: 0px; border: none;}

/* Enter Game */
#login.logged_in {
	position: static;
	float: right;
	margin-top: 65px;
	margin-left: 0px;
}

/* User Registration Screens*/
.begin_screen {padding-top: 28px;}
.begin_screen h1 {padding-left: 20px; font-size: 4em;}
.begin_screen div.input label {width:250px}

/* Registration Form */
#registration_form .column {
	background-color: #000;
	margin: 10px 0px 0px 25px;
	/*margin: 25px 0px 0px 25px;*/
	padding: 15px 25px 5px 25px;
}

#registration_form div#normal_registration_holder {
	height: 275px;
	width: 485px;
	/*height: 260px;*/
	/*width: 485px;*/
}
#registration_form .login p {width:25em;}
/*#facebook_connect_holder.column {margin-left: 25px;}*/
/*#fb_login_image {margin-bottom: 10px; border: 6px solid #7dff56;}*/
#fb_login_image {margin-bottom: 10px; border: 6px solid #eede00;}
a.fbconnect_login_button:hover #fb_login_image {margin-bottom: 10px; border: 6px solid #7dff56;}

#registration_form .column h2 {margin: 0px; font-size: 24px;}
#registration_form .column p {margin: 0px 0px 2em 0px;}

#normal_registration_holder div.left {width: 230px;}
#registration_form div.first {margin-right: 10px;/*margin-right: 20px;*/}
#registration_form div.submit {margin-top: 10px;}

#registration_form select {width: 240px;}

#registration_form div.input,
#registration_form div.select_wrapper {
	padding-bottom: 21px;
	position: relative;
}
#registration_form div.select_wrapper {padding-bottom: 10px;}

#login_connect_form div.submit input, #lost_password_form div.submit input, #resend_code_form div.submit input, #activate_form div.submit input {
	min-height: 30px;
	min-width: 120px;
}

/* input element tips */

p#input_tip {
	position: absolute;
	left: 3px;
	bottom: -20px;
	padding: 1px 4px;
	background-color: #b0a528;
	font-size: 1.2em;
	z-index: 2;
	color: #000;
	width: auto;
	white-space: nowrap;
}


/* Bottom Modules */
#wrapper .bottom div.column{
	float: left;
	background: transparent url(/img/ui/home_skin/column-bg.png) repeat-x;
	margin: 11px 10px 0px 0px;
	position: relative;
	width: 250px;
	height: 195px;
}
#wrapper .bottom .column a {
	display:block;
	height:100%;
	width:100%;
}
/* Bottom Banner "click me" text */
#wrapper .bottom .column a p {
	position:absolute; bottom: 3px; color: #000;
}
#offer p         {right: 10px;}
#reward_points p {left: 10px;}

#wrapper .bottom div.column .body{	
	height: 100%;
}

#wrapper .bottom #promos {
	background: url(/img/ui/home_skin/banners/home-module-concept.png) no-repeat;
	width: 440px;}
#wrapper .bottom #promos .body {overflow: visible;}

/* Bundle Offer */
#wrapper .bottom #offer {background: url(/img/ui/home_skin/banners/home-module-starter-bundle.png) no-repeat;}

/* Reward Point banner */
#wrapper .bottom #reward_points {background: url(/img/ui/home_skin/banners/home-module-reward-points.png) no-repeat; margin-right: 0em;}

/* News */
#news .item {color: #6a6442; margin-bottom: 10px;}
#news .item .date {
	background-color: #10100c;
	float: left;
	font-size: 7pt;
	padding-top: 3px;
	margin-right:  15px; 
	width: 55px; height: 12px;
	text-align: center;
}
#news .item h3 {/*font-size: 10pt; display: inline;*/ padding-left: 70px}
#news .item .snippet {margin-left:  70px; font-size: 8pt;}
#news #more_news {
	position: absolute;
	bottom: 11px;
	right:15px;
}

.form-container div.first  {margin-right: 20px;}

#content .box {
	background: black;
	padding: 50px 50px 50px 50px;
	margin: 30px 30px 30px 30px;
}

/* FAQ */

#faq_container {margin-top: 50px;}
#faq_container h2 {margin-top: 0px; text-align: center;}
#faq_container .ui-tabs-panel {background-color: #000; overflow: auto; height: 285px; width: 958px;}

#error {
	background-color:#000000;
	left:75px;
	padding:35px;
	position:absolute;
	text-align:center;
	font-size:135%;
	top:110px;
	width:808px;
}