@charset "utf-8";
/* CSS Document */

body {
background-color:#F1DCC8;
background-image:url(../bilder/lilli-hintergrund.jpg);
background-repeat:no-repeat;
background-position:center top;
}

/* Die Seite ist insgesamt 900 hoch und 1000 px breit */

#seite {
width: 1000px;
height: 900px;
/* position relative, da sonst andere absolute Container (extra) NICHT daran orientieren würden */
position:relative; top:0px; left:0px;
/* zentrieren des div auf die Seitenmitt: */
margin: 0 auto;
background-color:#7C4AA8;
background-image:url(../bilder/lilli-rahmen-neu.jpg);
font: normal 13px verdana, sans-serif;
color:#fdfab5;
}

#oben {
width: 1000px;
height: 170px;
/* background-color:#98AA00; */
float: left;
}

#leerlinks {
width: 180px;
height: 596px;
/* background-color:#980100; */
float: left;
}

#geschichte {
width:571px;
height: 520px;
background-color:#EDE8C2;
color:#000000;
text-align:justify;
padding-top:50px;
padding-bottom:50px;
padding-left:60px;
padding-right:60px;
overflow:auto;
float:left;
}

#leerrechts {
width: 129px;
height: 596px;
/* background-color:#980100; */
float: left;
}

#unten {
width: 1000px;
height: 110px;
/* background-color:#98AA00; */
float: left;
}

#lilli {
position:absolute; top:30px; left:50px;
width:200px;
height:200px;
z-index:1;
background-image:url(../bilder/lilli.png);
background-repeat:no-repeat;
}

#schorschi {
position:absolute; top:15px; left:320px;
width:200px;
height:200px;
z-index:2;
background-image:url(../bilder/schorschi.png);
background-repeat:no-repeat;
}

#schorschmett {
position:absolute; top:25px; left:860px;
width:200px;
height:200px;
z-index:3;
background-image:url(../bilder/schorschmett.png);
background-repeat:no-repeat;
}

#leon {
position:absolute; top:250px; left:40px;
width:200px;
height:200px;
z-index:4;
background-image:url(../bilder/leon.png);
background-repeat:no-repeat;
}

#nelli {
position:absolute; top:460px; left:45px;
width:200px;
height:200px;
z-index:5;
background-image:url(../bilder/nelli.png);
background-repeat:no-repeat;
}

#kalli {
position:absolute; top:640px; left:80px;
width:200px;
height:200px;
z-index:6;
background-image:url(../bilder/kalli.png);
background-repeat:no-repeat;
}

#fiedeldumm {
position:absolute; top:300px; left:880px;
width:200px;
height:200px;
z-index:7;
background-image:url(../bilder/fiedeldumm.png);
background-repeat:no-repeat;
}

#opa {
position:absolute; top:650px; left:880px;
width:200px;
height:200px;
z-index:8;
background-image:url(../bilder/opa.png);
background-repeat:no-repeat;
}

#jacko {
position:absolute; top:700px; left:400px;
width:200px;
height:200px;
z-index:9;
background-image:url(../bilder/jacko.png);
background-repeat:no-repeat;
}

#zurucklink {
position:absolute; top:500px; left:880px;
width:100px;
height:50px;
font-size:16px;
text-align:center;
z-index:12;
}

#copyright {
position:absolute; top:850px; left:780px;
width:200px;
height:200px;
color:#333333;
z-index:14;
}

#radio {
position:absolute; top:15px; left:570px;
width:200px;
height:200px;
color:#000;
font-size:18px;
text-align:center;
z-index:10;
background-image:url(../bilder/radio.png);
background-repeat:no-repeat;
}

#mp3spieler {
position:absolute; top:85px; left:600px;
width:200px;
height:200px;
z-index:11;
}

a:link {
color:#111;
text-decoration: none;
}

a:active {
color:#111;
text-decoration: none;
}

a:visited {
color:#111;
text-decoration: none;
}

a:hover {
color:#CCCC00;
text-decoration: none;
}