/* -- Allgemeines -- */
body {
 background-color: #1AACA3;
 color: #333;
 margin: auto;
 padding: 10px 0;
 min-width: 700px; /* Bei weniger als 700px Breite soll ein Scrollbalken erscheinen */
 font-size: 100.01%; /* umgeht den Font-Size-Bug im Safari, älteren Operas und IE */
 font-family: arial, verdana, helvetica, sans-serif;
}
a { 
 font-size: 90%;
 text-decoration: none;
}
p, ul {
 font-size: 90%;
 line-height: 1.65em;
 }
ul {
 list-style-type: disc;
}
ul.main {
 font-weight: bold;
 letter-spacing: 0.02em;
}
li.none {
 list-style-type: none;
}
ul.sub, ul.subtitle {
 font-size:100%;
 font-weight: normal;
 list-style-type: circle;
}
ul.subtitle li:first-line {
 font-weight: bold;
 letter-spacing: 0.02em;
 margin-bottom: 0.5em;
 list-style-type: circle;
}
p { 
 margin: 0.5em 0 0.5em 1em;
 } 
h1, h2, h3, strong {
 letter-spacing: 0.02em;
}
h1 {
 font-size: 1.3em;
 line-height: 0.8em;
 padding: 0 0 5px 0;
 margin: 0;
 text-align:left;
}
h2 {
 font-size: 1.15em;
}
h3, strong {
 font-size: 1.0em;
 margin: 0.5em 0 0.5em 1em;
}
h1.web { 
 border-bottom: 1px dashed #0CC;
 margin: 0 0 15px 0;
}
h1.wort { 
 border-bottom: 1px dashed #FFC;
 margin: 0 0 15px 0;
}
h1.musik { 
 border-bottom: 1px dashed #FB0;
 margin: 0 0 15px 0;
}
h1.bild_bright {
 border-bottom: 1px dashed #036;
 margin: 0 0 15px 0;
}
h1.bild_dark {
 color:#0CC; 
}
img { /* generell keinen Rahmen um Bilder */
 border: 0;
}
hr{
 width: 100%;
 margin-bottom: 2em;
 border: 1px dashed #0FF;
}
hr.solid{
 border: 1px solid #0FF;
}
q{
 text-decoration: none;
}
cite{
 font:normal 0.85em Verdana, Arial, sans serif;
 line-height:1.2em;
 text-align:right;
}
.foot {
 font-size:0.75em;
 line-height:1.4em;
 color:#044;
 text-align:center;
}
.text {
 margin:0;
 padding: 2em 2.5em;
 font-size: 90%;
 text-align:justify;
}
.inline {
 display:inline;
}
.in {
 margin-left: 10px;
}
.hint{
 font-weight:bold;
 color:#F00;
}
.bgweb_bright{
 background-color:#B0EAEA;
 }
.bgweb_dark{
 background-color:#088;
 }
 .bgwort{
 background-color:#FFE0A0;
 }
 .bgbild_bright{
 background-color:#C0FAE0;
 }
 .bgmusik{
 background-color:#EAEAA0;
 }
 .bginfo{
 background-color:#8AB;
 }
.fleft {
 float: left;
 margin: 0 1em 0.2em 0;
}
.fright {
 float: right;
 margin: 0 0 0.2em 1em;
 padding: 1px;
}
.clearer {
 clear: both;
}
.bottom {
 vertical-align: bottom;
}
.right {
 text-align: right;
}
.left {
 text-align: left;
}
.mittig {
 text-align: center;
}
.noborder {
 border:0;
}
.fett {
 font-weight: bold;
}
.normal {
 font-weight: normal;
}
.hit {
 color:#F60;
}
/* -- Layoutspezifisches -- */
#rahmen { 
 font-size: 90%;
 max-width: 900px; /* maximale Breite 900px.Für den IE in ielte.css einen Workaround. */
 margin: auto; /* Seite zentrieren*/
}

/* - Kopfcontainer - */
#header {
 width: 100%;
 height: 120px; 
 padding: 0;
 margin: 0;
}
/* - Logos im Kopf - */
#top_left {
 float:left;
 min-width:330px;
 height:100%;
 margin: 0;
 padding: 0;
 text-align: left;
}
#top_right {
 float:right;
 height:100%;
 min-width:370px;
 margin: 0;
 padding: 0;
 text-align: right;
}
#topmenu {
height:15px;
margin:0;
padding:0;
text-align:right;
}
#topmenu li {
display:inline;
list-style-type:none;
padding:0pt 0px 0pt 6px;
}

/* - Trennt Kopf von unterem Container - */
#clearer {
 clear: both;
 width: 100%;
 height:0.01em;
}

/* - Gesamter unterer Container - */
#maincontainer {
 width:100%;
 min-width: 700px;
 padding:0;
 margin:0;
}
/* - Navigation, Linke Spalte - */
#left {
 float:left;
 width: 23%;
 min-width: 150px;
 padding: 0;
 margin: 1.5em 0 0 0;
}
#nav {
 width: 150px;
 padding: 0; 
 margin: 23px 0 0 24%;
 font-size: 0.9em;
}
#nav dt { /* Überschriften in der Navigation */
 height:30px;
 font-size: 1.2em;
 font-weight:bold;
 font-family: Arial, Verdana, Helvetica, sans serif;
 color: #044;
 padding: 0.4em 0 0.1em 15px;
 margin-top: 0.5em;
 background-image: url(../images/buttonbg.gif);
 background-repeat: no-repeat; 
}
#nav dd { /* Unterpunkte der Navigation. */
 font-family: Arial, Verdana, Helvetica, sans serif; 
 padding: 0 0 0 25px;
 margin: 0.1em 0;
 color: #044;
}
#nav a { 
 color: #044; 
 text-decoration: none;
}
#nav a:hover { 
 color: #0FF;
}

/* - Main-Content - */
#main {
 float: right; /* Inhalt rechts neben der Navigation vorbeifließend */
 width: 76%;
 height:100%;
 margin: 0;
 padding: 0 0 2em 0;
 line-height: 1.5em;
 text-align: center;
 border-left: solid 2px #066; 
 border-top: solid 2px #066; 
 border-right: solid 1px #12BCBC; 
 border-bottom: solid 1px #12BCBC;
}
#main.ref {
 padding: 0;
}
#main a { 
 color: #666;  
 font-size: 1em; 
 text-decoration: none;
 padding: 0 2px;
}
#main a:hover { 
 color: #000;
}
#main a.indoc:before { 
 content: url(../images/link.gif)" ";
}
#main a.indoc:hover:before { 
 content: url(../images/link_on.gif)" ";
}
#main a.top {  
 font-size: 0.9em;
} 
#main a.top:before { 
 content: url(../images/up.gif)" ";
}
#main a.top:hover:before { 
 content: url(../images/up_on.gif)" ";
}

/* - Intro-Special Main-Content - */
#main_intro{
 width: 76%;
 float: right;  /* Inhalt rechts neben der Navigation vorbeifließend */
 margin: 0;
 padding: 5em 0 2em 0;
 text-align: center;
 vertical-align: middle;
 border-left: solid 2px #066; 
 border-top: solid 2px #066; 
 border-right: solid 1px #12BCBC; 
 border-bottom: solid 1px #12BCBC;
}
#footer {
 clear: both;
 margin-left: 23%;
 text-align:center;
}
#footer a { 
 color: #044;
 text-decoration: none;
} 
#footer a:hover { 
 color: #0FF; 
}