/* ###Testing only### */

/* ### ### */

/* Allgemeine Elemente */

body {
  background: #666 url(../img/body_bg.gif) top left;
  font-size: 67%;
  font-family: Verdana, Arial, sans-serif;
  text-align: center;
}

img {
  border: none;
}

input.text, input.password {
  border: 1px solid #b8b8b8;
  color: #515151;
}

table {
  font-size: 1em;
  width: 100%;
}

thead {
  font-size: 1.1em;
  font-weight: bold;
}

thead tr {
  background: #f2f2f2;
}

#container {
  background: #fff;
  margin: 20px auto;
  position: relative;
  text-align: left;
  width: 989px;
}


a:link, a:visited {
  color: #EC7212;
  text-decoration: none;
}

a:active, a:hover {
  color: #414141;
  text-decoration: none;
}


/* Header */

  /* Obere Leiste */
  
#topbar {
  background: #333 url(../img/topbar_bg.gif) top left repeat-x;
  clear: both;
  color: #C4C4C4;
  height: 31px;
  position: relative;
  width: 989px;
}

#topbar p {
  margin: 9px 10px 0 10px;
}

#topbar .center {
  left: 400px;
}

#topbar h1 {
  font-size: 100%;
  margin: 9px 10px;
}

  /* Logo */

#logo {
  background: #333;
  height: 80px;
  padding: 0;
}

  /* Hintergrundbild im Header */

#headerimage {
  background: #fff url(../img/headerimage.gif) top left no-repeat;
  border: 1px solid #000;
  border-width: 1px 0 1px 0;
  height: 139px;
  width: 989px;
}

  /* Hauptmenü */

#mainmenu, #gamemenu {
  background: #333 url(../img/mainmenu_bg.gif) top left repeat-x;
  height: 38px;
}

#mainmenu ul, #gamemenu ul {
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: center;
}

#mainmenu li, #gamemenu li {
  float: left;
  padding: 0;
}

#mainmenu a, #gamemenu a {
  border-right: 1px solid #000;
  display: block;
  height: 16px;
  float: left;
  padding: 11px 0;
  width: 90px;
}

#mainmenu a:link, #mainmenu a:visited, #gamemenu a:link, #gamemenu a:visited {
  color: #fff;
  text-decoration: none;
}


/* Lotsen */

#lotsen, #lotsen a:link, #lotsen a:visited{
  color: #73FB06;
  text-decoration: none;
}

#lotsendark, #lotsendark a:link, #lotsendark a:visited{
  color: #19CB02;
  text-decoration: none;
}

#lotsenred, #lotsenred a:link, #lotsenred a:visited{
  color: #CD0000;
  text-decoration: none;
}

#mainmenu a:active, #mainmenu a:hover, #gamemenu a:active, #gamemenu a:hover {
  background: url(../img/mainmenu_hover.gif) top left repeat-x;
}

#mainmenu a.toggle, #gamemenu a.toggle {
  background: url(../img/menu_switch.gif) center left no-repeat;
  border: none;
  color: #FC8C24;
  font-weight: bold;
  padding-left: 25px;
}

/* Inhalt */

  /* Linke Spalte */

#left {
  float: left;
  width: 740px;
}

#left2 {
  float: left;
  width: 990px;
}

  /* Login */

#loginbox .boxbody {
  background: #fff url(../img/loginbox.gif) top left no-repeat;
  border: none;
  padding: 0;
  position: relative;
  height: 54px;
  width: 726px;
}

#loginbox #language {
  height: 53px;
  left: 0;
  position: absolute;
  right: 0;
  text-align: center;
  width: 110px;
}

#loginbox #language img {
  margin: 20px 5px 0 5px;
}

#loginbox #login {
  height: 53px;
  left: 113px;
  position: absolute;
  top: 0;
  width: 450px;
}

#loginbox #login input {
  float: left;
  margin: 15px 0 0 5px;
}

#loginbox #login .image {
  float: right;

}

  /* Features */
  
#features {
  position: absolute;
  left: 260px;
  width: 440px;
}


#features h1 {
  font-size: 1.2em;
  margin: 5px 0;
}

#features ul {
  display: table;
  font-size: 1.1em;
  list-style: none;
  line-height: 16px;
  margin: 0;
  padding: 0;
}

#features li {
  background: url(../img/li.gif) top left no-repeat;
  padding-left: 20px;
  margin: 5px 0;
}

  /* What is Ars? */
  
#teaserbox .boxbody {
  background: #fdfdfd;
}
  
#teaserbox .boxfooter {
  background: url(../img/world.gif) bottom left no-repeat;
  height: 241px;
  position: relative;
  width: 726px;
}

#teaserbox #startplaying {
  background: #fff url(../img/start_playing.gif) top left no-repeat;
  height: 43px;
  left: 257px;
  position: absolute;
  top: 147px;
  width: 458px;
}

#teaserbox #startplaying a {
  color: #545454;
  font-size: 1.2em;
  font-weight: bold;
  display: block;
  height: 30px;
  letter-spacing: -1px;
  padding: 13px 0 0 25px;
  text-decoration: none;
  width: 433px;
}

  /* Credentials */
  
#credentials {
  height: 53px;
  left: 460px;
  position: absolute;
  width: 155px;
}

#credentials .blackbutton {
  margin: 15px 5px 0 5px;
}

#credentials a {
  color: #fff;
  display: block;
  height: 17px;
  padding: 3px 0 0 0;
  text-align: center;
  text-decoration: none;
  width: 124px;
}


  /* Rechte Spalte */

#right {
  float: right;
  width: 245px;
}

  /* Untere Linkliste */
  
#bottombar {
  clear: both;
  height: 33px;
  position: relative;
  width: 989px;
}

#bottombar .center {
  left: 100px;
}

#bottombar p {
  margin: 10px 9px;
}

#bottombar, #bottombar a {
  color: #515151;
  text-decoration: none;
}

/* Footer */

#footer {
  background: #333 url(../img/footer_bg2.gif) top left repeat-x;
  clear: both;
  position: relative;
  height: 45px;
}

#footer .center {
  left: 100px;
}

#footer p {
  margin: 10px 9px;
}

#footer, #footer a {
  color: #dcdcdc;
}

/* Banner */
#skyad {
  position: absolute; 
  top: 0; 
  right: -180px;
}

#worldad1, #worldad2 {
	width: 468px;
	margin-bottom: 5px;
}
#worldad1 {
	float: left; 
}
#worldad2 {
	float: right; 
}

/* Allgemeine Klassen */

.left {
  float: left;
}

.right {
  float: right;
}

.clear {
  clear: both;
}

.alignright {
  text-align: right;
}

.center {
  position: absolute;
}

.bold {
  font-weight: bold;
}

.italic {
  font-style: italic;
}

.uppercase {
  text-transform: uppercase;
}

.orange {
  color: #FF9933;
}

.left .orange {
  color: #D56C04;
}

.blue, .blue a {
  color: #4D5B94;
}

.inner {
  margin: 8px;
}

.row2 {
  background: #DADADA;
}

.vmiddle {
  vertical-align: middle;
}

.vbottom {
  vertical-align: bottom;
}

.bigtext {
  font-size: 1.3em;
  font-weight: bold;
}

.hidden {
  visibility: hidden;
}
/* Boxen */

.box {
  margin: 10px 0;
}

.box p {
  margin: 5px;
}

.rightbox .boxheader, .rightbox .boxheader a {
  color: #fff;
  text-decoration: none;
}

.boxbody {
  color: #515151;
}

.boxfooter {
  clear: both;
}

/* Grafischer Linkbutton */

.blackbutton {
  background: #000 url(../img/input.gif) top left no-repeat;
  height: 20px;
  width: 124px;
}

  /* Links */
   
.leftbox {
  width: 726px;
}

.leftbox .boxheader {
  background: #ff9900 url(../img/box_left_header.gif) top left no-repeat;
  color: #fff;
  font-size: 1.4em;
  height: 20px;
  padding: 5px 20px;
  width: 686px;
}

.leftbox .boxbody {
  background: #fff url(../img/box_bg.gif) bottom left repeat-x;
  border-right: 1px solid #a1a1a1;
  border-left: 1px solid #a1a1a1;
  padding: 10px;
  width: 704px;
}

.leftbox .boxbody .clean{
  background: none;
}

.leftbox .boxbody th{
  border-bottom: 2px solid #a1a1a1;
}

.leftbox .boxbody td{
  border-bottom: 1px solid #F3F3F3 ;
}

.leftbox .boxfooter {
  background: #fff url(../img/box_left_footer.gif) top left no-repeat;
  height: 8px;
  width: 726px;
}

.small_left, .small_right {
  margin: 0 0;
  width: 350px;
}

.small_left .boxheader, .small_right .boxheader {
  background-image: url(../img/box_left_header_small.gif);
  width: 319px;
}

.small_left .boxbody, .small_right .boxbody {
  width: 337px;
}

.small_left .boxfooter, .small_right .boxfooter {
  background-image: url(../img/box_left_footer_small.gif);
  width: 359px;
}

.small_left {
  float: left;
}

.small_right {
  float: right;
  margin-right: 7px;
}

    /* Orange */
    
.orangebox .boxheader {
  background: #fff url(../img/box_orange_header.gif) top left no-repeat;
  height: 5px;
  width: 726px;
}

.orangebox .boxbody {
  background: #EA9101;
  color: #fff;
  padding: 5px 4px;
  width: 718px;
}

.orangebox .boxfooter {
  background: #fff url(../img/box_orange_footer.gif) top left no-repeat;
  height: 5px;
  width: 726px;
}

.orangebox h1 {
  font-size: 1.3em;
  font-weight: normal;
  margin: 0 0 10px 5px;
  padding: 0;
}

.orangebox > .boxbody > h1 a:link, .orangebox > .boxbody > p > a:link, .orangebox > .boxbody > h1 a:visited, .orangebox > .boxbody > p > a:visited {
  color: #fff;
  text-decoration: none;
}

.orangebox > .boxbody > h1 a:hover, .orangebox > .boxbody > p > a:hover, .orangebox > .boxbody > h1 a:active, .orangebox > .boxbody > p > a:active {
  color: #CCCCCC;
  text-decoration: none;
}

  /* Grau */
  
.greybox .boxheader {
  background: #fff url(../img/box_grey_header.gif) top left no-repeat;
  height: 6px;
  overflow: hidden;
  width: 718px;
}

.greybox .boxbody {
  background: #fff;
  border: 1px solid #AB6A01;
  border-width: 0 1px 0 1px;
  color: #515151;
  padding: 5px 0px;
  width: 716px;
}

.greybox .boxfooter {
  background: url(../img/box_grey_footer.gif) top left no-repeat;
  height: 6px;
  width: 718px;
}

  /* Tabellen */

.tablebox .boxheader {
  background: #f2f2f2 url(../img/table_grey_header.gif) top left no-repeat;
  color: #414141;
  height: 23px;
  padding: 7px 0 0 0;
  width: 718px;
}

.tablebox .boxheader h1 {
  font-weight: 600;
}

.tablebox .boxspan {
	float: right;
	padding-right: 4px;
	cursor: pointer;
	font-size: 24px;
	margin-top: -8px;
}

.tablebox .boxheader2 {
  background:#F2F2F2;
  border: 1px solid #AB6A01;
  border-width: 0 1px 0 1px;
  color: #414141;
  font-size:1.1em;
  font-weight:bold;
  height: 25px;
}

.tablebox .boxbody {
  background: #fff;
  border: 1px solid #AB6A01;
  border-width: 0 1px 0 1px;
  color: #414141;
  padding: 0 0;
  width: 716px;
}

.stateimg {
  margin: 3px 5px 0 0;
}


.tablebox .boxfooter {
  background: url(../img/table_grey_footer.gif) top left no-repeat;
  height: 5px;
  width: 718px;
}

.lefttable {
  float: left;
}

.righttable {
  float: right;
}

.lefttable, .righttable {
  margin: 0 0;
}

.lefttable, .righttable, .lefttable .boxheader, .righttable .boxheader, .lefttable .boxfooter, .righttable .boxfooter {
  width: 353px;
}

.lefttable .boxheader, .righttable .boxheader {
  background: #f2f2f2 url(../img/table_grey_header_small.gif) top left no-repeat;
}

.lefttable .boxfooter, .righttable .boxfooter {
  background: url(../img/table_grey_footer_small.gif) top left no-repeat;
}

.lefttable .boxbody, .righttable .boxbody {
  width: 351px;
}

  /* Rechts */
  
.rightbox .boxheader {
  background: #E0910E url(../img/box_right_header.gif) top left no-repeat;
  font-size: 1.2em;
  height: 23px;
  padding: 0;
  width: 236px;
}

.steel .boxheader {
  background: #fff url(../img/box_right_header_steel.gif) top left no-repeat;
  height: 23px;
  padding: 8px 0 0 12px;
  width: 224px;
}

.rightbox .boxheader a.left {
  display: block;
  height: 20px;
  padding: 3px 0 0 5px;
  width: 181px;
}

.rightbox .boxheader a.right {
  display: block;
  height: 18px;
  padding: 5px 0 0 5px;
  width: 30px;
}

.rightobx .boxheader img {
  padding: 5px 0 0 0;
}

.rightbox .boxbody {
  border: 1px solid #a1a1a1;
  border-bottom-width: 0;
  width: 234px;
}

.rightbox .boxfooter {
  background: #fff url(../img/box_right_footer.gif) top left no-repeat;
  height: 5px;
  width: 236px;
}

.steel .boxheader {
  color: #414141;
}

.rightbox .boxbody a:link, .rightbox .boxbody a:visited {
  color: #414141;
  text-decoration: none;
}

.rightbox .boxbody a:hover, .rightbox .boxbody a:active {
  color: #cccccc;
}

/* Newstiker */

#NewsVertical {
	height: 200px;
	display: block;
	overflow: hidden;
	position: relative;
}

#TickerVertical {
  height: 200px;
  display: block;
  list-style: none;
  margin: 0;
  padding: 0;
}

#TickerVertical li {
	display: block;
	color: #333333;
	padding: 6px;
	float: left;
	margin: 0px;
}

#TickerVertical ul {
	margin: 0px;
	padding: 0px;
}

/* Newstiker */

#WorldVertical {
	height: 30px;
	width: 975px;
	display: block;
	overflow: hidden;
	position: relative;
}

#TickerWorld {
  height: 30px;
  width: 975px;
  display: block;
  list-style: none;
  margin: 0;
  padding: 0;
}

#TickerWorld li {
	display: block;
	color: #333333;
	padding: 6px;
	float: left;
	margin: 0px;
}

#TickerWorld ul {
	margin: 0px;
	padding: 0px;
}


/* Spielermenü */

.playerbox {
  width: 236px;
}

.playerbox .boxheader {
  background: url(../img/box_player_header.gif) top left no-repeat;
  height: 2px;
  width: 236px;
}

.playerbox .boxbody {
  background: #EA9101;
  color: #fff;
  padding: 5px 0 0 0;
}

.playerbox .boxbody p {
  margin: 5px;
}

.statebox {
  clear: both;
}

.statebox table {
  margin: 0 0 0 5px;
  width: 226px;
}

.statebox thead tr {
  background: url(../img/box_state_header.gif) top left no-repeat;
  border-bottom: 1px solid #d3d3d3;
  color: #373737;
  text-align: center;
  height: 27px;
  width: 226px;
}

.statebox a {
  color: #373737;
  display: block;
  height: 19px;
  padding: 6px 0 0 10px;
  text-decoration: none;
}

.statebox .tleft {
  background: url(../img/box_state_left.gif) top left no-repeat;
  width: 104px;
}

.statebox .tright {
  background: url(../img/box_state_right.gif) top left no-repeat;
  width: 102px;
}

.statebox .tboth {
  background: url(../img/box_state_both.gif) top left no-repeat;
  width: 215px;
}

.statebox .tleftactive {
  background: url(../img/box_state_left_hover.gif) top left no-repeat;
  width: 104px;
}

.statebox .trightactive {
  background: url(../img/box_state_right_hover.gif) top left no-repeat;
  width: 102px;
}

.statebox .tleft:hover {
  background: url(../img/box_state_left_hover.gif) top left no-repeat;
}

.statebox .tright:hover {
  background: url(../img/box_state_right_hover.gif) top left no-repeat;
}

.playermenu {
  list-style: none;
  margin: 5px 0 0 0;
  padding: 0;
}

.playermenu li {
  background: url(../img/playermenu_bg.gif) top left no-repeat;
  margin: 0;
  padding: 0;
}

.playermenu a {
  background: url(../img/playermenu_bg.gif) top left no-repeat;
  color: #fff;
  display: block;
  font-size: 1.2em;
  height: 22px;
  text-decoration: none;
  padding: 5px 0 0 20px;
  width: 215px;
}

.playermenu a:hover {
  background: url(../img/playermenu_active.gif) top left no-repeat;
}

  /* Listen rechts */
  /* Happiest Nations */
  

.rightbox .flag {
  width: 30px;
}

    /* Buttons */
  
.rightbuttonbox {
  background: #EC9301;
  border: 1px solid #cecece;
  height: 61px;
  margin: 10px 0;
  position: relative;
  width: 234px;
}

.rightbuttonbox .button {
  background: #e0e0e0 url(../img/button.gif) top left no-repeat;
  height: 47px;
  left: 15px;
  margin: 0;
  top: 7px;
  position: absolute;
  width: 207px;
}

.rightbuttonbox a {
  color: #414141;
  display: block;
  font-size: 1.2em;
  height: 32px;
  padding: 15px 0 0 20px;
  position: absolute;
  text-decoration: none;
  width: 187px;
}

.formlink, .formlink_hover{
	font-size: 1em;
	color: #EC7212;
	background: none;
	border-width: 0;  
	cursor: pointer;
	text-decoration: underline;
	font-weight: bold;
	text-align: left;
	padding: 0;
}
.formyes{
	width: 100px;
}

input.formyes{
	
}

.formlink_hover{
	color: #414141;
	text-decoration: none;
}


/* In State Classes */

.stateoverview {
  background: #f2f2f2 url(../img/stateinfo_bg.gif) top left no-repeat;
  color: #515151;
  height: 51px;
  padding: 10px;
  position: relative;
  width: 698px;
}

.stateoverview h2 {
  font-size: 1.4em;
  font-weight: normal;
  margin: 8px 0 0 0;
}

.stateoverview .center {
  left: 120px;
  position: absolute;
}

.statecomparisions h1 {
  background: url(../img/icon_comparisons.gif) center left no-repeat;
  padding-left: 25px;
}

.specifications h1 {
  background: url(../img/icon_specifications.gif) center left no-repeat;
  padding-left: 25px;
}

.keydata h1 {
  background: url(../img/icon_keydata.gif) center left no-repeat;
  padding-left: 25px;
}

  /* Happiness */

.happiness {
  text-align: center;
  margin: 0 10px;
  width: 696px;
}

.happiness thead tr {
  background: #fff;
  font-size: .9em;
}

.happiness tbody td {
  border-right: 1px solid #d2d2d2;
}

.happiness tbody .extremists {
  border-right: none;
}

.happy {
  background: url(../img/happy.gif) center left repeat-x;
  border-top: 4px solid #FABE06;
}

.content {
  background: url(../img/content.gif) center left repeat-x;
  border-top: 4px solid #9AC24B;
}

.unhappy {
  background: url(../img/unhappy.gif) center left repeat-x;
  border-top: 4px solid #5098D6;
}

.extremists {
  background: url(../img/extremists.gif) center left repeat-x;
  border-top: 4px solid #393939;
}

.tspace td{
  border-bottom: 10px solid #cacaca;
}

.tipclass-tip {
  border: 1px solid #222;
  width: 200px;
}

.tipclass-title {
  background: orange;
  font-size: 1.1em;
  font-weight: bold;
  padding: 5px;
}

.tipclass-text {
  background: #e0e0e0;
  padding: 5px;
}

/* Tweaks */

.orangebox .boxheader, .playerbox .boxheader  {
  overflow: hidden;
}

.orangebox .boxbody {
  float: left;
}

* html #right {
  width: 243px;
}

* html .statebox thead td {
  background: url(../img/box_state_header_ie.gif) top left repeat-x;
  height: 17px;
}

* html .statebox tbody td {
  background: #fefefe;
  border: 1px solid #d2d2d2;
  border-width: 1px 1px 0 0;
  height: 16px;
}



.morph1 {
	background-color: #ccc;
	display: block;
}

.morph2 {
  background-color: #ff3300;
  display: none;
}

