@charset "UTF-8";
body {
background: rgb(250,245,213);
font-family : Arial, sans-serif;
font-size:12px;
}

/* -------------------- document -------------------- */
div#document {
	margin: auto;
	background:url(../img/document.png) no-repeat;
	z-index:0;
	width:1100px;
	height:600px;
    position:absolute;
	text-align:left;
}

div#document a {
  text-decoration : none;
}

/* ------------------- spam protection ------------------- */
span.futsch {
display:none;
}

/* -------------------- navigation -------------------- */

/* --- musiktherapie --- */
div#musiktherapie a{
    position: absolute;
    background :url(../img/musiktherapie.png) -0px 0px no-repeat;
	width:119px;
    height:39px;
    left:50%;
    margin-left:310px;
    margin-top:218px;
}



div#musiktherapie a:hover{
    background :url(../img/musiktherapie.png) -119px 0px no-repeat;

}

/* --- unterrichtsangebot --- */
div#unterrichtsangebot a{
    position: absolute;
    background :url(../img/unterrichtsangebot.png) -0px 0px no-repeat;
	width:150px;
    height:45px;
    left:50%;
    margin-left:-25px;
    margin-top:140px;
}



div#unterrichtsangebot a:hover{
    background :url(../img/unterrichtsangebot.png) -150px 0px no-repeat;

}

/* --- spielregeln --- */
div#spielregeln a{
    position: absolute;
    background :url(../img/spielregeln.png) -0px 0px no-repeat;
	width:102px;
    height:34px;
    left:50%;
    margin-left:-240px;
    margin-top:117px;
}



div#spielregeln a:hover{
    background :url(../img/spielregeln.png) -102px 0px no-repeat;

}


/* --- rasselbande --- */
div#rasselbande a{
    position: absolute;
    background :url(../img/rasselbande.png) -0px 0px no-repeat;
	width:106px;
    height:31px;
    left:50%;
    margin-left:170px;
    margin-top:147px;
}



div#rasselbande a:hover{
    background :url(../img/rasselbande.png) -106px 0px no-repeat;

}


/* --- news --- */
div#news a{
    position: absolute;
    background :url(../img/news.png) -0px 0px no-repeat;
	width:60px;
    height:46px;
    left:50%;
    margin-left:-435px;
    margin-top:173px;
}



div#news a:hover{
    background :url(../img/news.png) -60px 0px no-repeat;

}


/* --- musikschule --- */
div#musikschule a{
    position: absolute;
    background :url(../img/musikschule.png) -0px 0px no-repeat;
	width:135px;
    height:61px;
    left:50%;
    margin-left:-410px;
    margin-top:88px;
}



div#musikschule a:hover{
    background :url(../img/musikschule.png) -135px 0px no-repeat;

}


/* --- mietinstrumente --- */
div#mietinstrumente a{
    position: absolute;
    background :url(../img/mietinstrumente.png) -0px 0px no-repeat;
	width:139px;
    height:54px;
    left:50%;
    margin-left:295px;
    margin-top:154px;
}



div#mietinstrumente a:hover{
    background :url(../img/mietinstrumente.png) -139px 0px no-repeat;

}


/* --- links --- */
div#links a{
    position: absolute;
    background :url(../img/links.png) -0px 0px no-repeat;
	width:61px;
    height:31px;
    left:50%;
    margin-left:320px;
    margin-top:113px;
}



div#links a:hover{
    background :url(../img/links.png) -61px 0px no-repeat;

}


/* --- dozentinnen --- */
div#dozentinnen a{
    position: absolute;
    background :url(../img/dozentinnen.png) -0px 0px no-repeat;
	width:105px;
    height:40px;
    left:50%;
    margin-left:147px;
    margin-top:217px;
}



div#dozentinnen a:hover{
    background :url(../img/dozentinnen.png) -105px 0px no-repeat;

}


/* --- bildergalerie --- */
div#bildergalerie a{
    position: absolute;
    background :url(../img/bildergalerie.png) -0px 0px no-repeat;
	width:115px;
    height:46px;
    left:50%;
    margin-left:-210px;
    margin-top:82px;
}



div#bildergalerie a:hover{
    background :url(../img/bildergalerie.png) -115px 0px no-repeat;

}


/* --- preise --- */
div#preise a{
    position: absolute;
    background :url(../img/preise.png) -0px 0px no-repeat;
	width:64px;
    height:20px;
    left:50%;
    margin-left:200px;
    margin-top:192px;
}



div#preise a:hover{
    background :url(../img/preise.png) -64px 0px no-repeat;

}



/* --- workshops --- */
div#workshops a{
    position: absolute;
    background :url(../img/workshops.png) -0px 0px no-repeat;
	width:102px;
    height:48px;
    left:50%;
    margin-left:-370px;
    margin-top:126px;
}



div#workshops a:hover{
    background :url(../img/workshops.png) -102px 0px no-repeat;

}



/* --- kontakt --- */

div#kontakt a{
    position: absolute;
    background :url(../img/kontakt.png) no-repeat;
    width:162px;
    height:167px;
    left:50%;
    margin-left:-450px;
    margin-top:500px;
}


/* --- home --- */

div#willkommen a{
  height:130px;
  left:50%;
  margin-left:-322px;
  margin-top:193px;
  position:absolute;
  width:130px;
}

/* -------------------- subnavigation -------------------- */

div#navi-rechts {
	position: absolute;
        width:210px;
	height:394px;
        margin-left:860px;
        margin-top:320px;
}


/* --- subnavigation-oben --- */
div#navi-rechts-oben {
    position: absolute;
    background :url(../img/navigationoben.png) -0px 0px no-repeat;
    width:198px;
    height:116px;
    margin-left:10px;
    margin-top:0px;
    z-index: -1;
}


/* --- subnavigation-liste --- */
div#navi-rechts-liste {
  float:left;
  margin-left:3px;
  margin-top:60px;
  width:198px;
}

div#navi-rechts-liste ul{
  list-style-type:none;
}

div#navi-rechts-liste li{
  height:20px;
  list-style-image:url(../img/blank.png);
  text-align:top;
}
div#navi-rechts-liste li:hover {
 list-style-image:url(../img/note.png);
}

div#navi-rechts-liste a {
   color:black;
   font-weight:bold;
   vertical-align:top;
}

div#navi-rechts-liste a:hover, div#navi-rechts-liste a.active {
   color:rgb(143,0,0);
}
/* --- navi-rechts-unten --- */

div#navi-rechts-unten {
  background:transparent url(../img/navigationunten.png) no-repeat scroll 0 0;
  float:left;
  height:78px;
  margin-left:10px;
  position:relative;
  width:198px;
}

 div#inhalt-ueberschrift {
    position:absolute;
    left:641px;
    top:330px;
    height: 50px;
    width:240px;

  }
/* -------------------- text-wrapper -------------------- */

 div#inhalt-klein {
    height:400px;
    left:410px ;
    line-height:1.3em;
    overflow:auto;
    position:absolute;
    /* top:330px;   */
    top:387px;
    width:460px;
    overflow:visible;

  }
 div#inhalt-gross {
    height:400px;
    left:410px;
    line-height:1.3em;
    overflow:auto;
    position:absolute;
    top:330px;
    width:560px;
    overflow:visible;
  }
  

 div#inhalt-klein-text {
    position:absolute;
    top:80px;
    left:80px;
    width:380px;

  }
  div#inhalt-gross-text {
    position:absolute;
    top:80px;
    left:80px;
    width:480px;

  }