<style type="text/css">


nav {
  display: block;
}

@media (min-width: 15em) { 
  nav {
    display: block;
    width: 50%;
  }

@media (min-width: 30em) { 
  nav {
    display: inline;
    width: 50%;
  }
}

@media (min-width: 30em) {
  container {
    display: grid;
  }
}


@media (min-width: 30em) {
  nav_re {
    display: grid;
  }
}

@media (min-width: 30em) {
  textbox {
    display: grid;
  }
}

@media (min-width: 30em) {
  textbox_h1 {
    display: grid;
  }
}


body {
 	font-size: 40px;
 	max-width: 30em;
 }


	
	
div, h1, h2, p, a, li, span {
	font-family:'Optima',sans-serif;
	}
div#title, div#title_w {
	float:right;
	margin:10px 100px 20px 0;
	background-color: transparent;
	color:#000000;
	text-align:right;
	font-size:.4em;
	}
div#title_w {
	color:#FFFFFF;
	}
div#nav {
	margin: 10px 0 20px 0;
	padding:5px 20px 5px 100px;
	color:#000000;
	background-color:#669900;
	font-size:.4em;
	display: block;	
	clear:both;
	}
	
	
div#nav_re {
	margin: -15px 0 20px -150px;
	padding:5px 20px 5px 20px;
	color:#000000;
	background-color: white;
	font-size:.4em;
	clear:both;
}



div#container {
	padding:0;
	margin:20px 100px 20px 80px;
	clear:both;	
	}
	

	
div#textbox, div#textbox_h1, div#textbox_li, div#textbox_re {
	padding:20px 20px 20px 150px;
	margin:0 20px 20px 0;
	background-color:white;
	color:#000000;
	clear:both;
	}
div#textbox {
	float:left;
	}
	
@media (min-width: 40em) {
  textbox {
    float: left;
    width: 50%;
  }
}
	
div#textbox_li {
	float:left;
	clear:both;
	}
div#textbox_re {
	float:left;
	}
div#textbox_h1 {
	clear:both;
	padding-bottom:5px;
	}

@media (min-width: 40em) {
  textbox_h1 {
    float: left;
    width: 50%;
  }
}
	
span#titel {
	color:#669900;
	font-size:1.0em;
	}
span#themen {
	margin-left:40px
	;
	font-size:.8em;
	}
img {
	border:1px solid #FFFFFF;
	}
img#box_re {
	float:left;
	margin:0 10px 0 0;
	}
img#box_li {
	float:left;
	clear:both;
	margin: 0 0 20px 0;
	}
img#box {
	margin:0;}
img#teaser {
	float:left; height:60px; padding:0;
	}
img#teaser first-child {
	clear:left;
	}

.opaque {
    opacity:0.8;
    filter: alpha(opacity=50);
    -moz-opacity:0.5;
	}
h1 {
	margin:0 0 20px 0;
	color:#669900;
	font-size:.px;
	font-weight:normal;
	text-transform:uppercase;
	}
h2 {
	font-size:.4em;
	color:#000000;
	margin:0 0 10px 0;
	font-weight:bold;
	text-transform:uppercase;
	}
h3 {
	font-size:.4em;
	color:#000000;
	margin:0 20px 0 20px;
	font-weight:bold;
	}
h4 {
	font-size:.4em;
	color:#669900;
	margin:0 0 10px 0;
	font-weight:bold;
	text-transform:uppercase;
	}
h5 {
	margin:0 0 0px 0;
	color:#669900;
	font-size:0.6em;
	font-weight:normal;
	text-transform:uppercase;
	}
h6 {
	font-size:.4em;
	float:left;
	color:#669900;
	margin:0 10px 0 0px;
	font-weight:normal;
	}
p {
	margin:0 30px 10px 20px;
	padding:0;
	color:#000000;
	font-size:.4em;
	max-width: 60em;
	}
li {
	font-size:.4em;
	color:#000000;
	max-width: 60em;
	}
table {
  border-collapse: separate;
  border-spacing: 0.2em;
	}
  
th, td {
  padding: .2em .5em;
  border-radius: .1em;  
	}  	
tr {
	font-size:.4em;
	color:#000000;
	max-width: 60em;
	}
td {
	font-size:.4em;
	color:#000000;
	max-width: 60em;
	}
	
	
div#fuss {
	float:right;
	clear:right;
	margin:0 0 20px 0;
	font-size:.4em; 
	color:#000000;
	background-color:#FFFFFF; 
	text-align:right; 
	padding:2px 20px 2px 20px;
	}
div#fuss2 {
	float:left;
	clear:left;
	margin:0 0 20px 0;
	font-size:.4em; 
	color:#ffffff;
	background-color:#FFFFFF; 
	text-align:left; 
	padding:2px 20px 2px 20px;
	}
a {
	color:#FFFFFF;
	text-decoration:none;
	}
div#nav a {
	color:#FFFFFF;
	}
div#nav_re a {
	color:#669900;
	}
a#text {
	color:#000000;
	text-decoration:underline;
	}
a#text2 {
	color:#669900;
	text-decoration:underline;
	}
a#text3 {
	color:#000000;
	}
</style>