/* CSS Document */
/* Version       : 1.0 */
/* erstellt      : MS */
/* Date          : Januar 2008 */

/* Das Stylesheet wurde so weit wie möglich vom HeBIS-Stylesheet (anhalt:/opt/htdocs/de/css/master.css)
   übernommen. Änderungen von mir wurden kommentiert, einfügungen sind weniger stark eingerückt im Vergleich 
   zum Original.

ms, 12.1.09
*/


/*************** Grundeinstellungen ***********************/

/* Allgemeine Festlegung für Schrift/ Abstände in Body- und P-Tags  */
body, p {
	font-family : Verdana, Arial, Helvetica, sans-serif;
 	color : #333333;    /* schwarz */
	margin : 0;
	padding : 0;
	}     


              
/* Definition der Überschriften allgemein */
h1 {
	font-size : 1.2em;
	color : #666666;        /* dunkelgrau */
        margin: 0;
	padding : 10px 0 3px 0; /* oben, rechts, unten, links */ 
	font-weight : bold;
	}

h2 {
	font-size : 1.1em;
	color : #666666;
	margin : 10px 0 3px 0;
	font-weight : bold;
	}

h3 {
	font-size : 1.1em;
	color : #666666;
	margin : 10px 0 3px 30px;  
	font-weight : bold;
	}
h4 { 
	color : #666666;
	margin : 10px 0 3px 0;  
	font-weight : bold;
        }


a:link { 
	color : #003399;   /* kräftiges blau */
}

a:visited { 
	color : #336699;   /* blaugrau  - master:  #ce0203 rot  */
}

a:hover { 
	color : #3399FF;   /* hellblau  - master: #fe0000   rot */
}

a:active { 
	color : #336699;   /* blaugrau */
}


.emailFett {    /* Für die eingeblendete Email-Adresse */
        font-weight: bold;
        }
  
.klein {        /* wird nur auf den Testmaschinen für den Maschinennamen in der Überschrift benutzt */
      	font-size: 80%;
}

.buchstabe {    /* Der Buchstabe in der Zeitschriftenauswahl */
        font-weight: bold;
        color: #666666;   /* dunkelgrau */
        size: 1.1em;
 }



/********************* Container *******************/

#container {

        position : relative;
        background-color : #ffffff;    /* #eeeeee grau */
       margin : 10px 10px 0 10px;    /*   oben, rechts, unten, links */ 
/*      width : 100%;  */
        height : auto;
        border : 1px solid #555555;
        border-left : 4px solid #555555; /* links am Container stärkerer Rahmen, wegen Navilayout */
        }



/***************** Header *************************/

#header {
	position : relative;
	background-color : #ffffff;  
	background-image : url(http://www.hebis.de/de/images/header_picture.jpg); /* Hintergrundbild OHNE Logo */
	background-repeat : no-repeat;
	background-position : top right;   /* Position oben rechts angesiedelt, um eine Verschiebung zu gewährleisten 
                                              und keinen Freiraum zu lassen */
	width : auto;
	height : 90px;
	border-bottom : 1px solid #999999; /* Trennlinie nur unten - andere Seiten Rahmen von Container */
	margin-left : -3px;                /* Einzug nach links, um den dicken Rahmen zu überlagern */
	}

.header_inhalt {  
	height: 90px; 
	} 

.header_inhalt a {      /* Die Klasse kann an ein html-Tag vergeben werden, in dem dann das Logo angezeigt wird */
	background-image : url(http://www.hebis.de/de/images/header_logo.jpg); /* header_logo.jpg */
	background-repeat : no-repeat;
	background-position : top left;
	height: 90px; 
        display: block;
        width: 150px; 
	} 


.header_inhalt p {    /* Klasse für die Schrift in Bezug auf das Logo */
	font-size : 80%; 
	font-weight : bold;

	color : #333333;
	position : absolute;
	left : 110px; 
	top : 60px; 
	} /* Die Positionsangaben left/ top geben den genauen Standort innerhalb des p-tags an, an dem die Schrift sitzen soll
             (direkt unter dem S). Das Logo-Bild in "header_inhalt" gibt der Schriftposition Spielraum */




/********************** Laufschrift ********************/

#laufschrift {
	position : relative;
	background-color : #ffffff;   /* Wichtig um den grauen Hintergrund des Containers zu verdecken */
     /* left: 0;
        top: 91px; */    /* Genau 91 Pixel Abstand zum Rand des Containers - 90px Header, 1px Rahmen */
        width: 100%;     /* Hintergrund weiß soll den den ganzen Bereich von links nach rechts ausfüllen */
      height : 80px;     /* damit das VifaBio-Logo passt, vorher: auto */  
        margin-left: -3px;
   text-align: center;
     /*	font-size: 65%;
	font-weight: bold;
	line-height: 1.2em;
	color: #03c;   */
	}


/*************** Flagge **************/
/* entspricht navi_horizontal, die sich hier aber auf den Sprachschalter beschränkt und deshalb viel einfacher gehalten ist */
#flag { 
   position: absolute;
   top: 100px;  /* master: 91 Pixel Abstand zum Oberen Rand des Containers - 90px für den Header, 1px für den Rahmen */
   right: 0;                            /* Position null Pixel von rechts entfernt und damit rechtsbündig */
	background-color : #ffffff;     /* Wichtig um den grauen hintergrund des Containers zu überdecken */
	margin : 20px; /*15px 20px 0px 15px; */   /*   oben, rechts, unten, links */ 
}

/*************** Logo des Katalogs **************/
/* entspricht navi_horizontal, die sich hier aber auf den Sprachschalter beschränkt und deshalb viel einfacher gehalten ist */
#logo { 
   position: absolute;
   top: 91px;  /* master: 91 Pixel Abstand zum Oberen Rand des Containers - 90px für den Header, 1px für den Rahmen */
   left: 0;                            /* Position null Pixel von rechts entfernt und damit rechtsbündig */
	background-color : #ffffff;     /* Wichtig um den grauen hintergrund des Containers zu überdecken */
	margin : 0 0 0 -3px; /*15px 20px 0px 15px; */   /*   oben, rechts, unten, links */ 
}


#logo2 { 
   position: absolute;
   top: 0;  /* master: 91 Pixel Abstand zum Oberen Rand des Containers - 90px für den Header, 1px für den Rahmen */
   right: 0;                            /* Position null Pixel von rechts entfernt und damit rechtsbündig */
	background-color : #ffffff;     /* Wichtig um den grauen hintergrund des Containers zu überdecken */
	margin : 0 0 0 -3px; /*15px 20px 0px 15px; */   /*   oben, rechts, unten, links */ 
}



/********************** Seite ****************************/
/* Definitionen für "außerhalb" --> keine Navigation, keine Emailadresse im Titel */

#seite {
	width : auto; 
	margin : 0 0px 0px 20px;    /* 0 0 -2px 0;     oben, rechts, unten, links  / rechts von 30 auf 0 verringert */
 	background-color : #ffffff;   
	padding : 20px 20px 10px 20px; 
	vertical-align : top;
	margin-left : -3px;
/*      Höhe ist nötig, wenn die Startseite viel Text enthält, sonst wären 10em ausreichend, bzw. besser */
        height: auto;    /* keine Angabe für height ist die beste Lösung */
	}

#seite p {
	margin-bottom : 5px;
	}

#seite ul { 
	padding-left : 12px;   
        }



#xlink14 a:link { 
        color: #0000CC;   /* kräftig blau */
}

#xlink14 a:visited { 
       color: #336699;   /* graublau */ 
}

#xlink14 a:hover { 
       color: #3399FF;   /*  helleres blau */ 
}

#xlink14 a:active  { 
       color: #336699;   /* graublau */ 
       line-height: 1.5;
}


.zentriert { 
        text-align: center;
        }

.klein_zentriert { 
        text-align: center;
	font-size: 80%;
        }

/* Klasse wird nur in den testxx.html-Dateien benötigt. */
.fett { 
        color: #666666;   /* grau */
        font-weight: bold;
       }



/****************** Navigation vertikal ****************/

#navi_vertikal {
     /*   float: left;  */    /* links umfließend */
        /* Die Breite muß eine feste Pixelgröße haben, sonst flackert die Navigation beim Drüberfahren mit der Maus */
	width : 200px; 
	color : #333333;  /* schwarz */
	background-color :  #eeeeee;  /* Hintergrundgrau */
        vertical-align : top;         /* damit im IE die Navigation nicht in die Tabellenmitte rutscht */
	margin-top : -3px;  /* master: 24 px */ /* Abstand zur Überbrückung des Bereiches für Laufschrift/ Horizontale Navigation */
                           /* Wenn ich die 24px übernehme, dann taucht ein dicker grauer Rand links oberhalb der Navi auf */ 
	margin-left : -1px; 
     /*	height : 100%;    */ /* master: 100% */ 
     /* Bei auto wird nur um das Navi-Menü grauer Hintergrund gelegt
        bei 100% ist die komplette Spalte grau, aber bei Mozilla 1.6 ist das Navi-Menu nicht mehr grau, sondern weiß */

	background-image : url(http://www.hebis.de/de/images/graupixel.jpg);  /* Hintergrundbild eingefügt, um sicherzugehen, 
                                dass in allen Browsern der Hintergrund grau ist */
	background-repeat : repeat;
	}




#navi_vertikal ul {        /* Listendefinierung für die Linkliste der Navigation */
	list-style-type : none;
	font-family : Verdana, Arial, Helvetica, sans-serif;
	font-size : 75%;
	padding-left : 10px;   
	}

       * html #navi_vertikal ul {
                margin-left : -7px;
                margin-right: 3px;
                } /* Hack IE <= 6 */
        
        *+html #navi_vertikal ul {
                margin-left : -7px;       
                margin-right: 3px;
                } /* Hack ID 7 - dann sitzen die Listeneinträge am linken Rand und nicht mittig */


#navi_vertikal ul:focus {
	border-left : 4px solid #ce0203;   
	width : 100%;
	} /* Definierung für das fokkusierte Listenelement */

/* Erste Navigationsebene + untere wegen Vererbung */
#navi_vertikal ul li a:link, #navi_vertikal ul li a:visited {
	color : #333333;     /* schwarz */
	text-decoration : none;
	font-weight : bold; 
	display: block;
	}      /* Layout der Navigationslinks benutzter und unbenutzter Link in den Listen - schriftbezogen */

#navi_vertikal ul li a:hover, #navi_vertikal ul li a:active {
	color : #fe0000;     /* rot */
	display: block; 
	}     /* Layout der Navigationslinks für das Highlight beim mouseover und aktiver Links (letzteres will nicht...) - schriftbezogen */

#navi_vertikal ul li {
	padding : 4px 20px;   /* oben/unten, re/li */    
	border-top : 1px solid #dddddd; /* Graue Trennlinie der ersten Navigationsebene */
	margin-left : -14px;  /* Verschiebung des Listenblicks nach Links, um die Trennlinie passend zu plazieren und etwas in den
                                 dicken Rahmen des Containers zu schieben */
	margin-right : 0px;   
}


#navi_vertikal ul li:hover {   /* Highlight der Listen-Elemente, nicht schriftbezogen */
	color : #fe0000;                  /* rot */
	background-color : #ffffff;       /* Weißer Hintergrund bei mouseover der Listenelemente */
	border-left : 4px solid #ce0203;  /* roter Seitenrand während des Highlight */
	border-right : 4px solid #ce0203; /* dito */
	margin-right : -2px;   /* Verschiebung des rechten Randes nach Links, zum Anpassen an Hintergrund */
	}

        * html #navi_vertikal ul li {
                margin-left : -5px;
                padding : 4px 0 4px 20px;
                } /* Nach IE <= 6 */

        *+html #navi_vertikal ul li {
                margin-left : -5px;
                padding : 4px 0 4px 20px;
                } /* Hack IE 7 */


#navi_vertikal ul li:hover ul li {
	border : none;
	background-color : transparent;
	}    /* Abstellen der übergeordneten Highlightfunktion, weil durch Verschiebung nicht anwendbar */   /* ??? */







/*********************** Content ***********************/

#content {
        width : 100%;   

	background-color : #ffffff;   /* weiße Hintergrundfarbe, um den grauen Hintergrund des Containers zu überdecken */
	padding : 0 10px 0 10px;      /* oben, rechts, unten, links */  /* oben auf 0 für  Meldungen inside */
                               /* master: 38px 20px 10px 20px; */ /* Reguläge Innanabstände */
	vertical-align : top;  /* Inhalt soll oben stehen, da in Tabelle meist mittig angeordnet wird */
	margin : 0 0 -2px 0; 
	}


#content p td {
	margin-bottom : 5px; /* Definition für den Abstand nach unten zwischen den p- und td-Tags */
	}


#content_zss { 
     margin: 20px 0 10px 10px;    /* oben, rechts, unten, links */
     overflow:scroll;        /* Scrollbar eingefügt, um nicht die ganze ZSS-Liste auf einmal anzuzeigen */
     width: 100%;
     height: 350px;
 }

#content_zss li { 
     margin: 0 10px 0 0;   /* einen rechten Rand setzen, damit der Scrollbalken in der ZSS-Liste nicht so dicht am Text sitzt */
 }



/************************ Footer ***********************/

#footer {
	position : relative;
	background-color : #ffffff;	 
	font-size : 68%;
	text-align : center;
	padding : 5px 0;
	margin : 0 10px;
	width : 97%; 
	height : auto;
        margin-right: auto;  /* "auto" sorgt für eine Zentrierung des Containers auf der Seite */
        margin-left: auto;
	}

#footer_aktualisierung {
	font-size : 80%;
	text-align : right;
	padding : 5px 10px;  /* master: 5px 20px */
	} 






