html, body, div, h1, h2, h3, h4, p, a, em, font, img, ul, li, figure {margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; }

header, nav, section, article, footer {display: block;}
figure {display: inline;}

body {background: #fff; font: 16px Arial, Helvetica, sans-serif; overflow-y: scroll; overflow-x: hidden;}

h1, h2, h3, h4 {font-family: 'Open Sans', Arial, Helvetica, sans-serif; font-weight: 700;}

h1 {font-size: 2em; color: #000; margin: 0 0 1.5em 0; line-height: 1.2em; text-transform: uppercase;}
h2 {font-size: 1.5em; color: #900; margin: 0 0 0.5em 0; line-height: 1.2em;}
h3 {font-size: 1.25em; color: #000; padding: 0 0 0.5em 0; margin: 0;}
h4 {font-size: 1em; color: #333; padding: 0 0 0.25em 0;}
p {font-size: 1em; line-height: 1.5; color: #333; margin: 0 0 3em 0;}
a {text-decoration: none;}

.klar {clear: left;}
.klar-beide {clear: both;}
img.zoom {display: block; width: 100%; margin: 0 0 1em 0;}

.bildlinks {float: left; margin: 0 1em 0 0; padding: 0;}
.rot {color: #900;}
.bioland {color: #090;}
.kursiv {font-style:italic;}

#kopf {position: fixed; top: 0; left: 0; width: 100%; height: 2.625em; z-index: 300; background: #900;} 

#navi {margin: 0 auto; position: relative; width: 100%; max-width: 60em; z-index: 4; height: 2.625em;}
#navi a {display: inline; float: right; font: 0.875em 'Open Sans', Arial, Helvetica, sans-serif; font-weight: 700; color: #fff; text-transform: uppercase; line-height: 3em; padding: 0 0.5em;}
#navi a:hover {background: #900;}
#navi a img.logo {position: absolute; top: 0; left: 1em; width: 7em;} 
#navi a.navilogo {display: inline;}

.inhalt {margin: 0 auto; background: #fff; padding: 1em;}
.inhalt ul {padding: 0.5em 0 0.5em 1em;}
.inhalt ul li {font-size: 0.875em; line-height: 1.5; list-style: outside disc; padding: 0 0 0 1em; color: #4d4d4d; margin: 0 0 0 1em;}
.inhalt ul li.download { list-style-image: url(../images/icon-download.png); margin: 0 0 0.25em 1em;}
.inhalt a {text-decoration: underline; color: #000; font-weight: bold;}
.inhalt a:hover {color: #c00;}
.inhalt img {max-width: 100%; margin: 0 0 3em 0;}

.intro {margin: 8em 0 0 0; text-align: center;}

#footer {margin: 1em auto 0 auto; padding: 1em 0; background: #e5e5e5;}

#sitemap {margin: 0 auto; text-align: left; padding: 1em;}
#sitemap a {color: #999; font: 1em 'Open Sans', Arial, Helvetica, sans-serif; text-transform: uppercase; font-weight: 600;}
#sitemap a:hover {color: #c00; text-decoration: none;}
#sitemap h3 {padding: 0 0 0.5em 0; color: #900;}

.fussspalte-links {float: none;}
.fussspalte-rechts {float: none;}

.spaltelinks {padding: 0 0 2em 0;}
.spalterechts {padding: 0;}

.dreispalten-links img, .dreispalten-mitte img, .dreispalten-rechts img {max-width: 70%; margin: 0 0 1em 0;}

@media (min-width: 600px) {

h1 {font-size: 3.5em; color: #000; margin: 0 0 1.5em 0; line-height: 1.2em; text-transform: uppercase;}
h2 {font-size: 2em; color: #900; margin: 0 0 0.5em 0; line-height: 1.2em;}

#kopf {position: fixed; top: 0; left: 0; width: 100%; height: 3em; z-index: 300;} 

#adresse {margin: 0 auto; height: 1em; background: #9b0102; text-align: center;}
#adresse p {font: 0.75em 'Open Sans', Arial, Helvetica, sans-serif; font-weight: 400; color: #fff; text-transform: uppercase; line-height: 1em; padding: 0 0.75em;}

#navi {height: 3em;}
#navi a {display: inline; float: right; font: 1em 'Open Sans', Arial, Helvetica, sans-serif; font-weight: 700; color: #fff; text-transform: uppercase; line-height: 3em; padding: 0 0.75em;}
#navi a.navilogo {display: inline;}
#navi a:hover, #navi a.aktiv {color: #c00; background: #fff;}
#navi a img.logo {top: 0; left: 0; width: 10em;}

.inhalt {margin: 2em auto 0 auto; max-width: 60em; padding: 0 1em;}

.intro {margin: 0 auto; padding: 10em 0 0 0; max-width: 60em;}

#footer {margin: 4em auto 0 auto; padding: 3em 0;}

.fussspalte-links {float: left; padding: 0 5em 0 0;}
.fussspalte-rechts {float: right; padding: 0;}

#sitemap {margin: 0 auto; text-align: left; max-width: 60em;}
#sitemap p {font-size: 1em;}
#sitemap a {color: #4d4d4d; padding: 0; }
#sitemap a:hover {color: #c00; text-decoration: none;}

.zweispalten-links {float: left; width: 48%; padding: 2em 4% 2em 0;}
.zweispalten-rechts {float: right; width: 48%; padding: 2em 0 2em 0;}

.dreispalten-links {float: left; position: relative; width: 30%; margin: 1em 5% 1em 0;} 
.dreispalten-mitte {float: left; position: relative; width: 30%; margin: 1em 5% 1em 0;} 
.dreispalten-rechts {float: left; position: relative; width: 30%; margin: 1em 0 1em 0;}
.dreispalten-links img, .dreispalten-mitte img, .dreispalten-rechts img {display: block; width: 100%; margin: 2em 0;}

}