ADDRESS { font-family: "Helvetica", "Arial"; font-size: 12pt; }
LI      { font-family: "Helvetica", "Arial"; font-size: 12pt; }
TD P    { font-family: "Helvetica", "Arial"; font-size: 12pt;}
H1      { margin-bottom: 0.18cm; color: #0000bf; text-align: center }
P       { font-family: "Helvetica", "Arial"; font-size: 12pt;  }
H2      { margin-bottom: 0.18cm; color: #0000bf; font-size: 16pt; text-align: center }
TH P    { font-family: "Helvetica", "Arial"; font-size: 12pt; }

body {
    margin-top: 3.5em;    
    max-width: 80em;
    display: grid; }
}

img {
  width: 100%;
}


h1 { font-size: 1.5em; }    

/* Skip-Link */
#skip-link { position: absolute; left: 0; top: 0; background: black; color: white; padding: 0.25em; transform: translateY(-100%); transition: 0.2s transform; z-index: 1001 } 
#skip-link:focus { transform: translateY(0); }			

/* Allgemeine Einstellungen und Einstellungen für schmale Viewports */
#sitenav *, #sitenav a { background-color: lightblue; color: black }
#sitenav { top: 1em; left: 2em; }
#sitenav ul { list-style-type: none; margin:0; padding-top:.2em; padding-left:1em; padding-right:1em; border-radius: .5em; }
#sitenav ul ul { margin-left: 7em; margin-top: -3.1em; padding-left: .1em; }
#sitenav li a { display: inline-block; margin-top:.1em; margin-bottom:.1em; }
#sitenav li a, #sitenav li summary { padding: .5em; margin: .3em; line-height: 1.4em; outline: none; }
#sitenav li a:hover, #sitenav li summary:hover, #sitenav li a:focus, #sitenav li summary:focus { outline: 1px solid #5050ff }
#sitenav li a { text-decoration: none; }
#sitenav li { padding: 0em; white-space: nowrap; vertical-align: middle; }
#sitenav li[aria-current] a[href='#']::before { content: "► "; font-family: arial_unicode_ms }
#sitenav ul details summary::after { font-family: arial_unicode_ms; }
#sitenav ul details:not([open]) summary::after { content: ' ►'; }
#sitenav ul details[open] summary::after { content: ' ◄'; }
#sitenav ul summary::before { content: ""; width: 0; }
#sitenav > details:not([open]) > summary::before { content: "☰"; font-size: 0.9em; } 
#sitenav > details[open] > summary::before { content: "×"; font-size: 1.2em; } 
#sitenav > details { border: 1px solid black; border-radius: .2em; max-width: -webkit-max-content; max-width: -moz-max-content; max-width: max-content; padding: .2em; }
#sitenav > details > ul { margin-left: -.5em; margin-top: .3em; }
#sitenav summary { cursor: pointer; max-width: -webkit-max-content; max-width: -moz-max-content; max-width: max-content; }
#sitenav summary::-webkit-details-marker { display: none; }
#sitenav summary { list-style-type:  none; }
#sitenav.withjs > details > ul > li[aria-current] { border-left: 2px solid black; }
#sitenav.withjs { position: absolute; }
#sitenav.withjs ul { position: absolute; }

/* Einstellungen für breite Viewports */
#sitenav.large { top: 0; left: 0; right: 0; }
#sitenav.large > details { border: none; border-radius: 0; padding: 0 } 
#sitenav.large > details > ul , #sitenav.large > details > ul > li { display: inline-block }
#sitenav.large ul details:not([open]) summary::after { content: ' ▼'; }
#sitenav.large ul details[open] summary::after { content: ' ▲'; }
#sitenav.large > details > ul { width: 100%; box-sizing: border-box; }
#sitenav.large > details > ul { margin-left: 0; margin-top: 0; border-radius: 0; }
#sitenav.large > details > ul > li[aria-current] { border-bottom: 2px solid black; border-left: none; }
#sitenav.large ul ul { margin-left: -.5em; margin-top: -.1em; padding-left: .5em; border-radius: 0 0 .5em .5em;}



div#Inhalt {
  margin-left: 0em; text-align: left;
  padding: 0 1em;
  border: 1px dashed silver;
  min-width: 16em; /* Mindestbreite (der Ueberschrift) verhindert Anzeigefehler in modernen Browsern */
}
div#Seite {
    text-align: left;    /* Seiteninhalt wieder links ausrichten */
    margin: 0 auto;      /* standardkonforme horizontale Zentrierung */
    width: 950px;
    padding: 0.5em;
    border: 2px ridge silver;
  }