* { font-family: sans-serif; font-size: 100%; font-style: normal; font-variant: normal; font-weight: normal; margin: 0; outline: 0; padding: 0 }
body { background: #fff; color: #444; font-weight: 400; margin: auto; width: 100% }
a { color: #008080; }
h1 { font-weight: 700; margin-bottom: .5em }
h2 { font-weight: 700; margin-bottom: .3em; margin-top: .7em }
p, ul { margin-bottom: .8em; }
ul { margin-left: 1.5em; }
table { margin-bottom: 1em; }
#oberesbild { height: auto; width: 100% }
#inhalt { padding: 0.3em }
#containerbild { display: flex; justify-content: center; }
#galerie { display: flex; justify-content: center; flex-wrap: wrap; }
#galerie div { margin: 0.6em; }
#urheberrecht { margin-top: 4em }
#urheberrecht p { font-size: .6em }
.navigation { background-color: #97d4f0; margin-bottom: 1.5em; margin-top: -4px; overflow: hidden; display: flex; flex-direction: row-reverse; }
.navigation a { color: #fff; padding: 0.6em; text-align: center; text-decoration: none }
.navigation a:hover, .navigation .aktuell { background-color: #fff; color: #000 }
.navigation a:not(.aktuell) { display: none }
.navigation a.menuschalter { display: block; flex: 1; text-align: right; }
.navigation.offen { flex-direction: column; }
.navigation.offen a:not(.menuschalter) { display: block; text-align: left; }
@media only screen and (max-height: 480px) { #oberesbild { display: none } }
@media only screen and (min-width: 500px) { #containerbild img { width: auto } }
@media only screen and (min-width: 850px) {
    h1 { font-size: 1.4em }
    #container { display: flex; justify-content: space-between; }
    #containerbild img { margin-right: 0.6em; }
    .navigation { flex-direction: row; }
    .navigation a { flex: 1 1 auto; white-space: nowrap; }
    .navigation a:not(.aktuell) { display: inline-block; }
    .navigation a.menuschalter { display: none }
}
@media only screen and (min-width: 1024px) { body { width: 1024px } }
