<!--
/***********************
Basics
***********************/

/*  body und schrift deffinitionen */
html {
padding:0px;
margin:0px;
}
body {
background-color: #e1ddd9;
font-size: 12px;
font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
color:#564b47;
text-align:center;
margin:0px;
padding:0px;
}
p,pre, h1 {
margin:0px 10px 10px 10px;
}
h1 {
font-size:14px;
padding-top:10px;
text-transform:uppercase;
color: #564b47;
background-color: transparent;
}
a {
color: black;
font-size: 12px;
background-color:transparent;
text-decoration: none;
}
pre {
color: #564b47;
font-size: 11px;
background-color:transparent;
font-family: Courier, Monaco, Monospace;
}


/***********************
Gesamte Seite
***********************/
#page {
width:800px;
margin: 0px auto;
padding:0px;
text-align:left;
}


/***********************
Navigation oben
***********************/

#top {
position:relative;
display:block;
height: 30px;
padding:0 0 0 0;
margin:4px 0 0 0;
background-color:#cccccc;
border-bottom: 2px solid orange;
}

a.top {
font-size: 14px;
display: inline-block;
padding: 0px 13px 0px 13px;
margin: 7px 0 0 0;
border-right: 1px solid black;
}

a.top:hover {
background-color: gray;
}

a.top_last {					/*Das letzte Element der Navigation darf keinen Rand rechts haben*/
font-size: 14px;
display: inline-block;
padding: 0px 13px 0px 13px;
margin: 7px 0 0 0;
}

a.top_last:hover {
background-color: gray;
}


/***********************
Logo
***********************/
#logo_top {
position:relative;
display:block;
height: 170px;
padding:0 0 0 0;
margin:0 0 0 0;
background-color:white;
background-image:url('logo_800w.gif');
background-repeat: no-repeat;
width: 800px;
}


/***********************
Inhalt + Bereiche
***********************/

#content {
position:relative;
height:550px;
background-color:white;
overflow: auto;
border-bottom: 2px solid orange;
}

.bereich {				/*allg. Definition der Bereiche*/
position: absolute;
display: block;
width: 190px;
height: 270px;
}

.robi {
left: 20px; 
top: 0px;
background-image:url('start_robi.png');
background-repeat:no-repeat;
padding-top: 110px;
}

.rjz {
left: 215px;
top: 0px;
background-image:url('start_rjz.png');
background-repeat:no-repeat;
padding-top: 110px;
}

.fuchsbau {
left: 410px;
top: 0px;
background-image:url('start_jugiaugarten.png');
background-repeat:no-repeat;
padding-top: 110px;
}

.jugimagden {
left: 605px;
top: 0px;
background-image:url('start_jugimagden.png');
background-repeat:no-repeat;
}

.fiz {
left: 20px; 
top: 270px;
background-image:url('start_fiz.png');
background-repeat:no-repeat;
}

.veranstaltungen {
left: 215px;
top: 270px;
background-image:url('start_veranstaltungen.png');
background-repeat:no-repeat;
}

.kindertheater {
left: 410px;
top: 270px;
background-image:url('start_kindertheater.png');
background-repeat:no-repeat;
}

.angebote {
left: 605px;
top: 270px;
background-image:url('start_angebote.png');
background-repeat:no-repeat;
}