/* Für die kb Seiten werden hier Formatierungen überschrieben */
/* Spezielle Elemente */
body {  /* Alles ist im Element body*/
position: relative;
max-width: 940px;
margin: 0 auto;
}

#rahmenl{
  position: absolute;
  left:0;
  width: 20px;
  height: 100%;
  background-image: url(../img/schathgl20.jpg);
  }

#rahmenr{
  position: absolute;
  right:0;
  width: 20px;
  height: 100%;
  background-image: url(../img/schathgr20.jpg);
  }

header {
  max-width: 900px;   /* hier wurde width durch max-width:900px  ersetzt*/
  background: #00264E;
  margin: 0 20px;
  border-bottom: 20px solid #848484;
  }

#kopf {
width: 100%;
height: 150px;
background: rgb(21,37,77);
position: relative; 
}
#hktitle {   /* Titel kbase für header der kbase*/
           margin: 5px 0px 20px 5px;
           float: left;
		   z-index: 5;
		 }
		 
#hkimg {   /*Bild image Leser kbase für header der kbase*/
            float: left;
			z-index: 6;
            max width: 10%;
         } 
#hklogo  {                      /*Logo KPP für header der kbase*/
          position: absolute; 
		   margin-left: 70%;  
		   margin-top: 60px;
		   
		   z-index: 5;        
         } 		 		 


main { /* Hauptbereich, kompletter Bereich rechts von der Prodnavileiste */
width:692px;
margin-left: 20px;
padding: 0 20px;
color: #000000;
background-color: #FFFFFF;
display: block;
}

section { /* engere Textspalte im Hauptbereich */
 margin: 0 10px 0 175px;
 line-height: 1.2em; }

.content { /* engere Textspalte im Hauptbereich. class alternativ zu section verwendet, steht noch in vielen kb seiten, bei zeiten von hand ersetzen*/
 margin: 0 10px 0 175px;
 line-height: 1.2em; }

/* Navigation */

/* Anfang Top-Navigation fuer weniger wichtige Basis-Links  */
#navitop {
position: absolute;
left: 30%;
top: 151px;
width: 100%;
list-style-type: none;
z-index: 5;
font-size: 0.8em;
}
#navitop li {
display: inline;
}
#navitop a {
display: block;
float: left;
border-left: 1px solid #999999;
color: #FFFFFF;
padding: 1px 4px 4px 4px;
text-decoration: none;
}
#navitop a:visited {color:silver;}
#navitop a:focus, #navitop a:hover {
  text-decoration: underline;
  background: transparent url() 0 0;
}
#navitop a:active {
  color: #336699;
  font-weight: bold;
}  /* Ende Top-Navigation fuer weniger wichtige Basis-Links  */



/* Anfang Haupt-Navigation links fuer die Produkte */
#navil {
position: absolute;
left: 20px;
top: 150px;
width: 169px;
height: 10px;
color: #000000;
font-weight: bold;
background: #d29b2a url(../img/hg_navip.jpg) repeat-y;
 }

#navil a {
 color:#FFFFFF;
 text-decoration: none;
 }

#navil a:focus, #navil a:hover, navil a:active {text-decoration: underline;}


#pschild{
  color: #FFFFFF;
  font-weight: bolder;
  padding: 5px 0px 5px 8px;
  margin-bottom:0px;
  background-color: #4F4F4F;
  z-index: 7; }

#navili {
 border-top: 1px solid #999999;
 font-size: 0.8em;
 list-style: none;
 }

#navili a {
display:block;
color:#000000;
text-decoration: none;
padding: 5px 0px 7px 8px;
border-bottom: 1px solid #999999;
}
#navili a:visited {color: #333333;}

#navili a:focus, #navili a:hover {
color: #FFFFFF;
background: #d29b2a url(../img/buttons/hgbtnnavipli_d.jpg);
}
#navili a:active {
color: #FFFFFF;
border: 1px solid black;
border-left-color: white; border-top-color: white;
background: #d29b2a url(../img/buttons/hgbtnnavipli_d.jpg);
}
/* Anfang Sub-Navigation innerhalb der Seite */
li.csubn {list-style: none}
#subnav {border-bottom: 1px solid #999999;
         list-style: none;}

#subnav a {
 padding: 3px 5px;
 font-size: 0.8em;
 color:#000000;
 font-weight: normal;
 text-decoration:none;
 border: none;
 background: #d29b2a url(../img/hg_navip.jpg);
 }

#subnav a:focus, #subnav a:hover, #subnav a:active{
 text-decoration:underline;
 color:#000000;
 font-weight: normal;
 border: none;
 background: #d29b2a url(../img/hg_navip.jpg);
 } /* Ende Sub-Navigation innerhalb der Seite */

#phkontap { /* Angaben zum Photo Kontaktperson */
width= 130;
height= 161;
font-weight:normal;
font-size: 0.8em;
padding: 5px;}
        /* Ende Haupt-Navigation links fuer die Produkte */


/* Anfang Navigation fuer Knowledge Base rechts  */
#column {   /* Blaue Spalte mit Leser */
position: absolute;
right: 20px;
top: 150px;
width: 160px;
color: #FFFFFF;
background: #00264E;
padding: 5px 0px 5px 8px;}

#column a {   /* allg. Formatierungen von Links in der blauen Spalte mit Leser */
 color:#FFFFFF;
 text-decoration: none;
}
#column a:focus, #column a:hover, #column a:active {text-decoration: underline;}

#kbschild{
  font-weight: bolder;
  padding: 9px 2px 2px 2px;
  z-index: 7;  }  /* Level der Ebene Vordergrund  */

#navir a {
 padding: 6px 0px;
 display:block;
 }
ul#navirkb {
 font-size: 0.8em;
 list-style: none;
 line-height: 1.5em;
 font-weight: bold;
 margin: 10px 0px;
 }
/* Ende Navigation fuer Knowledge Base rechts  */

/* Folgende Versuche können weg  */

@media screen and (max-width: 900px) 
  {
	#rahmenl {display:none}
	#rahmenr {display:none}
     body {    /* Individualformat für den body. Alles ist im body (div Container gelöscht) */
           position: relative;
           max-width: 900px;
           margin: 0 auto;
         }
	header {
	         max-width: 900px;   /* hier wurde width durch max-width:900px  ersetzt*/
	         margin: 0px;
	         border-bottom: 20px solid #848484;	
           }
	main { /* Format und Position für den Hauptbereich, alles unter header */
           float:left;
           max-width:70%;
		   margin-left: 5px;
           padding: 0px;
   
         }			   
    #navil {display:none}
	#column {        /* Blaue Spalte mit Leser */
              right: 0px;
			  float: right;
            }
	  /* allg. Formatierungen von Links in der blauen Spalte mit Leser */
                   
    section { /* Format und Positionierung für schmalere Textspalte im Hauptbereich main mit Element section zuweisen ex div content*/
              margin: 2px;
			  width:100%;              		  
            }
    .content { /* engere Textspalte im Hauptbereich. class alternativ zu section verwendet, steht noch in vielen kb seiten, bei zeiten von hand ersetzen*/
               margin: 0px;
             }


  @media screen and (max-width: 600px) 
 {
	#hklogo {
	           margin-top: 80px;
    		   margin-left: 2%;
			}
	#hkimg {   /*Bild image Leser kbase für header der kbase*/
            display:none
         } 
  }

  
  
  