/* Der HTML-Body Tag des Battlegrounds Layout. Globale Hintergrundbilder und globale Ausrichtung
 * (left, right, center) des Inhalts sollten hier festgelegt werden. Die Schriftartendefinierung
 * bringt nur wenig, da die meisten Texte nochmals gekapselt sind (in Tabellen oder weiteren div's) */
body {
  background-color: black;

  color: #FFFFFF;
  font-family: Tahoma, Verdana, Arial, 'DejaVu Sans', 'Bitstream Vera Sans', Kalimati, Helvetica, sans-serif;
  font-size: 12px;

  margin: 0px;
  padding: 0px;
  text-align: center;
}

/**
  * Werbedivs ganz weit vorne bitte :)
  */
body > div {
  z-index: 10200;
}

/**
  * RTL/LTR-aligned Text and margins. 
  */
.alignedTextL {
  text-align: left;
}

.alignedTextR {
  text-align: right;
}

.alignedMarginR {
  margin-right: 15px; 
}

.alignedMarginL {
  margin-left: 15px; 
}

.floatL {
  float: left;
}

.floatR {
  float: right;
}

/* END OF RTL/LTR CSS */

/* Generell gilt für DIVs, dass der Hintergrund nicht wiederholt wird und das Bild links oben positioniert wird */
div {
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: 0px 0px;
  background-color: transparent;

  border: 0px;
}

/* Zentrierte Objekte */
.center {
  width: 100%;
  text-align: center;
  margin: 0px auto;
}

/* Highlight link targets :) */
div:target {
  border: 2px solid tomato;
  padding: 3px;
}

/* Das Haupt-div von DL4, bestimmt wie breit der Inhalt ist, wie hoch und welche äusseren und inneren
 * Ränder vorhanden sein sollen. Hier mit kann das Design beispielweise eine feste Breite zugewiesen bekommen. */
#dl4All {
  position: absolute;
  width: 100%;
  left: 0px;
  border: 0px;
  padding: 0px;
  margin: 0px;
}

/*
 * Der Kopfbereich von DL4
 */
#dl4TopArea {
  visibility: hidden;
  background-image: url('dl4toparea.gif');
  background-position: left top;
  position: absolute;
  left: 0px;
  width: 1035px;
  max-width: 1035px;
  height: 180px;
  margin: 0px auto;
  padding: 0px;
  z-index: 10097;
}

#myxtaorchat {
  position: absolute;
  top: 19px;
  left: 123px;
}

#mysettings {
  position: absolute;
  top: 97px;
  left: 182px;
}

#psearch {
  position: absolute;
  top: 97px;
  left: 653px;
}

#mybuddies {
  position: absolute;
  top: 19px;
  left: 716px;
}

#dl4ControlButtons img {
  margin-top: 1px;
}

/* Der Hauptcontainer für die Ressourcenanzeige. Dieser wird zu allerletzt geladen (damit die Ressourcenanzeige immer aktuell ist).
 * Daher empfiehlt sich eine absolute Positionierung. Sind dieser und der folgende Block breit genug ist auch eine
 * horizontale statt Tabellenförmige Ressourcenanzeige möglich */
#dl4Res, #dl4Eggs {
  background-image: url('dl4ressources.gif');
  position: absolute;
  width: 170px;
  height: 125px;
  margin: 0px;
  padding: 0px;
  z-index: 10102;
  left: 0px;
  top: 20px;
}


#dl4ResMover, #dl4EggMover {
  width: 170px;
  height: 20px;
  cursor: move;
}

/* Ein Hilfscontainer der die Ressourceninformationen enthält. In ihm enthalten sind 5 einzelne Container, für
 * die einzelnen Ressourcen, die im Einzelnen folgen. Im Standarddesign ist dieses Div im Ressourcen-div zentriert und
 * etwas weniger breit. */
#dl4ResContainer, #dl4EggContainer {
  width: 160px;
  margin: 3px 0px 0px 7px;
  border: 0px;
  padding: 0px;
}

/* Ressourcensymbol und Name werden in diesem div angezeigt */
.dl4ResIconname, .dl4EggIconname {
  width: 85px;
  padding: 2px 0px 0px 0px;
  margin: 0px;
  float: left;
  text-align: left;
  font-weight: bold;
  font-size: 12px;
  font-family: Tahoma, Verdana, Arial, 'DejaVu Sans', 'Bitstream Vera Sans', Kalimati, Helvetica, sans-serif;
}

/* In diesem div wird nur der Ressourcenwert der aktiven Siedlung angezeigt */
.dl4ResValue, .dl4EggValue {
  width: 70px;
  padding: 0px;
  margin: 0px;
  margin-top: 1px;
  float: left;
  text-align: right;
  line-height: 18px;
  font-size: 12px;
  font-family: Tahoma, Verdana, Arial, 'DejaVu Sans', 'Bitstream Vera Sans', Kalimati, Helvetica, sans-serif;
}

.dl4EggValue {
  width: 50px;
}

.dl4EggIconname {
  width: 155px;
}

#dl4Eggs {
  background-image: url('dl4ressourceslarge.gif');
  visibility: hidden;
  width: 220px;
}

#dl4EggMover {
  width: 220px;
}


#dl4EggContainer {
  width: 210px;
}

/* Werbebanner 468x60 px  */
#dl4Ads {
  position: absolute;
  top: 5px;
  left: 50px;
  border: 1px solid white;
  width: 468px;
  height: 60px;
  margin: 0px;
  padding: 0px;
}

/* Das Hauptmenü von DL4 wird in in diesem div dargestellt. */
#dl4MainMenu {
  background-image: url('dl4menu.gif');
  position: absolute;
  top: 165px;
  left: 8px;
  text-align: center;
  width: 152px;
  height: 485px;
  margin: 0px;
  padding: 0px 0px 0px 0px;
  z-index: 10102;
  font-size: 11px;
  font-family: Tahoma, Verdana, Arial, 'DejaVu Sans', 'Bitstream Vera Sans', Kalimati, Helvetica, sans-serif;
}

#dl4MainMenuTop {
  height: 48px;
  /*No dragging for now -- cursor: move;*/
  font-weight: bold;
  padding-top: 1px;
  font-size: 14px;
}

/* Schriftstil der Links im Hauptmenü */
#dl4MainMenu a {
  font-weight: bold;
}

/* Eine Menüzeile des neuen DL4-Menüs */
.dl4MenuRow {
  visibility: hidden;
  z-index: 10103;
  position: absolute;
}

/* Schriftstyle der Hoverlinks im Hauptmenü und im Tutorial-Bereich */
.dl4WideWindowContent a:hover, #dl4MainMenu a:hover {
  color: #E5DECC;
  background-color: transparent;
}

/* Schriftstyle für den IGM-Link, falls neue Nachrichten eingetroffen sind */
.dl4newIGMlink {
  color: tomato;
}

/*
 * Auf Knopfdruck erscheinen wichtige Links aus der Anleitung oder für andere Bereiche. Dieser Bereicht sollte standardmäßig nicht
 * sichtbar sein (display: none;) */
#dl4InstructionLinks {
  background-image: url('dl4helpthingie.gif');
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: 0px 0px;
  visibility: hidden;
  position: absolute;
  top: 10px;
  left: 50px;
  width: 170px;
  height: 40px;
  border: 0px;
  text-align: left;
  padding: 10px;
  z-index: 10104;
}

#dl4HighlightBig {
  width: 80px;
  height: 80px;
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: 10112;
}

.highlightBigDownUnvisited {
  background-image: url('../grafikpack-full/stuff/tutorial_pointer_big_down.gif');
}

.highlightBigDownVisited {
  background-image: url('../grafikpack-full/stuff/tutorial_pointer_big_down_a.gif');
}

.highlightBigLeftUnvisited {
  background-image: url('../grafikpack-full/stuff/tutorial_pointer_big_left.gif');
}

.highlightBigLeftVisited {
  background-image: url('../grafikpack-full/stuff/tutorial_pointer_big_left_a.gif');
}

.highlightBigRightUnvisited {
  background-image: url('../grafikpack-full/stuff/tutorial_pointer_big_right.gif');
}

.highlightBigRightVisited {
  background-image: url('../grafikpack-full/stuff/tutorial_pointer_big_right_a.gif');
}

.highlightBigUpUnvisited {
  background-image: url('../grafikpack-full/stuff/tutorial_pointer_big_up.gif');
}

.highlightBigUpVisited {
  background-image: url('../grafikpack-full/stuff/tutorial_pointer_big_up_a.gif');
}


/**
  * CSS-Deklaration für einzelne Kartenteile
  */
#dl4DetailMap div, .detailMap div {
  width: 20px;
  height: 20px;
  padding: 0px;
  border: 0px;
  position: absolute;
}


#dl4MapInfo {
  background-image: url('dl4mapinfo.gif');
  width: 220px;
  height: 503px;
  margin: 0px;
  padding: 0px;
  position: absolute;
  z-index: 10104;
  width: 220px;
  left: 65%;
  top: 250px;
}

#dl4MapInfoTop {
  width: 220px;
  height: 20px;
  margin: 0px;
  padding: 0px;
  cursor: move;
}

#dl4Area, #dl4BuildingPlace {
  background-color: transparent;

  position: absolute;
  overflow: hidden;
  z-index: 0;
}

/* DIV das eingeblendet wird, wenn Gebäude zu platzieren sind */
#dl4BuildingPlace {
  background-color: transparent;
  width: 100%;
  z-index: 9049;
  left: 0px;
  top: 0px;
}

/* Der Hauptcontent von DL4 findet sich in diesem Fenster.  */
#dl4MainContent {
  background-image: url('bg_dark.jpg');
  background-repeat: repeat;
  position: absolute;
  /*  min-width: 800px;
  max-width: 1200px;*/
  top: 170px;
  left: 155px;
  right: 185px;
  padding: 0px 0px 15px 0px;
  margin: 0px;
  border: 0px;
  min-height: 30px;
  text-align: center;
  width: expression((document.body.offsetWidth - 350) + 'px');
  background-color: transparent;
  border: 3px ridge #888888;
  -moz-border-radius: 5px;
  z-index: 10095;
  color: #FFFFFF;
  font-family: Tahoma, Verdana, Arial, 'DejaVu Sans', 'Bitstream Vera Sans', Kalimati, Helvetica, sans-serif;
  font-size: 12px;

}

#dl4BuildMain {
  width: 280px;
  height: 164px;
  border: 0px;
  position: absolute;
  left: 0px;
  top: 0px;
}

.buildingDetail {
  display: none;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 110px;
  height: 149px;
  overflow: hidden;
  text-align: center;
  padding: 15px 0px 0px 170px;
  z-index: 10051;
}

.unitDetail {
  display: none;
  width: 300px;
  text-align: center;
}

.techTreeDetail {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 280px;
  height: 119px;
  overflow: hidden;
  text-align: center;
  padding: 45px 0px 0px 0px;
  z-index: 10051;
}


a.buildSelect {
  margin: 8px 5px 0px 5px;
}

#dl4BuildSelect {
  position: absolute;
  left: 280px;
  height: 164px;
  padding-top: 9px;
}

#dl4BuildSelect a:hover {
  text-decoration: none;
}

.dl4Placer {
  position: absolute;
  z-index: 10096;
  -moz-opacity: 0.5;
  opacity: 0.5;
  filter: alpha(opacity=50);
}

/**
  * Objekte die einen Raum einnehmen werden beim Gebäudebau entsprechend gekennzeichnet
  */
.dl4Objspace {
  -moz-opacity: 0.4;
  opacity: 0.4;
  filter: alpha(opacity=40);
  display: none;
}

/**
  * Objekte die einen Raum einnehmen und nicht "überbaut" werden können, werden rot markiert
  */
.dl4Hardspace {
  background-color: tomato;
}

/**
  * Objekte die einen Raum einnehmen, aber durch Platzieren eines anderen Objektes automatisch gelöscht werden, haben einen "softspace" und sind entsprechend gekennzeichnet beim Bau
  */
.dl4Softspace {
  background-color: greenyellow;
}


/* Button zum minimieren des Hauptcontent-Bereichs */
#dl4Minimizer {
  position: absolute;
  margin: 0px;
  padding: 0px;
  top: 2px;
  right: 2px;
  width: 36px;
  height: 36px;
  background-color: transparent;
  cursor: pointer;
  z-index: 10096;
}

#user_erz, #user_holz, #user_nahrung, #user_gold, #user_silber {
  width: 100px;
  font-size: 12px;
  padding: 2px 0px 0px 4px;
  font-weight: bold;
  text-align: left;
}

#erzgfx {
  position: absolute;
  left: 75px;
  top: 57px;
}

#user_erz {
  position: absolute;
  left: 98px;
  top: 58px;
}

#goldgfx {
  position: absolute;
  left: 63px;
  top: 77px;
}
#user_gold {
  position: absolute;
  left: 86px;
  top: 80px;
}

#holzgfx {
  position: absolute;
  left: 51px;
  top: 97px;
}
#user_holz {
  position: absolute;
  left: 74px;
  top: 100px;
}

#nahrunggfx {
  position: absolute;
  left: 39px;
  top: 117px;
}
#user_nahrung {
  position: absolute;
  left: 62px;
  top: 120px;
}

#silvergfx {
  position: absolute;
  left: 27px;
  top: 137px;
}
#user_silber {
  position: absolute;
  left: 50px;
  top: 140px;
}

/* Button zum maximieren des Hauptcontent-Bereichs */
#dl4Maximizer {
  visibility: hidden;
  position: absolute;
  margin: 0px;
  padding: 0px;
  top: 120px;
  left: 900px;
  width: 36px;
  height: 36px;
  background-color: transparent;
  cursor: pointer;
}

/* Logoutbutton */
#dl4Logout {
  position: absolute;
  margin: 0px;
  padding: 0px;
  top: 100px;
  left: 453px;
  width: 64px;
  height: 67px;
  background-color: transparent;
  cursor: pointer;
}

/* Notizblock-Tooltip */
#dl4Notepad {
  width: 60%;
  top: 50px;
  min-height: 150px;
  z-index: 10105;
}


/* Der Notizblock-Content, der angezeigt wird, sobald das Notizblock-Icon angeklickt wird */
#dl4Notes {
  background-color: transparent;
  background-image: url('notes.gif');
  background-repeat: no-repeat;

  position: absolute;
  z-index: 10106;
  display: none;
  width: 550px;
  height: 550px;
  border: 0px;
  top: 50px;
  left: 250px;
}

/* Titel des Notizblock, der auch gleichzeitig Bewegungs-Leiste ist */
#dl4NoteMover {
  text-align: center;
  margin-bottom: 10px;
  width: 100%;
  cursor: move;  
}

/* Der Spellbook-Content, der angezeigt wird, sobald eine Forschung angeklickt wird */
#dl4Spellbook {
  background-color: transparent;
  background-image: url('spellbook.gif');
  background-repeat: no-repeat;

  position: absolute;
  z-index: 10104;
  width: 350px;
  height: 450px;
  border: 0px;
  padding: 0px;
  top: 200px;
  left: 200px;
}

#dl4SpellbookMover {
  height: 25px;
  width: 100%;
  cursor: move;
}


#dl4SpellbookContent {
  margin: 0px 25px 0px 25px;
  text-align: left;
  overflow: auto;
  height: 400px;
}

.dl4Statusmsg {
  display: none;
}

.dl4StatusControls {
  width: 450px;
  height: 30px;
  position: absolute;
  top: 20px;
  left: 25px;
}

.dl4PreviousStatusmsg {
  position: absolute;
  left: 179px;
  top: 0px;
  z-index: 10105;
  visibility: hidden;
  cursor: pointer;
}

.dl4MarkStatusRead {
  position: absolute;
  left: 232px;
  top: 0px;
  z-index: 10105;
  cursor: pointer;
}

.dl4NextStatusmsg {
  position: absolute;
  left: 284px;
  top: 0px;
  z-index: 10105;
  visibility: hidden;
  cursor: pointer;
}


/* Der Bereich in dem der Tutorial-Text angezeigt wird (außen) */
#dl4Tutorial {
  background-color: transparent;
  background-image: url('dl4tutorial.gif');
  background-repeat: no-repeat;

  position: absolute;
  z-index: 10111;
  width: 500px;
  height: 141px;
  padding: 0px 25px 25px 25px;
  border: 0px;
  top: 5px;
  left: 250px;
}

#dl4Status, .dl4CycleMessageWindow {
  background-color: transparent;
  background-image: url('dl4statusmsg.gif');
  background-repeat: no-repeat;

  position: absolute;
  z-index: 10111;
  width: 500px;
  height: 241px;
  padding: 0px 25px 25px 25px;
  border: 0px;
  left: 20%;
  top: 100px;
}


#dl4TutorialContent, #dl4StatusContent, .dl4CycleMessageContent {
  margin: 0px;
  width: 500px;
  height: 116px;
  border: 0px;
  overflow: auto;
  z-index: 10111;
  text-align: left;
  color: #BBB5A5;
}

#dl4StatusContent, .dl4CycleMessageContent {
  margin-top: 40px;
  height: 176px;
}

#dl4Status.large {
  background-color: transparent;
  background-image: url('dl4statusmsglarge.gif');
  background-repeat: no-repeat;

  position: absolute;
  z-index: 10111;
  width: 800px;
  height: 841px;
  padding: 0px 25px 25px 25px;
  border: 0px;
  left: 50px;
  top: 10px;
}

#dl4StatusContent.large {
  margin-top: 40px;
  height: 776px;
  width: 800px;
}

/* Erstes Zeichen im Tutorial-Text
   Vorerst deaktiviert, da es z.B. den IE6 zum Absturz bringen kann (yay! -.-) */
/*#dl4TutorialContent:first-letter {
  font-weight: bold;
  font-size: 20px;
}*/

/* Der Bereich in der einem Tutorial-Fenster ähnlich sieht, aber für andere Sachen verwendet werden kann */
.dl4WideWindow, #dl4Question {
  background-color: transparent;
  background-image: url('dl4widewindow.gif');
  background-repeat: no-repeat;

  position: absolute;
  z-index: 10110;
  width: 550px;
  height: 130px;
  padding: 0px;
  border: 0px;
  top: 5px;
  left: 250px;
}

/* Drag-Bar im oberen Bereich eines Info-Fensters */
.dl4WideWindowDragBar, #dl4StatusMover {
  margin: 0px;
  padding: 0px;
  width: 100%;
  height: 25px;
  border: 0px;
  text-align: center;
  font-weight: bold;
  color: #BBB5A5;
  cursor: move;
}

/* Der Textbereich des Infofensters */
.dl4WideWindowContent {
  margin: 0px 25px 25px 25px;
  width: 500px;
  height: 90px;
  border: 0px;
  overflow: auto;
  text-align: left;
  /*font-weight: bold;*/
  color: #BBB5A5;
}

.dl4AbortButton {
  margin: 0px;
  padding: 0px;
  position: absolute;
  top: 10px;
  /*left: 515px;*/
  right: 10px;
  width: 20px;
  height: 20px;
  background-color: transparent;
  z-index: 10111;
  cursor: pointer;
}

.dl4NextButton {
  margin: 0px;
  padding: 0px;
  position: absolute;
  top: 116px;
  left: 505px;
  width: 32px;
  height: 32px;
  background-color: transparent;
  z-index: 10111;
  cursor: pointer;
  visibility: hidden;
}

/* Hyperlinks im Tutorial-Bereich */
.dl4WideWindowContent a {
  font-weight: bold;
  color: #958A6F;
}

/* Für div's die innerhalb des Hauptfensters sein sollen, sollen genau diese Breite haben (da IE mit dem Ausdruck width: 100% in dem Fall nicht viel anfangen kann)
 * Beispiel die diese Klasse verwenden sind Turnierbäume. */
.innerwindow {
  width: 99%;
  width: expression((document.body.offsetWidth - 360) + 'px');
}

/**
  * Der wichtigste Button überhaupt
  */
#myuseless {
  position: absolute;
  left: 100px;
  top: 15px;
}


/* Hier werden relevante Accountinfos wie Account-ID, Strafpunkte, Titel, Gesamtbewohnerzahl
 * und Gebietsvorstand (falls vorhanden) angezeigt. Siedlungsinformationen finden sich NICHT
 * in diesem div, sondern in #dl4Settlements. */
#dl4AccountInfo {
  position: absolute;
  width: 120px;
  left: 891px;
  top: 3px;
  margin: 0px;
  padding: 5px;
  text-align: left;
  font-size: 11px;
  line-height: 130%;
}

/* Dieses div enthält die Siedlungsinformationen und die Anzeige der aktiven Siedlung und
 * Koordinaten, sowie die Namen der Siedlungen werden hier angezeigt. */
#dl4SettlementNames {
  position: absolute;
  width: 175px;
  left: 816px;
  top: 66px;
  margin: 0px;
  padding: 5px;
  text-align: left;
  line-height: 130%;
}

.settleImage {
  border: 1px solid #000000;
  margin: 5px auto 15px auto;
}

#dl4Queue {
  position: absolute;
  right: 5px;
  top: 300px;
  width: 166px;
  z-index: 10101;
}

/* Der obere Bereich der Queue, der zur Zeit nichts enthält, außer einem Queuify-Button */
#dl4QueueTop {
  background-image: url('dl4queuetopsmall.gif');
  background-color: transparent;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: 1px 0px;

  width: 166px;
  height: 30px;
  margin: 0px;
  padding: 0px 0px 0px 0px;
  border: 0px;
  text-align: center;
  /* No dragging for now -- cursor: move; */
}

#dl4QueueTopSmall {
  background-image: url('dl4queuetopsmall.gif');
  background-color: transparent;
  background-repeat: no-repeat;
  background-attachment: scroll;

  bottom: 0px;
  width: 166px;
  margin: 0px;
  padding: 10px 0px 0px 0px;
  border: 0px;
  height: 21px;
}

#dl4ResBar {
  width: 120px;
  height: 15px;
  padding: 0px;
  margin: 0px auto 5px auto;
  background-repeat: repeat-x;
  background-image: url('../grafikpack-full/stuff/fillbar_rot.jpg');
  text-align: left;
  vertical-align: middle;
  cursor: pointer;
}

/* Zeitanzeige */
#dl4Time {
  font-weight: bold;
  font-size: 14px;
}

#menu_premium {
  position: absolute;
  left: 0px;
  top: 39px;
}

#menu_forum {
  position: absolute;
  left: 0px;
  top: 86px;
}

#myquests {
  position: absolute;
  left: 0px;
  top: 124px;
  width: 159px;
  height: 88px;
}

/* Buttons */
#mynews { margin: 10px 12px 7px 5px; }
#mynotes { margin: 3px 0px 10px 0px; }
#dl4Queueify { margin: 3px 0px 10px 8px; }
#myquestions { margin: 3px 0px 10px 8px; }
#myminigame { margin: 0px 12px 10px 12px; }
#mymessages { margin: 5px 0px 10px 0px; }
#myvoting { margin: 0px 10px 10px 0px; }
#mysirris { margin: 0px 0px 10px 10px; }

/* Die Queue befindet sich in diesem div. Sie besteht aus einer Tabelle mit jeweils 2 Spalten (links: Queueeintrag, rechts: Restzeit/Endzeit).
 * Die Farben der Queue sind festgelegt und können über dieses CSS ebenso verändert werden. */
#dl4QueueCenter {
  background-image: url('dl4queuecenter.gif');
  background-color: transparent;
  background-repeat: repeat-y;
  background-attachment: scroll;
  background-position: 1px 0px;

  width: 166px;
  margin: 0px;
  padding: 0px 0px 0px 0px;
  border: 0px;
  text-align: center;
}

/* Falls es noch etwas gibt was zusätzlich mit der Queue angezeigt werden soll, das aber nich so einfach
 * mit absoluter Positionierung zu erreichen ist (die Länge/Höhe der Queue kann stark variieren), kann es
 * hiermit eingebaut werden. Im Originaldesign wird die Abschlussgrafik unter der Queue mit diesem div umgesetzt. */
#dl4QueueBottom {
  background-image: url('dl4queuebottom.gif');
  background-color: transparent;
  background-repeat: no-repeat;
  background-attachment: scroll;

  bottom: 0px;
  width: 166px;
  margin: 0px;
  padding: 0px;
  border: 0px;
  height: 31px;
}

/**
  * Rechte spalte der Queue
  */
.qr {
  width: 50px;
  text-align: right;
}

.qr div {
  font-size: 10px;
}

/**
  * Überschriften der unterschiedlichen Siedlungen in der Queue
  */
.qSet {
  font-weight: bold;
  padding: 5px 0px;
}

#dl4QueueCenter table {
  width: 140px;
}

/* Die Farben der Queue für die unterschiedlichen Aufträge werden hier definiert.
 * Sie sollten alle auf dem entsprechenden Queue-Hintergrund gut sichtbar und unterscheidbar sein */
.dl4QueueHG 		{ color: green; }					/* Queuefarbe für Hauptgebäude (Haupthaus, Drachenhof usw.) */
a.dl4QueueHG:hover	{ color: green; text-decoration: underline; }		/* entsprechender Hoverlink */

.dl4QueueRG		{ color: lightgreen; }					/* Queuefarbe für Rohstoffgebäude */
a.dl4QueueRG:hover	{ color: lightgreen; text-decoration: underline; }	/* entsprechender Hoverlink */

.dl4QueueCG		{ color: #C0AA00; }					/* Queuefarbe für Gruppengebäude */
a.dl4QueueCG:hover	{ color: #C0AA00; text-decoration: underline; }		/* entsprechender Hoverlink */

.dl4QueueFOR		{ color: pink; }					/* Queuefarbe für Forschungen */
a.dl4QueueFOR:hover	{ color: pink; text-decoration: underline; }		/* entsprechender Hoverlink */

.dl4QueueDH		{ color: tomato; }					/* Queuefarbe für Drachenbrut */
a.dl4QueueDH:hover	{ color: tomato; text-decoration: underline; }		/* entsprechender Hoverlink */

.dl4QueueDEF		{ color: gray; }					/* Queuefarbe für Verteidungsanlagen */
a.dl4QueueDEF:hover	{ color: gray; text-decoration: underline; }		/* entsprechender Hoverlink */

.dl4QueueSPY		{ color: #00FFCC; }					/* Queuefarbe für Spionageaufträge */
a.dl4QueueSPY:hover	{ color: #00FFCC; text-decoration: underline; }		/* entsprechender Hoverlink */

.dl4QueueGSP		{ color: #AA5555; }					/* Queuefarbe für Gruppenspionageaufträge */
a.dl4QueueGSP:hover	{ color: #AA5555; text-decoration: underline; }		/* entsprechender Hoverlink */

.dl4QueueSP		{ color: #1e69e6; }					/* Queuefarbe für die Ausbildung von Schattenportal-Einheiten */
a.dl4QueueSP:hover	{ color: #1e69e6; text-decoration: underline; }		/* entsprechender Hoverlink */

.dl4QueueHAN		{ color: lightskyblue; }				/* Queuefarbe für Handel (Handel gekauft) */
a.dl4QueueHAN:hover	{ color: lightskyblue; text-decoration: underline; }	/* entsprechender Hoverlink */

.dl4QueueHAN_PARTNER	{ color: lightslategrey; }				/* Queuefarbe für Handel (Handel verkauft) */
a.dl4QueueHAN_PARTNER:hover	{ color: lightslategrey; text-decoration: underline; }	/* entsprechender Hoverlink */

.dl4QueueRIT		{ color: #CC66CC; }					/* Queuefarbe für ein Ritual im Tempel */
a.dl4QueueRIT:hover	{ color: #CC66CC; text-decoration: underline; }		/* entsprechender Hoverlink */

.dl4QueueMIS, .dl4QueuePOR, .dl4QueueSUP, .dl4QueueTOU { color: #0CB0E0; }			/* Queuefarbe für eine Mission (eigene Mission, friedlich) */
a.dl4QueueMIS:hover, a.dl4QueuePOR:hover, a.dl4QueueSUP:hover, a.dl4QueueTOU:hover { color: #0CB0E0; text-decoration: underline; }		/* entsprechender Hoverlink */

.dl4QueueMIS_PARTNER	{ color: red; }						/* Queuefarbe für eine Mission (man wird ausgeraubt oder angriffen) */
a.dl4QueueMIS_PARTNER:hover { color: red; text-decoration: underline; }		/* entsprechender Hoverlink */

.dl4QueueATT, .dl4QueueROB, .dl4QueueSIE, .dl4QueueFRE { color: #fe404d; }	/* Queuefarbe für eine Mission (eigene Mission, Raubzug oder Raserei oder Belagerung oder Befreiung) */
a.dl4QueueATT:hover, a.dl4QueueROB:hover, a.dl4QueueSIE:hover, a.dl4QueueFRE:hover { color: #fe404d; text-decoration: underline; } /* entsprechender Hoverlink */

.dl4QueueATT_PARTNER, .dl4QueueROB_PARTNER, .dl4QueueSIE_PARTNER, .dl4QueueFRE_PARTNER, .dl4QueueEAT { color: red; }				/* Queuefarbe für eine Mission (Belagerungs-Hilfs-Eintrag für den dritten Beteiligten) */
a.dl4QueueATT_PARTNER:hover, a.dl4QueueROB_PARTNER:hover, a.dl4QueueSIE_PARTNER:hover, a.dl4QueueFRE_PARTNER:hover, a.dl4QueueEAT:hover { color: red; text-decoration: underline; } /* entsprechender Hoverlink */

.dl4QueueMJ		{ color: #FFFFFF; }					/* Queuefarbe für eine Mission (eigene Mission, Monsterjagd) */
a.dl4QueueMJ:hover	{ color: #FFFFFF; text-decoration: underline; }		/* entsprechender Hoverlink */

.dl4QueueEGG		{ color: chocolate; }					/* Queuefarbe für eine Eiersuche */
a.dl4QueueEGG:hover	{ color: chocolate; text-decoration: underline; }	/* entsprechender Hoverlink */

.dl4QueueKAS		{ color: yellow; }					/* Queuefarbe für die Ausbildung von Kaserneneinheiten */
a.dl4QueueKAS:hover	{ color: yellow; text-decoration: underline; }		/* entsprechender Hoverlink */

.dl4QueueFRI		{ color: orange; }					/* Queuefarbe für die Ausbildung von Friedhofseinheiten */
a.dl4QueueFRI:hover	{ color: orange; text-decoration: underline; }		/* entsprechender Hoverlink */

.dl4QueueGEM		{ color: chocolate; }					/* Queuefarbe für die Edelsteinsuche */
a.dl4QueueGEM:hover	{ color: chocolate; text-decoration: underline; }	/* entsprechender Hoverlink */

.dl4QueueHEX		{ color: greenyellow; }					/* Queuefarbe für die Trankbrauerei & ähnliches aus der Hexenküche */
a.dl4QueueHEX:hover	{ color: greenyellow; text-decoration: underline; }	/* entsprechender Hoverlink */

.dl4QueueSOE		{ color: #DDFF99; }					/* Queuefarbe für die angeheuerte Söldner die zur Siedlung kommen */
a.dl4QueueSOE:hover	{ color: #DDFF99; text-decoration: underline; }		/* entsprechender Hoverlink */


/* In diesem Block sind zusätzlich Links und Informationen zu finden. Namentlich die Grafik für den Premiumaccount so
 * wie der entsprechende Link. */
#dl4InfoBlockAddition {
  width: 160px;
  height: 214px;
  position: absolute;
  right: 0px;
  top: 110px;
  padding: 0px;
  border: 0px;
  background-image: url('forumpremquest.gif');
  background-position: right top;
  z-index: 10098;
}

/* Design der Fehlermeldungen in Battlegrounds */
.dl4error, .dl4BuddyOffline {
  color: tomato;
  font-weight: bold;
}

/* Design der Bestätigungsmeldungen in Battlegrounds */
.dl4acknowledge, .dl4BuddyOnline {
  color: greenyellow;
  font-weight: bold;
}

/* Blätter des Talentbaumes */
div.talentLeaf {
  position: absolute;
  width: 132px;
  height: 45px;
  z-index: 10002;

  color: black;
  text-align: center;
}

/* Tooltip-öffnende Bereiche an Kreuzungen im Talentbaum */
div.talentJunction {
  position: absolute;
  width: 50px;
  height: 50px;
  z-index: 10002;

}

/* Forschungsblatt in der Bibliothek*/
div.researchLeaf {
  float: left;
  width: 165px;
  height: 23px;
  padding: 5px 7px 0px 28px;
  text-align: left;
}

div.researchCategory {
  float: left;
  width: 185px;
  height: 22px;
  padding: 6px 7px 0px 8px;
  text-align: left;
}

/* Bewertungsleiste im Tribunal bei Urteilen */
.sentenceVotebar {
  border: 1px solid #888888;
  width: 100px;
  height: 15px;
  margin: 5px 0px 0px auto;
  text-align: left;
}

/* Bilder */
img {
  vertical-align: middle;		/* Bilder sollten immer zentriert sein mit dem Text (auch wenn die Browser das meist nicht so hinkriegen -.-) */
}

img.floatL {
	margin: 5px 15px 15px 5px;
	float: left;
}

img.floatR {
	margin: 5px 5px 15px 15px;
	float: right;
}


/* Bilder in Links haben keinen Rand */
a img {
  border: 0px;
}

/* Standardlinks im Battlegrounds Design */
a {
  color: #BBB5A5;
  text-decoration: none;
  background-color: transparent;
}

/* Standardhoverlinks im Battlegrounds Design */
a:hover {
  color: #E5DECC;
  text-decoration: underline;
}

/* Unterstriche Hoverlinks im Battlegrounds Design (gehören zur Klasse "hoveruline") */
a.hoveruline:hover {
  text-decoration: underline;
}

/* Eingabefelder für Formulare (Textbereiche, Textfelder und Auswahllisten) im Battlegrounds Design */
input, textarea, select, .inputfake {
  background-color: #3b3632; /*#544d47;*/
  border-top: 1px solid #332f2b;
  border-left: 1px solid #332f2b;
  border-bottom: 1px solid #a5a3a1;
  border-right: 1px solid #a5a3a1;
  font-family: Tahoma, Verdana, Arial, 'DejaVu Sans', 'Bitstream Vera Sans', Kalimati, Helvetica, sans-serif;
  font-size: 12px;
  color: #eddbc9;
}

input:focus, textarea:focus  {
  background-color: #544d47;
  background-image: url('input_bg_dark.jpg');
}

input, textarea {
  background-image: url('input_bg.jpg');
  background-repeat: repeat;
}

/* Die Klasse 'text' wird für alle Textfelder und Textareas benutzt werden, damit der Text nicht am Rahmen 'klebt' */
input[type=text], input[type=password] {
  padding-left: 3px;
}

/* Die Klasse 'checkbox' muss für Checkboxen benutzt werden, damit im IE der Hintergrund und der Rahmen nicht angezeigt werden
   color und background-color sind wichtig für Opera und andere Browser, die die Farben in Checkboxes und Radiobuttons übernehmen!
  */
input[type=checkbox] {
  background-color: transparent;
  background-image: none;
  border: 0px;
  vertical-align: middle;
}

/* Die Klasse 'radio' muss für Radiobuttons benutzt werden, damit im IE der Hintergrund und der Rahmen nicht angezeigt werden
   color und background-color sind wichtig für Opera und andere Browser, die die Farben in Checkboxes und Radiobuttons übernehmen!
  */
input[type=radio] {
  background-color: transparent;
  background-image: none;
  border: none;
  color: black;
}


/* Die Klasse 'button' wird für alle Buttons benutzt, damit sie sich von den Textfeldern unterscheiden */
input[type=submit], input[type=button], input[type=reset] {
  border: 1px outset #332f2b;
}

/* Tabellen ohne spezifische Klassen */
table {
  background-color: transparent;
  border-collapse: collapse;
  border: none;
  margin: 0px auto;
}

.ridgeborder {
  border: 3px ridge #888888;
  -moz-border-radius: 5px;
}

/* Ein normaler Spaltenheader ohne spezifische Klasse (keine Hintergrundgrafik) */
th {
  background-color: #332f2b;
  background-image: url('bg_th.jpg');
  background-repeat: repeat;
  border: 1px solid #211e1c;
  text-align: center;
  font-size: 13px;
  font-weight: bold;
}

/* Eine normale Zeile in einer Tabelle */
tr {
  background-color: transparent;
}

/* Folgende zwei Klassen dienen der farblichen Absetzung der Tabellenzeilen. Sie werden jeweils abwechselnd auf den TR-Tag angewendet */
.dark, .hoverdark {
  background-image: url('bg_dark.jpg');
  background-repeat: repeat;
  background-position: top right;
  background-color: #544d47;
  border: 0;
}

.light, .hoverlight {
  background-image: url('bg_light.jpg');
  background-repeat: repeat;
  background-position: 60px 0px;
  background-color: #665e56;
  border: 0;
}

.redborder {
  border: 2px solid tomato;
}


.marked, .hovermarked {
  background-image: url('bg_marked.jpg');
  background-repeat: repeat;
  background-position: 60px 0px;
  background-color: #440000;
}

.hovermarked:hover {
  background-image: url('bg_marked_hover.jpg');
}

.hoverlight:hover, .hoverdark:hover {
  background-image: url('bg_hover.jpg');
}

tr.hovertr:hover, td.hovertd:hover {
  background-color: #7c726a;
}

/* Ein sehr dunkler Ton, z.B. für das herausheben von gesicherten IGMs */
.deepdark {
  background-image: url('bg_th.jpg');
  background-color: #2b2825;
}


/* Tabellenzellen die nicht die Klasse no_border (siehe unten) haben, werden wie folgt dargestellt */
td {
  /*border: 1px solid #211e1c;*/
  font-family: Tahoma, Verdana, Arial, 'DejaVu Sans', 'Bitstream Vera Sans', Kalimati, Helvetica, sans-serif;
  font-size: 12px;
  text-align: left;
}

/* Wird verwendet in vielen Tabellenheadern um ihn mit einer Grafik zu verschönern. */
.designheader {
  background-image: url('bg_header.jpg');
  background-repeat: repeat-x;
  border: 0px;
  padding: 15px 0px 10px 0px;
}

/* Tabellenzellen die gar nicht dargestellt werden (kein Hintergrund, kein Rand) haben diese Klasse (no_border ist etwas missverständlich) */
.no_border {
  background-color: transparent;
  border: 0px;
}

/* Nach floating Objekten kann damit der Zeilenumbruch erzwungen werden,
 * damit das umgebende div auf die entsprechende Größe ausgeweitet wird */
.cleardiv {
  clear: both;
  height: 0px;
  width: 0px;
  font-size: 1px;
  line-height: 0;
  margin: 0px; 
  padding: 0px;
  overflow: hidden;
}

p {
  text-align: justify;
  margin: 1em 0 0 0;
}

/* Die Standard-Überschrift im DL-Design */
h1, .dl4heading, .dl4KBRound {
  font-size: 18px;
  font-weight: bold;
}

/* Die Standard-Überschrift im DL-Design */
h2, .dl4subheading {
  font-size: 14px;
  font-weight: bold;
}

/* Kleine Informationstexte */
.smallinfo {
  font-size: 10px;
}

/* Turniergewinner werden üblicherweise in dieser Schrift gezeigt */
.tourneywinner {
  font-size: 18px;
  font-weight: bold;
}

/* Turnierzweite werden üblicherweise in dieser Schrift gezeigt */
.tourneysecond {
  font-size: 14px;
  font-weight: bold;
}

/* Turnierdritte werden üblicherweise in dieser Schrift gezeigt */
.tourneythird {
  font-weight: bold;
}

/* Sonstige Teilnehmer werden üblicherweise in dieser Schrift gezeigt */
.tourneyall {
  font-weight: normal;
}

/* Hintergrundfarbe für alles was in 2-Team-Turnieren Team 1 betrifft */
.teamonebg {
  background-color: tomato;
}

/* Hintergrundfarbe für alles was in 2-Team-Turnieren Team 2 betrifft */
.teamtwobg {
  background-color: cornflowerblue;
}

/* Textdesign für alles was in 2-Team-Turnieren Team 1 betrifft */
.teamonetext {
  color: tomato;
}

/* Textdesign für alles was in 2-Team-Turnieren Team 2 betrifft */
.teamtwotext {
  color: cornflowerblue;
}

/** 
  * Slider controls
  */ 
div.slider {
  width: 200px;
  margin: 10px 0;
  background-image: url('../grafikpack-full/stuff/track.gif');
  background-position: center left;
  height: 30px;
  position: relative;
}

div.slider div.handle {
  width: 20px;
  height: 30px;
  background-image: url('../grafikpack-full/stuff/handle.gif');
  cursor: pointer;
  position: absolute;
}

/**
  * Versteckte Objekte
  */
.hidden {
  height: 0pt;
  left: -9000px;
  max-width: 8000px;
  overflow: hidden;
  position: absolute;
}

/* Klasse für aktive (angezeigte) Popups */
.popupActive {
  font-size: 12px;
  color: #AAAAAA;
  border: 1px solid #A9A9A9;
  padding: 6px;
  background-image: url('bgbase.gif');
  background-repeat: repeat;
  background-color: #000000;
  -moz-border-radius: 4px;
  text-align: left;
  z-index: 10121;
  position: absolute;
}

/* Basisklasse für Tooltips (Standard: Absolute Positionierung, Unsichtbar) */
.tooltipbase {
  position: absolute;
  display: none;
  z-index: 10120;
}

/* Die Tooltips auf der Gebietskarte sehen wie folgt aus (zusätzlich zu den Parametern für jeden Tooltip) */
.tooltipmap {
  background-color: transparent;
  background-image: url('scroll-map.gif');
  background-repeat: no-repeat;
  border: 0px;
  text-align: left;
  color: #000000;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 30px;
  width: 150px;
  /*-moz-opacity: 0.8;
  filter: alpha(Opacity=80);  */
}

/* Eine Basisklasse für jegliche Tooltips in DL4, die von addTooltip() zugefügt werden */
.dl4Tooltip, .dl4BuildingTooltip, .dl4KBTooltip, #dl4Notepad {
  font-size: 12px;
  color: #AAAAAA;
  border: 1px solid #A9A9A9;
  padding: 6px;
  background-image: url('bgbase.gif');
  background-repeat: repeat;
  background-color: #000000;
  -moz-border-radius: 4px;
  min-width: 100px;
  text-align: left;
  z-index: 10120;
  position: absolute;
  display: none;			/* Standardmäßig die Tooltips nicht anzeigen (werden über JS eingeblendet) */
}

.dl4BuildingTooltip {
  display: block;
  visibility: hidden;
  width: 280px;
  border: 3px ridge #888888;
  -moz-border-radius: 5px;
}

.dl4Tooltip, .dl4KBTooltip {
  max-width: 300px;
}

/* Klasse für die Subnavigation im Content-Fenster (1-zeilig: mit DIVs) */
#dl4Linklist {
  position: relative;
  margin: 0px auto;
}

/* Klasse für die Subnavigation im Content-Fenster (2-zeilig: mit TABLE) */
#dl4LinklistTable {
  margin: 0px auto;
  border-collapse: collapse;
  border: 0px;
}

/* Zeilen und Zellen der Table-Version */
#dl4LinklistTable tr, #dl4LinklistTable td {
  margin: 0;
  padding-top: 0px;
  padding-bottom: 0px;
  border-collapse: collapse;
  border: 0px;
}

/* Generelle Aussagen über die linken und rechten Elemente der Subnavigation */
.dl4LinklistLeft {
  background-image: url('dl4LinklistLeft.png');
  height: 43px;
  width: 48px;
  padding: 0;
}

.dl4LinklistRight {
  background-image: url('dl4LinklistRight.png');
  height: 43px;
  width: 48px;
  padding: 0;
}

/* DIV-spezifische Angaben für die Subnavigation (float bei TD ist nicht so schön) */
div.dl4LinklistLeft, div.dl4LinklistRight {
  float: left;
}

/* Ein Linklistenelement der DIV-Version, bei der sich Größe und Padding von der TABLE-Version unterscheiden */
.dl4LinklistElem {
  background-image: url('dl4LinklistCenter.png');
  background-repeat: repeat-x;
  float: left;
  height: 31px;
  padding: 12px 8px 0px 8px;
  font-weight: bold;
  /*cursor: pointer;*/
  font-size: 13px;
}

/* Obere Zeile der Subnavigation bei 2-zeiligen Table-Varianten */
.dl4LinklistElemTop {
  background-image: url('dl4LinklistCenter.png');
  background-repeat: repeat-x;
  background-position: top left;
  height: 21px;
  padding: 4px 7px 0px 7px;
  margin: 0px;
  font-weight: bold;
  /*cursor: pointer;*/
  font-size: 13px;
  text-align: center;
}

/* Untere Zeile der Subnavigation bei 2-zeiligen Table-Varianten */
.dl4LinklistElemBottom, .dl4LinklistElemBottomNH {
  background-image: url('dl4LinklistCenter.png');
  background-repeat: repeat-x;
  background-position: bottom left;
  margin: 0px;
  height: 22px;
  padding: 0px 7px 0px 7px;
  font-weight: bold;
  font-size: 13px;
  text-align: center;
}

.dl4LinklistElemBottom {
  /*cursor: pointer;*/
}

/* Hervorgehobene Navigationselemente in allen drei Versionen (der IE6 ignoriert es gekonnt -.-) */
.dl4LinklistElem:hover, .dl4LinklistElemTop:hover, .dl4LinklistElemBottom:hover {
  background-image: url('dl4LinklistCenter_a.png');
}


/* Die Farbe der inaktiven Subnavigations-Links */
.standardLinkList {
  color: #DDDDDD;
}

.standardLinkList:hover {
  color: #FFFFFF;
  text-decoration: none;
}

/* Die Farbe der aktiven Subnavigations-Links */
.selectedLinkList {
  color: tomato;
}

.selectedLinkList:hover {
  color: tomato;
  text-decoration: none;
}

/* Zitate-Boxen für IGMs und Statusnachrichten die über die [quote]-Tags erstellt werden */
.quotebox {
  width: 90%;
  border: 3px ridge #888888;
  -moz-border-radius: 5px;
  padding: 5px;
  background-color: #403C38;
  background-image: url('bg_th.jpg');
  background-repeat: repeat;
  margin-left: auto;
  margin-right: auto;
  color: #CCCCCC;
}

/* Für die Forschungen gibt es folgende Farben, entsprechend der Typen  */

.kriegsmagietextonly {
  font-weight: bold;
  color: #8c2525;
}

.prodmagietextonly {
  font-weight: bold;
  color: #298c24;
}

.kreaturenmagietextonly {
  font-weight: bold; color:
  #24618c;
}

.techniktextonly {
  font-weight: bold;
  color: #8c5525;;
}

.kriegsmagie {
  color: #330e0e;
  font-weight: bold;
  text-decoration: none;
}

.kriegsmagie:hover, .kriegsmagietextonly:hover {
  color: #FFDDAA;
  text-decoration: none;
}

.prodmagie {
  color: #081A06;
  font-weight: bold;
  text-decoration: none;
}

.prodmagie:hover, .prodmagietextonly:hover {
  color: #EEFFCC;
  text-decoration: none;
}

.kreaturenmagie {
  color: #06121A;
  font-weight: bold;
  text-decoration: none;
}

.kreaturenmagie:hover, .kreaturenmagietextonly:hover {
  color: #AAD4F2;
  text-decoration: none;
}

.technik {
  color: #331f0e;
  font-weight: bold;
  text-decoration: none;
}

.technik:hover, .techniktextonly:hover {
  color: #f2d8c2;
  text-decoration: none;
}


/* TRUPPEN AUFSPÜREN UND TOPLISTENFDESIGNS
 */

/* Für NAPs beim Truppen aufspüren */
.cnap {
  color: cornflowerblue;
}

.cbuddy {
  color: #32DCBF;
}

.cseeked {
  color: greenyellow;
}

/* Für Bündnisse beim Truppen aufspüren */
.cbnd {
  color: limegreen;
}

/* Für Kriegsgegner beim Truppen aufspüren */
.cwar {
  color: tomato;
}

/* Für Gruppenmitglieder beim Truppen aufspüren */
.cownclan {
  color: #DD00DD;
}

/* Für sich selbst */
.cself {
  color: orange;
}

/* Für NAPs in Hyperlinks beim Truppen aufspüren und in der Topliste*/
a.cnap:hover {
  color: cornflowerblue;
  text-decoration: underline;
}

/* Für Buddies in Hyperlinks beim Truppen aufspüren und in der Topliste*/
a.cbuddy:hover {
  color: #32DCBF;
  text-decoration: underline;
}

/* Für eigene Ziele in Hyperlinks beim Truppen aufspüren und in der Topliste*/
a.cseeked:hover {
  color: greenyellow;
  text-decoration: underline;
}

/* Für Bündnisse in Hyperlinks beim Truppen aufspüren und in der Topliste */
a.cbnd:hover {
  color: limegreen;
  text-decoration: underline;
}

/* Für Kriegsgegner in Hyperlinks beim Truppen aufspüren und in der Topliste */
a.cwar:hover {
  color: tomato;
  text-decoration: underline;
}

/* Für Gruppenmitglieder in Hyperlinks beim Truppen aufspüren und in der Topliste */
a.cownclan:hover {
  color: #DD00DD;
  text-decoration: underline;
}

/* Für sich selbst */
a.cself:hover {
  color: orange;
  text-decoration: underline;
}

/* Strafpunktlisten-Styles: Platzierung von Outlaws */
.coutlaw {
  color: tomato;
}

a.coutlaw:hover {
  color: tomato;
  text-decoration: underline;
}

/* Toplisten-Styles: Unspezfische Spieler, kann ignoriert werden */
a.noclass:hover {
  text-decoration: underline;
}










/* Festgepinnte Einträge außerhalb des Gruppenbereichs */
.sticky {
  color: gold;
}

/* Common items/monsters/units */
.tier0 {
  /*font-weight: bold;*/
}

/* Uncommon items/monsters/units */
.tier1 {
  color: limegreen;
  font-weight: bold;
}

/* Rare items/monsters/units */
.tier2 {
  color: #4444FF;
  font-weight: bold;
}

/* Epic items/monsters/units */
.tier3 {
  color: purple;
  font-weight: bold;
}

/* Legendary items/monsters/units */
.tier4 {
  color: orange;
  font-weight: bold;
}

/* Set items */
.tier9 {
  color: gold;
}

/**
  * Tavernen-CSS
  */
#tavern {
  background-image: url('../grafikpack-full/stuff/tavern_bg.jpg');
  position: relative;
  left: 0px;
  top: 0px;
  width: 450px;
  height: 300px;
  margin: 0px auto;
  background-color: #000000;
}

#tavern div {
  position: absolute;
  width: 15px;
  height: 15px;
  cursor: pointer;
  background-color: #333333;
}

#tavernMuttering {
  width: 550px;
  height: 150px;
  overflow: auto;
  margin: 10px auto;
  border: 1px solid white;
  text-align: left;
  padding: 5px;
}

#tavern .chair {
  background-image: url('../grafikpack-full/stuff/chairempty.png');
}
#tavern .chairSelf {
  background-image: url('../grafikpack-full/stuff/chairself.png');
}
#tavern .chairSeated {
  background-image: url('../grafikpack-full/stuff/chairseated.png');
}

#tavern .chairSeeked {
  border: 2px solid tomato;
}

#tavernChat {
  width: 550px;
  height: 150px;
  overflow: auto;
  margin: 10px auto;
  border: 1px solid white;
  text-align: left;
  padding: 5px;
}

#tavern .table1 { background-color: #00FF00; }
#tavern .table1:hover { background-color: #FF3333; }
#tavern .table2 { background-color: #dcbb00; }
#tavern .table2:hover { background-color: #FFFF77; }
#tavern .table3 { background-color: #84bb00; }
#tavern .table3:hover { background-color: #FF3333; }
#tavern .table4 { background-color: #dc3e00; }
#tavern .table4:hover { background-color: #FFCCCC; }
#tavern .table5 { background-color: #ff9d26; }
#tavern .table5:hover { background-color: #FF3333; }
#tavern .table6 { background-color: #dc3e90; }
#tavern .table6:hover { background-color: #FF3333; }
#tavern .table7 { background-color: #31b690; }
#tavern .table7:hover { background-color: #FF3333; }
#tavern .table8 { background-color: #FFFFFF; }
#tavern .table8:hover { background-color: #FF3333; }
#tavern .table9 { background-color: #ffff26; }
#tavern .table9:hover { background-color: #FF3333; }
#tavern .table10 { background-color: #bbff00; }
#tavern .table10:hover { background-color: #FF3333; }
#tavern .table11 { background-color: cornflowerblue; }
#tavern .table11:hover { background-color: #FF3333; }
#tavern .table12 { background-color: #f78200; }
#tavern .table12:hover { background-color: #FF3333; }
#tavern .table13 { background-color: #dcb690; }
#tavern .table13:hover { background-color: #FF3333; }
#tavern .table14 { background-color: #009b00; }
#tavern .table14:hover { background-color: #FF3333; }
#tavern .table15 { background-color: #3c0062; }
#tavern .table15:hover { background-color: #FF3333; }
#tavern .table16 { background-color: #ab9d26; }
#tavern .table16:hover { background-color: #FF3333; }
#tavern .table17 { background-color: #ed1944; }
#tavern .table17:hover { background-color: #FFCCCC; }
#tavern .table18 { background-color: #31b6e9; }
#tavern .table18:hover { background-color: #FF3333; }
#tavern .table19 { background-color: #ff0005; }
#tavern .table19:hover { background-color: #FFCCCC; }
#tavern .table20 { background-color: #5462ae; }
#tavern .table20:hover { background-color: #FF3333; }
#tavern .table21 { background-color: #00a658; }
#tavern .table21:hover { background-color: #FF3333; }
#tavern .table22 { background-color: #ab0026; }
#tavern .table22:hover { background-color: #FF3333; }

/**
  * Questbereich
  */

div.mainQuest {
  width: 500px;
  margin: 0px auto 25px auto;
  text-align: left;
}

div.subQuest {
  width: 475px;
  margin: 0px auto 25px auto;
  padding-left: 25px;
  text-align: left;
  clear: both;
}

div.questReward {
  margin-top: 10px;
  text-align: center;
  clear: both;
}

/**
  * Klassen für den Page Navigator
  */ 
.curPage {
  font-weight: bold;
}

.pageNavigator {
  width: 95%;
  margin-bottom: 5px;
}
  

/**
  * Tabellen die Einheitenlisten sind, haben diese Klasse
  */
table.unitList {
  width: 95%;
  margin: 0px auto;
}

table.unitList td {
  text-align: left;
}

table.centertd td {
  text-align: center;
}

table.padding5 td, td.padding5 {
  padding: 5px;
}

table.padding10 td {
  padding: 10px;
}

table.unitList td.act {
  text-align: right;
}

table.trans, table.trans tr, table.trans td, table.trans th {
  background: transparent;
}

td.lBorder {
  border-left: 1px solid #444444;
}

/**
  * Leiste für Levelanzeige/EP-Anzeige
  */
.levelbar {
  position: relative;
}

.levelbar, .unitlevel, .unitlevelup, .unitlevelgfx {
  top: 1px;
  left: 0px;
  width: 80px;
  height: 18px;
  z-index: 10200;
}

.unitlevelgfx {
  text-align: left;
}

.unitlevelup, .unitlevel {
  text-align: center;
  padding-top: 1px;
  position: absolute;
  /* Shadow font-weight: bold;*/
}

.unitlevelup, .unitlevelup a {
  font-weight: bold;
  color: black;
  /* Shadow color: white; */
}

.unitlevelup a:hover {
  color: black;
}

.defaultKpBar {
  position: relative;
  top: 0px;
  left: 0px;
  width: 150px;
  height: 25px;
  padding: 0px;
  margin: 0px auto;
  background-repeat: repeat-x;
  text-align: left;
  vertical-align: middle;
}

img.kpToBeUsed {
  height: 25px;
  border-left: 1px solid black;
  border-right: 1px solid black;
  position: absolute;
  top: 0px;
}

/* Wenn wir nur eine Siedlung haben, verschieben wir den Namen etwas nach unten */
settlecount1 {
  margin-top: 8px;
}

/**
  * Kampfberichtrelevante Klassen
  */

.dl4KB {
}

.dl4KBTitle {
  width: 100%;
  text-align: center;
  margin-bottom: 15px;
}

.dl4KBHeader {
  /*margin-bottom: 15px;*/
}

.dl4KBUnitList {
  margin-top: 10px;
  margin-left: 10px;
}

.dl4KBUnitList img, .dl4KBTooltip img {
  margin-left: 3px;
  margin-right: 6px;
}

.dl4KBTooltipTitle {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 10px;
  text-align: center;
}

.dl4KBUnitListTitle {
  margin: 25px 0px 0px 0px;
  font-weight: bold;

}

.dl4KBResult {
  font-size: 15px;
  text-align: center;
  width: 100%;
}

.dl4KBWinner {
  font-weight: bold;
}

.dl4KBMain {
  margin-top: 25px;
}

.dl4KBLine {
  margin-top: 4px;
}

.dl4KBRound {
  margin: 15px 0px 15px 15px;
}

.dl4KBRes, .dl4KBRobArtifact, .dl4KBKill {
  font-weight: bold;
}

.dl4KBFooter {
  margin-top: 15px;
}

.dl4KBAttackerTitle, .dl4KBDefenderTitle {
  float: left;
  width: 100px;
  font-weight: bold;
}

.dl4KBAttackerList, .dl4KBDefenderList {
  float: left;
  width: 420px;
}

.magic { color: tomato; }
.usemana { color: greenyellow; }
.ep { color: #FF44FF; }
.aggressor { font-weight: bold; }
.settler { font-style: italic; }

.a1 { color: #FFFF00; }
.a2 { color: #FF7F00; }
.a3 { color: #FF1500; }
.a4 { color: #FF00E9; }
.a5 { color: #803A00; }
.a6 { color: #801A00; }
.a7 { color: #800065; }
.a8 { color: #807A00; }
.a9 { color: #FF3F00; }
.a10 { color: #FFFF4B; }
.a11 { color: #FFCA4B; }
.a12 { color: #FF604B; }
.a13 { color: #FF4BFF; }
.a14 { color: #FF0055; }
.a15 { color: #B4B400; }
.a16 { color: #B43400; }
.a17 { color: #B40000; }
.a18 { color: #B4009E; }

.d1 { color: #00AAFF; }
.d2 { color: #00FF3F; }
.d3 { color: #006AFF; }
.d4 { color: #00FFD4; }
.d5 { color: #005A80; }
.d6 { color: #00801A; }
.d7 { color: #008065; }
.d8 { color: #001080; }
.d9 { color: #4BB5FF; }
.d10 { color: #4BF5FF; }
.d11 { color: #4BFF8A; }
.d12 { color: #67FF49; }
.d13 { color: #00FF00; }
.d14 { color: #0015FF; }
.d15 { color: #00B489; }
.d16 { color: #00B400; }
.d17 { color: #005FB4; }
.d18 { color: #009C54; }

/**
  * ------- ENDE Kampfberichtrelevante Klassen ---------
  */
  
div.eventItem {
  width: 95%;
  margin: 0px auto;
}

/**
  * Settleshop css classes
  */
.settleShopItem {
	width: 300px;
	float: left;
	height: 175px;
	overflow: hidden;
	position: absolute;
	background-color: black;
	border: 2px ridge #888888;
	-moz-border-radius: 2px 2px 2px 2px;
}

.settleShopItem .shopImage {
	margin: 0px auto;
	padding: 0;
	width: 125px;
	height: 75px;
}

.settleShopItem .additional {
	padding: 0;
	width: 235px;
	height: 25px;
	float: left;
	text-align: right;
	padding-right: 15px;
	line-height: 18px;
}

.settleShopItem .buttons {
	padding: 0;
	width: 45px;
	height: 25px;
	float: left;
}

.settleShopItem .prestigePayout {
	margin: 5px auto;
	font-weight: bold;
	height: 20px;
}

.settleShopItem .info {
	float: left;
	width: 150px;
}

.settleShopItem .costs {
	float: left;
	width: 148px;
	font-weight: bold;
	margin: 15px 0 0 0;
}

.settleShopItem .costs .cost {
	font-weight: bold;
	width: 90%;
	margin: 0px auto 10px auto;
}

.settleShopItem .costs .cost .buy {
	margin: 5px auto 10px auto;
}

.settleShopItem a {
	font-weight: bold;
}

#shopItemCategory {
	width: 600px;
	position: relative;
	top: 0;
	left: 0;
	margin: 15px auto;
	height: 350px;
}

#shopnav {
	width: 600px;
	margin: 10px auto;
	height: 30px;
	text-align: center;
	line-height: 30px;
	position: relative;
	top: 0;
	left: 0;
}

.shopItemHovered {
	-moz-opacity: 0.4;
	opacity: 0.4;
	filter: alpha(opacity=40);
	background-color: greenyellow;
}

ul.popupActive {
	list-style-image: none;
	list-style-position: outside;
	list-style-type: none;
	margin: 0;
}