/**
 * Der Simple-Skin - dem subsilver2-Foren-Skin angelehnt
 * von refridgerator - 2009-10-26 
 * Hier sollten eigentlich nur die CSS-Stile definiert sein, die den 
 * Standard-Stil variieren. Also hauptsächlich Farben und Bilder.
 *
 * @version $Id$
 * @package simple
 */
html * {
  margin: 0;
  padding: 0;
}
body {
  font-size: 0.9em;
  margin: 0;
  padding: 0;
  background-color: #FFFFFF;
}
body, td, p {
  color: #323D4F;
  font-family: Arial, sans-serif;
  line-height: 1em;
}
p {
  margin-bottom: 1em;
}
img {
  border: 0;
  vertical-align: middle;
}
a {
  cursor: pointer;
  color: #006597;
  text-decoration: none;
}
a:hover {
  color: #D46400;
  text-decoration: underline;
}
table {
  empty-cells: hide;
}
h3 {
  margin: 5px 0 5px 0;
  padding: 0;
  text-align: center;
  font-size: 1.4em;
  color: #323D4F;
  font-variant: small-caps;
}
acronym {
  cursor:help;
  border-bottom:1px dotted;
}
.noscript-notice {
  text-align: center;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  padding: 1px 0 3px;
}

.noscript-notice {
  background: #FF3300 none repeat scroll 0 0;
  color: #FFF;
  opacity: 1;
  z-index: 100;
}
.klein {
  font-size: 75%;
  color: #000;
}

.gross {
  font-size: 110%;
  font-weight: bold;
  color: #000;
}

.green {
  color: #00A100;
}

.red {
  color: #F00;
}

.ooc {
  font-style: italic;
  color: #402C13;
}

.nobr {
  white-space: nowrap;
}

.error {
  font-weight: bold;
  color: red;
}

.success {
  font-weight: bold;
  color: green;
}

/* ------------------------------------------------------------------------------- */

div#wrapper {
  margin: 0;
  padding: 0;
}

div#content {
  margin: 0;
  padding: 0;
}

table.main {
  width: 100%;
  margin: auto;
}

.game {
  vertical-align: top;
}

.game img { 
  margin: 0; 
}

.game h2 {
  margin: 5px 0 10px 0;
  text-align: center;
  font-size: 1.6em;
  line-height: 1.2em;
}

.game h3 {
  margin: 0;
  padding: 0;
  text-align: center;
  font-size: 1em;
  color: #006597;
  font-variant: small-caps;
}

.game h3:first-letter {
  color: #003465;
}

.game h4 {
  margin: 0;
  font-size: 0.95em;
}

.game table { 
  margin: 0 auto;
  empty-cells: hide;
}

.game th {
  background:#DCE1E5;
  border:1px solid #A9B8C2;
  padding: 5px;
}

.game td {
  background: #ECECEC;
  border: 1px solid #A9B8C2;
  padding: 5px;
}

/* -- Header ---------------------------------------------------------------- */
#header {
  height: 115px;
  width: 100%;
  margin: auto;
  table-layout: fixed;
  border-spacing: 0;
  empty-cells: hide;
  border-bottom: 1px solid #4787A7;
  border-collapse: collapse;
  background-color: #D9DfE4;
}

/* die äußeren Grenzen (r+l) des Headers */
#header_border_left, #header_border_right {
  display: none;
  width: 0;
  margin: 0;
}

#header_left {
  text-align: center;
  padding: 5px 0;
  vertical-align: middle;
  width: 40%;
}

#header_left div.heroPics {
  text-align: center;
  margin: auto;
  width: 300px;
}

/* header_logo - das Antamarlogo in der Mitte */

#header_logo {
  width: 20%;
  text-align: center;
  padding: 0;
  margin: 0;
  overflow: hidden;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  background-image: url(http://forum.antamar-community.de/styles/subsilver2/imageset/antamar_logo_04.png) ;
}

#header_logo h1 {
  visibility: hidden;
}

/* der bewegliche Teil auf der RECHTEN Seite */

#header_float {
  width: 0;
  padding: 0;
  margin: 0;
  border: 0;
}

/* der bewegliche Teil auf der LINKEN Seite */
#header_float_left {
  width: 0;
  padding: 0;
  margin: 0;
  border: 0;
}

/* Heldenangaben im header_right */
#header_right {
  padding: 0;
  margin: 0;
  width: 40%;
}

#header_right div.kalender {
  float: left;
  width: 150px;
  font-weight: bold;
  color: #323D4F;
  text-align: center;
  padding-top: 25px;
}

#header_right div.heroShortInfo {
  margin-left: 150px;
  text-align: center;
  color: #402b22;
}

#header_right div.heroShortInfo h2 {
  font-size: 1.2em;
  font-weight: bold;
}

#header_right div.heroShortInfo span.held_ort {
  font-style: italic;
}

/* --- Menü auf der linken Seite -------------------------------------------- */
td#menuBox {
  vertical-align: top;
  margin: 0;
  padding: 0;
  font-size: 1.0em;
  line-height: 1.4em;
  width: 130px;
}

div#menu {
  background-color: #DCE1E5;
  border: 1px solid #A9B8C2;
  padding: 0;
  width: auto;
  height: auto;
}

div#menu img {
  vertical-align: baseline;
}

div#menu a{
  display: block;
  color: #006597;
  font-weight: bolder;
  font-variant: small-caps;
}

div#menu a:hover{
  color: #D46400;
}

div#menu a:first-letter{
  color: #004365;
  font-weight: bolder;
  font-variant: small-caps;
  font-size: 100%;
}

div#menu ul {
  margin: 5px;
  padding: 0;
  list-style-type: none;
}

div#menu li.ungeleseneNachrichten {
  background: url(../../bilder/scroll.png) right no-repeat;
}

div#menu li.abmelden { padding-top: 8px; }

/* die kleinen Dolche zum Ausblenden vom Menü */
div#menuShort {
  position: fixed;
  top: 120px;
  left: 0;
  width: 10px;
}

div#menuShort div.menu_show {
  background: #DCE1E5 url(../../bilder/menu_hint.png) repeat-y 50% 0;
  border: 1px solid #A9B8C2 ;
  width: 10px;
  height: 75px;
}

div#menu_pin_buttons {
  position: absolute;
  top: 120px;
  left: 100px;
  z-index: 100;
  max-width: 15px;
}

/* --- Rand l+r bei Haupttabelle ---------------------------------------- */
td.game_border_left { width:5px; }
td.game_border_right { width: 0; }

/* --- Heldeninfo auf der rechten Seite ---------------------------------------- */
td#heldeninfoBox { vertical-align: top; padding: 0; margin: 0; font-size: 0.83em; width:190px; }
div#heldeninfo { padding: 2px 0 5px 0; background-color: #DCE1E5; border: 1px solid #A9B8C2; width: 190px; }
div#heldeninfo ul{
  margin:0 10px 0 10px;
  padding: 0 0 2px 0;
  border-bottom: 1px solid #003465;
  list-style-type: none;
  line-height: 1.2em;
}

div#heldeninfo h2 { font-size: 1.2em; margin: 10px 0 5px 0; }
div#heldeninfo h2 a{ display: block; text-align: center; padding: 0; margin: 0; color: #006597; font-weight: bolder; font-variant: small-caps; line-height: 130%; }
div#heldeninfo h2 a:first-letter { font-size: 100%; color:#003465; margin: 0; }

div#heldeninfo table { border-spacing:0; width: 99%; }
div#heldeninfo table.heldeninfo_eigenschaften { border: 0; padding: 0; margin: 0; border-collapse: collapse; }
div#heldeninfo table.heldeninfo_eigenschaften th { text-align:left; width:74%; }
div#heldeninfo table td.left { text-align: left; width: 13%; white-space: nowrap; }
div#heldeninfo table td.right { text-align: right; width:13%; }


/* die kleinen Dolche zum Ausblenden der Heldeninfo */
div#heldeninfoShort { position: fixed; top: 122px; right: 0; width: 10px; }
div#heldeninfoShort div.heldeninfo_hint {
  background: #FFD98F url(../../bilder/heldeninfo_hint.png) repeat-y 50% 0;
  width: 10px;
  height: 160px;
}
div#heldeninfo_pin_buttons { position: absolute; top: 122px; right: 182px; z-index: 101; max-width: 15px; }

/*Punkte, Gottheit, Geld*/
div#heldeninfo div.pgg {
  margin: 0 10px 3px 10px;
  padding: 0 0 2px 0;
  border-bottom: 1px solid #003465;
  font-size: 1.0em;
  white-space: nowrap;
  clear: right;
  line-height: 1.2em;
}

div#heldeninfo div.heldeninfo_inPGG { clear: both; }

div#heldeninfo div.heldeninfo_inPGG strong { float: right; text-align: right; }

div#heldeninfo div.withoutHeight { height: 0; } /* Klasse ist für den IE nötig */
div#heldeninfo span.EP_gesamt { float: left; width: 120px; }
div#heldeninfo span.groschen, div#heldeninfo span.thaler, div#heldeninfo span.gulden, div#heldeninfo span.EP_guthaben, div#heldeninfo span.stufe { float: left; width: 70px; }
div#heldeninfo span.gott { float: left; width: 60px; }
div#heldeninfo div.geld { margin: 3px 10px 3px 10px; padding:0 0 2px 0; border-bottom: 1px solid #003465; }
div#heldeninfo div.heldeninfo_rs_waffen { padding:0 0 2px 0; margin: 3px 10px 3px 10px; }

/* Waffen */
div#heldeninfo div.heldeninfo_rs_waffen div.heldeninfo_waffen { margin-bottom: 3px; padding-bottom: 2px; border-bottom: 1px solid #003465; }
div#heldeninfo div.heldeninfo_rs_waffen div.heldeninfo_waffen span { display: block; padding: 2px 0 2px 15px; }

/* Heldenbild */
div#heldeninfo div.heldeninfo_rs_waffen div#heldeninfo_rs { }
div#heldeninfo div.heldeninfo_rs_waffen div#heldeninfo_rs div.introText { margin-bottom: 5px; }
div#heldeninfo div.heldeninfo_rs_waffen div#heldeninfo_rs div.trefferzonen { width: 103px; height: 231px; background: url(../../bilder/trefferzonen/hintergrund.png) no-repeat; }
div#heldeninfo div.heldeninfo_rs_waffen div#heldeninfo_rs span#wundentext{ font-size: 0.8em; width: 90px; }

/* Teleporterbox */
div#held_teleporter_box { text-align: right; font-size: 0.85em; width: 180px; }
div#held_teleporter_box form.teleporterForm input.teleport_input { width: 110px; color: #4D3409; font-size: 0.9em; }

/* ----------------------------------------------------------------------------- */

.hero-active {
  font-weight: bold;
}

.hero-inactive {
  font-style:italic;
}

.button {
  font-variant:small-caps;
  border: 1px solid #402C13;
  background-color: #FEEFD2;
  color: #000;
  margin: 2px;
  padding: 2px;
  cursor: pointer;
}

#spendenbutton{
    font-size: 1.3em;
    background-color: #f8b19f;
}

#spendenbutton:hover{
    transform: translateY(-1px);
    box-shadow: 0 0.25em 0.25em rgba(0,0,0,0.5);
}

/* -- Footer ---------------------------------------------- */
table#footer{
  text-align: center;
  margin: 20px auto 10px auto;
}

table#footer div#copy {
  margin: 15px;
  padding: 5px 10px 10px 10px;
  width: 610px;
  letter-spacing: 0;
  background: #DCE1E5;
  border: 1px solid #A9B8C2;
}

table#footer div#copy p {
  font-size: 0.7em;
  line-height: 1.1em;
  margin: 3px;
  text-align: center;
}

table#footer div.zentriert {
  text-align: center;
  font-size: 70%;
}

/* -- ZB-Ausgabe ------------------------------------------------------------ */
.tag {
  border:1px solid #402C13;
  padding:8px 8px 3px 8px;
  margin:6px;
  text-align: left;
}

.tag p{
  margin-top: .5em;
  margin-bottom: .5em;
}

.tag_ooc {
  border:1px solid #402C13;
  padding:3px;
  margin:0; 
  margin-left:-1px;
  margin-bottom: 6px;
  background-color: #FFF4DF;
}

.tag_ooc .liste {
  padding-left: 15px;
}

.tag_ooc .verloren{
  color: #DC0000;
}



/*--- Dungeon ------------------------------------------------------------------*/

.dungeon table {
  clear: both;
  width: auto;
  height: auto;
  margin: 0px;
  border-collapse: collapse;
}

.dungeon th {
  background:#D3913C;
  border:0px;
  padding: 0px;
}

.dungeon td {
  border:0px;
  padding: 0px;
}

.dungeon p img {
  width:100%;
}

.dungeon img {
  width:100%;
}

.dungeon .kampf img {
  margin:0;
}

.dungeon img.pure {
  border:0;
  margin:0;
}



table.liste {
  width: 90%;
}

table.liste td, table.liste th {
  padding: 3px;
}

div.opacity_30 {
  opacity: 0.3;
}

.ooc_chat {
  color:#666666;
}

.meister {
  color: #C3812C;
  font-style: oblique;
  font-weight: bold;
  letter-spacing: 0em;
}

.gelernt {
  color:black;
}

.ungelernt {
  color:gray;
}

.tip_content .tip {
  border: 0;
}

.tip_content .tip img {
  width: 100px;
  height: 100px;
  max-width: 100px;
  max-height: 100px;
}

#chatterList {
  position: absolute;
  font-weight: 600;
  width: 250px;
  border: 1px solid #402C13;
  margin: 0px;
  background-color: #402C13;
  color: #fff4df;
}

#chatterList > div {
  height: 5.4em;
  font-weight: 300;
  overflow: hidden;
  background-color: #fff4df;
  text-align: left;
  font-size: 1em;
}

.inlimit {
  color: #402C13;
  width: 3.5em;
}

.toomuch {
  color: #AD4234;
  width: 3.5em;
}

/* -- Trefferzonenanzeige --------------------------------------------------- */
.verwundet {
  position: absolute;
  display: inline;
  width: 15px;
  height: 15px;
  float: left;
  background: url(../../bilder/kampf/verwundet.png) no-repeat;
}

div.trefferzonen div {
  position: absolute;
  width: 10px;
  height: 12px;
  float: left;
}

div.trefferzonen .wunde {
  width: 5px;
  height: 5px;
  margin: 0px;
  position: absolute;
  float: left;
  background: url(../../bilder/trefferzonen/wunde.png) no-repeat;
}

div.trefferzonen #rs_kopf {
  margin-left: 47px;
  margin-top: 17px;
}

div.trefferzonen #rs_rarm {
  margin-left: 5px;
  margin-top: 67px;
}

div.trefferzonen #rs_larm {
  margin-left: 89px;
  margin-top: 67px;
}

div.trefferzonen #rs_brust {
  margin-left: 42px;
  margin-top: 49px;
}

div.trefferzonen #rs_ruecken {
  margin-left: 52px;
  margin-top: 49px;
}

div.trefferzonen #rs_uleib {
  margin-left: 47px;
  margin-top: 86px;
}

div.trefferzonen #rs_rbein {
  margin-left: 33px;
  margin-top: 173px;
}

div.trefferzonen #rs_lbein {
  margin-left: 61px;
  margin-top: 173px;
}

div.trefferzonen #w1_kopf {
  margin-left: 42px;
  margin-top: 10px;
}

div.trefferzonen #w2_kopf {
  margin-left: 49px;
  margin-top: 10px;
}

div.trefferzonen #w3_kopf {
  margin-left: 56px;
  margin-top: 10px;
}

div.trefferzonen #w1_rarm {
  margin-left: 11px;
  margin-top: 60px;
}

div.trefferzonen #w2_rarm {
  margin-left: 16px;
  margin-top: 55px;
}

div.trefferzonen #w3_rarm {
  margin-left: 21px;
  margin-top: 50px;
}

div.trefferzonen #w1_larm {
  margin-left: 78px;
  margin-top: 50px;
}

div.trefferzonen #w2_larm {
  margin-left: 83px;
  margin-top: 55px;
}

div.trefferzonen #w3_larm {
  margin-left: 88px;
  margin-top: 60px;
}

div.trefferzonen #w1_brust {
  margin-left: 42px;
  margin-top: 42px;
}

div.trefferzonen #w2_brust {
  margin-left: 49px;
  margin-top: 42px;
}

div.trefferzonen #w3_brust {
  margin-left: 56px;
  margin-top: 42px;
}

div.trefferzonen #w1_bauch {
  margin-left: 42px;
  margin-top: 79px;
}

div.trefferzonen #w2_bauch {
  margin-left: 49px;
  margin-top: 79px;
}

div.trefferzonen #w3_bauch {
  margin-left: 56px;
  margin-top: 79px;
}

div.trefferzonen #w1_rbein {
  margin-left: 35px;
  margin-top: 152px;
}

div.trefferzonen #w2_rbein {
  margin-left: 35px;
  margin-top: 159px;
}

div.trefferzonen #w3_rbein {
  margin-left: 35px;
  margin-top: 166px;
}

div.trefferzonen #w1_lbein {
  margin-left: 63px;
  margin-top: 152px;
}

div.trefferzonen #w2_lbein {
  margin-left: 63px;
  margin-top: 159px;
}

div.trefferzonen #w3_lbein {
  margin-left: 63px;
  margin-top: 166px;
}

div.trefferzonen .rs0 {
  background: url(../../bilder/trefferzonen/rs0.png) no-repeat;
}

div.trefferzonen .rs1 {
  background: url(../../bilder/trefferzonen/rs1.png) no-repeat;
}

div.trefferzonen .rs2 {
  background: url(../../bilder/trefferzonen/rs2.png) no-repeat;
}

div.trefferzonen .rs3 {
  background: url(../../bilder/trefferzonen/rs3.png) no-repeat;
}

div.trefferzonen .rs4 {
  background: url(../../bilder/trefferzonen/rs4.png) no-repeat;
}

div.trefferzonen .rs5 {
  background: url(../../bilder/trefferzonen/rs5.png) no-repeat;
}

div.trefferzonen .rs6 {
  background: url(../../bilder/trefferzonen/rs6.png) no-repeat;
}

div.trefferzonen .rs7 {
  background: url(../../bilder/trefferzonen/rs7.png) no-repeat;
}

div.trefferzonen .rs8 {
  background: url(../../bilder/trefferzonen/rs8.png) no-repeat;
}

/* -- Tooltip --------------------------------------------------------------- */
div.tip,
span.tip,
a.tip,
a.tip:link,
a.tip:hover,
a.tip:visited,
a.tip:active {
  text-decoration: none;
  cursor:help;
  border-bottom: 1px dotted #D46400;
  color: #003465;
}

/* -- Jobangebote im Rathaus ------------------------------------------------ */
.job { margin: 5px; width: 700px; }
.job  td{ background-color: #ECECEC; }
#job_ende { max-width: 90%; background-color: #F6C46F; }


.marktstand {
  max-height: 28em; /* ~ 10 Waren */
  overflow: auto;
}

.marktstand table {
  width: 98%;
  margin: 3px auto 3px auto;
}

.auswahl table {
  width: 98%;
  margin: 3px auto 3px auto;
}

.ortsbeschreibung {
  width: 98%;
  overflow: auto;
  margin: 3px auto 3px auto;
  background: #FFF4DF;
  border: 1px solid #402C13;
  padding: 5px;
}
.ortsbeschreibung img{
  width: 30%;
  float: right;
}

/* -- Accordion ------------------------------------------------------------- */
.accordion_toggle {
  text-align: left;
  display: block;
  overflow: hidden;
  height: 30px;
  width: 98%;
  background-color: #DCE1E5;
  line-height: 30px;
  color: #402C13;
  cursor: pointer;
  margin: 0;
  border-top: 1px solid #A9B8C2;
  border-left: 1px solid #A9B8C2;
  border-right: 1px solid #A9B8C2;
  padding-left: 10px;
}

.accordion_toggle2 {
  position: relative;
  text-align: left;
  display: block;
  overflow: hidden;
  height: 30px;
  width: 98%;
  background-color: #DCE1E5;
  line-height: 30px;
  color: #402C13;
  cursor: pointer;
  margin: 0;
  border-top: 1px solid #A9B8C2;
  border-left: 1px solid #A9B8C2;
  border-right: 1px solid #A9B8C2;
  padding-left: 10px;
}

.leave {
  display: block;
  overflow: hidden;
  height: 30px;
  width: 98%;
  background-color: #DCE1E5;
  line-height: 30px;
  color: #402C13;
  cursor: pointer;
  margin: 0;
  border-bottom: 1px solid #003465;
  padding-left: 10px;
}

.accordion_toggle_active {
  background-color: #C0C8D0;
  color: #003465;
  border-bottom: 1px solid #FFF4DF;
}

.accordion_content {
  color: #402C13;
  overflow: hidden;
  width: 99%;
  padding-left: 0;
  text-align: left;
  max-height: 0;
  opacity: 0;
}

.accordion_content2 {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
}

/* -- Chat Toggle Button im Gruppen-Accordion ------------------------------- */
.chat-toggle-btn {
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  padding: 0 10px;
  cursor: pointer;
  font-size: 0.9em;
  line-height: 30px;
  color: #003465;
  background: #DCE1E5;
  border: none;
  border-left: 1px solid rgba(0, 52, 101, 0.3);
}


.chat-toggle-btn:hover {
  background: #C0C8D0;
}

.chat-toggle-icon {
  display: inline-block;
}

#chat_gruppe_wrapper {
  overflow: hidden;
}

#chat_gruppe_wrapper.chat-hidden {
  height: 0;
}

/* -- Sortable Tables ------------------------------------------------------- */
table.sortable tr.odd td {
  background-color: #DCE1E5;
}
table.sortable tr.even td {
  background-color: #ECECEC;
}

/* -- Kampfbericht ---------------------------------------------------------- */
.kampf td{
  text-align:center;
  padding:1px;
}

.held {
  color: #00A100;
}

.gegner {
  color: #DC0000;
}

.kampf .name_single_held {
}

.kampf .name_single_gegner {
}

.kampf .name_multi_held {
  color: #00A100;
}

.kampf .name_multi_gegner {
  color: #DC0000;
}

.kampf .beschreibung {
  color: #333333;
}

/* -- Cash Symbole (Dukaten, Silberlinge, Heller) ------------------------------*/

.game p img.cash {
  margin: 1px;
  width: 17px;
  height: 14px;
  float: none;
  display: inline;
}

/* -- AOQML --------------------------------------------------------------------------*/
.eoq {
  text-align:center;
}

.aoqml li {
  list-style-type: disc;
  margin: 0.2em 1.2em;
}

.aoqml q {
  font-style: italic;
  color: #505050;
}

.aoqml q span.tip {
  color: #505050;
}

.aoqml span.cite {
  font-style: italic;
  color: #505050;
  margin-left:1em;
}

.aoqml cite {
  font-style: italic;
  color: #505050;
  margin-left:1em;
}

.aoqml a {
  text-decoration: underline;
}

.aoqml .debug {
  text-align: center;
  color: gray;
}

.aoqml .antamar {
  font-style: italic;
  color: sienna;
  border: none;
}

.aoqml p img {
  width: auto;
}

.aoqml .maze img {
  padding: 0;
  margin: 0;
}

/* -- held_wechsel -------------------------------------------------------------*/
.white_box {
  border: 1px solid black;
  background-color: #ECECEC;
  padding: 20px;
  text-align: center;
}

.bold {
  font-weight: bold;
}

#Ladebalken {
  margin: 0 auto;
  padding: 0px;
  width: 200px;
}

.geladen {
  max-width: 200px;
  height: 12px;
  margin-top: 1px;
  background-image: url(../../bilder/ladebalken/strich.png);
}
.geladen div{
  width: 200px;
  height: 12px;
  margin: 0;
  padding: 0;
  background-color: transparent;
  background-image: url(../../bilder/ladebalken/rahmen.png);
}

.geladen_text {
  width: 200px;
  background-color: transparent;
}

/* -- routenplaner -------------------------------------------------------------*/

.outputRoutenplaner {
  text-align: center;
  border: none;
  margin: 0;
  table-layout: fixed;
  font-size: smaller;
  width: 95%;
  overflow: auto;
}

/* -- regiezna -----------------------------------------------------------------*/
.egiezna {
  text-align: center;
  border: 1px double darkgray;
  width: 93.25%;
}

.egiezna_kopf {
  width: 100%;
  max-width: 100%;
  font-size: 0.8em;
  border-bottom: 1px double darkgray;
}

.egiezna_inhalt {
  padding: 5px;
  text-align: left;
}

.egiezna_spam_lnk {
  cursor: pointer;
  text-align: right;
  font-size: 0.6em;
  padding-right: 3px;
}

.regiezna {
  width: 95%;
  max-width: 500px;
}

.regiezna hr {
  width: 10%;
  color: #402C13;
}

.regiezna_top {
  text-align: center;
  vertical-align: middle;
  height: 80px;
  width: 500px;
  max-width: 500px;
  background-repeat: no-repeat;
}

.regiezna_title {
  padding: 8px 0px 0px 0px;
  height: 72px;
  background-repeat: no-repeat;
  background-position: center 20px;
}

.regiezna_middle h3 {
  padding: 0px 0px 0px 0px;
  text-align: center;
  vertical-align: middle;
  width: 500px;
  font-size: 2.0em;
  line-height: 1em;
  font-weight: 600;
  color: #402C13;
}

.regiezna_middle h3:first-letter {
  font-size: 1.4em;
  line-height: 1em;
  font-weight: 900;
  color: #AD4234;
  vertical-align: middle;
}

.regiezna_middle {
  text-align: center;
  background-repeat: repeat-y;
  width: 500px;
  max-width: 500px;
  min-width: 500px;
}

.regiezna_bottom {
  background-repeat: no-repeat;
  height: 80px;
  width: 500px;
  max-width: 500px;
}

.regiezna_inhalt {
  padding: 10px 40px 10px 40px;
  max-width: 500px;
}

.regiezna_rubrik {
  border: 1px solid #402C13;
  width: 96%;
}

.regiezna_rubrik_beschreibung {
  font-size: 0.8em;
  text-align: left;
  font-style: oblique;
  margin-bottom: 5px;
  border-bottom: 1px dotted #402C13;
}

.regiezna_rubrik_inhalt {
  padding-bottom: 10px;
  max-height: 200px;
  overflow: auto;
  text-align: center;
}

/* -- Console ------------------------------------------------------------------*/

.console {
  position: absolute;
  top: 10px;
  left: 10px;
  width: 400px;
  height: 250px;
  max-height: 250px;
  border: 2px groove black;
  z-index: 60000;
  background-color: #D3913C;
}

.console .console_header {
  width: 100%;
  height: 10%;
  max-height: 10%;
  color: #402C13;
  background-color: #D3913C;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  font-weight: bold;
}

.console .console_header .console_close_button {
  width: 16px;
  height: 16px;
  position: absolute;
  top: 2px;
  right: 2px;
  vertical-align: top;
}

.console .console_outputwrap {
  width: 100%;
  max-width: 100%;
  height: 80%;
  max-height: 80%;
  font-family: monospace;
  font-size: 1em;
  background-color: #FFD98F;
  text-align: left;
  line-height: 13px;
  overflow: auto;
  border-top: 1px solid black;
  margin-top: -1px;
}

.console .console_output {
  padding: 2px;
}

.console .console_footer {
  width: 100%;
  height: 10%;
  max-height: 10%;
  font-size: 1em;
  background-color: #D3913C;
  text-align: center;
  line-height: 13px;
  overflow: auto;
  display: inline-block;
  border-top: 1px solid black;
  margin-top: -1px;
}

.console .console_footer_checkbox {
  width: 13px;
  height: 13px;
  vertical-align: top;
}

.console .console_footer_checkbox_label {
  text-align: left;
  color: black;
  width: 45%;
  height: 2.5em;
  display: inline-block;
}

.console .console_footer_checkbox_general {
  width: 13px;
  height: 13px;
  vertical-align: top;
}

.console .console_footer_checkbox__general_label {
  text-align: left;
  color: black;
  width: 45%;
  height: 2.5em;
  display: inline-block;
}

/**
 * Hauptseite
 */
div#gameContent { text-align: center; }
#ajax_loader { float: left; }
div.spielSeite { text-align: left; }
div.weitere_helden { text-align: center; padding-bottom: 10px; }

/**
 * Kampf
 */
div.kampfseite div#meldung { margin: 10px; }
div.kampfmanoever table td { text-align: left; }
div.kampfmanoever select.input { width: 250px; }

/**
 * Fertigkeiten/Talente
 */
div.talenteBox table.sortable {
  width: 75%;
  text-align: center; 
}

/**
 * Orden
 */
div.orden table td {
  text-align: left;
}

div.orden div#ausspionierenBox {
  margin: 40px;
}

/* Tab-Navigation - minimalistisch (einheitlich für alle Bereiche) */
p.tab-nav a,
p.tab-nav span.aktiv {
    background-color: transparent;
    color: #006597;
    border: 1px solid #323D4F;
}
p.tab-nav a:hover {
    background-color: #f0f0f0;
}
p.tab-nav span.aktiv {
    background-color: #323D4F;
    color: #fff;
}

/**
 * Notizen
 */
div.notiz {
  text-align: center;
}

div.notiz table {
  width: 95%;
  text-align: center;
  margin: 10px auto;
}

div.notiz table textarea {
  width: 99%;
}

#stadt_info_wappen {
  display: none;
}

/**
 * im Rathaus
 */

div.rathaus, div.illegaleAufgaben {
  padding: 10px;
  max-width: 800px;
  text-align: center;
  margin: auto;
}

div.rathaus table, div.illegaleAufgaben table {
  text-align: left;
}

div.illegaleAufgaben table th {
  text-align: center;
}

div.illegaleAufgaben td.zurueck {
  text-align: center;
}

div.illegaleAufgaben td.inhalt {
  padding-left: 10px;
}

div.illegaleAufgaben img.float {
  max-width: 450px;
  width: 45%;
  float: right;
  margin-left: 10px;
}

/**
 * Kampf- und Lernschule
 */
div.kampfschule, div.lernschule {
  padding: 10px;
}

div.kampfschule table td {
  text-align: left;
}

div.lernschule table td {
  text-align: left;
}

/**
 * Markstand
 */
table.markstand {
  margin: 0;
  border: 0;
  border-spacing: 0;
  border-collapse: collapse;
  width: 100%;
  height: 100%;
}

/**
 * Bank
 */
table.bank {
  text-align: left;
}

table.bank td.bank_beschreibung div.bank_bild {
  width: 30%;
  float: left;
}

table.bank td.bank_beschreibung div.bank_bild img {
  width: 93%;
}

table.bank td.bank_beschreibung div.beschreibung_txt {
  line-height: 100%;
}

/* Bank-Sektionen */
.bank-section {
    background: #f5f5f5;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 15px;
    margin-bottom: 15px;
}

.bank-section h3 {
    margin: 0 0 12px 0;
    padding-bottom: 8px;
    border-bottom: 1px solid #ddd;
    font-size: 1.1em;
}

.bank-section h4 {
    margin: 10px 0 8px 0;
    font-size: 1em;
}

.bank-overview .bank-balance {
    display: flex;
    gap: 40px;
    margin-bottom: 10px;
}

.bank-overview .balance-item {
    display: flex;
    flex-direction: column;
}

.bank-overview .balance-label {
    font-size: 0.85em;
    color: #666;
}

.bank-overview .balance-value {
    font-size: 1.3em;
    font-weight: bold;
}

.bank-overview .bank-info {
    margin: 10px 0 0 0;
    font-size: 0.9em;
    color: #666;
}

.bank-currency-input {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.bank-actions {
    margin-top: 10px;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.bank-account-close {
    margin-top: 10px;
    text-align: right;
    font-size: 0.9em;
}

.bank-subsection {
    padding: 10px 0;
    border-bottom: 1px solid #eee;
}

.bank-subsection:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.bank-creditletter-scope {
    margin: 8px 0;
}

.bank-creditletter-scope label {
    margin-right: 15px;
}

.bank-redeem-input {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

.bank-redeem-input label {
    white-space: nowrap;
}

.bank-transfers {
    width: 100%;
    border-collapse: collapse;
    margin: 10px 0;
    font-size: 0.95em;
}

.bank-transfers th {
    text-align: left;
    padding: 6px 8px;
    border-bottom: 2px solid #ddd;
    font-weight: normal;
    color: #666;
}

.bank-transfers td {
    padding: 6px 8px;
    border-bottom: 1px solid #eee;
    vertical-align: middle;
}

.bank-transfers .phrase-text {
    font-family: monospace;
    white-space: nowrap;
}

.bank-transfers .transfer-amount {
    white-space: nowrap;
}

.bank-transfers .transfer-note input {
    width: 100%;
    max-width: 150px;
}

/**
 * Ortsübersicht. Beachte: antamarGebaeudeIcons.css wird nicht geladen im simple-Skin.
 */
ul.ort_gebaeude {
  margin: 10px;
}

ul.ort_gebaeude li {
  background-repeat: no-repeat;
  background-position: 0 50%;
  background-color: transparent;
  padding-left: 20px;
  list-style: none;
  line-height: 150%;
}

/**
 * auf Reisen
 */
span.probe { font-style: italic; cursor:help; border-bottom: 1px dotted #402C13; }
span.probe_ohne_tip { font-style: italic; border-bottom: 1px dotted #402C13; }
div.tag span.zb_debug_output { color: blue; }
div.tag span.zb_debug_output span { padding-right: 20px; }
div.tag q  { font-style: italic; color: #505050; } /* vgl. .aoqml q */

/**
 * Gruppenaktionen
 */
div.gruppe_szene {
  margin: 10px;
  background-color: white;
  color: black;
  padding: 10px;
  font-size: 1.0em;
  line-height: 1.2em;
  border: 1px solid black;
  text-align: left;
}

div.gruppe_heldenuebersicht {
  background-color: #DCE1E5;
}

/**
 * Nachrichten
 */
div.nachrichten table#nachrichten, div.nachrichten table#rp_liste { width: 98%; margin: 3px auto 3px auto; }
div.nachrichten table#nachrichten td.betreff { text-align: left; }
table.tableNachrichten { width: 85%; }
table.tableNachrichten td.nachricht_inhalt { text-align: left; }

/* Nachrichten Tabs - Simple Theme */
.nachrichten-tabs .tab {
    border: 1px solid #A9B8C2;
    background-color: #DCE1E5;
    color: #323D4F;
}
.nachrichten-tabs .tab:hover {
    background-color: #c8d0d8;
    color: #006597;
}
.nachrichten-tabs .tab.active {
    background-color: #ECECEC;
    border-bottom-color: #ECECEC;
    box-shadow: inset 0 -3px 0 0 #006597;
}

/* Nachrichten Editor - Simple Theme */
.nachrichten-editor {
    background-color: #ECECEC;
    border: 1px solid #A9B8C2;
}
.nachrichten-editor h3 {
    color: #323D4F;
    border-bottom-color: #A9B8C2;
}
.editor-actions {
    border-top-color: #A9B8C2;
}

/* Nachrichten/RP DataTables - Simple Theme */
#nachrichten.dataTable thead th, #rp_liste.dataTable thead th {
    background-color: #DCE1E5;
    color: #003465;
    border-bottom: 1px solid #A9B8C2;
}
#nachrichten.dataTable tbody tr.odd, #rp_liste.dataTable tbody tr.odd {
    background-color: #ECECEC;
}
#nachrichten.dataTable tbody tr.even, #rp_liste.dataTable tbody tr.even {
    background-color: #fff;
}
#nachrichten.dataTable tbody tr:hover, #rp_liste.dataTable tbody tr:hover {
    background-color: #c8d0d8 !important;
}
#nachrichten.dataTable td a, #rp_liste.dataTable td a {
    color: #006597;
}
#nachrichten.dataTable td a:hover, #rp_liste.dataTable td a:hover {
    color: #003465;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: #DCE1E5 !important;
    border-color: #A9B8C2 !important;
    color: #003465 !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: #c8d0d8 !important;
    border-color: #A9B8C2 !important;
    color: #003465 !important;
}

/**
 * Arena
 */
div.arena img.arena_img1 { width: 60%; text-align: right; }
div.arena img.arena_img2 { width: 30%; text-align: right; }

/**
 * Gepäck
 */
div.gepaeck_inhalt_box { background-color: #ECECEC; border: 1px solid black; }
div.gepaeck_inhalt table.nahwaffen, div.gepaeck_inhalt table.schilde, div.gepaeck_inhalt table.ruestung, div.gepaeck_inhalt table.fernwaffen { clear:none; margin:0; }

/**
 * Kampfseite
 */
div.kampf_v2 .simple_weitere_waren { float:right; font-size:90%; margin-right:5px; }

/**
 * Transfer, Handel
 */
div.transferobject { margin: 2px 0; }
table.markt td.trenner { background: none; }
table.transfer div.warencontainer_eigener_stand { float: none; height: auto; }
table.transfer div.tobj { float: left; padding: 2px 0; }

/**
 * Login Seite
 */
form.loginForm div.introText { line-height: 1.3em; font-size: 1.2em; }
form.loginForm div.registerBox { margin-top: 30px; margin-bottom: 50px; }

.loginTable th, td, input, form.loginForm table.loginTable select { font-size: 110%; line-height: 150%; }
.loginTable input#submit { margin: 20px; padding: 5px; }
.loginTable .klein { font-size: 0.8em; line-height: 0.9em; }
.introText { margin: 1em;}

/**
@media only screen and (min-width: 1024px) {
  .loginTable th, td, input, form.loginForm table.loginTable select { font-size: 110%; line-height: 150%; }
}*/


/**
* RSS News Anzeige
 */
.RssTeaser {
  border: 1px solid #888888;
  box-shadow: 0 4px 8px #888;
  margin: 1em auto; width: 780px;
  border-radius: 8px;
  text-align: justify;
  padding: 0.9em;
}

.RssTeaser h1{
  line-height: 110%;
  padding: 5px;
}

.RssTeaser h2{
  line-height: 110%;
  padding: 5px;
}

.RssTeaser p{
  line-height: 110%;
}

/* ablegen Link in Kampfseite */
span.ablegen_link a{
  top: 0;
  font-size: 1rem;
}

/**
Talente Übersicht
 */
td.fertigkeiten {
    text-align: left;
}

/**
Buchquesten
 */
div.buch_linke_seite p { color: #0a0a0a; font-size: 0.9rem }
div.buch_rechte_seite p { color: #0a0a0a; font-size: 0.9rem }
div.buch_linke_seite q { color: #0a0a0a; font-size: 0.9rem }
div.buch_rechte_seite q { color: #0a0a0a; font-size: 0.9rem }

div.privathaus_bild img{
  display: none;
}
/* ============================================
 * Gespann-Styles (Mehrspänner)
 * ============================================ */
div.begleiter .gespann_box { background:#DCE1E5; border:1px solid #A9B8C2; border-radius:4px; padding:10px; margin:5px 0; }
div.begleiter .gespann_header { margin-bottom:8px; padding-bottom:5px; border-bottom:1px solid #A9B8C2; }
div.begleiter .gespann_header strong { font-size:1.05em; color:#323D4F; }
div.begleiter .gespann_info { color:#666; font-size:0.9em; margin-left:8px; }
div.begleiter .gespann_warnung { color:#c00; font-size:0.85em; margin-left:10px; font-weight:bold; }
div.begleiter .gespann_liste { list-style:none; margin:0 0 10px 0; padding:0; }
div.begleiter .gespann_liste li { padding:5px 8px; margin:3px 0; background:#ECECEC; border:1px solid #A9B8C2; border-radius:3px; display:flex; align-items:center; gap:10px; }
div.begleiter .gespann_leittier { background:#d8e8d8 !important; border-color:#8cb89c !important; }
div.begleiter .gespann_liste .tier_name { font-weight:bold; flex:1; color:#323D4F; }
div.begleiter .gespann_liste .tier_info { color:#666; font-size:0.85em; }
div.begleiter .gespann_liste .tier_zugkraft { color:#006597; font-size:0.85em; min-width:100px; text-align:right; }
div.begleiter .gespann_summe { padding-top:8px; border-top:1px solid #A9B8C2; font-size:0.95em; }
div.begleiter .gespann_anspannen { margin-top:10px; padding-top:10px; border-top:1px dashed #A9B8C2; }
div.begleiter .gespann_anspannen select { padding:4px 8px; margin-right:8px; min-width:200px; border:1px solid #A9B8C2; background:#fff; }
div.begleiter .gespann_anspannen button { padding:4px 12px; cursor:pointer; background:#DCE1E5; color:#323D4F; border:1px solid #A9B8C2; border-radius:3px; }
div.begleiter .gespann_anspannen button:hover { background:#4787A7; color:#fff; }
div.begleiter .btn_abspannen { padding:2px 8px; font-size:0.8em; cursor:pointer; background:#ECECEC; border:1px solid #A9B8C2; border-radius:3px; color:#323D4F; }
div.begleiter .btn_abspannen:hover { background:#f8e0e0; border-color:#c88; }
div.begleiter .angespannt_info { background:#ECECEC; border:1px solid #A9B8C2; border-radius:4px; padding:10px; display:flex; align-items:center; gap:10px; }
div.begleiter .angespannt_icon { font-size:1.3em; }
div.begleiter .anspannen_option { padding:5px 0; }
div.begleiter .anspannen_option select { padding:4px 8px; margin-right:8px; min-width:200px; border:1px solid #A9B8C2; background:#fff; }
div.begleiter .anspannen_option button { padding:4px 12px; cursor:pointer; background:#DCE1E5; color:#323D4F; border:1px solid #A9B8C2; border-radius:3px; }
div.begleiter .anspannen_option button:hover { background:#4787A7; color:#fff; }

/**
 * Fertigkeiten-UI (Hell/Blaugrau Theme - Simple)
 */
.fertigkeiten-ep-info {
    background: rgba(50,61,79,0.08);
    border: 1px solid #A9B8C2;
    border-radius: 4px;
    padding: 10px 15px;
    margin-bottom: 15px;
    display: flex;
    justify-content: center;
    gap: 30px;
    flex-wrap: wrap;
}
.fertigkeiten-ep-info .ep-value { font-weight: bold; font-size: 1.1em; color: #006597; }
.fertigkeiten-ep-info .ep-label { color: #666; }

.fertigkeiten-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
    margin-bottom: 15px;
    border-bottom: 2px solid #A9B8C2;
    padding-bottom: 0;
}
.fertigkeiten-tab {
    padding: 8px 14px;
    border-radius: 4px 4px 0 0;
    cursor: pointer;
    background: #ECECEC;
    border: 1px solid #A9B8C2;
    border-bottom: none;
    margin-bottom: -2px;
    text-decoration: none;
    color: #323D4F;
    transition: background 0.2s, border-color 0.2s;
}
.fertigkeiten-tab:hover { background: #DCE1E5; }
.fertigkeiten-tab.active {
    background: #fff;
    font-weight: bold;
    border-color: #A9B8C2;
    border-bottom: 2px solid transparent;
    position: relative;
}
.fertigkeiten-tab.active::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    height: 2px;
    background: #fff;
}

.fertigkeiten-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 15px;
    justify-content: center;
}
.fertigkeiten-filter-btn {
    padding: 5px 12px;
    border-radius: 15px;
    border: 1px solid #A9B8C2;
    background: #ECECEC;
    cursor: pointer;
    font-size: 0.9em;
    transition: all 0.2s;
    color: #323D4F;
}
.fertigkeiten-filter-btn:hover { background: #DCE1E5; }
.fertigkeiten-filter-btn.active { background: #C0C8D0; font-weight: bold; }
.fertigkeiten-filter-btn .count {
    background: rgba(50,61,79,0.15);
    border-radius: 10px;
    padding: 1px 6px;
    font-size: 0.85em;
    margin-left: 4px;
}

.fertigkeiten-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 12px;
    margin-bottom: 20px;
}

.fertigkeit-card {
    background: #fff;
    border: 1px solid #A9B8C2;
    border-radius: 6px;
    padding: 12px;
    text-align: left;
    transition: box-shadow 0.2s, border-color 0.2s;
}
.fertigkeit-card:hover {
    box-shadow: 0 2px 8px rgba(50,61,79,0.15);
    border-color: #006597;
}
.fertigkeit-card.nicht-steigerbar { opacity: 0.7; }
.fertigkeit-card.maximum-erreicht {
    background: rgba(0,161,0,0.05);
    border-color: rgba(0,161,0,0.4);
}

.fertigkeit-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}
.fertigkeit-name { font-weight: bold; font-size: 1.05em; color: #323D4F; }
.fertigkeit-name .tip { cursor: help; border-bottom: 1px dotted #A9B8C2; color: #006597; }
.fertigkeit-attribute {
    color: #666;
    font-size: 0.9em;
    white-space: nowrap;
}

.fertigkeit-progress-container { margin: 10px 0; }
.fertigkeit-progress-bar {
    height: 20px;
    background: #ECECEC;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    border: 1px solid #A9B8C2;
}
.fertigkeit-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #006597, #4787A7);
    border-radius: 10px;
    transition: width 0.3s ease;
}
.fertigkeit-progress-fill.maximum {
    background: linear-gradient(90deg, rgba(0,161,0,0.6), rgba(0,161,0,0.8));
}
.fertigkeit-progress-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.85em;
    font-weight: bold;
    color: #323D4F;
    text-shadow: 0 0 3px rgba(255,255,255,0.8);
}

.fertigkeit-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
    flex-wrap: wrap;
    gap: 8px;
}
.fertigkeit-ep-info { font-size: 0.85em; color: #666; }
.fertigkeit-actions { display: flex; gap: 6px; }
.fertigkeit-steigern-btn {
    padding: 6px 14px;
    border-radius: 4px;
    border: 1px solid #A9B8C2;
    background: #DCE1E5;
    cursor: pointer;
    font-size: 0.9em;
    transition: all 0.2s;
    text-decoration: none;
    color: #323D4F;
}
.fertigkeit-steigern-btn:hover {
    background: #4787A7;
    border-color: #006597;
    color: #fff;
}
.fertigkeit-steigern-btn:disabled,
.fertigkeit-steigern-btn.disabled { opacity: 0.5; cursor: not-allowed; }
.fertigkeit-steigern-btn.primary {
    background: rgba(0,100,0,0.15);
    border-color: rgba(0,100,0,0.4);
    color: #006400;
}
.fertigkeit-steigern-btn.primary:hover { background: rgba(0,100,0,0.3); }

.fertigkeit-voraussetzungen {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px dashed #A9B8C2;
    font-size: 0.85em;
}
.fertigkeit-voraussetzungen summary { cursor: pointer; color: #666; }
.fertigkeit-voraussetzungen-list { margin-top: 5px; padding-left: 15px; }

.fertigkeiten-aktivieren {
    background: #ECECEC;
    border: 1px dashed #A9B8C2;
    border-radius: 6px;
    padding: 15px;
    margin-top: 20px;
}
.fertigkeiten-aktivieren h3 { margin: 0 0 10px 0; font-size: 1em; color: #323D4F; }
.fertigkeiten-aktivieren select {
    padding: 8px;
    border-radius: 4px;
    border: 1px solid #A9B8C2;
    background: #fff;
    min-width: 200px;
}

.fertigkeit-status {
    font-size: 0.8em;
    padding: 2px 8px;
    border-radius: 10px;
    margin-left: 8px;
}
.fertigkeit-status.blockiert { background: rgba(255,0,0,0.1); color: #c00; }
.fertigkeit-status.ep-fehlen { background: rgba(255,165,0,0.15); color: #b86e00; }
.fertigkeit-status.maximum { background: rgba(0,161,0,0.1); color: #008000; }

/* Fertigkeiten Tipp-Banner */
.fertigkeiten-tipp-banner {
    background: rgba(0,101,151,0.1);
    border: 1px solid #A9B8C2;
    border-left: 4px solid #006597;
    border-radius: 6px;
    padding: 12px 15px;
    margin-bottom: 15px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    text-align: left;
}
.fertigkeiten-tipp-banner img { width: 24px; height: 24px; flex-shrink: 0; margin-top: 2px; }
.fertigkeiten-tipp-banner .tipp-content { flex: 1; line-height: 1.5; }
.fertigkeiten-tipp-banner h2 { margin: 0 0 8px 0; font-size: 1.1em; color: #323D4F; }
.fertigkeiten-tipp-banner p { margin: 0 0 6px 0; font-size: 0.95em; }
.fertigkeiten-tipp-banner p:last-child { margin-bottom: 0; }
.fertigkeiten-tipp-banner b { color: #006597; }

@media (max-width: 700px) {
    .fertigkeiten-grid { grid-template-columns: 1fr; }
    .fertigkeiten-tabs { gap: 2px; }
    .fertigkeiten-tab { padding: 6px 10px; font-size: 0.9em; }
    .fertigkeiten-ep-info { flex-direction: column; gap: 5px; text-align: center; }
}

/**
 * Zauber-UI (Hell/Blaugrau Theme - Simple)
 */
.zauberBox { padding: 10px; }

.zauber-ep-info {
    background: rgba(50,61,79,0.08);
    border: 1px solid #A9B8C2;
    border-radius: 4px;
    padding: 10px 15px;
    margin-bottom: 15px;
    display: inline-block;
    color: #323D4F;
}
.zauber-ep-info .ep-label { color: #666; }
.zauber-ep-info .ep-value { font-weight: bold; font-size: 1.1em; color: #006597; }

.zauber-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 15px;
    justify-content: center;
}
.zauber-filter-btn {
    padding: 5px 12px;
    border-radius: 15px;
    border: 1px solid #A9B8C2;
    background: #ECECEC;
    color: #323D4F;
    cursor: pointer;
    font-size: 0.9em;
    transition: all 0.2s;
}
.zauber-filter-btn:hover { background: #DCE1E5; }
.zauber-filter-btn.active { background: #C0C8D0; font-weight: bold; }
.zauber-filter-btn .count {
    background: rgba(50,61,79,0.15);
    border-radius: 10px;
    padding: 1px 6px;
    font-size: 0.85em;
    margin-left: 4px;
}

.zauber-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 12px;
    margin-bottom: 20px;
}

.zauber-card {
    background: #fff;
    border: 1px solid #A9B8C2;
    border-radius: 6px;
    padding: 12px;
    text-align: left;
    color: #323D4F;
    transition: box-shadow 0.2s, border-color 0.2s;
}
.zauber-card:hover {
    box-shadow: 0 2px 8px rgba(50,61,79,0.15);
    border-color: #006597;
}
.zauber-card.im-kampf-aktiv {
    border-color: rgba(0,161,0,0.6);
    border-width: 2px;
    background: rgba(0,161,0,0.05);
}
.zauber-card.maximum-erreicht {
    background: rgba(0,161,0,0.05);
    border-color: rgba(0,161,0,0.4);
}
.zauber-card.nicht-steigerbar { }

.zauber-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}
.zauber-name { flex: 1; font-weight: bold; font-size: 1.05em; color: #323D4F; }
.zauber-name a {
    color: #006597;
    text-decoration: none;
    cursor: help;
    border-bottom: 1px dotted #A9B8C2;
}
.zauber-name a:hover { color: #D46400; }
.zauber-name img { vertical-align: middle; margin-right: 5px; }

.zauber-status {
    font-size: 0.8em;
    padding: 2px 8px;
    border-radius: 10px;
    margin-left: 8px;
    display: inline-block;
    margin-top: 4px;
}
.zauber-status.maximum { background: rgba(0,161,0,0.1); color: #008000; }
.zauber-status.ep-fehlen { background: rgba(255,165,0,0.15); color: #b86e00; }

.zauber-attribute { color: #666; font-size: 0.9em; white-space: nowrap; }

.zauber-progress-container { margin: 10px 0; }
.zauber-progress-bar {
    height: 20px;
    background: #ECECEC;
    border: 1px solid #A9B8C2;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
}
.zauber-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #006597, #4787A7);
    border-radius: 10px;
    transition: width 0.3s ease;
}
.zauber-progress-fill.maximum {
    background: linear-gradient(90deg, rgba(0,161,0,0.6), rgba(0,161,0,0.8));
}
.zauber-progress-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.85em;
    font-weight: bold;
    color: #323D4F;
    text-shadow: 0 0 3px rgba(255,255,255,0.8);
}

.zauber-details {
    font-size: 0.85em;
    color: #323D4F;
    margin-bottom: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.zauber-detail { background: #ECECEC; padding: 3px 8px; border-radius: 3px; border: 1px solid #A9B8C2; }
.zauber-detail-label { color: #666; }

.zauber-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-top: 10px;
    border-top: 1px solid #A9B8C2;
}

.zauber-kampf-toggle { display: flex; align-items: center; }
.zauber-toggle-label { display: flex; align-items: center; cursor: pointer; gap: 8px; }
.zauber-kampf-checkbox { display: none; }
.zauber-toggle-slider {
    width: 36px;
    height: 18px;
    background: #A9B8C2;
    border-radius: 18px;
    position: relative;
    transition: background 0.3s;
}
.zauber-toggle-slider::after {
    content: '';
    position: absolute;
    width: 14px;
    height: 14px;
    background: #fff;
    border-radius: 50%;
    top: 2px;
    left: 2px;
    transition: transform 0.3s;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}
.zauber-kampf-checkbox:checked + .zauber-toggle-slider { background: rgba(0,161,0,0.7); }
.zauber-kampf-checkbox:checked + .zauber-toggle-slider::after { transform: translateX(18px); }
.zauber-toggle-text { font-size: 0.85em; color: #666; }

.zauber-ep-info-card { font-size: 0.85em; color: #666; }
.zauber-actions { margin-left: auto; }

.zauber-steigern-btn {
    padding: 6px 14px;
    border-radius: 4px;
    border: 1px solid #A9B8C2;
    background: #DCE1E5;
    color: #323D4F;
    cursor: pointer;
    font-size: 0.9em;
    transition: all 0.2s;
    text-decoration: none;
    display: inline-block;
}
.zauber-steigern-btn:hover {
    background: #4787A7;
    border-color: #006597;
    color: #fff;
}
.zauber-steigern-btn.primary {
    background: rgba(0,100,0,0.15);
    border-color: rgba(0,100,0,0.4);
    color: #006400;
}
.zauber-steigern-btn.primary:hover { background: rgba(0,100,0,0.3); }
.zauber-steigern-btn.disabled { opacity: 0.5; cursor: not-allowed; }

.zauber-einstellungen {
    background: #ECECEC;
    border: 1px dashed #A9B8C2;
    border-radius: 6px;
    padding: 15px;
    margin-bottom: 20px;
    color: #323D4F;
}
.zauber-einstellungen h3 { margin: 0 0 12px 0; font-size: 1em; color: #323D4F; }
.zauber-einstellung-row { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.zauber-einstellung-row label { color: #323D4F; }
.zauber-einstellung-actions { display: flex; align-items: center; gap: 10px; }

.zauber-sonderfertigkeiten {
    background: #ECECEC;
    border: 1px solid #A9B8C2;
    border-radius: 6px;
    padding: 15px;
    color: #323D4F;
}
.zauber-sonderfertigkeiten h3 { margin: 0 0 10px 0; font-size: 1em; color: #323D4F; }
.zauber-sf-list { text-align: center; }
.zauber-sf-list a { color: #006597; }

@media (max-width: 700px) { .zauber-grid { grid-template-columns: 1fr; } }

/* Kampfbericht: Kein Icon im Simple-Design */
.kampfbericht_icon {
    display: none;
}

/* Waffen-Detail-Panel (Simple Theme) */
.waffe-detail-panel {
    background: #fff;
    border: 1px solid #A9B8C2;
}
.waffe-detail-panel .panel-header {
    color: #323D4F;
    border-bottom-color: #A9B8C2;
}
.waffe-detail-panel .close-btn {
    color: #666;
}
.waffe-detail-panel th {
    background: #DCE1E5;
    color: #003465;
}
.waffe-detail-panel td {
    border-bottom-color: #ECECEC;
}
tr.waffe-detail-row {
    background: #fff;
}
