@charset "UTF-8";

body {
  color:#000066; 
  background-color:#FFFFFF;
  font-size: 100%;
  /*font-family: Helvetica,Arial,sans-serif;*/
  margin-left: 5em; padding: 1em;
  width: 52em;
  height: auto;
}

a:link { text-decoration:underline; color:#000066}
a:visited { text-decoration:underline; color:#000066}
a:hover { text-decoration:underline; font-weight:bold; }
a:active { text-decoration:underline; font-weight:bold; }
a:focus { text-decoration:underline; font-weight:bold; }

.oben    { vertical-align:top; }
.mittig  { vertical-align:middle; }
.unten   { vertical-align:bottom; }


span.magic { 
  unicode-bidi:bidi-override; 
  direction: rtl;
}
span.emphasize {
  font-variant: small-caps;
}

div#Kopf {
  margin: 0; padding: 0;
}


div#Inhalt {
  padding: 10px 50px;
  margin: 2em 0 0 0.5em;
  border-left: 1px solid #9999C2;
  width: 34em; 
  min-width: 16em; /* Mindestbreite (der Ueberschrift) verhindert Anzeigefehler in modernen Browsern */
  float:left;
}
/*
float all or float none:

> The problem here is that when the clear is used inside of the right 
> column, it does not just clear the right column, it clears the entire 
> page - messing up the two column layout.
> So, when you have a float nested within another float, how do you 
> clear just the inner float?

Your <br> float isn't inside another float.
div#right isn't floated. If it were floated, the nested float would not
clear the left column.

*/


div#Inhalt h1 {
  margin:0;
}
div#Inhalt h2 {
  margin:0;
}
div#Inhalt h3 {
  margin:0;
}
div#Inhalt h4 {
  margin:0;
}
div#Inhalt h4.eng {
  margin-bottom:-10px;
}

div#Inhalt p{
  margin-bottom: 20px;
}
div#Inhalt hr{
  border-bottom: 1px solid #9999C2;
  border: 0;
  height: 1px;
  color: #9999C2;
  background-color: #9999C2;
  margin-bottom:2em;
}

div#Inhalt span.BildContainer {
  float: left;
  margin-right: 1em;
}
div#Inhalt span.BildContainerLuftig {
  float: left;
  margin-right: 1em;
  margin-bottom: 1em;
}
div#Inhalt span.BildContainerRechts {
  float: right;
  margin-left: 1em;
  vertical-align:top;
}

div#Inhalt span.Bildunterschrift {
  font-size: 80%;
}

div#Inhalt br.clear {
  /*display: none;*/
  clear:both;
}

div#Inhalt div#termine {
  border: 1px solid;
  padding: 1em;
}

div#Inhalt ul.luftig {
  margin-left: 10em;
}


div#Menu {
  margin-top: 2em; padding: 0;
  /*border-right: 1px solid #000066;  */
  float: left;
  width: 11em; 
}

div#Menu a:link, div#Menu a:visited { 
  text-decoration:none;
}
div#Menu a:hover, div#Menu a:active,
div#Menu a:focus { 
  /*text-decoration:underline;*/
}

div#Menu span {
  padding-left: 1em;
  padding-right: 1em;
}
div#Menu span.active{
  /*text-decoration:underline; */
  font-weight:bold;
  background-color: #FFFFFF;
}
div#Menu span.inactive{
  text-decoration:none; 
  font-weight:normal;
}

div#Menu li{
  list-style: none;
  margin: 0; padding: 0;
}
div#Menu ul{
  list-style: none;
  margin: 2px 2px 0 0 ; padding: 10px 0 10px 10px ;
  background-color: #9999C2;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
}
div#Menu ul ul {
  padding: 0;
  padding-left: 15px;
  font-size: 90%;
}


div#Trace {
  margin-top: 3px;
  font-size: 0.8em;
  color: #9999C2;
}
div#Trace a:link, div#Trace a:visited, div#Trace a:hover, div#Trace a:active,
div#Trace a:focus { 
  color: #9999C2;
  font-weight:normal;
}


div#Fuss {
  clear: both;
  font-size: 0.8em;
  color: gray;
  /*border-top: 1px solid gray;*/
}