/* Farben 

blau: 	#0066b3;
hellblau: #3385C2;
rot:	#d01f25;

 */

/******** Allgemeine Anweisungen ********/

* {
margin: 0;
padding: 0;
}

body {
  background: #fff;
  color: #333;
  font-family: Verdana, Arial, sans-serif;
  font-size: 100.01%;
}

.stopFloat {
  display: block;
  clear: both;
  float: none;
  line-height: 0;
  font-size: 0;
  height: 1px;
}

.unsichtbar {
	position:absolute; 
	top:-5000px; 
	left:-5000px;
	height: 1px;
	width: 1px;
}

.floatleft {
	float: left;
}

a, a:link, a:visited  {
  text-decoration: underline;
}

a:focus, a:hover, a:active  {
  text-decoration: none;
}

a img { border: 0;}

input, textarea, select { font: 100% verdana,arial,sans-serif;}


/* Seitenbreite */

/* Für Browser, die min-width verstehen*/
#wrapper1 {
  min-width: 870px; 
  max-width: 1242px;
}

/* Für den IE6, damit der auch eine min-width hat (damit die dritte Spalte nicht umbricht) */

* html #wrapper2 {
  border-left: 900px solid #fff; /* warum 890px? */
  position: relative; 
  float: left; 
  z-index: 1;
  }
  
* html #wrapper3 {
  margin-left: -900px; 
  position: relative; 
  float: left; 
  z-index: 2;
}
  
  /* Problem: bei Schriftvergrößerung im IE ist die dritte Spalte immer noch zu klein */

/******** Schrift ********/

#schrift {
  background: #0066b3;
  color: #fff;
  overflow: hidden;
  padding: 3px 0 3px 375px;
}

#schrift h1 {
  font-size: 0.7em;
  font-weight: normal;
  display: inline;
  font-weight: bold;
}

#schrift ul {
  display: inline;
  list-style: none;
}

#schrift li {
  display: inline;
  padding: 0px 8px 0px 8px;
  border-right: 1px solid #fff;
}

* html #schrift li {
  height: 1em;
}

#schrift li.rechts {
  border-right: none;
}

#schrift a, #schrift a:link, #schrift a:visited  {
  font-size: 0.7em;
  color: #fff;
  line-height: 1.8em;
}

#schrift a:focus, #schrift a:hover, #schrift a:active  {
  background: #3385C2;
  text-decoration: underline;
}

/******** Logo ********/

#logo {
  background: #fff;
  height: 123px;
  margin-bottom: 45px;
  background: url(../images/menschen.jpg) scroll no-repeat 375px 36px ;
  /*background-image: url(../images/menschen.jpg);
  background-position: 375px 36px;
  background-repeat: no-repeat;*/
}

#logo img {
  margin: 15px 20px 0 20px;
}



/******** navigation ********/

#navigation {
  float: left;
  width: 19%;
  overflow: hidden; /* wichtig, damit im IE die dritte Spalte bei einem schmalen Bildschirm nicht runter rutscht */
}

#navigation .linie {
  border-bottom: 4px solid #0066b3;
  width: 75%;
  display: block;  
  line-height: 1px;
}

/******** Suche ********/

#suche {
 padding: 10px 10px 20px 15px;
 border-top: 4px solid #0066b3;
 border-right: 4px solid #0066b3;
}

#suche h2 {
  color: #0066b3;
  font-size: 0.8em;
}

#suche input {
  vertical-align: middle;
}

#suche input.form {
  padding: 1px 2px;
  width: 65%;
  border: 1px solid #0066b3;
  background: #eaeaea;
  font-size: 0.8em;
}

html>body #suche input.form {
  width: 55%;
  w\idth: 65%
}


/******** Menue ********/

#menue {
  font-size: 0.8em;
  font-weight: bold;
}

#menue ul {
  list-style: none;
  margin-bottom: 20px;
}

#menue ul ul {
  margin-bottom: 0px
}

#menue li {
  padding: 1px 0 0 0;
  line-height: 120%;
}

#menue li a {
  display: block;
  color: #0066b3;
  text-decoration: none;
  padding: 3px 0 3px 15px;
  background:  url(../images/quadrat_rot.gif) 0 0.5em no-repeat;
}

#menue li li a {
  font-weight: normal;
  padding: 3px 0 3px 15px;
  margin-left: 15px;
  background:  none;
}

#menue li a:focus, #menue li a:hover, #menue li a:active, #menue li a.active {
  color: #fff;
  background-color: #d01f25; 
}

#menue li li a:focus, #menue li li a:hover, #menue li li a:active, #menue li li a.active {
  color: #fff;
  background-color: #0066b3; 
}

/******** brotkrumen-navigation ********/

#content p.breadcrump {
  color: #777;
  line-height: 150%;
  font-size: 0.85em;
}

#content p.breadcrump a, #content p.breadcrump a:link, #content p.breadcrump a:visited {
  font-weight: normal;
  color: #0066b3;
}

#content p.breadcrump a:focus, #content p.breadcrump a:hover, #content p.breadcrump a:active  {
  color: #fff;
  background: #0066b3;
  text-decoration: none;
}


/******** Inhalt ********/


#content {
  float: left;
  width: 55.9%; 
  padding-bottom: 20px;
  font-size: 0.8em;
}

#inner_content {
	margin: 0 35px;
}

#content h1 {
  font-family: 'Avant Garde', 'Avantgarde', Verdana, Arial, sans-serif;
  color: #0066b3;
  font-size: 2.7em;
  font-weight: normal;
  margin: 0.4em 0;
  line-height: 110%;
}

#content h2 {
  font-family: 'Avant Garde', 'Avantgarde', Verdana, Arial, sans-serif;
  color: #0066b3;
  font-size: 1.6em;
  font-weight: normal;
  margin: 1.8em 0 0 0;
  line-height: 130%;
}

#content h3 {
  font-family: 'Avant Garde', 'Avantgarde', Verdana, Arial, sans-serif;
  font-weight: bold;
  font-size: 1em;
  margin: 2em 0 0 0;
  line-height: 150%;
}

#content h4 {
  font-weight: bold;
  margin: 0.8em 0;
  line-height: 150%;
}

#content p {
  line-height: 150%;
  margin: 0.8em 0;
}

#content p.datum {
  color: #0066b3;
  margin: 0;
}

#content p.einleitung {
  margin: 0;
}

#content hr {
 border: 0px; /* Für Firefox und Opera */
 border-top: solid 1px #0066b3;
 border-bottom: solid 1px #fff; /* Für I.Explorer (Seiten-Hintergrundfarbe!) */
}

#content img {
  border: 1px solid #888;
}

#content img.rahmenlos {
  border: 0;
  text-align: center;
}

#content img.fliessbild {
  float: left;
  margin: 5px 15px 5px 0;
}

#content a, #content a:link, #content a:visited {
  color: #0066b3;
}

#content a:focus, #content a:hover, #content a:active {
  color: #fff;
  background: #0066b3;
}

#content fieldset {
	border: solid 1px #333;
}

#content fieldset legend {
	margin: 0 10px;
	padding: 0 5px;
}

#content fieldset p {
	margin: 1em 15px;
}

#content .pager {
	margin: 2em 0 0 0;
}

/* Styles Logos */

#content div.logo {
	margin-bottom: 3em;
}

/* Styles Kontaktadressen */

#content address {
   border-top: 1px solid #0066b3;
	font-style: normal;
	font-weight: normal;
	padding: 1em 0 0.7em 0;
	margin: 8px 0 0 0;
}

#content address strong {
	font-weight: bold;
	color: #0066B3;
}

/* Styles Organisationen */

#content .abisz {
	background: #E7EEF6;
	border-bottom: 1px solid #0066b3;
	width: 100%; /* für den IE weil er sonst die Breitenangaben in .links und .rechts falsch interpretiert */
}

#content .abisz .links {
	width: 50%;
	float: left;
	margin-right: 5%;
}

#content .abisz .rechts {
	width: 44%;
	float: left;
}

#content .abisz h3 {
  margin: 0.8em 0 0 12px;
}

#content .abisz p {
  margin: 0 0 0.8em 12px;
}

#content .abisz address {
   border-top: none;
	padding: 0;
	margin: 0.8em 12px 0.8em 0;
	line-height: 150%;
}

#content .abisz address strong {
	font-weight: bold;
	color: #333;
}

/* Styles Tabelle */

#content table {
  margin: 1.1em 0;
  vertical-align: top;
  border-collapse: collapse; 
}

#content td {
   border-bottom: 1px solid #0066b3;
	padding: 0.8em;
	background: #E7EEF6;
	vertical-align: top;
}

#content .spalte2 {
 white-space: nowrap;
}

#content .streifen td {
	background: #D5E1EF;
}

/* Formular */


#content form p {
  margin: 20px 0;
}

#content label {
  display: block;
  font-weight: bold;
}

#content input,
#content textarea {
  background: #F7F7F7;
  font-family: verdana, arial, sans-serif;
  font-size: 1em;
  border: 1px solid #CCC;
  width: 60%;
  padding: 2px;
}

#content input.button {
  background: #0066b3;
  border: none;
  width: auto;
  color: #fff;
  margin-top: 15px;
  padding: 2px 10px;
}

#content input:hover,
#content textarea:hover {
  background: #FCFCFC;
  border: 1px solid #999;
}

#content input:focus,
#content textarea:focus {
  background: #FFF;
  border: 1px solid #d01f25;
}

#content input.button:hover, 
#content input.button:focus {
  background: #d01f25;
  border: none;
}

/* Listen */

#content ul {
  list-style: none;
  margin: 1.2em 0 1.2em 45px;
  line-height: 180%;
}

#content li {
   padding-left: 15px;
	background:  url(../images/quadrat_blau.gif) 0 0.6em no-repeat;
}

#content ul ul {
	margin: 1.2em 0 1.2em 40px;
	
}

#content ul ul ul {
	margin-top: 1.2em;
	margin-bottom: 1.2em;
}

/* Suche */

#content .suche .searchhighlight { 
  color: #d01f25; 
  font-weight: bold; 
}

#content .suche input.button {
  margin-top: 0;
}

#content .suche .suchergebnis {
	margin: 1em 0;
}

/* Inhaltsverzeichnis */

#content #sitemap ul {
  margin: 1.2em 0;
  color: #0066b3;
  font-size: 1.6em;
}

#content #sitemap ul ul {
   font-size: 0.6em;
	font-weight: bold;
   margin: 0 0 1.2em 0;
	padding-top: 0.5em;
	border-top: 1px solid #0066b3;
}

#content #sitemap ul ul ul {
   font-size: 1em;
	font-weight: normal;
	margin: 0 0 1.2em 0;
	border-top: none;
}

#content #sitemap li {
	background:  none;
	padding-left: 0;
	margin-top: 1.8em;
}

#content #sitemap  li li{
  margin-top: 0;
  padding-left: 15px;
  background:  url(../images/quadrat_rot.gif) 0 0.6em no-repeat;
}

#content #sitemap li li li {
	background:  url(../images/quadrat_blau.gif) 0 0.6em no-repeat;
}

/******** Spalte 3 ********/

#spalte3 {
  float: right;
  width: 25%;
  font-size: 0.8em;
}

#inner_spalte3 {
  margin:  0 20px 0 0;
}

#spalte3 h1 {
  font-family: 'Avant Garde', 'Avantgarde', Verdana, Arial, sans-serif;
  color: #0066b3;
  font-size: 1.6em;
  font-weight: normal;
  margin:  2.35em 0 0 0;
  line-height: 150%;
}

#spalte3 h2 {
  font-family: 'Avant Garde', 'Avantgarde', Verdana, Arial, sans-serif;
  color: #333;
  font-size: 1em;
  font-weight: bold;
  margin:  0;
  line-height: 150%;
}

#spalte3 img {
  float: left;
  margin: 4px 8px 0 0;
  border: 1px solid #888;
}

#spalte3 p {
  line-height: 150%;
  margin: 0 0 0.8em 0;
}

#spalte3 div.hg {
 background: #E7EEF6;
 border-bottom: 1px solid #0066b3;
 padding: 0.8em;
 margin-right: -20px;
}

#spalte3 a, #spalte3 a:link, #spalte3 a:visited {
  color: #0066b3;
}

#spalte3 a:focus, #spalte3 a:hover, #spalte3 a:active {
  color: #fff;
  background: #0066b3;
}

/* Kontaktliste */
   
#spalte3 address {
	font-style: normal;
	font-weight: normal;
	line-height: 150%;
}