body {
    font-size: 1.01em;
	display: block;
	width: 800px;
	margin: 0 auto;
}

/* Mobile first - alle Dokument-Blöcke bekommen 100% Breite */
header,
nav,
article,
aside,
footer {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	border-radius: 0px 0.5em 0.5em;
	border: 1px #000 solid;
	padding: 8px;
	margin: 5px auto;
}

aside {
	display: block;
	clear: left;
}

nav a,
section {
	border-radius: 0px 0.5em 0.5em;
	padding: 10px;
	margin: 5px;
}

header {
	width: 100%;
    font-family: 'Sansita', Cambria, Cochin, Georgia, DejaVuSans, Times, "Times New Roman", serif;
	background: #ffcc40 url('../pic/bg_oben.jpg') repeat-x fixed center top;
	border-color: #d5d5d5;
	display: -webkit-flex;
	-webkit-flex-flow: row wrap;
	display: flex;
	flex-flow: row wrap;
}

header * {
	-webkit-flex: 1 1 0;
	flex: 1 1 0;
}

header img {
	background: #F1F3F4 url('../pic/bg4a.gif') repeat-x fixed center top;
	-webkit-flex: 1 1 98%;
	flex: 1 1 98%;
	margin-right: 2px;
	display: block;
	float: left;
    min-width: 350px;
}

header nav {
	background-color: transparent;
	-webkit-flex: 1 1 100%;
	flex: 1 1 100%;
}

.zwei {
	width: 100%;
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
    background-color: #ffffff;
	text-align: left;
}

.txtformatueberschrift {
	text-decoration: underline;
	font-size: 1.25em;
	color: #333399;
	max-width: 650px;
	display: block;
	font-weight: bolder;
	margin-bottom: 0.5em;
}

.formatHeadtxt, .interaktiv {
    font-family: 'Sansita', Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
    background-color: #ffffff;
	text-align: left;
}

h1 {
    color: #dfac20;
    background: #111;
    margin-right: 10px;
    border-radius: 0 0.2em 0.2em 0;
}

nav,
nav ul,
nav li {
	margin: 6px 1px;
	padding: 2px;
	border: none;
}

nav ul {
	display: -webkit-flex;
	-webkit-flex-direction: column;
	display: flex;
	flex-direction: column;
}

nav li {
	list-style-type: none;
	margin: 5px 0;
	-webkit-flex: 1 1 100%;
	flex: 1 1 100%;
}

nav a {
	display: inline-block;
	width: 95%;
	background: #fffbf0;
	border: 1px solid #dfac20;
	margin: 0;
	text-decoration: none;
	text-align: center;
    color: #00335f;
    font-size: 1.1em;
}

nav a:hover {
	background-color: #dfac20;
}

#selected {
	background-color: #dfac40;
    color: #efefee;
    font-weight: bold;
}

aside a:link,
aside a:visited {
    text-decoration: none;
    background-color: #ebf5ef;
    color: #000fee;
}

article {
	display: block;
	vertical-align: top;
	margin: 0 auto;
	padding: 2px;
	text-align: left;
	font-size: 1.0em;
	width: 800px;
}

section {
	background: #F1F3F4;
	border-color: slateblue;
/*	background: #ffede0 url('../pic/iconartist.jpg') no-repeat center center;  */
/*	border-color: #df6c20; */
	margin: 2px;
    padding: 2px;
}

aside#news {
	display: block;
	vertical-align: top;
	width: 240px;
	background: #aaaaaa;
	font-size: 0.98em;
    border-color: #a77208;
}

aside#links {
	display: block;
	vertical-align: top;
	width: 240px;
	font-size: 0.99em;
	background: #ebf5d7;
	border-color: #8db243;
}

footer {
	width: 100%;
	background: #e4ebf2;
	border-color: #8a9da8;
	display: block;
	clear: left;
	display: -webkit-flex;
	-webkit-flex-flow: row wrap;
	display: flex;
	flex-flow: row wrap;
}

footer * {
	-webkit-flex: 1 1 0;
	-webkit-justify-content: space-between;
	flex: 1 1 0;
	justify-content: space-between;
}

footer p {
	text-align: right;
}

#heute {
    position: absolute;
    top: 66px;
    left: 110px;
    font-size: 0.89em;
}

.f0 {
	display: block;
	float: left;
	padding: 0 0.3em;
	color: teal;
	border-bottom: thin solid #000066;
	border-left: thin solid #000066;
	font-family: 'Open Sans Condensed', Cambria, Cochin, Georgia, Times, "Times New Roman", serif;
	font-weight: bolder;
	font-size: 0.9em;
}

.txtformatgliederung {
	padding:0 0.3em;
	color:teal;
	border-bottom:thin teal solid;
	border-left:thin teal solid;
	font-family:Cambria, Cochin, Georgia, Times, "Times New Roman", serif;
	font-weight:bolder;
	font-size:medium;
}

.formatSansita {
    font-family: 'Sansita Swashed', serif;
    font-size: 0.99em;
    text-align: right;
    padding: 5px;
	font-style:italic;
 }

.f1 {
	font-style: italic;
	text-align: justify;
}

.f2 {
	display: block;
	float: right;
	padding: 3px 5px;
	text-align: right;
	font-family: "Courier New", Courier, monospace;
	font-weight: bold;
	font-size: 0.78em;
	color: #000099;
	background-color: #E1E1E1;
}

.f3 {
	display: block;
	border-bottom: 2px #000099 solid;
	padding: 5px 0px 5px 20px;
	background-color: #800000;
	color: #99FFCC;
	margin-bottom: 0;
}

.f4 {
	display: inline-block;
	background-color: #fff;
	color: #000;
	font-size: 0.9em;
	vertical-align: middle;
	min-width: 60px;
}

.f5 {
	display: block;
	border-bottom: 2px #000333 solid;
	padding: 5px 0px 5px 20px;
	background-color: #888;
	font-size: 0.98em;
	color: #000333;
	margin-top: 3px;
}

.f6 {
	display: inline-block;
	background-color: #aaa;
	color: #000333;
	font-size: 0.8em;
	vertical-align: middle;
	min-width: 60px;
}

.f7 {
	display: inline-block;
}

.img {
	padding: 5px;
}

img#logo {
    border-radius: 0 0.2em 0;
}

/* Nur Smart Phones und Tablets mit mittlerer Auflösung */

@media all and (max-width: 610px) {
	body {
		display: block;
		font-size: 1.1em;
		vertical-align: top;
	}

	header img {
        background: #F1F3F4 url('../pic/bg4a.gif') repeat-x fixed center top;
        padding: 5px;
        margin: 5px auto;
 	}

	nav ul {
		-webkit-flex-direction: row;
		flex-direction: row;
	}

	nav li {
		margin: 0 10px;
		-webkit-flex: 1 1 0;
		flex: 1 1 0;
	}

	nav a {
		display: list-item;
		width: 100%;
        background: #fffbf0;
        border: 1px solid #dfac20;
        margin: 0.3em;
        text-decoration: none;
        text-align: center;
        color: #00335f;
        font-size: 1em;
	}

	footer {
		-webkit-order: 5;
		order: 5;
	}

	img#logo {
        border-radius: 0 0.5em 0;
	}

	article {
		-webkit-order: 1;
		order: 1;
		display: block;
		clear: left;
	}

	#links {
		display: block;
		clear: left;
		-webkit-order: 3;
		order: 3;
	}

	#news {
		display: block;
		clear: left;
		-webkit-order: 2;
		order: 2;
		height: 120px;
	}

	h1 {
        font-size: xx-large;
        color: #dfac20;
        background: #111;
        padding: 10px 0;
        border-radius: 0 0.3em 0.3em 0;
	}

	h2 {
        font-size: x-large;
    
	}
	
	h3 {
        font-size: large;
	}

	h4 {
        font-size: medium;
	}

	#heute {
        position: absolute;
        float: left;
        top: 35px;
        left: 45px;
        font-size: 0.89em;
	}

}

/* Only Large screens */
@media all and (max-width: 810px) {
    body {
		display: block;
        font-size: 1.0em;
        width: 800px;
     }
        
    header img {
        background: #F1F3F4 url('../pic/bg4a.gif') repeat-x fixed center top;
        margin-left: 10px;
    }

    nav a {
        display: list-item;
        width: 95%;
        background: #fffbf0;
        border: 1px solid #dfac20;
        margin: 0;
        text-decoration: none;
        text-align: center;
        color: #00335f;
        font-size: 1.0em;
    }

    h1 {
        font-size: xx-large;
        color: #dfac20;
        background: #111;
        padding: 10px 0;
        border-radius: 0 0.3em 0.3em 0;
    }

    h2 {
        font-size: x-large;
    }

    h3 {
        font-size: large;
    }

    img#logo {
        border-radius: 0 0.5em 0;
    }

	article {
/*		Der Article wird 2.5x so breit wie die beiden asides! */
		-webkit-flex: 10 1 0;
		-webkit-order: 1;
		order: 1;
		flex: 10 1 0;
		display: block;
	}

	#links {
		-webkit-flex: 10 1 0;
		-webkit-order: 3;
		-webkit-align-self: top;
		flex: 10 1 0;
		order: 3;
		align-self: top;
	}

	#news {
		-webkit-flex: 10 1 0;
		-webkit-order: 2;
		-webkit-align-self: top;
		flex: 10 1 0;
		order: 2;
		align-self: top;
		height: 120px;
	}

}