﻿/*
Basisstylesheet
Allgemeine Styles zum Formatieren der Elemente
Aufhebung von Rahmen etc.
*/
@import url("form.css");

body {
    padding: 0; margin: 0;
    font: 100% Verdana, Arial, Helvetica, sans-serif;
    background: #e5ebf0; color: #333;
    text-align: center; /* Zentriert fuer die aelteren Browser den nachfolgenden Block */
}

/* Allgemeingueltige Klassen und Elemente */
img {
    border: none;
}

code {
    font: 14px consolas, 'courier new', monospace;
    color: #900;
}

pre {
    overflow: auto; padding: 1em;
    font-size: 1em;
}

h1, h2, h3, h4 {
    font-family: georgia, serif; font-weight: normal;
}

a {
    color: #700;
}
a:hover {
    text-decoration: none;
}

/* Bildausrichtungen hinterlegen, dass Bilder im Text fließen*/

.bild-links { /* Diese Klasse vergeben Sie einem Bild welches links ausgerichtet werden soll */
    float: left;
    margin: .1em 1em .4em 0;
}

.bild-rechts { /* Diese Klasse vergeben Sie einem Bild welches rechts ausgerichtet werden soll */
    float: right;
    margin: .1em 0 .4em 1em;
}

.bild-abstand img {
    margin: 0 .5em .5em 0; /* Bilder innerhalb dieses Elements bekommen zusaetzlichen Abstand */
}

.clearer {
    clear: both; /* hebt die vorhergehenden Floats auf */
}


/*
* Hauptbereich #container
 */

#container {
    text-align: left; /* Hebt die zentrierung auf */
    margin: 0 auto; /* Zentriert diesen Block auf horizontaler Ebene (fÃ¼r modernere Browser) */
    width: 960px;
}


/*
* Hauptbereich: #container
** Unterbereich: #kopfbereich (Logo/Schriftzug und horizontale Navigation)
 */
#kopfbereich {
    position: relative; /* Durch relative Positionierung koennen wir untergeordnete Elemente in Bezug auf #kopfbereich absolut positionieren */
    height: 268px; width: 960px;
    background: url("../bilder/header.jpg") no-repeat;
}

/*
* Hauptbereich: #container
** Unterbereich: #kopfbereich
*** Abschnitt: #logo
 */
#kopfbereich #logo {
    position: absolute; 
    top: 0; 
    left: 25px;
    margin: 0;
    padding: 10px; 
    line-height: 1; /* Die richtigen Abstaende fÃ¼r die Ueberschrift als Logo-Box */
    text-align: left;
    font: normal 1.5em Arial, sans-serif;
    color:black;
    text-transform: uppercase;
    background-color: #a1a1e5;
}

#kopfbereich #logo span {
    font-weight: bold; 
    display: block;
}

#kopfbereich a {
    text-decoration: none;
}
#kopfbereich ul a {
    float: left; display: block; padding: 1px 10px;
    font: .9375em verdana, sans-serif;
    text-transform: uppercase;
    color:white;
    border-bottom:4px #5c5c99 solid;
    border-top:4px #5c5c99 solid;
}


/*
* Hauptbereich: #container
** Unterbereich: #kopfbereich
*** Abschnitt: #hauptnavi1 (Rechts) und #hauptnavi2 (Links)
 */

#hauptnavi1 {
    position: absolute; top: 0; right: 25px;
    margin: 0; padding: 0;
    background: #5c5c99;
    list-style: none;
    font: .7em verdana, sans-serif;
}

#hauptnavi2 {
    position: absolute; bottom: 0; left: 25px;
    margin: 0; padding: 0;
    background: #fff;
    list-style: none;
}
#hauptnavi2 a {
    background: #5c5c99; color: #fff;
}
#hauptnavi2 a:hover, #hauptnavi2 .aktiv a {
    /*background: #fff url(images/rahmen.gif) repeat-x; color: #300;*/
    background:#fff;
    border-top:4px #a1a1e5 solid;
    border-bottom:4px #fff solid;
    color:#5c5c99;

}
#hauptnavi1 a:hover, #hauptnavi1 .aktiv a {
    /*background: #fff url(images/rahmen.gif) repeat-x bottom; color: #300;*/
    background:#fff;
    border-bottom:4px #a1a1e5 solid;
    border-top:4px #fff solid;
    color:#5c5c99;
}

#kopfbereich ul li {
    display: inline; /* Damit sich die einzelnen Listenelemente horizontal anordnen */
}


/*
* Hauptbereich: #container
** Unterbereich: #mitte (Inhalt + Sidebar)
 */

#mitte {
    padding: 0 25px 25px 40px;
    font-size: 75%;
    background: #fff;
    line-height: 1.45;
}
#mitte p, mitte ul, #mitte ol {
    margin: 5px 0 15px 0;
}

#mitte li {
    margin-bottom: 2px;
}


/*
* Hauptbereich: #container
** Unterbereich: #kopfbereich
*** Abschnitt: #inhalt
 */

#inhalt {
    float: left;
    width: 46em; min-width: 552px; max-width: 590px;
}

#inhalt h1 {
    font-size: 1.833em;
    border-bottom:1px #5c5c99 solid;
    border-left:1px #5c5c99 solid;
    padding-left:5px;
    color:#5c5c99;
}

#inhalt h2 {
    font-size: 1.2em;
    font-weight:bold;
}
#inhalt h3 {
    margin-bottom: 0; font-size: 1.1em;
    border-bottom: 1px dotted #5c5c99;
    font-weight:bold;
}
#inhalt h4 {
    margin-bottom: 0;
    margin-top: 0;
    font-size: 1.05em;
    font-weight:bold;
}
#inhalt h5 {
    margin-bottom: 0; font-size: 1em;
}
#inhalt .fotostrecke {
	border-top:5px #a1a1e5 solid;
	border-bottom:5px #a1a1e5 solid;
}

/*
* Hauptbereich: #container
** Unterbereich: #mitte
*** Abschnitt: #sidebar
 */

#sidebar {
    float: right;
    width: 280px;
    position: relative; top: -38px;
}

#sidebar img {
    position: relative; 
}

/* Die einzelnen Boxen in der Sidebar */
.sidebar-box {
    padding: 15px; margin-bottom: 25px;
    background: #a1a1e5; color: #222;
}
.sidebar-box h2 {
    margin: 0;
}
.sidebar-box ul, .sidebar-box ol {
    list-style: none; margin-left: 0; padding-left: 0; /* Entfernt die Listenpunkte und den linken Abstand */
}

.erste-box {
    background: #5c5c99; color: #fff;
}
.erste-box a {
    color: #fff; text-decoration: underline;
}
.erste-box a:hover {
    text-decoration: underline;
}


/*
* Hauptbereich: #container
** Unterbereich: #footer
 */

#footer {
    background: #5c5c99; color: #fff; padding: 5px 25px 5px 40px;
    font-size: 60%;
}

#footer p {
    margin: 0 0 2px 0;
}

#footer a {
    color: #fff; text-decoration: underline;
}
#footer a:hover {
    text-decoration: none;
}

/*lightwindow*/
#content{
	background:white;
	width:480px;
	margin:0 auto;
	font-size:75%;
	padding:5px;
	text-align:left;
	line-height:1.45;
}

#oben {
    left: 25px;
    margin: -5px;
    
    padding: 10px; 
     /*line-height: 1; Die richtigen Abstaende fÃ¼r die Ueberschrift als Logo-Box */
    text-align: left;
    font: normal 1.5em Arial, sans-serif;
    color:black;
    text-transform: uppercase;
    background-color: #5c5c99;
}

#oben span {
    font-weight: bold; 
    display: block;
}
#content h2 {
    font-size: 1.833em;
    border-bottom:1px #5c5c99 solid;
    border-left:1px #5c5c99 solid;
    padding-left:5px;
    color:#5c5c99;
    text-align:left;
    font-weight:normal;
    
}
#content .fotostrecke {
	border-top:5px #a1a1e5 solid;
	border-bottom:5px #a1a1e5 solid;
}
#content h4 {
    margin-bottom: 0;
    margin-top: 0;
    font-size: 1.05em;
    font-weight:bold;
}

#inhalt p.untertitel{
	margin-top:0px;
	font-weight:bold;
	font-size:75%;
}

#inhalt th, #inhalt td{
	font-size:75%;
}
