* {

  margin:0;

  padding:0;

  font-family: "Arial Rounded MT Bold", Arial, sans-serif;

  z-index:20;

  position:relative;

}



body {

  background-color:#c60;

  text-align:center;

}



h1,#einleitung,#making_of,#zurueck,#entstehung,#anleitung,.anleitung-detail,div.fragewort,#antwort-abrufen,#neue_frage {

  line-height:99em;

  overflow:hidden;

}



h1 {

  background:url(../images/aus_gruenden.png) top center no-repeat;

  height:80px;

  margin-top:30px;

}



#making_of {

  background:url(../images/making_of.png) right top no-repeat;

  width:100px;

  height:30px;

  cursor:pointer;

  position:absolute;

  top:10px;

  right:10px;

}

#making_of:hover {

  background-position: right bottom;

}



#zurueck {

  background:url(../images/zurueck.png) right top no-repeat;

  width:100px;

  height:30px;

  cursor:pointer;

  position:absolute;

  top:10px;

  right:10px;

}

#zurueck:hover {

  background-position: right bottom;

}



#einleitung {

  background:url(../images/einleitung.png) top center no-repeat;

  height:30px;

  margin-top:40px;

}



#entstehung {

  background:url(../images/entstehung.png) top center no-repeat;

  height:30px;

  margin-top:40px;

}



#anleitung {

  background:url(../images/anleitung.png) top center no-repeat;

  height:30px;

  margin-top:10px;

}



#anleitung-detail {

  height:20px;

  width:540px;

  margin:auto;

  z-index:10;

}



.anleitung-detail {

  position:absolute;

  bottom:20px;

  height:20px;

}



#anleitung-detail-1 {

  background:url(../images/anleitung-detail-1.png) top left no-repeat;

  margin-left:16px;

}



#anleitung-detail-2 {

  background:url(../images/anleitung-detail-2.png) top left no-repeat;

  margin-left:201px;

}



#form {

  width:720px;

  margin:30px auto 0 auto;

}





div.fragewort {

  position:absolute;

  cursor:pointer;

  height:30px;

  width:100px;

}



#fragewort-label-wieso {

  top:0px;

  background:url(../images/fragewort-wieso.png) center top no-repeat;

}



#fragewort-label-weshalb {

  top:40px;

  background:url(../images/fragewort-weshalb.png) center top no-repeat;

}



#fragewort-label-warum {

  top:80px;

  background:url(../images/fragewort-warum.png) center top no-repeat;

}



#fragewort-label-wieso:hover,#fragewort-label-weshalb:hover,#fragewort-label-warum:hover {

  background-position:center bottom;

}



#frageform {

  z-index:5;

  background:url(../images/input-frage.png) right top no-repeat;

  width:0px;

  overflow:hidden;

  height:30px;

  margin-left:80px;

  text-align:left;

}



input#frage {

  height:30px;

  padding:0;

  margin:0 0 0 35px;

  border:0;

  outline: none;

  font-size:16px;

  width:320px;

}



#antwort-abrufen {

  background:url(../images/form-antwort_abrufen.png) right top no-repeat;

  width:0;

  height:30px;

  position:absolute;

  top:0;

  left:469px;

  z-index:4;

  cursor:pointer;

}

#antwort-abrufen:hover {

  background-position: right center;

}



#antwort {

  display:none;

}



#neue_frage {

  background:url(../images/neue_frage.png) right top no-repeat;

  width:110px;

  height:30px;

  cursor:pointer;

  position:absolute;

  top:40px;

  right:0;

  display:none;

}

#neue_frage:hover {

  background-position: right bottom;

}



#archiv {

  margin:100px auto 20px auto;

  width:720px;

  padding:30px 0;

  height:240px;

  background:url(../images/archiv.png);

}



#archiv ul {

  height:240px;

  width:720px;

  list-style-type:none;

  overflow-y:scroll;

  overflow-x:hidden;

  text-align:left;

}



#archiv li {

  height:20px;

  padding:5px 135px 5px 5px;

  width:570px;

  line-height:20px;

  font-size:12px;

  overflow:hidden;

  white-space:nowrap;

  text-overflow:ellipsis;

  background:url(../images/archiv-aus_gruenden.png) 585px center no-repeat;

}



#archiv li span {

  font-size:10px;

  line-height:10px;

  height:10px;

  margin-top:5px;

  width:120px;

  display:block;

  float:left;

}



#archiv .ungerade {

  background-color:#DDFFDD;

}



img {

  padding:30px 15px 0 15px;

}