/* Use default values for divs and images, so we will know what we start with at any given time */
div, img {
  margin: 0;
  padding: 0;
  border: none;
  background-color: transparent;
}

html, body {
  height:100%;				/* needed for container min-height */
}

body {
  background-color: #000000;
}

#mainBackground.defaultBG {
  background-image: url('../portal/portal2010_bg_main.jpg');  
  z-index: 1;
}

#mainBackground {

  background-repeat: no-repeat;
  background-position: center top;

 
  width: 100%;
  min-width: 980px;			/* In Non IE6-Browsers, force min width to make the background look good all the time */
  /*height: 893px;*/
  
  margin: 0 auto;			/* center, not in IE5 */
  height: auto !important;		/* real browsers */
  height: 100%;				/* IE6: treaded as min-height*/

  min-height: 100%;			/* real browsers */
  position: relative;
  top: 25px;

  font-family: Georgia, 'Palatino Linotype', 'Book Antiqua', 'Times New Roman', Times, serif;
  font-size: 16px ;
  color: #cbcfc1;

}

#header {
  height: 172px;
  width: 980px;
  margin: 0px auto;
  text-align: left;
  overflow: hidden;
}

#battlegroundsLogoAnim {
  margin-left: 89px;
  margin-top: 1px;
}

#footer {
  /*position: absolute;*/
  bottom: 0px;
  width: 100% !important;		/* Tell nice browsers to use full width */
  width: auto;				/* Tell IE6, which ignores !important, to not use full width, as it messes up the layout */
  padding-bottom: 10px;
  color: #FFFFFF;
  font-size: 0.8em;
  font-family: Georgia, 'Palatino Linotype', 'Book Antiqua', 'Times New Roman', Times, serif;
}

#welcomeMenu, #welcomeMenu a {
  background-image: url('../portal/welcome2010.gif');
  height: 74px;
  top: 164px;
  left: 800px;
}

#loginMenu, #loginMenu a {
  background-image: url('../portal/login2010.gif');
  height: 40px;
  top: 174px;
}

#regMenu, #regMenu a {
  background-image: url('../portal/reg2010.gif');
  height: 72px;
  top: 244px;
  left: 800px;
}

#storyMenu, #storyMenu a {
  background-image: url('../portal/story2010.gif');
  height: 74px;
  top: 164px;
  left: 0px;
}

#screenshotsMenu, #screenshotsMenu a {
  background-image: url('../portal/screenshots2010.gif');
  height: 40px;
  top: 194px;
}

#boardMenu, #boardMenu a {
  background-image: url('../portal/board2010.gif');
  height: 72px;
  top: 244px;
  left: 0px;
}

#welcomeMenu a, #loginMenu a, #regMenu a, #storyMenu a, #screenshotsMenu a, #boardMenu a {
  position: absolute;
  width: 175px;
  left: 0px;
  top: 0px;
}

#welcomeMenu, #loginMenu, #regMenu, #storyMenu, #screenshotsMenu, #boardMenu {
  width: 175px;
  position: absolute;
}

.hoverButton {
  background-position: top left;
  background-repeat: no-repeat;
}

.hoverButton:hover {
  background-position: bottom left;
}

#regWelcomeButton {
  background-image: url('../portal/regWelcomeButton2010.jpg');
  position: absolute;
  height: 168px;
  width: 361px;
  top: 33px;
  left: 7px;
}

.registerButton {
  background-image: url('../portal/registerButton2010.gif');
  height: 22px;
  width: 82px;
}

.loginButton {
  background-image: url('../portal/loginButton2010.gif');
  height: 22px;
  width: 82px;
}

.emailButton {
  background-image: url('../portal/emailButton.jpg');
  height: 35px;
  width: 147px;
}

#mailSend {
  position: absolute;
  top: 306px;
  left: 219px;
}

#loginSubmit {
  display: none;
}

#regSend {
  position: absolute;
  top: 448px;
  left: 175px;
}

#loginSend {
  position: absolute;
  top: 448px;
  left: 461px;
}

#selectServer {
  position: absolute;
  width: 140px;
  font-size: 0.7em;
  background-color: #6c5536;
  color: #000000;
}

#selectServer.login {
  top: 427px;
  left: 405px;
}

#selectServer.reg {
  top: 426px;
  left: 175px;
}

#selectServer:focus {
  background-color: #97784a;
}

input, select, option {
  font-family: Georgia, 'Palatino Linotype', 'Book Antiqua', 'Times New Roman', Times, serif;
}

input[type=text], input[type=password] {
  background-image: url('text_input_bg_2010.jpg');
  background-repeat: no-repeat;
  width: 124px;
  height: 18px;
  font-size: 0.9em;
  color: #222222;
  padding: 2px 3px 3px 10px;
  border: 0px;
  font-weight: bold;
}

/* Display input focus change in non IE6 */
input[type=text]:focus, input[type=password]:focus {
  background-image: url('text_input_bg_hover_2010.jpg');
}

#content {
  margin: 0px auto;
  width: 980px;
  height: 730px;
  position: relative;
}

#textContent {
  margin: 0px auto 0px 0px;
  position: relative;
  height: 474px;
  width: 565px;
  left: 192px;
  top: 3px;
  padding: 10px;
  overflow: auto;
  text-align: left;
  z-index: 10;
}

.textContentStory {
  background-repeat: no-repeat;
  background-position: left top;
  background-image: url('../portal/storyContent2010.jpg');
}

.textContentImprint {
  background-repeat: no-repeat;
  background-position: left top;
  background-image: url('../portal/imprintContent.jpg');
}

.textContentReg {
  background-repeat: no-repeat;
  background-position: left top;
  background-image: url('../portal/regContent2010.jpg');
}

.textContentRegSuccess {
  background-repeat: no-repeat;
  background-position: left top;
  background-image: url('../portal/regsuccessContent.jpg');
}

.textContentLogin {
  background-repeat: no-repeat;
  background-position: left top;
  background-image: url('../portal/loginContent2010.jpg');
}

.textContentComingsoon {
  background-repeat: no-repeat;
  background-position: left top;
  background-image: url('../portal/comingsoonContent.jpg');
}

#textContent, #textContent p {
  font-size: 1em;
}

p {
  margin: 0pt 0pt 1em;
}

h1 {
  font-weight: bold;
  font-size: 2em;
}

h2 {
  font-weight: bold;
  font-size: 1.5em;
}

#dl_name, #dl_em_1, #dl_pw_1 {
  position: absolute;
  left: 175px;
}

#name, #passwort {
  position: absolute;
  left: 405px;
}

#name {
  top: 377px;
}

#passwort {
  top: 402px;
}

#dl_name {
  top: 348px;
}

#dl_pw_1 {
  top: 374px;
}

#dl_em_1 {
  top: 400px;
}

.overflowHidden {
  overflow: hidden;
}

#lostPassword {
  position: absolute;
  text-align: right;
  top: 452px;
  right: 140px;
}

#lostPassword a {
  color: #222222;
  font-size: 0.6em;
  font-weight: bold;
}

#metadesc {
  color: #BBB5A5;
  font-size: 0.8em;
  width: 800px;
  margin: 0px auto 10px auto;
}

#screenshotLink1 {
  position: absolute;
  top: 545px;
  left: 97px;
}

#screenshotLink2 {
  position: absolute;
  top: 545px;
  left: 368px;
}

#screenshotLink3 {
  position: absolute;
  top: 545px;
  left: 640px;
}

.gbgSelectListHidden {
  display: none !important;
}

.gbgSelectList {
  display: block;
  position: absolute;
  margin: 0;
  padding: 1;
  width: 250px;
  z-index: 2500;
}

.gbgSelectList ul {
  list-style-image: none;
  list-style-position: outside;
  list-style-type: none;
  margin: 0;
  padding-left: 2px;
  padding-top: 2px;
  padding-right: 2px;
  overflow-x: hidden;
  overflow-y: auto;
  height: 200px;
}

.gbgSelectElementActive {
  /* Active Element in List */
}

.gbgSelectList ul li:hover {
  /* Hover Element in List */
}

.gbgSelectList ul li a:hover, .gbgSelectBox a:hover {
  text-decoration: none; /* Deactivate underline hover by default */
}

.gbgSelect * {
  z-index: 1000;
}

.gbgSelect {
  width: 250px;
}

.gbgSelectBox {
  border: 1px solid #666666;
  padding: 1px;
  background: transparent url('selectBoxArrow.png') no-repeat top left;
  height: 16px;
  display: block;
}

.gbgSelectBox a {
  line-height: 16px;
}

.gbgSelectBox:hover {
  background: transparent url('selectBoxArrow.png') no-repeat bottom left;
}

.gbgSelectList ul li {
  padding: 2px 0;
}

li.gbgSelectElementActive {
  /* Active Element in List */
}

/* Start Gamebar */

#gameBar {
  position: absolute;
  left: 0;
  top: 0;
  height: 25px;
  width: 100%;
  border-bottom: 1px solid #666666;
  font-weight: bold;
  font-family: Tahoma, Verdana, Arial, 'DejaVu Sans', 'Bitstream Vera Sans', Kalimati, Helvetica, sans-serif;
  font-size: 0.9em;
  z-index: 2;
}

#gameBar, #gameBar .gbgSelectList {
  background-color: #000000;
  border-bottom: 1px solid #666666;
}

#countrySelect {
  float: right;
}

#countrySelect, #countrySelect .gbgSelectList {
  width: 250px;
}

#countrySelect .gbgSelectList {
  border-bottom: 1px solid #666666;
  border-left: 1px solid #666666;
  border-right: 1px solid #666666;
}

#gameBar .gbgSelectElementActive {
  background-color: #333333 !important;
}

#gameBar .gbgSelectList ul li:hover {
  background-color: #333333 !important;
}

#gameBarContent {
  width: 800px;
  height: 22px;
  padding: 0;
  margin: 0 auto;
  position: relative;
}

#country {
  position: absolute;
  right: 100px;
  width: 400px;
  margin-top: 2px;
  height: 23px;
}

#country label {
  float: right;
  width: 135px;
  text-align: left;
  padding-left: 10px;
  line-height: 21px;
}