* {
  margin:0;
  padding:0;
}

body {
  text-align:center;
  background:#FFF8E8 url("pic/bg.jpg");
  /* Die Hintergrundfarbe wird in einem winzigem JPG gespeichert, da der IE unter 16bit-Graphikkarten CSS und JPG-Fargen nicht gleich behandelt */
  font-family:Verdana, sans-serif;
}

#header {
  clear:both;
  height:88px;
  position:relative;
}

#container {
  width:883px;
  margin:0 auto;
  text-align:left;
  background:url("pic/orgel_bg.jpg") right 6px no-repeat;
}


#container {
  *position:relative;
}

#content {
  float:left;
  width:524px;
  min-height:540px;
  _height:540px;
  _display:inline;
  border:1px solid #CCC;
  border-bottom-width:1px;
  background-color:white;
  padding:0px 2px;
  position:relative;
  margin-left:125px;
}


#sub-content {
  width:208px;
  float:right;
  margin-top:392px;
}
#navigation {
  width:124px;
  float:left;
  margin-left:-654px;
}

#footer {
  clear:both;
  position:relative;
  height:1em;
}


/* Seitenüberschrift */
/* erster Schriftzug "St. Wenzel ..." */
#header h1 {
  color:#333;
  font-size:24px;
  font-weight:bold;
  font-family:"Times New Roman",serif;
  position:absolute;
  /* Koordinaten im Kopf */
  left:128px; /* nach links */
  top:29px;   /* nach oben */
}
/* zweiter Schriftzug "Hildebrandt-Orgel ..." */
#header h2 {
  color:#900;
  font-size:24px;
  font-weight:bold;
  font-family:"Times New Roman",serif;
  position:absolute;
  /* Koordinaten im Kopf */
  right:230px; /* nach rechts */
  bottom:2px;  /* nach unten (Textbox) */
}



/* Navigation */
#navigation ul {
  list-style:none;
  border-bottom:1px solid #C5C2BB;
  text-align:right;
  margin-top:68px;
}

#navigation ul li {
  border-top:1px solid #C5C2BB;
  padding:5px 6px 5px 0px;
  font-size:11px;
  *line-height:17px;
  *height:15px;
  *padding-top:3px;
  _margin-right:0px;
  position:relative;

}


#navigation ul li a,
#navigation ul li.aktiv ul li a {
  color:#900;
  text-decoration:none;
}

#navigation ul li ul {
  position:absolute;
  left:124px;
  top:7px;
  width:12em;
  margin:0;
  display:none;
  background-color:#F3F3F3;
  border:1px solid #C5C2BB;
  border-top-style:hidden;
  border-right-width:2px;
}


#navigation ul li ul li {
  padding:5px;
  *padding-top:3px;
  position:relative;
}

#navigation ul li:hover ul,
#navigation ul li.over ul
{
  display:block;
}

#navigation a:hover,
#navigation ul li.aktiv a:hover {
  color:#D00;
}

#navigation ul li.aktiv a {
  color:#900;
  font-weight:bold;
}





/* Fließtext */
#content {
        font-size:12px;
        /* Extra-Angabe für den Internet-Explorer, da er relative Schriftgrößen
           anders als andere Browser interpretiert. */
        /* *font-size:12px; */
        /* Angabe auskommentiert, das Sie ja die gleiche wie oben ist */
}

/* Fließtextüberschrift */
#content h2 {
  font-size:18px;
  font-weight:normal;
  color:#8993B5;
  margin:1.1em 0 50px 1px;
}




/* Menü zu anderen Unterseiten auf der rechten Seiten */
#content #menu_unterseiten {
  position:absolute;
  top:30px;
  right:0px;
  list-style:none;
  border-bottom:1px solid #CCC;
  background:white;
  text-align:right;
}

#content #menu_unterseiten li {
  border-top:1px solid #CCC;
  padding:1px 4px 3px 0px;
  font-size:11px;
  line-height:13px;
  _padding-top:1px;
  _margin-bottom:0px;
  _margin-right:0px;
}

#content #menu_unterseiten li a {
  text-decoration:none;
  color:#900;
  line-height:2.9ex;
}


/* normaler Text bzw Tabellen im Fließtext */
#content p,
#content table
{
  font-size:12px;
  color:black;
  line-height:144%;
  margin:0 30px 1em 38px;
}
#content #button a {
  text-decoration:none;
  color:#FFFFFF;
}
/* Klasse für rechtbündige Links */
#text_rechtsbuendig {
 float:right;
  text-align:right;
}

/* Klasse für große Zeilenabstände */
#content .wenig_text,
#content.wenig_text p,
#content.wenig_text table
{
   /* Größere Zeilenabstände für zb Chorprobenseite */
   line-height:260%;
   /* relativer negativer Abstand nach oben, damit die Absätze dennoch auf gleicher linie wie die
   mit .dichter_text anfangen. */
   margin-top:-0.6em;
}


/* konzert-tabelle ua */
#content table {
  width:auto;
}
#content table td {
  padding:2px 5px 2px 0px;
  vertical-align:top;
}
#content div.trennlinie {
  border-top:1px solid #CCC;
  width:100%;
  height:0px;
  font-size:0px;
}


/* Das Foto samt Beschreibung unter dem Fließtext */
#content div.foto {
  position:absolute;
  bottom:0;
  right:0;
  width:390px;
  padding:26px;
  margin-bottom:10px;
  text-align:right;

}
#content div.foto img {
  float:right;
  border:2px solid #DADADA;
  padding:6px;
  margin-bottom:-10px;
}
#content div.foto p {
  margin:0 5px 0 0;
  padding-top:153px;  /* den Text am unteren Rand des Fotos ausrichten
                                        muss evtl angepasst werden, falls sich die Zeilenanzahl
                                        ändert */
  float:right;
  font-size:75%;
  line-height:100%;
  color:#666;
  width:150px;
}





/* === Text rechts === */
#sub-content {
  text-align:right;
}
#sub-content p {
  /* === Schriftgröße, Farbe und Zeilenabstand des Textblocks unter der Orgel === */
  font-family:Arial;
  font-size:14px;
  line-height:130%;
  font-weight:bold;
  color:#333;
}




/* Footer */
#footer #copyright {
  position:absolute;
  top:4px;
  left:124px;
  font-size:10px;
  color:#cfcecd;
  padding-bottom:4mm;
}
#footer #seitenanfanglink {
  position:absolute;
  top:4px;
  right:208px;
  font-size:10px;
  color:#ccc;
  padding-bottom:4mm;
}
#footer #copyright a {
  text-decoration:none;
  color:#CFCECD;
}
#footer #seitenanfanglink a {
  display:block;
  padding-right:19px;
  text-decoration:none;
  color:#999;
}


/* allgemeine Angaben */
hr {
  height:1px;
  width:84%;
  color:#CCC;
  border-style:hidden;
  border-bottom:1px solid #CCC;
  text-align:center;
  margin:auto;
}
hr.rot {
  height:3px;
  color:#C00;
  border-bottom:3px solid #C00;
}


/* Linkstile (ausser Navigation) */
/* Standartwerte */
a {
 text-decoration:none;
 color:#900;
}
/* Hoverlinks im Fließtext */
#content a:hover {
  color:#D00;
}