/* style import */
@import url(tabellen.css);
@import url(link.css);
@import url(navigation.css);
@import url(listen.css);
@import url(def_liste.css);

*{
	margin:0;
	padding:0;
	}
	
p{
	margin-top:8px;
	font-size:13px;
	line-height:18px;
	}

p.untertitel{
	margin-left:10px;
	color:#0069b3;
	}

body {
	background-color: #dfe5eb;		/* Schluepferblauer Background */
	font-family:arial, helvetica, sans-serif;
	margin:0px;
	padding:0px;
	font-size:14px;
	xline-height:17px;
	font-size:12px;
	}
	
h1, h2, h3, h4{
	margin-top:0px;
	padding:0px;
	margin-bottom:10px;
	color:#0069b3;
	
	}
	
h1{
	font-size:1.5em;
	clear:left;
	}	
	
h2{
	font-size:1.1em;
	display:block;
	}
	
h3{
	font-size:1em;
	margin-top:1em;
	margin-bottom:0.5em;
	}
	
hr {color: #bcbcbc; background-color: #bcbcbc; height: 1px; border:0px; margin:0 0 15px 0;}

/* -----------------
   Kopfzeilenbereich
   ----------------- */
#kopfzeile {
background-image: url(/img/header_bg.gif); /* oberer rand (4px)*/
height: 140px;
}
div#kopfzeile .logo,
div#kopfzeile .logo_naju{			/* Logo-Bilder mit Hyperlinks */
  display: block;
  width:160px;
  height:110px;
  position: absolute;
  top: 4px; left: 40px;
  background:url(/img/logo_herten.gif);
  background-repeat:no-repeat;
	}
div#kopfzeile .logo_naju{
  background:url(/img/logo_naju.gif);
	}
	
div#kopfzeile .logo2{			/* Logo-Bilder mit Hyperlinks */
  display: block;
  width:55px;
  height:110px;
  position: absolute;
  top: 4px; left: 200px;
  background:url(/img/logo_map.gif);
  background-repeat:no-repeat;
}

div#kopfzeile .topleft {			/* Hilfsklassen für Positionierung in Ecken */
  position: absolute;
  top: 0px; left: 0px;
  display:block;
  width:141px;
  height:140px;
  background:url(/img/header_left.gif);
  background-repeat:no-repeat;
}
div#kopfzeile .topright {
  position: absolute;
  top: 0px; right: 0px;
  display:block;
  width:537px;
  height:140px;
  background-image:url(/img/kinder1.gif);
  background-repeat:no-repeat;
}

/* -----------------
   Menu im
   Kopfzeilenbereich
   ----------------- */
ul#topmenu {
  list-style: none;
  position: absolute;
  top: 100px; right: 20px;		/* Absolute Position, damit unabh. vom Kopf-Bild */
}
ul#topmenu li {
  display: inline;  			/* Hyperlinks stehen nebeneinander */
}
ul#topmenu li a{
  padding-left: 10px;
  padding-right: 10px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1em;
  /*font-weight: bold;*/
  line-height: 1;
}
ul#topmenu li a:link, ul#topmenu li a:visited, ul#topmenu3 li a:link, ul#topmenu3 li a:visited {
  font-size: 14px;
  text-decoration: none;
  color: #266dab;
}
ul#topmenu li a:hover, ul#topmenu3 li a:hover, ul#topmenu3 li a:active {
  
  text-decoration: underline;
  color: #993333;
  background:#dfe5eb;
  
}

ul#topmenu2 {
	list-style:none;
	position:absolute;
	top:120px; left:110px;
}
ul#topmenu2 li {
display:inline;

}

ul#topmenu3 {
	list-style:none;
margin-left:5px;	
}

ul#topmenu3 li a:link, ul#topmenu3 li a:visited {
		width:100%;
		display:block;
		text-align:right;
}

ul#topmenu3 li a:hover, ul#topmenu3 li a:active {
	width:100%;
	display:block;
	text-align:left;
}

/* -----------------
   Mittlere Spalte
   ----------------- */
#mittelspalte {
background-color: #ffffff;		/* Hintergrund ist weiss */
margin-left: 141px;			/* Platz für Seitenspalten */
margin-right: 141px;
border: solid #bcbcbc 1px;
height: 100%; 
min-height:900px;				/* Das nutzt nix */
}

.inner h1{
	line-height:16px;
	}

a.pfeil2
{

background:url(/img/pfr_n.gif) no-repeat;
width:17px;
line-height:20px;
display:inline;
}
a:hover.pfeil2
{
background:url(/img/tn.gif) no-repeat;
width:17px;
height:16px;
}

div#mittelspalte div.inner1 {		/* i-Tupferl: Weisse Ränder neben dem grauen Rand */
  position: relative; left: -2px; top: 2px;
  padding: 0px;
  border-left: solid white 1px; border-bottom: solid white 1px;		/* Einmal links... */
  min-height:1200px;
}
div#mittelspalte div.inner2 {
  position: relative; left: 4px;  top: 1px;
  padding: 10px;
  border-right: solid white 1px; border-bottom: solid white 1px;		/* ... und rechts */
  min-height:1200px;
}

/* ----------------------
   Formatklassen für Inalt
   der mittleren Spalte
   ---------------------- */
div.bildlinks {
	width:250px;
	margin-right:15px;
	margin-bottom:5px;
	float:left;
	text-align:left;
	padding:5px;
	background-color:#DFE5EB;
	border:1px solid #bcbcbc;
	}
div.bildrechts {
	width:250px;
	margin-left:15px;
	float:right;
	text-align:right;
	padding:5px;
	background-color:#DFE5EB;
	border:1px solid #bcbcbc;
	}
	
div.bildlinks img, div.bildrechts img{border: solid #bcbcbc 1px;}
div.bildlinks, div.bildrechts {font-size: 0.9em; font-style: italic;}
div.bildlinks img{float:left;}
div.bildrechts img{float:right;}
div.bildlinks p{float:left;}
div.bildrechts p{float:right;}

/* Listen in der Mittelspalte */

ul li{
	xmargin-left:20px;
	}

/*button to the top!*/

.oben{
	display:block;
	text-align:right;
	clear:both;
	position:relative;
	height:20px;
	}
	
.oben a {
	background:url(/img/p_f.gif) no-repeat;
	height:20px;
	width:20px;
	display:block;
	position:absolute;
	right:0;
	top:0;
	}
	
.oben a:hover {
	background:url(/img/p_n.gif) no-repeat;
	}
	
/* ----------------------
   Rechte und linke Spalte
   ---------------------- */
#links, #rechts {
	position: absolute;
	top: 140px;
	width: 141px;
	background-color: transparent;
	}
	
#links {
	left: 0;
	}
	
#rechts {
	right: 0;
	}
/* ----------------------
   Styles fuer die Laschen
   ---------------------- */
#rechts .laschenab
{
width:135px;
margin-bottom:30px;;
}   

#rechts .laschenab .lasche {
  width: 135px;
  position: relative;
  left: 2px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11px;
  overflow: hidden;
  background-image: url(/img/lasche_rm.gif);	/* nur der rechte Rand */
  background-repeat:  repeat-y;
  margin-bottom: 0px;
}

#rechts .laschenab .lasche .lasche_ro{
display:block;
width:135px;
height:7px;
background:url(/img/lasche_ro.gif) no-repeat;
}

div#rechts .laschenab div.lasche div.inner {		/* Abstaende fuer den inneren Bereich */
  padding: 6px;
  padding-right: 10px;
}

.lasche_ru
{
display:block;
width:135px;
height:7px;
background:url(/img/lasche_ru.gif) no-repeat;
position: relative;
left: 2px;
}
/* ----------------------
   Formatklassen fuer
   Lascheninhalt
   ---------------------- */
div.lasche p {line-height: 1.2; margin-top: 0; margin-bottom: 0.5em;}
div.lasche h1 {font-weight: bold;   font-size: 1em; line-height: 1.5; margin-top: 0; margin-bottom: 0.5em;}
div.lasche h2 {font-weight: normal; font-size: 1em; line-height: 1.5; 
margin:0;}
div.lasche a img {vertical-align: middle; border: 0;}

/* ----------------------
   Fussbereich
   ---------------------- */
.fusszeile {
	xbackground-color:#000099;
	clear:both;
	border-bottom:solid 8px #0069b3;
	text-align:center;
	margin-top:20px;
	padding-bottom:8px;
	}

.fusszeile a{
	background:url(/img/top.gif);
	background-repeat:no-repeat;
	background-position:center;
	width:20px;
	height:20px;
	xdisplay:block;
	text-align:center;
	margin-left:center;
	margin-right:center;
	padding:10px;
	}
	
.fusszeile a:hover{
	background:url(/img/top_f.gif);
	background-repeat:no-repeat;
	background-position:center;
	}

p.hinweis{
	font-style:italic;
	color:#CC9933;
	}

hr.clear{
	clear:both;
	visibility:hidden;
	}
	
hr.headlinelink{
	margin-bottom:10px;
	}
	
#logorechts{
	position:absolute;
	top:10px;
	right:20px;
	}
	
.clear{
	clear:both;
	}