/* *****************************************************/
/* k_screen.css - Styles für die Bildschirmdarstellung */
/* "#" -> "id"-Selektor; "." -> "class"-Selektor       */
/* *****************************************************/

/* --- CSS-Variablen für Hintergrundfarben --- */
:root {
 --col_body:        #FFFFFF;
 --col_absatz:      #FFFFFF;
 --col_navi_top:    #C7E7C7;
 --col_navi_middle: #D7F0D7;
 --col_navi_low:    #E7F8E7;
 --col_kopf_zeile:  #C7E7C7;
 --col_pfad_zeile:  #C7E7C7;
 --col_pfad_input:  #E7F8E7;
 --col_news_top:    #C7E7C7;
 --col_news_item:   #C7E7C7;
 --col_program_top: #E7F8E7;
 --col_button:      #C7E7C7;
 --col_hover:       #009900;
}

/* --- Hintergrund für die Startseite - Screen --- */
#bereich_mitte div.bgi{
 background-image:url(../image/h_home.jpg);
 background-repeat:repeat;
}

/* --- Bereich Kopfzeile rechts - Screen --- */
#bereich_kopf_rechts {
 position:absolute;
 top:0px;
 left:96px;
 height:80px;
 width:664px;
 font-size:10px;
 font-weight:bold;
 letter-spacing:2px;
 background-color:var(--col_kopf_zeile);
 background-image:url(../image/design/weltband.jpg);
 margin:3px;
 padding:5px;
 border-width:1px;
 border-style:solid;
 border-color:#333333;
}

/* --- Bereich Kopfzeile rechts - Printer --- */
#bereich_kopf_rechts_p {
 display:none;
}

/* --- Bereich Horizontale Infozeile --- */
#bereich_pfad {
 position:absolute;
 top:95px;
 left:0px;
 height:22px;
 width:764px;
 letter-spacing:1px;
 color:#666666;
 background-color:var(--col_pfad_zeile);
 margin:3px;
 padding:3px;
 border-width:1px;
 border-style:solid;
 border-color:#333333;
 display:flex;
 align-items:center;
 justify-content:flex-end;
}

#bereich_pfad input {
 background-color:var(--col_pfad_input);
 width:155px;
 border-width:1px;
 border-style:solid;
 border-color:#333333;
 margin:0px;
}

#bereich_pfad select {
 background-color:var(--col_pfad_input);
 width:55px;
 border-width:1px;
 border-style:solid;
 border-color:#333333;
 margin:0px;
}

#bereich_pfad input.lupe {
 background-image:url(../image/design/lupe_16.gif);
 background-color:transparent;
 background-repeat:no-repeat;
 background-position:center;
 width:22px;
 border-width:0px;
}

/* --- Bereich Sprache --- */
#bereich_sprache {
 position:absolute;
 top:95px;
 left:3px;
 height:27px;
 width:180px;
 background-color:transparent;
 margin:3px;
 padding-top:3px;
 padding-left:3px;
 display: flex;
 align-items: center;
 justify-content: flex-start;
}

#bereich_sprache img{
 width: 24px;
 height: 15px;
 margin-right:5px;
}

/* --- Bereich Navigationsspalte --- */
#bereich_links {
 position:absolute;
 top:128px;
 left:0px;
 width:135px;
 min-height:400px;
}

/* --- Liste - Navigationsspalte --- */
#bereich_links ul {
 margin:0px;
 padding:0px;
}

/* --- Listenelement - Navigationsspalte - Hauptpunkt --- */
#bereich_links li.navigation_haupt {
 list-style-type:none;
 display:block;
 font-size:13px;
 background-color:var(--col_navi_top);
 padding-top:2px;
 padding-right:3px;
 padding-bottom:2px;
 padding-left:3px;
 margin-top:3px;
 margin-right:3px;
 margin-bottom:5px;
 margin-left:3px;
 border-width:1px;
 border-style:solid;
 border-color:#333333;
}

/* --- Listenelement - Navigationsspalte - Unterpunkt 1 --- */
#bereich_links li.navigation_neben {
 list-style-type:none;
 display:block; 
 font-size:12px;
 letter-spacing:1px;
 background-color:var(--col_navi_middle);
 padding-top:2px;
 padding-right:3px;
 padding-bottom:2px;
 padding-left:3px;
 margin-top:3px;
 margin-right:3px;
 margin-bottom:5px;
 margin-left:9px;
 border-width:1px;
 border-style:solid;
 border-color:#333333;
}

/* --- Listenelement - Navigationsspalte - Unterpunkt 2 --- */
#bereich_links li.navigation_unter {
 list-style-type:none;
 display:block; 
 font-size:12px;
 letter-spacing:1px;
 background-color:var(--col_navi_low);
 padding-top:2px;
 padding-right:3px;
 padding-bottom:2px;
 padding-left:3px;
 margin-top:3px;
 margin-right:3px;
 margin-bottom:5px;
 margin-left:15px;
 border-width:1px;
 border-style:solid;
 border-color:#333333;
}

/* --- Listenelement über den Textbereich hinaus klickbar machen --- */
#bereich_links a {
  display: block;
  width: 100%;
}

/* --- Bereich Mitte --- */
#bereich_mitte {
 position:absolute;
 top:128px;
 left:133px;
 width:639px;
 min-height:400px;
 color:#333333;
 margin:3px;
 padding:0px;
 text-align:left;
 vertical-align:middle;
}

/* --- News-Spalte - Screen --- */
#bereich_rechts {
 position:absolute;
 top:0px;
 left:776px;
 width:212px;
 min-height:400px;
 color:#333333;
 margin:3px;
 padding-right:5px;
 text-align:left;
 vertical-align:middle;
 font-size:11px;
 text-align:right;
}

/* --- News-Spalte Top --- */
#bereich_rechts div.aktuell_top {
 position:static;
 margin-bottom:3px;
 padding:5px;
 padding-top:4px;
 background-color:var(--col_news_top);
 border-width:1px;
 border-style:solid;
 border-color:#333333;
 height:114px;
 font-weight:bold;
}

/* --- News-Spalte Eintrag --- */
#bereich_rechts div.aktuell {
 position:static;
 margin-bottom:3px;
 padding:5px;
 background-color:var(--col_news_item);
 border-width:1px;
 border-style:solid;
 border-color:#333333;
}

/* --- Bereich noprint --- */
#bereich_noprint {
}

/* --- Mauszeiger über Element --- */
a:hover {
 color:var(--col_hover);
 text-decoration:none;
 border-style:none;
}

/* --- Farbgestaltung der Links - Navigation --- */
#bereich_links li a:link {
 color:#000000;
 text-decoration:none;
}

#bereich_links li a:hover {
 color:var(--col_hover);
 text-decoration: none;
}

/* --- Farbgestaltung der Links - Horizontale Infozeile --- */
#bereich_pfad a:link {
 color:#333333;
 text-decoration:none;
}

#bereich_pfad a:hover {
 color:var(--col_hover);
 text-decoration:none;
}

/* --- Farbgestaltung der verlinkten Icons --- */
input.ikon_16:hover, input.ikon_25:hover, input.ikon_32:hover{
 color:var(--col_hover);
}