/*
Color scheme:

Basis: #6666FF

Schrift: schwarz #000000
Seitenhintergrund: weiß #FFFFFF

"Gebrochenes Weiß": EEEEFF
Hellblau: CBCBFF
Lichtblau: 9999FF
Mittelblau 6666FF
Tiefblau 000098

"Gebrochenes Grau": B2B2CB

Grau: #B2B2B2
Schriftgrau: 666666

Hervorhebung rot: CB0000
*/

div#content 
{
  color: #000000;
  font-size: 1em;
  font-family: Helvetica,Arial,sans-serif;
}

/**********************************************************************
*           Überschriften und Paragraphen                             *
***********************************************************************/
div#content h1 
{
  font-size: 1.5em;
  margin: 1em 0 0.5em;
}

div#content h2 
{
  font-size: 1.2em;
  margin: 0.5em 0 0.5em;
}

div#content h3 
{
  font-size: 1.0em;
  font-weight: bold;
  margin: 0em 0 0.5em;
}

div#content h4 /* Für den Slogan über einer Überschrift */
{
  color: #666666;
  font-size: 1.0em;
  font-weight: normal;
  font-style: italic;
  margin: 0.5em 0 0em;
}

div#content p 
{
  font-size:1em;
  margin: 1em 0;
  text-align: justify;
}

div#content img.bildrechts
{
  padding:1px;
  border: 1px solid #B2B2B2;
  float: right;
  margin-left: 5px;
  margin-bottom: 5px;
}

div#content hr
{
  color: #666666;
}


/**********************************************************************
*           Liste von Unterkatalogen                                   *
***********************************************************************/

div#content div.subcat
{
  margin-right: 20px;
  margin-bottom: 20px;
  text-align: center;
  font-size: 0.9em;
  float: right;
  display: block;
}

div#content div.subcat a:hover
{
  text-decoration: none;
}

div#content div.subcat a:active
{
  text-decoration: none;
}

/**********************************************************************
*           Bilder auf der Frontpage                                  *
***********************************************************************/

div#content div.frontpagebild
{
  outline: 0px black dashed;
  text-align:center;
  margin:10px 0;
  display:block;
}

div#content div.frontpagebild img
{
  padding:1px;
  border: 1px solid #B2B2B2;
  float: left;
}


div#content div.frontpagebild a:hover
{
  text-decoration: none;
}

div#content div.frontpagebild a:active
{
  text-decoration: none;
}

div#content .bildinfo_rechts 
{
  font-size:0.9em;
  text-align: left;
  vertical-align: bottom;
  padding-left: 10px;
}

div#content .catalog_titeltext
{
  font-size:1em;
  text-align: justify;
  vertical-align: bottom;
}

/**********************************************************************
*           Bilder auf den Unterseiten                                *
***********************************************************************/

div#content .furtherpagebild
{
  outline: 0px black dashed;
  padding:4px;
  margin: 30px; /* 30px entspricht 3 Bildern pro Zeile, 3px entspricht 4 pro Zeile */
  border: 1px #CBCBFF solid;
  width:154px;
  height: 200px;
  display:block;
  float:left;
  text-align:center;
}

div#content .furtherpagebild:hover
{
  border: 1px #000000 solid;
}

div#content .furtherpagebild img
{
  padding:1px;
  border: 1px solid #B2B2B2;
}


div#content .furtherpagebild a:hover
{
  text-decoration: none;
}

div#content .furtherpagebild a:active
{
  text-decoration: none;
}

div#content .bildinfo_unten 
{
  font-size:0.9em;
  text-align: center;
  vertical-align: bottom;
}

/**********************************************************************
*           Literaturstücke auf den Unterseiten                        *
***********************************************************************/

div#content .furtherpagetext
{
  outline: 0px black dashed;
  padding:4px;
  margin: 30px; /* 30px entspricht 3 Bildern pro Zeile, 3px entspricht 4 pro Zeile */
  border: 1px #CBCBFF solid;
  width:154px;
  height: 200px;
  display: table; /* Um vertical-align:middle zu ermöglichen */
  float:left;
  text-align:center;
}

div#content .furtherpagetext p /* Etwas komplizierter Workaround, um den Text im DIV vertikal zu zentrieren */
{
  display: table-cell;
  vertical-align:middle;
  text-align:center;
}

div#content .furtherpagetext:hover
{
  border: 1px #000000 solid;
}

div#content .furtherpagetext img
{
  padding:1px;
  border: 1px solid #B2B2B2;
}


div#content .furtherpagetext a:hover
{
  text-decoration: none;
}

div#content .furtherpagetext a:active
{
  text-decoration: none;
}


/**********************************************************************
*           Text (Literatur) in Lyteframe                             *
***********************************************************************/
div#textframe
{
  color: #000000;
  font-size: 10pt;
  font-family: Helvetica,Arial,sans-serif;
}

div#textframe .titel
{
  font-size: 1.0em;
  font-weight: bold;
  margin: 0.5em 0 0.5em;
}

div#textframe .desc
{
  color: #666666;
  font-size: 1.0em;
  font-weight: normal;
  font-style: italic;
}

div#textframe hr
{
  color: #666666;
}

div#textframe img.bild
{
  padding:1px;
  border: 1px solid #B2B2B2;
  float: right;
}

/**********************************************************************
*                         Umrandung für eCard-Texte                   *
***********************************************************************/
div#content div.umrandet
{
  padding:5px;
  margin: 5px;
  border: 1px #CBCBFF solid;
  width:auto;
  height: auto;
  display: block;
  text-align:justify;
}

div#content div.umrandethinterlegt
{
  padding:5px;
  margin: 5px;
  border: 1px #CBCBFF solid;
  background-color: #EEEEFF;
  width:auto;
  height: auto;
  display: block;
  text-align:justify;
}

/**********************************************************************
*                         Links                                       *
***********************************************************************/
div#content a:link
{
  color: #6666FF;
  text-decoration: none;
}

div#content a:visited
{
  color: #6666FF;
  text-decoration: none;
}

div#content a:hover
{
  color: #6666FF;
  text-decoration: underline;
}

div#content a:active
{
  color: #6666FF;
  text-decoration: underline;
}

/**********************************************************************
*                 Eingabefelder, Formularelemente                     *
***********************************************************************/

div#content textarea,
div#content input /* IE interpretiert [type=] nicht --> ein Style für alle inputs */
{
  font-size:1em;
  font-family: Helvetica,Arial,sans-serif;
	border:1px black solid;
	color: black; background-color: #EEEEFF;
}

div#content textarea:focus,
div#content input:focus
{
  background-color: #FFFFFF;
}

/* Für standardkonforme Browser jetzt die einzelnen inputs separieren. 
Opera verpasst sonst auch checkbox und radio z.B. einen Rahmen */
div#content input[type=text], 
div#content input[type=file], 
div#content input[type=password], 
div#content textarea
{
  font-size:1em;
  font-family: Helvetica,Arial,sans-serif;
	border:1px black solid;
	color: black; background-color: #EEEEFF;
}

div#content input[type=text]:focus, 
div#content input[type=file]:focus, 
div#content input[type=password]:focus, 
div#content textarea:focus
{
  background-color: #FFFFFF;
}

/* Opera versucht, auch diese beiden zu stylen --> 
Background auf weiß setzen, border:none; */
div#content input[type=checkbox], 
div#content input[type=radio]
{
  font-size:1em;
  font-family: Helvetica,Arial,sans-serif;
	border:none;
	color: black; background-color: #FFFFFF;
}

div#content input[type=checkbox]:focus, 
div#content input[type=radio]:focus
{
	border:none;
	color: black; background-color: #FFFFFF;
}

