*{    
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}


/* -- Allgemeines -- */
html {
  background: #e7f3f7;
  color: black;
}

body {
  margin: 0 auto;
  padding: 1%; 
  max-width: 75em; 
  font-family: verdana, arial, sans-serif ;
  font-size: 0.8em;
  border: 1px solid #aaa; 
  border-top: 0;
  background: white;
}

.skip {
  position: absolute;
  margin-left: -999px;
  width: 990px;
}

.hide {
	display:none;
}

/* - Logo bzw. Kopf - */
header {
  background: url(../img/bunt.png) 0 0 no-repeat black; 
  height: 64px; 
  margin: 0; 
  padding: 0 20px;
  text-align: right;
  line-height: 20px;
  font-size: 20px;
  font-weight: bold;
  letter-spacing: 0px;
}

header a#logo {
  color: white; 
  text-decoration: none;
}
header a#logo span {
  color: black;
  background: white;
  padding-right: 0.1em;
  font-weight: bold;
}

a { color: #0B4D8C; text-decoration: underline; } 
a:visited { color: black; }

/* - Der Hauptinhaltsteil - */
main {
  display: block;  
  background: /*url(../img/monster.png) no-repeat 100% 0*/white;
  padding: 0 2%; 
  line-height: 1.5em;
}

section {display: inline-block; width: 73%;}

/* - Sidebar, Rechte Spalte - */
aside {
  width: 25%; 
    float: right;
    clear:right;
  display : inline-block;
  padding: 0em 1% 1em;
  margin: 10em 1% 0 1%;
  border-left: 1px dotted #aaa;
  font-size: 0.9em;}
aside dt { /* Die einzelnen Überschriften in der Sidebar */
  font-size: 1.2em;
  font-family: Georgia, "Times New Roman", Times, serif;
  padding: 0.5em;
  margin-top: 1em;
  border-top: 1px dotted #aaa; 
}
aside dd { /* Die Unterpunkte der Sidebar. */
  padding: 0;
  margin: 0.2em 0;
}

h1 { 
  font-size: 2.3em;
  font-weight: normal;
  line-height: 0.9em;
  padding: 0.6em 0 0.2em 2%;
  margin: 0;

}

h2 {
	color: #14902e;}

h4 {
	font-size: 1.5em;
   line-height: 1.0em;
   color: #0da4eb ;
   padding: 0.8em 0 0.6em 2%;
   margin: 0;
	border-bottom: 2px dashed #E6E6FA;
	font-weight: normal;
	}

h2, h3, h4 {
	font-weight: normal;
	}

h1, h5, h6 {
  color: #ff6f91;
  }
  
h3 {
	color: #14902e;
	}  
  
h1, h2, h3, h4, h5, h6 {
  font-family: Georgia, "Times New Roman", Times, serif;
}

/*DL, DT, DD Datenliste*/
dl 	{ margin-bottom:  50px;}
 
dl dt {	
    float: left;
    font-weight: bold;
    margin-right: 5px;
    padding: 5px; 
    width: 50%;
}
 
dl dd {
    margin: 2px 0;
    padding: 5px 0;
}

img { 
  border: solid 1px #aaa;
  padding: 1px;
}


.fleft { 
  float: left;
  margin: 0 1em 0.2em 0;
  width: 20%;
}
.fright {
  float: right;
  margin: 0 0 0.2em 1em;
  padding: 1px;
  width: 20%;
}

img.portrait {
  border: none;
  float: right;
  margin: 0 0 0.2em 1em;
  padding: 1px;
  width: 20%;
}

main p span {
	display: none;
}
/* -- Layoutspezifisches -- */

footer {
  clear: both;
  padding: 2%;
  text-align:center;
  border-top: 1px dotted #aaa;
}

footer .copy span {
	margin: 0 auto;
	display: block;
}


/* - Menü - */
nav ul {
  background: url(../img/wechselschatten.png) #287635;
  padding: 5px 5%;
  margin: 0;
  text-align: center;
  color: yellow;
}
nav ul li {
  font-size: 1.2em;
  display: inline;
  list-style-type: none;

  padding: 0 1em 0 1em;
  font-weight: normal;
}
nav ul li a {
  color: white;
  border-radius: 0.2em;
  text-decoration: none;
}
nav ul li a:visited {
	color: white;
}

nav ul li a:hover {
	color:#24536d;
	background:yellow;
	opacity:0.8;
}

@media only screen and (max-width: 600px) {
nav ul {
	display:block; 
	background:transparent;
	margin: 1em 0;
}
nav ul li{width:90%; margin: 5px 0; display:inline-block; text-align:center; }
nav ul li.active{padding:0 2em; background:#24536d; border-radius:10px;}
nav ul li a{display:inline-block; width:100%; color:white; background:#24536d; margin:5px 0; border-radius:10px;text-align:center;}
nav ul li a:after{display:none;} 

section,
section.spalte, 
aside {
	float:none;
	display:block;
	width:100%;
}


.fleft,.fright {
	width:50%;
}
}