@charset "UTF-8";
/*
- allererste Zeile, auch vor Kommentaren
https://www.w3.org/International/questions/qa-css-charset
https://developer.mozilla.org/en-US/docs/Web/CSS/@charset
https://www.w3.org/TR/CSS2/syndata.html#x57

CSS für SUDD (CSS 3-konform)

http://de.selfhtml.org/css/eigenschaften/positionierung.htm
http://www.quirksmode.org/css/display.html
https://developers.google.com/speed/docs/insights/ConfigureViewport
*/

/* Generelle Darstellung */
BODY
{
 /* Textfarbe */
 color: black;
 /* Hintergrund: "aquamarine" ist nicht CSS-Standard */
 background-color: #7FFFD4;
 /* Schrifttypen
    Syntax: https://www.w3.org/TR/css-fonts-3/
    "Liberation Sans" ist Red Hats Ersatz für Helvetica
 */
 font-family: "Liberation Sans", Helvetica, Verdana, Arial, sans-serif;
 /* Blocksatz */
 text-align: justify; 
}

/* Schriftgrösse dem Zielgerät anpassen */
@media screen and (max-width: 480px)
{
 BODY { font-size: 14px; }
}

@media screen and (min-width: 481px)
{
 BODY { font-size: 12px; }
}

/* unsichtbarer Text zur Spambekämpfung */
SPAN.nil
{
 display: none;
}

/* keine Zeilenumbrüche */
.kzu
{
 white-space: nowrap;
}

/* Gestaltungselemente */
DIV.table
{
 display: table;
 width: 100%;
}

/* Zeile */
DIV.tr
{
 display: table-row;
}

/* Zelle */
/* Standard: rechts und links gepolstert */
DIV.td
{
 display: table-cell;
 /*    oben rechts unten links */
 padding: 0px 20px 0px 20px;
}

/* Vorspann */
DIV.olinks
{
 display: table-cell;
 text-align: left; 
 vertical-align: top;
 padding: 5px;
}
 
DIV.orechts
{
 display: table-cell;
 text-align: right; 
 vertical-align: middle;
 padding: 5px;
}

/* Abspann */
DIV.ulinks
{
 display: table-cell;
 text-align: left; 
 vertical-align: bottom;
 padding: 5px;
}
 
DIV.urechts
{
 display: table-cell;
 text-align: right; 
 vertical-align: middle;
 padding: 5px;
}

/* knallgelber Hintergrund für Augenfälliges */
DIV.warnung
{
 width: 100%;
 background-color: yellow;
 font-weight: bold;
 text-align: center; 
 vertical-align: middle;
 padding: 10px;
}

/* Stimmzettel in doku.php einmitten */
DIV.mitte
{
 width: 100%;
 text-align: center; 
 vertical-align: middle;
 padding: 20px 0px 20px 0px;
}

/* ohne Zeilenumbrüche, verhält sich wie <span> */
DIV.eng
{
 display: inline;
}

/* Stimmzettel in doku.php einmitten */
FIGURE.mitte
{
 text-align: center; 
 padding: 0px 0px 30px 0px;
}

FIGCAPTION
{
 font-weight: bold;
 font-size: 139%;
 padding: 30px 0px;
}

/* Überschriften und Text */
H1
{
 font-size: 139%;
}

H1.mitte
{
 font-size: 139%;
 text-align: center; 
}

H2
{
 font-size: 126%;
}

H3
{
 font-size: 113%;
}

P.mitte
{
 text-align: center; 
}

SMALL
{
 font-size: 75%;
}

/* keine Rahmen in der Suchmaske */
FIELDSET
{
 border: none;
 padding: 0px;
}

/* Unter- bzw. Durchstreichen sicherstellen */
/* dito mit fett und kursiv (statt <b> und <i>) */
INS    { text-decoration: underline; }
DEL    { text-decoration: line-through; }
STRONG { font-weight: bold; }
EM     { font-style: italic; }

/* Suchtext hervorheben */
MARK
{
 background-color: yellow;
}

/* Bilder nie mit Rahmen */
IMG
{
 border: 0px;
}

/* Adressen ohne Zeilenumbrüche */
ADDRESS
{
 display: inline;
}

/* breite Tabellen in <pre> mit Rollbalken versehen */
PRE.breit
{
 overflow: scroll;
}

/* Tabelle für list.php */
TABLE.leer
{
 width: 100%;
 border-style: none;
}

/* Tabellen: allen gemeinsam */
TABLE.rahmen, TABLE.haar
{
 table-layout: fixed;
 border-style: solid;
 border-color: black;
 border-width: 1px;
}

/* Haupttabelle mit doppelten Linien */
TABLE.rahmen
{
 width: 100%;
}

/* Tabellen im Feld "Bemerkungen" mit haarfeinen Linien */
TABLE.haar
{
 width: 100%;
 border-collapse: collapse;
}

/* fetter, grosser Text */
.schwer
{
 font-size: 139%;
 font-weight: bold;
}

/* Überschrift */
CAPTION
{
 caption-side: top;
 text-align: left;
 font-size: 139%;
 font-weight: bold;
 padding: 15px 5px;
}

/* linksbündige Zellen, Standard */
TD
{
 text-align: left; 
 vertical-align: top;
 border-style: solid;
 border-color: black;
 border-width: 1px;
 padding: 3px 3px;
 word-wrap: break-word;
}

TD.fett
{
 text-align: left; 
 vertical-align: top;
 border-style: solid;
 border-color: black;
 border-width: 1px;
 padding: 3px 3px;
 word-wrap: break-word;
 font-weight: bold;
}

/* rechtsbündige Zellen und Spaltenüberschriften */
/* TH immer fett */
TD.rb, TH.rb
{
 text-align: right; 
 vertical-align: top;
 border-style: solid;
 border-color: black;
 border-width: 1px;
 word-wrap: break-word;
}

TD.rbf
{
 text-align: right; 
 vertical-align: top;
 border-style: solid;
 border-color: black;
 border-width: 1px;
 word-wrap: break-word;
 font-weight: bold;
}

/* Zellen in Suchergebnissen ohne Rahmen */
TD.leer
{
 border-style: none;
 text-align: left; 
 vertical-align: top;
}

/* Haupttabelle, verwendet Typ "rahmen" */

/* allen gemeinsam */
TD.feld, TD.block, TD.block_lz, TD.halbblock, TD.halbblock_lz
{
 vertical-align: top;
 border-style: solid;
 border-color: black;
 border-width: 1px;
 padding: 3px 5px;
}

/* Feldbezeichnung */
TD.feld
{
 width: 20%;
 text-align: left;
}

/* Feldinhalt */
TD.block
{
 width: 80%;
 text-align: justify;
}

/* Feldinhalt linksbündig mit Leerzeichen */
TD.block_lz
{
 width: 80%;
 white-space: pre;
 font-family: courier, monospace;
}

/* halbe Feldbreite */
TD.halbblock
{
 width: 40%;
 text-align: justify;
}

/* halbe Feldbreite linksbündig mit Leerzeichen */
TD.halbblock_lz
{
 width: 40%;
 white-space: pre;
 font-family: courier, monospace;
}

/*
  Links
  - "hover" nach "link" und "visited"
  - auf kleinen Bildschirmen polstern
  - "block", damit auch oben und unten
*/

/* Linktext nie umbrechen */
A
{
 white-space: nowrap;
}

/* Links auf kleinen Bildschirmen polstern */
@media screen and (max-width: 480px)
{
 A
 {
  display: block;
  padding: 10px 5px;
 }
}

A:link     { color: blue; }
A:visited  { color: red; }
A:hover    { color: orange; }
A:active   { color: orange; }

/* "nackter" Link für oben rechts */
A.nackt:link      { color: black; text-decoration: none; }
A.nackt:visited   { color: red;   text-decoration: none; }
A.nackt:hover     { color: black; text-decoration: none; }
A.nackt:active    { color: black; text-decoration: none; }