/*************************************************************
Neues Layout für die Homepage des Wald- und Naturkindergartens
Bruchsal e.V.

2005 Lars Mezler Software Consulting - http://www.mezler.de
**************************************************************/

body{
	font-family: Arial, Helvetica, sans-serif;
	padding: auto;
	margin: auto;
	background: #FFEDC8;
	text-align: center;
	color: #646417;
	font-size: 16px;
}
/*************************************************************
Überschriften - überall gültig
**************************************************************/
h1{
	font-family: Kidprint, Arial, Helvetica, sans-serif;
	color: #BF002C;
	font-size: 40px;
}

h2{
	font-family: Kidprint, Arial, Helvetica, sans-serif;
	color: #BE002C;
	font-size: 30px;
}

h3{
	font-size: 25px;
	font-family: Kidprint, Arial, Helvetica, sans-serif;
	color: #BE002C;
	margin-bottom: 0px;
}

/*************************************************************
Liste
**************************************************************/
li{
	font-family: Arial, Helvetica, sans-serif;	
	line-height: 150%;
	margin-bottom: 5px;
	list-style-position: outside;
	list-style-type: sqare;
	font-size: 18px;
}


/*************************************************************
Der Kopf der Seite
*************************************************************/
div.seitenkopf{
	height: 100px;
	max-height: 100px;
	background-color: #BE002C;	
	font-family: Kidprint, Arial, Helvetica, sans-serif;
	font-weight: normal;
	line-height: 80%;
	color: #FFEBC6;
	text-align: center;
	margin:0px;
	padding:0px;
	padding-top: 10px;
}

div.seitenkopf h1{
	color: #FFEBC6;
	font-size: 60px;
}


div.seitenkopf p{
	margin: 0px;
}

div.seitenkopf img{
	position: absolute;
	left:0px;
	float:left;
	padding:0px;
	margin:0px;
}


/*************************************************************
Der Seitenfuss ist nur ein Balken
*************************************************************/
div.seitenfuss {
	height: 0px;
	margin:0px;
	padding:0px;
}

/*************************************************************
Das Menü - für alle Ebenen wird entsprechendes
Linkverhalten gesetzt
*************************************************************/
div.menu{
  position:absolute;
  left: 15px;
  top: 160px;
  width: 250px;
  text-align:left;
  background: transparent;
  margin-left:15px;
}

div.menu a{
	font-family: Kidprint, Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: normal;
	text-decoration: none;
	color: #FFEBC6;
	width: 240 px;
	height:20px;
	background:#BE002C;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #DE204C;
	padding-left: 10px;
	display: block;
}

div.menu a:hover{
	background: #9D0024;
}

div.menu a.sectionLevel1{
	font-size: 15;
}

div.menu a.sectionLevel1:hover{
	font-size: 15;
	display: block;
}

div.menu a.sectionLevel2{
	font-size: 13;
	display: block;
}

div.menu a.sectionLevel2:hover{
	font-size: 1;
   padding-left: 25px;
	display: block;
}


/*************************************************************************************************
Die Hauptbereiche - können mehrere Klassen Sein - 
hier sind im wesentlichen 2 definiert: die Bilderseite und der "normale" Hauptbereich
*************************************************************************************************/

div.hauptbereich {
 position: absolute;
 top: 130 px;
 margin-left: 300px;
 width: 670px;
 margin-right:10px;
}


div.basis{
	position:relative;
	width:970px;
	margin:auto;
	text-align:left;
	background-color: #FFEBC6;
}

div.hauptbereich img{
	margin: 5px;
	border: medium solid #646417;
	background: transparent;
}

div.hauptbereich img.noborder{
	border: none;	
	text-align: center;
}

div.hauptbereich img.nobordercenter{
	border: none;	
	text-align: center;
}


div.hauptbereich a {
	font-family:  Arial, Helvetica, sans-serif;
	font-weight: normal;
	text-decoration: none;
	font-weight: normal;
	color: #BE002C;
}

div.hauptbereich a:hover {
	color: #32644B;
	font-family:  Arial, Helvetica, sans-serif;
	font-weight: normal;
	text-decoration: none;
	font-weight: normal;
}

div.hauptbereich a.nextPage{
	clear: right;
	margin: 10px;
}

div.hauptbereich div.centerImage{
	width: 100%;
	text-align: center;
}

div.bilderseite{
	margin-left: 280px;
	text-align: center;
}

div.bilderseite img{
	margin: 5px;
	border: medium solid #BE002C;
	background: transparent;
}

div.bilderseite img.noborder{
	border: none;	
	text-align: center;
}

div.bilderseite img.nobordercenter{
	border: none;	
	text-align: center;
}


div.bilderseite a {
	font-family:  Arial, Helvetica, sans-serif;
	font-weight: normal;
	text-decoration: none;
	font-weight: normal;
	color: #BE002C;
}

div.bilderseite a:hover {
	color: #32644B;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	text-decoration: none;
	font-weight: normal;
}

div.bilderseite a.nextPage{
	clear: right;
	margin: 10px;
}

div.hauptbereich p {
	margin-top: 4px;
}

#meinText{
  width: 200px;
  height: 30px;
  text-align:left;
    overflow:hidden;
  font-family: Kidprint, Arial, Helvetica, sans-serif;
  font-weight: normal;
  text-decoration: none;
  font-weight: normal;
  color: #FFFFFF;
  white-space: nowrap;
}

p.bildueberschrift{
	float:left;
}

p.clearline{
	clear:left;
}
