@charset "utf-8";

body {
    background: #fff url('menue_thumbs/rand.gif') 0 35px repeat-x;
    margin: 10px 0;
	/* Hack für die Zentrierung der Seite im IE 5 */
	text-align: center;
}

/* Das allumfassende div mit der class: wrapper dient zur mittigen *
 * Positionierung des Inhalts.                                     */
#wrapper {
    margin: 0 auto;
    width: 740px;
	text-align: left;
}

/* Navigation Anfang */

/* Da der Skiplink nur zur Barrierefreiheit dient (z.B. für blinde Menschen *
 * die Screenreader nutzen) wird dieser für den "optischen" Betrachter      *
 * ausgeblendet. Das selbe gilt für die Menülinks von denen nur die Grafik  *
 * sichtbar sein soll.                                                      */
#nav .skiplink, #nav ul a span {
    position: absolute;
    left: -3000px;
    top: -2000px;
}

#nav ul li ul li a span{
	position: static;
}

/* Wenn man die Skiplinks per Tastatur angewählt, werden sie in den *
 * Sichtbaren Bereich verschoben.                                   */
#nav a.skiplink:focus, #nav a.skiplink:active{
	left: 0;
    top:  0;
	width: 160px;
	color: #000000;
	background-color: #FFFFFF;
	height: auto;
	padding: 2px;
	border: 1px solid black;
}

#nav h1 {
    position: absolute;
    left: 168px;
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: small;
    color: #666666;
    background-color: #FFFFFF;
    font-weight: normal;
}

#nav {
    position: relative;
    height: 9em;
}

#nav ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 740px;
}

#nav li{
    float: left;
}

/* padding-bottom ist der Abstand nach unten eines aufgeklappten Menüreiters.*
 * Außerdem wird das div für die innere Liste positioniert und mit einem     *
 * Hintergrund versehen (fluide Box).                                        */
#nav div {
    position: absolute;
    top: 59px;
    left: 0px;
    padding-bottom: 5px;
    background: url('menue_thumbs/sub-nav/bg_hinten.png') bottom no-repeat;
}

/* padding-top ist der Abstand nach oben eines aufgeklappten Menüreiters.  */
#nav div ul {
    padding-top: 4px;
    background: url('menue_thumbs/sub-nav/bg_oben.png') no-repeat;
    height: auto;
}

/* Hier wird der Abstand der Menüeinträge/Links.                           */

#nav li li {
    padding: 0 4px;
}

/* Design der Menüeinträge/Links */
#nav li li a {
	font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
	color: #000000;
	text-decoration: none;
}

#nav li li a:hover{
	text-decoration: underline;
}


/* Hier beginnen die Angaben für die Menügrafiken, welche immer angzeigt *
 * werden. Z.B. das Schulloge und Schule - Schulleben.                   */

#nav .nav-logo {
    margin-right: 2px;
    height: 59px;
    width: 164px;
    background: url('menue_thumbs/schaltflaechen/logo.gif') no-repeat;
    display: block;
}

/* Die Hyperlinks Schule - Schulleben sind immer gleich hoch.  */
#nav .menue-1, .menue-2, .menue-3, .menue-4, .menue-5 {
    margin-top: 25px;
    height: 34px;
    display: block;
}

#nav .menue-1 {
    background-image: url("menue_thumbs/schaltflaechen/schule.gif");
    width: 96px;
}

#nav .menue-1:focus, #nav .menue-1:hover, #nav .menue-1:active {
    background-position: -96px 0;
}

#nav .aufklappen .menue-1 {
    background-position: -192px 0 !important;
}

#nav .menue-2 {
    background-image: url("menue_thumbs/schaltflaechen/info.gif");
    width: 86px;
}

#nav .menue-2:focus, #nav .menue-2:hover, #nav .menue-2:active {
    background-position: -86px 0;
}

#nav .aufklappen .menue-2 {
    background-position: -172px 0 !important;
}

#nav .menue-3 {
    background-image: url("menue_thumbs/schaltflaechen/faecher.gif");
    width: 108px;
}

#nav .menue-3:focus, #nav .menue-3:hover, #nav .menue-3:active {
    background-position: -108px 0;
}

#nav .aufklappen .menue-3 {
    background-position: -216px 0 !important;
}

#nav .menue-4 {
    background-image: url("menue_thumbs/schaltflaechen/aktivitaeten.gif");
    width: 138px;
}

#nav .menue-4:focus, #nav .menue-4:hover, #nav .menue-4:active {
    background-position: -138px 0;
}

#nav .aufklappen .menue-4  {
    background-position: -276px 0 !important;
}

#nav .menue-5 {
    background-image: url("menue_thumbs/schaltflaechen/schulleben.gif");
    width: 142px;
}

#nav .menue-5:focus, #nav .menue-5:hover, #nav .menue-5:active {
    background-position: -142px 0;
}

#nav .aufklappen .menue-5 {
    background-position: -284px 0 !important;
}

/* Im folgenden werden die Hintergrundfarben der Aufgeklappten Menüs *
 * definiert.                                                        */

#nav .menuefarbe_schule {
    background-color: #3F89F7;
}

#nav .menuefarbe_info {
    background-color: #1CADD8;
}

#nav .menuefarbe_faecher {
    background-color: #1FA5AF;
}

#nav .menuefarbe_aktivitaeten {
    background-color: #30AE6E;
}

#nav .menuefarbe_schulleben{
    background-color: #40B541;
}


/* Hier beginnen Angaben zum kleinen Kästchen rechts oben (Sitemap etc) */
#nav #oben-rechts {
    position: absolute;
    right: 0;
    width: auto;
    font-family: Arial, Helvetica, sans-serif;
    font-size: x-small;
}

#nav #oben-rechts li {
    padding: 0 7px;
    background: url('menue_thumbs/zwischen.gif') no-repeat;
}

#nav #oben-rechts a {
    color: #808080;
    text-decoration: none;
}

#nav #oben-rechts a:focus,#nav #oben-rechts a:hover,#nav #oben-rechts a:active{
    color: #000000;
    text-decoration: underline;
}

#nav #oben-rechts .firstchild {
    background: white;
}
/* /Navigation Ende */

/* Inhalt Anfang */
#content {
    margin: 0 auto;
	padding-bottom: 50px;
    width: 740px;
}

#content #autor {
    clear: both;
    font-size: small;
}

/* Inhalt Ende */

/* Allgemeine Angaben Anfang */

/* Schrift*/

body {
	font-family: Arial, sans-serif;
	font-size: 80%;
}

#content p{
	line-height: 1.3em;
}

#content li{
	list-style-type: circle;
}

#content a, #content a span{
	background: url('content/a.png') bottom repeat-x;
	color: #1648AA;
	text-decoration: none;
}

a, a span {
	height: 1px;
	vertical-align: bottom;
}

li a, li a span, li span {
	vertical-align: baseline;
}

#content a:focus, #content a:hover, #content a:active,
#content a:focus span, #content a:hover span, #content a:active span{
	background: url('content/a_hover.png') bottom repeat-x;
}

#content abbr, #content acronym {
    border-bottom: 1px #666666 dashed;
}

/* Icons für Links mit bestimmten URL's (siehe dateiendungen_und_class.txt) */

#content a.icon_pdf{
	padding-left: 20px;
	background: url(icons/pdf.gif) left center no-repeat !important;
}

#content a.icon_ppt {
	padding-left: 20px;
	background: url(icons/ppt.gif) left center no-repeat !important;
}

#content a.icon_email {
	padding-left: 20px;
	background: url(icons/email.png) left center no-repeat !important;
}

#content a.icon_externer_link {
	padding-left: 15px;
	background: url(icons/extern_blau.gif) left center no-repeat;

}

#content a.icon_externer_link:focus,#content a.icon_externer_link:hover,
#content a.icon_externer_link:active {
	background: url(icons/extern_blau_hover.gif) left center no-repeat;

}

#nav a.icon_externer_link {
	padding-left: 15px;
	background: url(icons/extern_sw.gif) left center no-repeat;
}

#nav a.icon_externer_link:focus,#nav a.icon_externer_link:hover,
#nav a.icon_externer_link:active{
	background: url(icons/extern_sw_hover.gif) left center no-repeat;
}

#content a.icon_facebook,#content a.icon_lokalisten,
#content a.icon_youtube,#content a.icon_flickr,#content a.icon_twitter{
	padding-left: 20px;
}

#content a.icon_facebook{
	background: url(icons/facebook.png) left center no-repeat;
}

#content a.icon_lokalisten{
	background: url(icons/lokalisten.png) left center no-repeat;
}

#content a.icon_youtube{
	background: url(icons/youtube.png) left center no-repeat;
}

#content a.icon_flickr{
	background: url(icons/flickr.png) left center no-repeat;
}

#content a.icon_twitter{
	background: url(icons/twitter.png) left center no-repeat;
}

/* /Icons für Links */

/* Allgemeine Angaben Ende */