* {
box-sizing: border-box;
padding: 0;
margin: 0;
word-wrap: break-word;
}

img {
max-width: 100%;
height: auto;
}

body {
width: 100%;
font-family: Book Antiqua;
font-size: medium;
text-align: justify;
color: Linen;
 background: #00001F;
}

header {
width: 100%;
float: left;
margin-top: 5px;
margin-bottom: 5px;
padding: 5px;
}

p {
 font-family: Book Antiqua;
 font-size: medium;
 text-align: justify;
 color: Linen;
 padding: 15px;

}
#special {
 font-family: Garamond;
 font-size: medium;
 text-align: justify;
color: Linen;
 padding: 15px;

}
#Intro {
 font-family: Book Antiqua;
 font-size: medium;
 text-align: justify;
 color: Linen;
 padding-top: 1px;
 padding-bottom: 1px;
}
#foot {
 font-family: Book Antiqua;
 font-size: medium;
 text-align: center;
 color: Linen;
 padding: 15px;

}


/*Überschriften
h1 - evtl. Header
h2 - Hauptüberschrift
h3 - UnterÜberschrift bei Inhaltsverzeichnis
h4 - Unterüberschrift
h5 - Zwischenüberschrift, betonter Satzanfang, Überschrift OT Links NavListe
h6 - kleine Überschrift
*/

h1 {
 font-family: Papyrus;
 font-size: x-large;
 font-style: italic;
 text-decoration: underline;
 text-align: center;

}

h2 {
 font-family: Papyrus;
 font-size: large;
 font-style: italic;
 text-decoration: underline;
 text-align: center;
color: Linen;
}

h3 {
 font-family: Papyrus;
 font-size: medium;
 font-weight: bold;
 font-style: italic;
 text-decoration: underline;
 text-align: left;
color: Linen;
 margin-top: 15px;
 margin-bottom: 15px;
}

h4 {
 font-family: Papyrus;
 font-size: medium;
 font-weight: bold;
 font-style: italic;
 text-decoration: none;
 text-align: center;
color: Linen;
 margin-top: 15px;
 margin-bottom: 15px;
}

h5 {
 font-family: Papyrus;
 font-size: small;
 font-weight: bold;
 font-style: normal;
 text-decoration: none;
 text-align: left;
color: Linen;
}

h6 {
 font-family: Papyrus;
 font-size: small;
 font-weight: bold;
 font-style: normal;
 text-decoration: none;
 text-align: right;
 margin-top: 5px;
 margin-bottom: 5px;
color: Linen;
}

#inhaltsverzeichnis {
width: 100%;
float: left;
border-radius: 25px;
/*margin-top: 15px;*/
margin-bottom: 15px;
padding: 15px;

}
/* Abschnitte OT Formate */
#abschnitt1{
width: 100%;
float: left;
border-radius: 25px;
margin-top: 15px;
margin-bottom: 15px;

}
#abschnitt2{
width: 100%;
float: left;
border-radius: 25px;
margin-top: 15px;
margin-bottom: 15px;

}
#abschnitt3{
width: 100%;
float: left;
border-radius: 25px;
margin-top: 15px;
margin-bottom: 15px;

}
#abschnitt4{
width: 100%;
float: left;
border-radius: 25px;
margin-top: 15px;
margin-bottom: 15px;

}
#abschnitt5{
width: 100%;
float: left;
border-radius: 25px;
margin-top: 15px;
margin-bottom: 15px;

}
#abschnitt6{
width: 100%;
float: left;
border-radius: 25px;
margin-top: 15px;
margin-bottom: 15px;

}
#abschnitt7{
width: 100%;
float: left;
border-radius: 25px;
margin-top: 15px;
margin-bottom: 15px;

}
#abschnitt8{
width: 100%;
float: left;
border-radius: 25px;
margin-top: 15px;
margin-bottom: 15px;

}
#abschnitt9{
width: 100%;
float: left;
border-radius: 25px;
margin-top: 15px;
margin-bottom: 15px;

}
#abschnitt10{
width: 100%;
float: left;
border-radius: 25px;
margin-top: 15px;
margin-bottom: 15px;

}
#abschnitt11{
width: 100%;
float: left;
border-radius: 25px;
margin-top: 15px;
margin-bottom: 15px;

}
#abschnitt12{
width: 100%;
float: left;
border-radius: 25px;
margin-top: 15px;
margin-bottom: 15px;

}
#abschnitt13{
width: 100%;
float: left;
border-radius: 25px;
margin-top: 15px;
margin-bottom: 15px;

}


article {
width: 100%;
float: left;
border-radius: 25px;
margin-top: 15px;
padding: 25px;

}

aside {
width: 50%;
float: left;
border-radius: 25px;
margin-top: 5px;
padding: 25px;
}

footer {
width: 100%;
float: left;
border-radius: 25px;
margin-top: 5px;
padding: 5px;

}

/*Tabellen*/

table {
width: 100%;
margin-top: 5px;
padding: 5px;

}



/*banner mittig plaziert*/
.banner {
display: none;
}

/*bilder*/
.fgleft {
float: left;
margin: 5px;
margin-top: 10px;
margin-right: 10px;
clear: right;
}

.fgright {
float: right;
margin: 5px;
margin-top: 10px;
margin-left: 10px;
margin-right: 10px;
}
.fggalerie {

margin: 5px;
margin-top: 10px;
margin-right: 10px;
clear: all;
}

.fgfolk {
float: middle;
margin: 5px;
margin-top: 10px;
margin-right: 10px;
}
.fgimpr {
margin: 25px;
}
figure {
float: absmiddle;
margin: 5px;
}


/*listen*/
ol{
width: 50%;
float: left;
padding: 25px;

}
ul{
width: 100%;
float: left;
padding: 15px;

}

/*Links*/
a {
 font-family: Book Antiqua;
 font-size: small;
 text-align: center;
color: Linen;
}
a:link {
 font-family: Book Antiqua;
 font-size: small;
 text-align: left;
color: Linen;
}
a:hover {
 font-family: Book Antiqua;
 font-size: small;
 text-align: left;
color: Linen;
}
a:visited {
 font-family: Book Antiqua;
 font-size: small;
 text-align: left;
color: Linen;
}
.oben {
 font-family: Book Antiqua;
 font-size: small;
 text-align: right;
color: Linen;
}
/*Anzeige für Mobilgeräte */

header, menue, article, aside {
 width: 100%;
}

@media only screen and (min-width: 768px){
menue {
width: 25%;
float: left;
}
article {
width: 70%;
float: left;
}
aside {
/*width: 25%;*/
width: 50%;
float: left;
}
#container {
width: 70%;
margin: auto;
}
.banner {
display: flex;
justify-content: center;
align-items; center;
margin: 15px;
}
#bereichlogo {
display: none;
}
}





#steuerung li {
list-style: none;
float: right;
font-weight: bold;
}
#menuesteuerunglinks  dl {
list-style: none;
float: left;
}

#steuerung a {
display: block;
height: 100%;
width: 100%;
padding: 0.5em;
text-decoration: none;
color: Linen;
background-color: none;
}
#menuesteuerunglinks  a {
display: block;
height: 100%;
width: 100%;
padding: 0.5em;
text-decoration: none;
color: Linen;
}

.menue-button {
display: none;
}
.menue-button-links {
display: none;
}

#steuerung {
/*float: left; */
margin: 0 auto;
}
#menuesteuerunglinks  {
float: right;
}

#steuerung a:hover {
color: Linen;
background: Maroon;
}
#menuesteuerunglinks  a:hover {
color: Linen;
background: Maroon;
}

/* CSS erweitern um MENÜ-Button und entsprechende Steuerung */
/* Menü-Button oben rechts einblenden bei kleiner als 600px */
@media only screen and (max-width:768px /*600px*/) {

/*Bereich Logo Überschrift nur am Hand */
#bereichlogo {
color: Linen;
background-color: none;
display: block;
padding: 0.5em;
text-decoration: none;
font-family: Papyrus;
font-size: x-large;
font-weight: bold;
float: left;
}
#bereichlogo {
width: auto;
}

.menue-button {
display: block;
}
.menue-button-links {
display: block;
}

.menue-button {
background-color: Maroon;
display: block;
position: absolute;
right: 0;
top: 0;
padding: 0.5em;
color: Linen;
font-weight: bold;
cursor: pointer;
text-decoration: none;
}
.menue-button-links {
background-color: Maroon;
display: block;
position: absolute;
left: 0;
top: 0;
padding: 0.5em;
color: Linen;
font-weight: bold;
cursor: pointer;
text-decoration: none;
}

#bereichlogo {
width: 100%;
}

#steuerung {
float: left;
width: 100%;
display: none;
}
#menuesteuerunglinks {
float: left;
width: 100%;
display: none;
}

#steuerung li {
width: 100%;
border-bottom: 2px solid silver;
}
#menuesteuerunglinks dl {
width: 100%;
border-bottom: 2px solid silver;
}

.menue-button:hover {
color: #FFF6E5;
font-weight: bold;
background: Maroon;
}
.menue-button-links:hover {
color: #FFF6E5;
width: 100%;
font-weight: bold;
background: Maroon;
}
}
/* die Magie, um die Steuerung einzublenden (auch auf mobile Devices) */
#nav-menue:target #steuerung {
display: block;
}
#nav-menue-links:target #menuesteuerunglinks {
display: block;
}
/* ausblenden des Menü-Buttons zum öffnen - somit wird der zum Schließen
sichtbar */
#nav-menue:target .menue-button-beschr-open {
display: none ;
}
#nav-menue-links:target .menue-button-links-beschr-open {
display: none ;
}






/* Allgemein Anweisungen */
section {
padding: 0.5em;
float: left;
width: 100%;
}
h1, p {
margin: 0.5em 0 0 0;
}