html {
}

body {
	background-color: #000;
	font-family: Arial, Verdana, sans-serif;
	font-size: 13px;
	background-image: url(http://static.grepolis.com/images/start/bg.jpg);
	background-repeat: no-repeat;
	background-position: center 0px;
	margin: 0px;
}

img { 
	border: none; 
}

#main {
	/*background-repeat: no-repeat;
	margin: 0px auto;
	position: relative;*/
	
}

.bold{
	font-weight: bold;	
}

.small{
	font-size: 10px;	
}

#register_accept.small,
lost_pw.small,
.news_item.small,
.headline.small{
	font-size: 11px;	
}	

#header {
	text-align: center;
}

h1 {
	width: 422px;
	height: 0px;
	padding: 0;
	margin: 30px auto 0;
}

h1 a {
	display: block;
	width: 450px;
	height: 80px;
}

h1 a span {
	visibility: hidden;
}

h2 {
	margin: 2px;
}

#grepolis_startpage_link {
  width:422px;
  height:71px;
  display:block;
  position:relative;
  background-image:url(http://static.grepolis.com/images/start/grepolis_logo_startpage.jpg);
  
}

#grepolis_startpage_link span{
  text-indent:-500em;
  display:block;  
}

#content {
	background-image: url(http://static.grepolis.com/images/start/content_middle.png);
	background-repeat: repeat-y;
	margin: 178px auto 0 auto;
	width: 602px;
	min-height: 350px;
}
* html #content{ 
	margin-top:107px;
}
#content_main {
	min-height:357px;
	z-index: 2;
	position: relative;
	padding: 0 20px;
}
* html #content_main{ 
	height:357px;
} 
#content_text {
	font-size: 14px;
	margin: 0 3px; 
	position: relative;
	width: 280px;
	height: 165px;
	padding: 25px 0 0 0;
	text-align: center;
	float:left;
}

#content_bottom {
	background-image: url(http://static.grepolis.com/images/start/content_bottom.png);
	background-repeat: no-repeat;
	position: relative;
	width: 602px;
	height: 28px;
	margin: 0 0 -1px -1px;
	border-width: 0 0px 1px 1px;
	border-style:solid;
}
	
.screen {
	margin-right: 8px;
	cursor: pointer;
}

#screenshots {
	position: relative;
	margin: 10px 3px;
}

#screenshots a {
}

#screenshots-target {
	display: none;
	position: absolute;
	top: -184px;
	left: 23px;
	z-index: 999;
	width: 556px;
	height: 358px;
}

#screenshots-target img {
	display: block; 
	cursor: pointer;
}


.login_box{
	position: relative;
}
.login_box .top_left,
.login_box .top_right,
.login_box .bottom_left,
.login_box .bottom_right{
	background: url(http://static.grepolis.com/images/start/loginbox_corners.png) no-repeat 0 0;
	left: 0px;
	right: 0px;
}

.login_box .middle_left,
.login_box .middle_right{
	background: url(http://static.grepolis.com/images/start/loginbox_left_right.png) repeat-y;
}
.login_box .middle_left{
	background-position: left;	
}
.login_box .middle_right{
	background-position: right;
}
.login_box .top_center,
.login_box .bottom_center{
	background: url(http://static.grepolis.com/images/start/loginbox_top_bottom.png) repeat-x;
}
.login_box .middle_left{
	background-position: left;	
}
.login_box .middle_right{
	background-position: right;
}
.login_box .top_left,
.login_box .top_right,
.login_box .top_center{
	height:12px;
	position: absolute;
}
.login_box .top_center{
	height: 9px;
	left: 12px;
	right: 12px;
}
.login_box .top_left{
	background-position: left top;
}
.login_box .top_right{
	background-position: right -12px;
}

.login_box .bottom_left{
	height:77px;
	background: url(http://static.grepolis.com/images/start/loginbox_corner_bottom_left.png) no-repeat left;
	position: absolute;
	bottom: -9px;
}
.login_box .bottom_right{
	background-position: right bottom;
	height: 12px;
	bottom: 0px;
	position: absolute;
}
.login_box .bottom_center{
	background-position: 0 -9px;
	height: 9px;
	bottom: 0px;
	left:79px;
	right: 12px;
	position: absolute;
}

.login_box .login_box_content{
	margin:0 9px;
	padding:12px 0;
	background: url(http://static.grepolis.com/images/game/border/brown.png) repeat;
	
}
*:first-child + html #login_form .login_box .login_box_content{ 
	height: 100%;	
}
* html .login_box .bottom.left,
* html .login_box .bottom.right{
	
}

#gamebar {
	width: 100%;
	height: 20px;
	background-image:url(http://static.grepolis.com/images/start/bar.png);
	background-repeat: repeat-x;
	position: absolute;
	top: 0px;
	color: #fc6;
	z-index:10;
}
#gamebar a{
	color: #fc6;
}

#gamebar_content {
	position:relative;
	top: 1px;
	width: 897px; 
	margin: auto;
	z-index: 10;
	background-image:url(http://static.grepolis.com/images/start/bar_content.png);
	background-repeat: no-repeat;
	background-position: 0 -1px;
	height: 20px;
}


#flag1_dropdown {
	margin-right: 10px;
	margin-left: 140px;
}

#flag1_dropdown img {
	border: 0;
	position: relative;
	top: 2px;
	z-index: 10;
}

#flags {
	text-align:left;
	list-style-type: none;
	padding: 2px;
	position:absolute;
	top: 5px; 
	left: 137px;
	background-color: #F2E4BF;
	border: 1px solid #88462C;
	display: none;
	z-index: 10;
}
* html #flags{ 
	left:97px;
	top:18px;	
}
*:first-child+html #flags{ 
	left:97px;
	top:18px;
}

#flags li a { line-height: 10px; }

#flags li a{ color:#804000; }

a:link { font-weight:bold; color: #804000; text-decoration:none; }
a:visited { font-weight:bold; color: #804000; text-decoration:none; }
a:active { font-weight:bold; color: #0082BE; text-decoration:none; }
a:hover { font-weight:bold; color: #0082BE; text-decoration:none; }


#loginform {
	position: relative;
	width: 258px;
	/*height: 180px;
	left: 307px;*/
	min-height: 60px;
}

#request_pwd_form{
	float:right;
	position:relative;
	width:260px;
	top:50px;
}
.request_pwd_textbox{
	width:300px;
	float:left;
}
#request_pwd_form a.button{
	float:right;
}
#loginform .login_text,#request_pwd_form .request_text{
	position: absolute;
	height: 20px;
	width: 90px;
	white-space:nowrap;
	text-align: right;
	padding: 3px;
}

#request_pwd_form .register_input {
	left:100px;
}

#loginform .login_fields,
.register_input{
	position: absolute;
	height: 18px;
	width: 142px;
	left: 95px;
	background-image: url(http://static.grepolis.com/images/start/login_field.png);	
	border: 0px;
	padding: 4px;
}

.legend_text{
  margin-bottom:5px;
  display:block;
}
#loginform #remember {
	position: relative;
	left: 95px;
}
#loginform #remember label{
	display:block;
	width:155px;
}
#loginform #remember input{
	margin: 3px 0;
	vertical-align: middle;
}

#loginform #login_button {
	position: relative;
	left: 95px;
	width: 150px;
}
#login_form #login_button a.button{
	display:inline-block;
}
.loginform-inner-wrap {
	padding: 0 0 4px 0;
  height:24px;
  position:relative;
}
#request_pwd_form .requestpwdform-inner-wrap{
		padding: 0 0 4px 0;
		height:24px;
		position:relative;
}
#loginform .loginform-inner .loginform-inner-wrapsubmit {
	padding-top: 10px;
}

#login_form{
	float:right;
	margin-bottom:10px;
}

#loginform .loginform-inner,
#loginform #worlds {
	position: relative; 
	left: 5px; 
	top: 8px;
	z-index: 5;
	width: 230px;
	height: 146px;
	margin: 5px;
}

#loginform #worlds {
	height:auto;
	width:auto;
	left:0;
	margin:0 0 30px 0;
	top:10px;
	z-index:1;
}
	
#loginform h4 {
	margin: 0 0 4px 0;
}

#loginform #worlds ul {
	list-style: none;
	padding: 0px 0px;
	margin: 0 auto;
	position:relative;
	top:0px;	
}

#loginform #worlds ul li {
	border-bottom: 1px solid #d5b064;
	cursor: pointer; 
	margin: 0 auto;
	padding: 0;
	width:150px;
	;
}
#loginform #worlds .logout_button {
	text-align: right;
	margin-right: 20px;
	font-size: 10px;
}

#loginform #worlds ul li a {
	display: block;
	padding: 4px 0px;
	text-align:center;
}

#remembered p {
	margin: 3px;
}

#remembered a:link, #remembered a:visited {
}
	
#start_register {
	background-image: url(http://static.grepolis.com/images/start/register_button.png);
	width: 530px;	
	height: 27px;
	font-size: 20px;
	color: #fc6;
	text-align: center;
	padding: 19px 0;
	display:block;
	margin: 10px 15px;
}

#start_register:hover {
	background-position: 0 -65px;
}

#imprint {
	background-image: url(http://static.grepolis.com/images/start/shadow_bottom.png);
	background-repeat: no-repeat;
	position: relative;
	margin: 0px auto;
	width: 604px;
	height: 15px;
}

#imprint p, #imprint a:link, #imprint p a:visited {
	font-size: 11px;
	color: #ffe2a0;
	margin: 0 3px;
	text-align: center;
	width: 600px;
}

#imprint a:hover {
	color: #fff; ;
}

/*
 * Select new World
 */

#select_new_world td {
	padding: 3px;
}	

#select_new_world .world_advise {
	background-color: #FADB9B;
}

/*
 * Select Direction
 */
 

#start_compass {
 	background-image:url(http://static.grepolis.com/images/start/compass.png);
 	background-repeat: no-repeat;
 	width: 300px;
 	height: 300px;
	margin: 0px auto 10px auto; 
	position: relative;
}

#choose_direction_text {
	position: relative;
	margin: 5px;
	text-align: center;
	width: 550px;
	height: 10px;
	font-size: 13px;
}

#random {
	position: absolute;
	top: 139px;
	left: 138px;
}

#random_text {
	position: absolute;
	width: 113px;
	height: 19px;
	top: 166px;
	left: 94px;
	text-align: center;
}

.direction_text {
	position: absolute;
	width: 120px;
	height: 19px;
}


#nw {
	position: absolute;
	top: 64px;
	left: 63px;
}

#nw_text {
	top: 64px;
	left: -55px;
	text-align: right;
}

#ne {
	position: absolute;
	top: 64px;
	left: 218px;
}

#ne_text {
	top: 64px;
	left: 240px;
	text-align: left;
}

#sw {
	position: absolute;
	top: 220px;
	left: 63px;
}

#sw_text {
	top: 220px;
	left: -55px;
	text-align: right;
}

#se {
	position: absolute;
	top: 220px;
	left: 218px;
}

#se_text {
	top: 220px;
	left: 240px;
	text-align: left;
}


/**
 * Register
 */
 
#register {
/*	width: 360px;
	height: 360px;*/
}
* html #register .login_box_content{ 
	width: 360px;
}

#register .register_container {
	position: relative;
	margin-top: 5px;
}
#register .register_container input{
	width:142px;
}
#register .register_container select{
	width:150px;
}

.register_text {
	position: relative;
	height: 26px;
	display: inline-block;
	width: 160px;
	text-align: right;
}

.register_field {
	position: relative;
	height: 18px;
	width: 142px;
	background-image: url(http://static.grepolis.com/images/start/login_field.png);	
	border: 0px;
	padding: 4px;
}

.register_status {
	margin-left: 0px;
	position: relative;
	width: 200px;
	display: inline-block;	
	color: #E00;
}

.register_voucher {
	font-family: monospace;
	font-weight: normal; 
}

#register_accept {
	margin-left: 160px;
}
#register a:link, #register a:visited {
}

#register_button {
	float: none;
	margin: 10px 5px 0 162px;
	position: relative;
	z-index: 50;
}

#registered_form {
	position: absolute;
	width: 272px;
	height: 150px;
	left: 20px;
	top: 7px;
	padding: 2px 0 0 2px
}

#flash-zeus {
	position: absolute;
	top: 0;
	left: 50%;
	margin: 21px 0 0 -556px;
	z-index: 4;   
	width: 254px;
	height: 334px;
}

#lost_pw {
	color:#AF9A6D;
	position: relative;
	left:95px;
}

#lost_pw a:link, #lost_pw  a:visited {
	color:#875;
}

#code_validation_form .register_field{
	position:absolute;
	left:150px;
}

.help_button{
	background:url(http://static.grepolis.com/images/game/layout/bigbutton.png) no-repeat scroll 0 0 transparent;
	background-position:-22px 0;
	display:block;
	width:22px;
	height:23px;
	float:right;
}

/*
* Links
*/
#links{
	text-align:center;
}

/*
* News
*/

.news_image{
	background-image: url(http://static.grepolis.com/images/start/news_image.jpg);
	width:39px;
	height:40px;
	float:left;
	margin-right:10px;
	margin-left:3px;
}

.news_item{
	overflow:hidden;
	margin-bottom:20px;
	line-height:13px;
}
.news_item h3{
	margin:0px;
	display:inline;
}

.news_item p{
	margin:0 50px;
}
/* not needed anymore?
.news_item .more{
	font-weight:bold;
	color:#884400;
}

.news_item .more:hover{
	color:#0082BE;
}
*/
/*
* Ban
*/

table.ban_info {
	width: 100%; 
	border-collapse: collapse; 
}

table.ban_info th {
		white-space: nowrap;
}

table.ban_info th, 
table.ban_info td {
	text-align: left;
	vertical-align: top;
	padding: 4px 20px 4px 0;
	border-bottom: 1px solid #d5b064;  
}


#facebook_landing #register {
	width: auto;
	height: 160px;
}

#landingpage_a #register{
	width: auto;
	height:265px;
}
#facebook_landing #login_form,
#landingpage_a #login_form{
	width: 332px;
}
#facebook_landing #content_text,
#landingpage_a #content_text{
	width: 220px;
}
#facebook_landing #played_before,
#landingpage_a #played_before{
	text-align: center;
	float: left;
	width: 220px;
}

#landingpage_b,
#landingpage_c,
#landingpage_d{
	padding-bottom: 25px;
}

#landingpage_b #content_text,
#landingpage_c #content_text{
	width: 100%;
	height: auto;
	float: none;
}

#landingpage_b #loginform,
#landingpage_c #loginform{
	width: auto;
}
#landingpage_b #loginform #login_button,
#landingpage_b .loginform-inner-wrap,
#landingpage_c #loginform #login_button,
#landingpage_c .loginform-inner-wrap{
	height: 60px;
	float: left;
	width: 160px;
	position: static;
	margin: 0 10px;
}
#landingpage_b #loginform .login_fields,
#landingpage_c #loginform .login_fields{
	position: static;
}
#landingpage_b #loginform .login_text,
#landingpage_c #loginform .login_text{
	position: static;
	display: block;
	text-align: left;
}
#landingpage_b .loginform-inner,
#landingpage_c .loginform-inner{
	width: 100%;
	position: static;
	height: 65px;
}
#landingpage_b #remember,
#landingpage_c #remember{
	position: static;
	float: left;
}
#landingpage_b #login_button .button .middle
#landingpage_c #login_button .button .middle{
	width: 142px;
}
#landingpage_b #login_button,
#landingpage_c #login_button{
	padding-top: 25px;
}
#landingpage_c{
	position: relative;
	z-index: 10;	
}
#flash-hera {
	position: absolute;
	top: 0;
	left: 50%;
	margin: 175px 0 0 -372px;
	width: 164px;
	height: 238px;
}
#start_register_flash{
	position: relative;
	z-index: 5;
	display: block;
}
#register_flash{
	z-index: -1;
	left: -21px;
	position: relative;
}
#register_flash span{
	display: block;
	height: 50px;
	background: url(http://static.grepolis.com/images/start/register_button_new.jpg) 0 0 no-repeat;
	color: #fff;
	font-family: Georgia, Times New Roman, serif;
	font-size: 20px;
	line-height: 50px;
	text-align: center;
	position: relative;
	left: 21px;
	cursor: pointer;
}
#register_flash span:hover{
	background-position: 0 -50px; 
}
#login_flash span{
	background: url(http://static.grepolis.com/images/start/login_button_new.jpg);
	display: block;
	width: 116px;
	height: 23px;
	line-height: 23px;
	position: relative;
	top: 3px;
	text-align: center;
	color: #fff;
	font-family: Georgia, Times New Roman, serif;
	
}
#login_flash span:hover{
	background-position: 0 -23px;
}


span.grepo_input input{
	background: url(http://static.grepolis.com/images/game/layout/input_bg.png) 0 -46px repeat-x;
	border: 0 none;
	margin: 0 5px;
	padding: 1px;
	height: 21px;
}

*:first-child + html span.grepo_input input{ 
	display: block;
	float: left;
}

span.grepo_input span{
	background: url(http://static.grepolis.com/images/game/layout/input_bg.png) 0 0 no-repeat;
	display: inline-block;
}
span.grepo_input span.left{
	background-position: left 0;
}
span.grepo_input span.right{
	background-position: right -23px;
}


#flashplayer{
	background: url(http://static.grepolis.com/images/start/flash_bg.jpg) center no-repeat;
}
#fp_wrapper{
	position: relative;
	width: 520px;
	margin:5px auto 45px;
}
#fp_overlay{
	position: absolute;
	z-index: 50;
	left: 50%;
	top: 50%;
	margin:-79px 0 0 -75px;
}

#fp_timeline,
#fp_volume_control{
	background: url(http://static.grepolis.com/images/start/flashplayer_sprite.png) 0 0 no-repeat;
	height: 8px;
	position: absolute;
	cursor: pointer;
}
#fp_volume_control{
	background-position: -340px -7px;
	width: 102px;
	display: none;
}
#fp_timeline{
	background-position: -340px -15px;
	left: 2px;
	top: -3px;
	width: 160px;
}
#fp_timeline a.ui-slider-handle,
#fp_volume_control a.ui-slider-handle{
	margin-left: -8px;
	top: -9px;
	width: 18px;
	height: 18px;
	background: transparent url(http://static.grepolis.com/images/game/barracks/slider_point.png) no-repeat 0 0;
	position: absolute;
}
#fp_timeline a.ui-slider-handle:focus,
#fp_volume_control a.ui-slider-handle:focus{
	text-decoration: none;
	outline: 0 none;
	border: 0 none;
}
#fp_wrapper div.border{
	position: absolute;
	z-index: 50;
}
#fp_wrapper div.top {
	position: absolute;
	background: url(http://static.grepolis.com/images/game/border/border_h.png) repeat-x top;
	left: 0;
	right: 0;
	top: -3px;
	height: 4px;
}
#fp_wrapper div.left {
	position: absolute;
	background: url(http://static.grepolis.com/images/game/border/border_v.png) repeat-y;
	top: 0;
	bottom: 0;
	width: 4px;
	left: -3px;
}
#fp_wrapper div.right {
	position: absolute;
	background: url(http://static.grepolis.com/images/game/border/border_v.png) repeat-y;
	top: 0;
	bottom: 0;
	width: 4px;
	right: -3px;
}
#fp_wrapper div.border div.socket {
	background: url(http://static.grepolis.com/images/game/border/edge.png);
	position: absolute;
	z-index: 3;
	width: 10px;
	height: 10px;
}
#fp_wrapper div.top div.socket.left {
	left:-3px;
}
#fp_wrapper div.top div.socket.right {
	background-position: 0 -10px;
	right:-3px;
}
#fp_wrapper div.bottom div.socket.left {
	background-position: 0 -30px;
	left: 0;
	top: -7px;
}
#fp_wrapper div.bottom div.socket.right {
	background-position: 0 -20px;
	right: 0;
	top: -7px;
}
#fp_control_wrapper{
	width: 526px;
	height:17px;
	background: url(http://static.grepolis.com/images/start/flashplayer_sprite.png) 0 -23px no-repeat;
	bottom: -17px;
	left: -3px;
}
#fp_controls{
	height: 33px;
	width: 134px;
	padding: 0 15px;
	background: url(http://static.grepolis.com/images/start/flashplayer_sprite.png) 0 10px no-repeat;
	position: absolute;
	left: 181px;
	text-align: center;
}
#fp_controls a{
	background: url(http://static.grepolis.com/images/start/flashplayer_sprite.png) 0 11px no-repeat;
	width: 22px;
	height: 23px;
	display: inline-block;
	margin:5px 1px;
}
#fp_controls a.pause{ 
	background-position: -186px 0;

}
#fp_controls a.pause:hover{
	background-position: -274px 0;
}
#fp_controls a.play{
	background-position: -164px 0;
}
#fp_controls a.play:hover{
	background-position: -252px 0;
}
#fp_controls a.volume{
	background-position: -208px 0;
}
#fp_controls a.volume:hover{
	background-position: -296px 0;
}
#fp_controls a.volume.muted{
	background-position: -230px 0;
}
#fp_controls a.volume:hover.muted{
	background-position: -318px 0;
}
#fp_controls a.volume.disabled{
	background-position: -230px 0;
}
#fp_controls a.volume.disabled:hover{
	background-position: -318px 0;
}


.fb_dialog.ui-dialog{
	background: none repeat scroll 0 0 rgba(82, 82, 82, 0.7);
	-moz-border-radius: 8px;
	padding: 8px;
	color: #808080;
	font-family: Tahoma, Verdana, sans-serif;
}
.fb_dialog .ui-dialog-titlebar{
	background: #6D84B4;
	border-width: 5px 5px 0;
	border-color: #fff;
	border-style: solid;
	color: #fff;
	font-weight: 700;
	padding: 5px 0;
}
.fb_dialog .ui-dialog-titlebar img{
	vertical-align:middle;
	margin: 0 5px 0 5px;
 }
 .fb_dialog .ui-dialog-titlebar span{
	vertical-align:middle;
 }
.fb_dialog .ui-dialog-content.ui-widget-content{
	background: #fff;
	padding: 5px;
}
.fb_dialog input{
	border: 1px solid #BDC7D8;
	background: #fff;
}

.fb_dialog a{
	color: #3B5998;
}
.fb_dialog a:hover{
	text-decoration: underline;
}
.fb_dialog #register_button{
	border-width: 1px 0 1px 0;
	border-color: #5972a8 #fff #d9d9d9;
	border-style: solid;
	float: right;
	margin: 7px 5px 10px;
}

.fb_dialog #register_button a{
	border-style: solid;
	display: block;
	height: 20px;
	padding:1px 6px;
	line-height: 20px;
	color: #fff;
	background: #5972a8;
	border-color: #8a9cc2 #fff #1a356e;
	border-width: 1px 0 1px 0;
	text-align: center;
	text-decoration: none;
}
#fb_dialog_register_button_wrapper{
	margin: 20px 0 0 0;
	background: #F2F2F2;
	border-top: 1px solid #ccc;
	height: 40px;
}
.fb_dialog .ui-icon.ui-icon-closethick{
	background: url(http://static.grepolis.com/images/game/chat/chat_icons.png) -28px 0 no-repeat;
	width: 14px;
	height: 14px;
	text-indent: -9999px;
	display: block;
	float: right;
	margin: 5px 5px 0 0;
}
div.fb_dialog .ui-state-hover .ui-icon.ui-icon-closethick{
	background: url(http://static.grepolis.com/images/game/chat/chat_icons.png) -28px 0 no-repeat;
	opacity: 0.5;
	filter: alpha(opacity=50);
}
.fb_dialog .ui-dialog-titlebar-close.ui-corner-all.ui-state-hover{
	background: none;
	padding: 1px;
}
.ui-widget-overlay{
	position: fixed;
	left: 0;
	top: 0;
	background: #333;
	opacity: 0.5;
	filter: alpha(opacity=50);
}
#sevengames_logo{
	background: url(http://static.grepolis.com/images/start/logo_7g.png) right bottom no-repeat;
	position: absolute;
	display: block;
	height: 20px;
	width: 161px;
	margin: 0 0 0 320px;
	left: 50%;
	top: 680px;
	z-index: 1;
}


 .clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
 * html .clearfix {
    zoom: 1;
 }
 *:first-child + html .clearfix {
    zoom: 1;
 }