/* default css */
body {
  margin: 0;
  font: 12px Arial, Tahoma, Verdana, sans-serif;
  color: #ccc;
  overflow-y: scroll;
}

div, p { position: relative; }

table, tr, td, th { border: none; margin: 0; padding: 0; border-collapse: collapse; }
img { border: none; margin: 0; }
h1, h2, h3, h4, h5, h6, p, form { margin: 0; padding: 0;}
form { display: inline; }
hr { border: none; height: 1px; background-color: #000; margin: 0; }

h1 { font-size: 16px; }
h2 { font-size: 15px; }
h3 { font-size: 14px; }
h4 { font-size: 13px; }
h5 { font-size: 12px; }
h6 { font-size: 11px; }

.bold { font-weight: bold; }
.italic { font-style: italic; }

.ffDefault { font-family: Arial, Tahoma, Verdana, sans-serif; font-variant: normal; }
.ffTimes { font-family: "Times New Roman", serif; }
.smallCaps { font-variant: small-caps; }

.large { font-size: 14px; }
.norm { font-size: 12px; }
.small { font-size: 11px; }
.mini { font-size: 10px; }
.micro { font-size: 8px; }

.black { color: #000; }
.blue { color: #0341cf; }
.lightBlue { color: #6F6FF4; }
.green { color: #080; }
.greenDark { color: #050; }
.red { color: #800; }
.white { color: #fff; }
.yellow { color: #ffed5d; }
.grey { color: #555; }
.orange { color: #ffb514; }
.badRed { color: #f00; }
.poison { color: #0f0; }

.bgBlack { background-color: #000; }
.bgBlue { background-color: #252561; }
.bgGreen { background-color: #080; }
.bgGreenDark { background-color: #050; }
.bgRed { background-color: #800; }
.bgWhite { background-color: #fff; }
.bgYellow { background-color: #ffdc4c; }
.bgGrey { background-color: #555; }
.bgGreyDark { background-color: #333; }
.bgOrange { background-color: #ffb514; }

.borderBlack { border: 1px solid #000; }
.borderBlue { border: 1px solid #252561; }
.borderGreen { border: 1px solid #080; }
.borderRed { border: 1px solid #800; }
.borderWhite { border: 1px solid #fff; }
.borderYellow { border: 1px solid #ffdc4c; }
.borderYellow { border: 1px solid #555; }
.borderOrange { border: 1px solid #ffb514; }
.borderGrey { border: 1px solid #555; }

.borderTop { border-top: 1px solid #000; }
.borderBottom { border-bottom: 1px solid #000; }
.borderLeft { border-left: 1px solid #000; }
.borderRight { border-right: 1px solid #000; }

.borderTopGrey { border-top: 1px solid #555; }
.borderBottomGrey { border-bottom: 1px solid #555; }
.borderLeftGrey { border-left: 1px solid #555; }
.borderRightGrey { border-right: 1px solid #555; }

a { color: #bbb; text-decoration: none; outline: 0; }
a:active { color: #bbb; }
a:hover { color: #fff;}

.aYellow a { color: #ffdc4c; }
.aYellow a:active { color: #FFC337; }
.aYellow a:hover { color: #FFC337; }

.aWhite a { color: #fff; }
.aWhite a:active { color: #ccc; }
.aWhite a:hover { color: #ccc;}

.aBlack a { color: #000; }
.aBlack a:active { color: #ccc; }
.aBlack a:hover { color: #bd9e4c;}

.aGreen a { color: #080; }
.aGreen a:active { color: #fff; }
.aGreen a:hover { color: #fff;}

.aRed a { color: #800; }
.aRed a:active { color: #fff; }
.aRed a:hover { color: #fff;}

.aBlue a { color: #252561; }
.aBlue a:active { color: #6fa9ac; }
.aBlue a:hover { color: #bd9e4c;}

.aGold a { color: #bd9e4c; }
.aGold a:active { color: #bd9e4c; }
.aGold a:hover { color: #ccc;}

.aOrange a { color: #ffb514; }
.aOrange a:active { color: #bd9e4c; }
.aOrange a:hover { color: #ccc;}

.aOrangeUnderlined a {
  color: #ffb514;
  text-decoration: underline;
}
.aOrangeUnderlined a:active { color: #bd9e4c; }
.aOrangeUnderlined a:hover { color: #ccc;}

.center { text-align: center; }
.left { text-align: left; }
.right { text-align: right; }

.bottom { vertical-align: bottom; }
.middle { vertical-align: middle; }
.top { vertical-align: top; }

.floatLeft { float: left; }
.floatRight { float: right; }

.abs { position: absolute; }
.rel { position: relative; }

.clear {
  clear: both;
  line-height: 0px;
}

.spacer {
  margin-top: 3px;
  line-height: 1px;
}

ul { margin: 0; padding: 0; list-style-type: none; }
li { margin: 0; padding: 0; }
ul.floatLeft li { float: left; }

.cursorPointer { cursor: pointer; }

.tdPadding td { padding: 2px; }
.tdBigPadding td { padding: 5px; }
.tdNoPadding td { padding: 0px; }

.t25 { opacity:.25; -moz-opacity: 0.25; filter: alpha(opacity=25); }
.t45 { opacity:.45; -moz-opacity: 0.45; filter: alpha(opacity=45); }
.t50 { opacity:.50; -moz-opacity: 0.50; filter: alpha(opacity=50); }
.t75 { opacity:.75; -moz-opacity: 0.75; filter: alpha(opacity=75); }



div.fix { position: fixed; }

.aButtonStart a       { background: url("/img/index/start.jpg"); background-position: top;
                        width: 339px; height: 87px; cursor: pointer; display: block; }
.aButtonStart a:hover { background-position: bottom; }

div.scrollbar   { background: url("/img/index/scrollbar.png") no-repeat right; }

div#error { border: 1px solid #fff; background-color: #800; color:#fff; padding: 3px; text-align: left; }

/* Browserleiste */
#nav_browser {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 42px;
  background: url("/img/browser/bg_browser.png");
  color: #000;
  line-height: 42px;
}

#nav_browser > a {
  background: url("/img/browser/sprite_browser.png");
  float: left;
  height: 42px;
  width: 54px;
}

#nav_browser > a.back           { width: 48px; background-position: 0 0; }
#nav_browser > a.back:hover     { background-position: 0 -42px; }
#nav_browser > a.forward        { width: 36px; background-position: -48px 0; }
#nav_browser > a.forward:hover  { background-position: -48px -42px; }
#nav_browser > a.reload         { width: 36px; background-position: -84px 0; }
#nav_browser > a.reload:hover   { background-position: -84px -42px; }

#nav_browser > a.facebook       { margin-left: 10px; width: 46px; background-position: -120px 0; }
#nav_browser > a.facebook:hover { background-position: -120px -42px; }

#nav_browser > a.vspacer        { width: 8px; background-position: -160px 0; }

#nav_browser > a.payment        { background-position: -222px 0; }
#nav_browser > a.payment:hover  { background-position: -222px -42px; }
#nav_browser > a.forum          { background-position: -330px 0; }
#nav_browser > a.forum:hover    { background-position: -330px -42px; }
#nav_browser > a.support        { background-position: -492px 0; }
#nav_browser > a.support:hover  { background-position: -492px -42px; }
#nav_browser > a.settings       { background-position: -168px 0; }
#nav_browser > a.settings:hover { background-position: -168px -42px; }
#nav_browser > a.rules          { background-position: -438px 0; }
#nav_browser > a.rules:hover    { background-position: -438px -42px; }
#nav_browser > a.help           { background-position: -546px 0; }
#nav_browser > a.help:hover     { background-position: -546px -42px; }
#nav_browser > a.chat           { background-position: -276px 0; }
#nav_browser > a.chat:hover     { background-position: -276px -42px; }
#nav_browser > a.rankings       { background-position: -385px 0; }
#nav_browser > a.rankings:hover { background-position: -385px -42px; }

#showLoading {
  float: left;
  margin-left: 35px;
  font-weight: bold;
}

#showConfirmationHint {
  float: left;
  margin-left: 35px;
}

#showConfirmationHint > a { font-weight: bold; color: #800; }

#nav_browser > div.logout { float: right; margin-right: 25px; }
#nav_browser > div.logout > a { font-weight: bold; color: #000; }


/* Navi */
div#navHead { padding-left: 281px; }

#navHead a.aDistrict  { background: url('/img/nav/bg_nav_district.jpg'); background-position: bottom; }
#navHead a.aMap       { background: url('/img/nav/bg_nav_world.jpg'); background-position: bottom; }
#navHead a.aMain      { background: url('/img/nav/bg_nav_main.jpg'); background-position: bottom; }
#navHead a.aStart     { background: url('/img/nav/bg_nav_start.jpg'); background-position: bottom; }
#navHead a.aFamily    { background: url('/img/nav/bg_nav_family.jpg'); background-position: bottom; }
#navHead a.aGroup     { background: url('/img/nav/bg_nav_group.jpg'); background-position: bottom; }
#navHead a.aExtras    { background: url('/img/nav/bg_nav_extras.jpg'); background-position: bottom; }

#navHead a { display: block; width: 55px; height: 55px; float: left; margin: 2px 5px 0 0; }
#navHead a:hover { background-position: top; }
#navHead p { text-align: center; padding-top: 55px; }


#feedbackErrContainer, #feedbackMsgContainer {
  display: none;
  border: 1px solid #555;
  box-shadow: 2px 2px 15px #000;
  background: url("/img/box/bg_content.jpg");
}

/* Formulare */
input, select {
  background: url("/img/form/input.jpg") #bbb;
  border: solid 1px #ccc;
  color: #000;
}

@media (-webkit-min-device-pixel-ratio: 0) {
  select {
    background: #bbb;
  }
}

option {
  color: #000;
  background: #bbb;
}

input[type=checkbox], input[type=radio] {
  background: transparent;
  border: 0;
}

textarea {
  background: #bbb;
  border: solid 1px #ccc;
  color: #000;
  resize: none;
}

input.formButtonRed        { background: url("/img/form/send_red.png"); border: solid 1px #ccc; color: #fff;
                                  font-size: 12px; height: 24px; cursor: pointer; }
input.formRegisterButtonRed{ background: url("/img/form/send_red.png"); border: solid 1px #ccc; color: #fff;
                                  font-size: 16px; height: 30px; font-family: "Times New Roman", serif;
                                  font-variant: small-caps; cursor: pointer; width: 520px;
                                }
input.formButtonBlue       { background: url("/img/form/send_blue.png"); border: solid 1px #ccc; color: #fff;
                                  font-size: 12px; height: 24px; cursor: pointer; }
input.formButtonGreen      { background: url("/img/form/send_green.png"); border: solid 1px #ccc; color: #fff;
                                  font-size: 12px; height: 24px; cursor: pointer; }
input.formButtonOrange     { background: url("/img/form/send_orange.png"); border: solid 1px #ccc; color: #fff;
                                  font-size: 12px; height: 24px; cursor: pointer; }
input.bigButton            { font-size: 16px; height: 30px; font-family: "Times New Roman", serif; font-variant: small-caps; }

input.formButtonUpgrade    { background: url("/img/form/send_upgrade.png"); border: solid 1px #ccc; color: #000;
                                  font-size: 20px; height: 40px; width: 375px; cursor: pointer;
                                  font-family: "Times New Roman", serif; font-variant: small-caps; font-weight: bold; }
input.formButtonDowngrade  { background: url("/img/form/send_down.png"); border: solid 1px #ccc; color: #fff;
                                  font-size: 18px; height: 30px; width: 375px; cursor: pointer;
                                  font-family: "Times New Roman", serif; font-variant: small-caps; font-weight: bold; }

/* Eine gleichförmige liste von Formularelementen */
ul.formRight                      {   }
ul.formRight li                   { height: 20px; line-height: 20px; margin: 2px 0; }
ul.formRight li span              { float: left; text-align: right; width: 40%; color: #fff; font-weight: bold; }
ul.formRight li input, li select  { float: right; width: 57%;  }

/* Links like FormSends */
.aButtonRed a       { background: url("/img/form/send_red.png"); border: solid 1px #ccc; color: #fff; font-size: 12px; width: 99%; height: 24px; line-height: 24px; text-align: center; margin: 0 auto; cursor: pointer; display: block; }
.aButtonRed a:hover { border: solid 1px #fff; color: #ffb514; }
.aButtonBlue a        { background: url("/img/form/send_blue.png"); border: solid 1px #ccc; color: #fff; font-size: 12px; width: 99%; height: 24px; line-height: 24px; text-align: center; margin: 0 auto; cursor: pointer; display: block; }
.aButtonBlue a:hover  { border: solid 1px #fff; color: #ffb514; }
.aButtonGreen a       { background: url("/img/form/send_green.png"); border: solid 1px #ccc; color: #fff; font-size: 12px; width: 99%; height: 24px; line-height: 24px; text-align: center; margin: 0 auto; cursor: pointer; display: block; }
.aButtonGreen a:hover { border: solid 1px #fff; color: #ffb514; }
.aButtonOrange a        { background: url("/img/form/send_orange.png"); border: solid 1px #ccc; color: #fff; font-size: 12px; width: 99%; height: 24px; line-height: 24px; text-align: center; margin: 0 auto; cursor: pointer; display: block; }
.aButtonOrange a:hover  { border: solid 1px #fff; color: #000; }

.aBigButton a       { background: url("/img/form/send_red.png"); border: solid 1px #ccc; color: #fff;
                      display: block; margin: 0 auto; text-align: center;
                      font-size: 16px; height: 30px; line-height: 26px; font-family: "Times New Roman", serif; font-variant: small-caps; }
.aBigButton a:hover { border: solid 1px #fff; color: #ccc; }

.menu a       { background: url('/img/form/send_nav.jpg'); display: block;
                width: 165px; height: 24px; line-height: 24px; padding-left: 8px;
                color: #000; font-weight: bold;  }
.menu a:hover { background: url('/img/form/send_nav_over.jpg'); }

/* Noch mehr Links, diesmal kleiner und als Liste */
ul.buttons li a  { background: url("/img/form/send_green.png"); border: solid 1px #ccc; color: #fff;
                   margin: 0 auto; margin-bottom: 1px; cursor: pointer; display: block;
                   text-align: center; font-size: 10px; height: 14px; line-height: 14px; }
ul.buttons li.green a     { background: url("/img/form/send_green.png"); }
ul.buttons li.red a     { background: url("/img/form/send_red.png"); }
ul.buttons li.blue a      { background: url("/img/form/send_blue.png"); }
ul.buttons li.yellow a    { background: url("/img/form/send_orange.png"); }
ul.buttons li a:hover         { border: solid 1px #fff; color: #ffb514; }
ul.buttons li.yellow a:hover  { border: solid 1px #fff; color: #000; }

/* Die lieben Boxen */
.box              { border: 1px solid #000; text-align: left; }
.box p.title      { background: url("/img/box/bg_title.jpg");
                    height: 42px; line-height: 40px; font-size: 20px; padding-left: 10px;
                    font-family: "Times New Roman", serif; font-variant: small-caps; font-weight: bold; }
.box p.subtitle   { background: url("/img/box/bg_subtitle.jpg"); font-family: "Times New Roman", serif;
                    height: 25px; line-height: 18px; font-size: 12px; padding-left: 5px; padding-right: 5px; }
.box div.content  { background: url("/img/box/bg_content.jpg"); padding: 5px 15px 10px 15px; }

.boxNav           { width: 203px; text-align: left; margin: 0 auto; }
.boxNav .title    { background: url("/img/box/bg_nav_title.png") no-repeat;
                    height: 47px; line-height: 40px; font-size: 20px; padding-left: 35px;
                    font-family: "Times New Roman", serif; font-variant: small-caps; font-weight: bold; }
.boxNav .content  { background: url("/img/box/bg_nav_content.png"); padding: 5px 15px 0px 15px;  }
.boxNav .bottom   { background: url("/img/box/bg_nav_bottom.png") no-repeat; height: 27px; }

.boxNews            { width: 725px; text-align: left; }
.boxNews .title     { background: url("/img/box/bg_news_title.jpg") no-repeat; height: 77px;  }
.boxNews .content   { background: url("/img/box/bg_news_content.jpg"); color: #000; padding: 5px 50px 15px 50px; }
.boxNews .bottom    { background: url("/img/box/bg_news_bottom.png") no-repeat; left: 0px; top: -20px; height: 33px; }
.newsSpacer         { background: url("/img/box/spacer_news.png"); width: 100%; height: 27px; margin: 0 auto; }
.boxNews h1         { font-family: "Times New Roman"; font-size: 20px; margin: 6px 0;  }

div.message   { background: #333; color: #fff; border: 1px solid #555; padding: 5px; }
.message img  { width: 50px; height: 50px; margin-right: 5px; text-align: left; }
.message a    { color: #fff;  }

h3.subtitle   { background: url("/img/box/bg_subtitle.jpg"); font: 16px/18px "Times New Roman", serif;
                border-top: 1px solid #333; margin-top: 6px; white-space: nowrap;
                height: 25px; padding: 0 5px; }

div.subBox            { padding: 5px; background-color: #333; border: 1px solid #555; }
table.subBox td       { background-color: #333; }
table.subBox td.noBg    { background: none; }
table.subBox tr.noBg td { background: none; }
tr.highlight td       { background-color: #800; }
table.tdBorderLeft td { border-left: 1px solid #555; }

/* Pager-Formatierung */
a.pagerLinks { font-weight: bold; color: #ccc; }
a.pagerLinks:hover { color: #fff; border-bottom: 1px dotted #fff; }
a.pagerLinks.prev { margin-right: 8px; }
a.pagerLinks.curr { color: #fff; border-bottom: 1px dotted #fff; }
a.pagerLinks.gap { margin: 0 5px; }
a.pagerLinks.next { margin-left: 8px; }

/* Stadt-Karte */
tr.trOdd { background-color: #333; border: 1px solid #555; }
tr.trEven { }

/* ------------------------------ */
table.coinItems td    { height: 35px; }
table.coinItems td a  { background: url('/img/coinItems/sprite.jpg') no-repeat left top;
                        display: block; margin: 0 auto;
                        width: 35px; height: 35px;
                        cursor: pointer; }
table.coinItems td a.empty        {  background-position: 0 0; }
table.coinItems td a.empty:hover  { background-position: 0 -35px; }
table.coinItems td a.alcohol    { background-position: -35px 0; }
table.coinItems td a.drugs      { background-position: -70px 0; }
table.coinItems td a.money      { background-position: -105px 0; }
table.coinItems td a.visitors   { background-position: -140px 0; }
table.coinItems td a.depot      { background-position: -175px 0; }
table.coinItems td a.speed      { background-position: -210px 0; }
table.coinItems td a.wareMax    { background-position: -245px 0; }
table.coinItems td a.power      { background-position: -35px -35px; }
table.coinItems td a.stamina    { background-position: -70px -35px; }
table.coinItems td a.health     { background-position: -105px -35px; }
table.coinItems td a.seconds    { background-position: -140px -35px; }
table.coinItems td a.person     { background-position: -175px -35px; }
table.coinItems td a.vehicle    { background-position: -210px -35px; }
table.coinItems td a.badPrestige{ background-position: -245px -35px; }
table.coinItems td a.protection   { background-position: -280px 0px; }

div.coinItems50 a  { background: url('/img/coinItems/sprite50.jpg') no-repeat left top;
                     display: block; margin: 1px;
                     width: 50px; height: 50px;
                     cursor: pointer; }
div.coinItems50 a.empty       { background: url('/img/coinItems/bg50.jpg') no-repeat left top;
                                display: block; margin: 1px;
                                width: 50px; height: 50px;
                                cursor: pointer; }
div.coinItems50 a.alcohol     { background-position: -0px 0; }
div.coinItems50 a.drugs       { background-position: -50px 0; }
div.coinItems50 a.money       { background-position: -100px 0; }
div.coinItems50 a.visitors    { background-position: -150px 0; }
div.coinItems50 a.depot       { background-position: -200px 0; }
div.coinItems50 a.speed       { background-position: -250px 0; }
div.coinItems50 a.wareMax     { background-position: -300px 0; }
div.coinItems50 a.power       { background-position: -350px 0; }
div.coinItems50 a.stamina     { background-position: -400px 0; }
div.coinItems50 a.health      { background-position: -450px 0; }
div.coinItems50 a.seconds     { background-position: -500px 0; }
div.coinItems50 a.person      { background-position: -550px 0; }
div.coinItems50 a.vehicle     { background-position: -600px 0; }
div.coinItems50 a.badPrestige { background-position: -650px 0; }
div.coinItems50 a.protection    { background-position: -700px 0; }

div.coinItems50 a.aButtonOrange       { background: url("/img/form/send_orange.png"); border: solid 1px #ccc; color: #fff; font-size: 12px; width: 99%; height: 24px; line-height: 24px; text-align: center; margin: 0 auto; cursor: pointer; display: block; }
div.coinItems50 a.aButtonOrange:hover { border: solid 1px #fff; color: #000; }

#overDiv {
  position: fixed;
  left: 0;
  top: 0;

  float: left;
  text-align: left;
  display: none;
  border: solid 1px #000;
  background: #fff;
  color: #000;
  font: 12px "Lucida Grande", Tahoma, sans-serif;
  padding: 2px 3px;
  -moz-box-shadow: 2px 3px 2px #000;
  -moz-border-radius: 4px;
  overflow: hidden;
}

/* new footer */
#divFooterLeft { float: left; width: 200px; }
#divFooterRight { float: right; width: 200px; }
#divFooterCenter { float: left; width: 510px; }

#indexBody {
  background-color: #000;
  color: #eee;
}

#insideBody{
  background-color: #000;
  /*text-align: center;*/
}

.boxNews .content a { color: #c00; }
.boxNews .content a:hover { color: #000; }

/* closing link */
a.close {
  display: block;
  position: absolute;
  background: url("/img/site/close.png") no-repeat scroll 0 0 transparent;
  height: 20px;
  right: 10px;
  top: 6px;
  width: 20px;
}
a.close:hover { background-position: 0 -21px; }

.hidden { display: none; }

div.upgradeIcon { position: absolute; width: 50px; height: 50px; }
div.upgradeIcon:hover { background-image: url('/img/icons/i_upgrade.png'); }
div.upgradePushIcon { position: absolute; width: 50px; height: 50px; }
div.upgradePushIcon:hover { background-image: url('/img/icons/i_upgrade_push.png'); }