/* =======================================
   Grundlayout & Tabellen
   ======================================= */
table {
  width: 100%;
}

/* =======================================
   Farb- und Themenbereiche
   ======================================= */
td#stammtisch, button#stammtisch, a#stammtisch { background: lemonchiffon; }
td#meet, button#meet, a#meet { background: #99d1c8; }
td#mata, button#mata { background: #ffcb06; }

td#fledermaus, td#fledermaus a, button#fledermaus {
  background: var(--mausbg);
  color: var(--maustext);
}
td#cage, td#cage a, button#cage, a#cage {
  background: var(--cagebg);
  color: var(--cagetext);
}
td#cage h3, td#cage h4 {
  color: var(--cagetext);
}
td#vogel, td#vogel a, button#vogel, a#vogel {
  background: var(--vogelbg);
  color: var(--vogeltext);
}
td#meet h3.termin {
  color: var(--gptlogofarbe);
}

td#fuehrung, button#fuehrung, a#fuehrung { background: lightblue; }
td#verein, button#verein, a#verein { background: violet; }
td#theater, button#theater, a#theater {
  background: var(--gpthellgruen);
  color: #000;
}
td#mut, button#mut, a#mut {
  background: var(--mut);
  color: #000;
}
td#fahrt, button#fahrt, a#fahrt { background: lightcoral; }
td#liebestrank, button#liebestrank, a#liebestrank { background: lightcoral; }
td#fremdgehen { background: lightyellow; }

/* =======================================
   Beitrags-Tabellen
   ======================================= */
table#beitrag {
  max-width: 50em;
}
table#beitrag tr {
  background: var(--gptgelb);
  color: #000;
}
th.beitrag, td.beitrag {
  text-align: right;
}

/* =======================================
   Terminstruktur
   ======================================= */
div#termin_titel {
  text-transform: uppercase;
  text-align: center;
  font-size: 30px;
  font-weight: bold;
}

div#termin_person,
div#termin_person a {
  text-transform: uppercase;
  text-align: center;
  font-size: 30px;
  font-weight: bold;
  color: darkgoldenrod;
  text-decoration: none;
}

div#termin_untertitel {
  text-align: center;
  font-size: 16px;
}

div#ort,
div#ort a {
  text-align: center;
  font-size: 16px;
}

/* =======================================
   Beschreibung – neu formatiert
   ======================================= */
div#beschreibung {
  font-size: 15px;
  line-height: 1.45;
  text-align: left;
  font-weight: normal;
  padding: 0.5em 0.5em 0.5em 0;
}

/* Macht die <br> in der Beschreibung zu Absatzabständen */
div#beschreibung br {
  display: block;
  content: "";
  margin-bottom: 0.7em;
}

/* =======================================
   Zusatzelemente
   ======================================= */
figcaption,
div#foto {
  font-size: 10px;
  text-align: center;
}

div#fehler {
  color: red;
}

/* Uhrzeit optisch an Datum angleichen */
td > .uhrzeit {
  font-size: 12px;
  opacity: 0.85;
}

/* =======================================
   Karten-Tabellen (responsiv)
   ======================================= */
@media all {
  table#karte {
    max-width: 70em;
  }
  table#karte tr {
    color: #000;
    background: var(--gptbasis);
  }
  th#karte, td#karte {
    text-align: right;
  }

  table#karte2 {
    max-width: 70em;
  }
  table#karte2 tr {
    color: #000;
    background: var(--gptgelb);
  }
  th#karte2, td#karte2 {
    text-align: right;
  }
}

#kartenpreise th {
  text-align: left;
}

/* kleinere Karten-Tabellen auf großen Displays */
@media all and (min-width: 70em) {
  table#karte,
  table#karte2 {
    max-width: 30em;
  }
}