/*********************************************************************/
/***                                                               ***/
/*** xon_styles.css                                                ***/
/*** CSS-Stylesheet für alle Dateien auf www.xon.de                ***/
/***                                                               ***/
/*********************************************************************/


/****** Grunddefinition der Schrift für den gesamten Body: ***********/
body {  font-family: Verdana, sans-serif;
        font-size: 10pt;
        color: black;
        background-color: white;
        margin: 0px;
        padding: 0px;
        top: 0px; 
     }

/******* Links in allen Geschmacksrichtungen: ************************/
a { text-decoration: none; }
/*** Links grau hinterlegen wenn die Maus drübergleitet. ***/
a:link    { color:#1B1FD1; padding:0px; }
a:visited { color:#800080; padding:0px; }
a:hover   { background-color:#dddddd; } 
a:active  { background-color:#dddddd; }
a:focus   { background-color:#dddddd; }
/*** Externe Links werden mit einer kleinen Grafik markiert. ***/
a.external { text-decoration: none; background: url(../images/external.png) center right no-repeat; padding-right:13px; }
a.external:link    { color:#1B1FD1; padding-right:13px; }
a.external:visited { color:#800080; padding-right:13px; }
a.external:hover   { background-color:#dddddd; padding-right:13px; } 
a.external:active  { background-color:#dddddd; padding-right:13px; }
a.external:focus   { background-color:#dddddd; padding-right:13px; }

/*********************************************************************/


/******* Überschriften-Ebenen ****************************************/
h1 { font-size: 18pt; font-weight: normal; margin-top:0; }
h2 { font-size: 14pt; font-weight: normal; margin-top:0; margin-bottom:2px; }
h3 { font-size: 12pt; font-weight: bold; margin-top:0; margin-bottom:2px;}
h4 { font-size: 11pt; font-weight: bold; margin-top:0; font-style:italic; margin-bottom:2px;}

/***** Hilfs-Container für die Seitenaufteilung **********************/
#container0 { background-color:white; 
              margin: 0px;
              padding: 0px;
            }
#container1 { background-color:#eeeeee;
              border:1px solid #cccccc;
              border-top:none;
              border-bottom:none;
            }
#container2 { margin-left:140px;
              background-color:#eeeeee;
            }

/***** Die drei Spalten **********************************************/
#left-col { float:left;
            left:0px;
            width:140px;
            padding: 0px;
            border: none;
          }
#contentarea { min-height: 450px; }
*html #contentarea {height: 450px; }

#middle-col { margin-right:165px;
              margin-left:0px;
              background-image:URL(../images/lvback_blass.png);
              border:1px solid #cccccc;
              border-top:none;
              min-height:500px;
              padding: 10px;
            }
    /*** Hack für MSIE ***/
*html #middle-col {
            height:500px;
            }

#right-col { position:absolute;
             right:49px;
             margin-right:-6px;
             width:115px;
             padding: 10px;
            }
*html #right-col {
            margin-right:-28px;
            right:14px;
            }

/***** Werbeblöcken in rechter Spalte ********************************/
table.RightColTable   { 
    position: relative;
    left: 0px;
    width:150px;     
    margin-bottom: 1ex;
    }
table.RightColTable th    {
	font-weight: bold; 
	text-align: left; 
    background-image: url(../images/rightback_02.png);
    background-repeat: repeat-y;
    background-position:right 0;
	padding-left: 4px;
	padding-right: 3px;
	}
	
table.RightColTable td    { 
	font-size: 9pt; 
	vertical-align: top; 
	background-color: white; 
	padding-left: 4px;
	padding-right: 3px; }

/***** Fußzeile (grau) ***********************************************/
#BaseFooter { clear:both;
              text-align:right;
              background-color:#eeeeee;
              padding:4px;
              padding-right:185px;
              font-size:smaller;
              border:1px solid #cccccc;
              border-top:none;
            }

/***** Menu links ****************************************************/
p.Menu1 {
    margin-top:    6px;
    margin-bottom: 0px;
    margin-left:  10px;
    margin-right:  0px;
    width: 110px;
    cursor:pointer;
}

div.Menu2 {
    position: relative;
    left: 10px;
    width: 110px;
    list-style: none;
    font-size: 8pt;
    margin: 0px;
    margin-left:10px;
    padding: 0px;
    cursor:pointer;
}

div.Menu2 p {
    position: static;
    margin: 0px;
    padding: 2px;
    padding-top: 0px;
    width: 100px;
    background-image: url(../images/menuback_02.png); 
    background-repeat: repeat-y;
    background-position:right;
    cursor:pointer;
}

div.Menu2 a { color: #501010; }
div.Menu2 a:link { color: #501010; }
div.Menu2 a:visited{ color: #501010; }
div.Menu2 a:hover { color: #101010; background-color: #ffffff;}
div.Menu2 a:active { color: #101010; background-color: #ffffff;}
div.Menu2 a:focus { color: #101010; background-color: #ffffff;}

/**** Alle Menu-Links sind erstmal class="MenuLinkInact" *************/
div.Menu2 li { background-repeat:no-repeat; background-position:right 0; width:100px; }
div.Menu2 li:link     { color: #501010;  }
div.Menu2 li:visited  { color: #501010; }
div.Menu2 li:hover    { color: #101010; background-image: url(../images/Xred_10x16.png); background-color: #ffffff;}
div.Menu2 li:active   { color: #101010; background-image: url(../images/Xred_10x16.png); }
div.Menu2 li:focus    { color: #101010; background-image: url(../images/Xred_10x16.png); }

a.MenuLinkInact li { background-repeat:no-repeat; background-position:right 0; }
a.MenuLinkInact:link    li { color: #501010; padding:2px; padding-top: 0px; }
a.MenuLinkInact:visited li { color: #501010; padding:2px; padding-top: 0px; }
a.MenuLinkInact:hover   li { color: #101010; padding:2px; padding-top: 0px; 
                             background-image: url(../images/Xred_10x16.png); background-color: #ffffff;}
a.MenuLinkInact:active  li { color: #101010; padding:2px; padding-top: 0px; 
                             background-image: url(../images/Xred_10x16.png); }
a.MenuLinkInact:focus   li { color: #101010; padding:2px; padding-top: 0px; 
                             background-image: url(../images/Xred_10x16.png); }

a.MenuLinkInact p { background-repeat:no-repeat; background-position:right 0; background-image: url(../images/menuback_02.png); }
a.MenuLinkInact:link    p { color: #501010; padding: 2px; }
a.MenuLinkInact:visited p { color: #501010; padding: 2px;}
a.MenuLinkInact:hover   p { color: #101010; padding: 2px;
                            background-image: url(../images/Xred_12x19.png); background-color: #ffffff;}
a.MenuLinkInact:active  p { color: #101010; padding: 2px;
                            background-image: url(../images/Xred_12x19.png); }
a.MenuLinkInact:focus   p { color: #101010; padding: 2px;
                            background-image: url(../images/Xred_12x19.png); }



/***** Der aktive Link wird dann vom Script auf  *********************/
/***** id="MenuLinkActive" gesetzt. **********************************/
div.Menu2 a#MenuLinkActive { color: #000080; }
div.Menu2 a#MenuLinkActive:link { color: #000080; }
div.Menu2 a#MenuLinkActive:visited{ color: #000080; }
div.Menu2 a#MenuLinkActive:hover { color: blue; }
div.Menu2 a#MenuLinkActive:active { color: blue; }
div.Menu2 a#MenuLinkActive:focus { color: blue; }

div.Menu2 a#MenuLinkActive li { color: #000080; background-image: url(../images/menuback_02_red.png); }
div.Menu2 a#MenuLinkActive:link li { color: #000080; background-image: url(../images/menuback_02_red.png); }
div.Menu2 a#MenuLinkActive:visited li { color: blue; background-image: url(../images/menuback_02_red.png); }
div.Menu2 a#MenuLinkActive:hover li { color: blue; background-image: url(../images/Xred_10x16.png); }
div.Menu2 a#MenuLinkActive:active li { color: blue; background-image: url(../images/menuback_02_red.png); }
div.Menu2 a#MenuLinkActive:focus li { color: blue; background-image: url(../images/Xred_10x16.png); }

a#MenuLinkActive:link    p { color: #000080; background-image: url(../images/menuback_02_red.png); }
a#MenuLinkActive:visited p { color: #000080; background-image: url(../images/menuback_02_red.png); }
a#MenuLinkActive:hover   p { color: blue;    background-image: url(../images/Xred_12x19.png);       background-color: #ffeeee; }
a#MenuLinkActive:active  p { color: blue;    background-image: url(../images/menuback_02_red.png); }
a#MenuLinkActive:focus   p { color: blue;    background-image: url(../images/Xred_12x19.png);       background-color: #ffeeee; }

/*********************************************************************/

/***** Flaggen für andere Sprachen *****/
p.MenuFlags {
    margin-top:   20px;
    margin-left:  25px;
    background-color: #eeeeee;
}
p.MenuFlags a   { background-color: #eeeeee; }
p.MenuFlags img { margin-right: 10px; }


a#FlagDe { background-repeat:no-repeat; background-position:0px 0px; 
			background-image: url(../images/de_grey.gif); font-size: 18px;}
a#FlagDe:link { background-image: url(../images/de_grey.gif); }
a#FlagDe:visited { background-image: url(../images/de_grey.gif); }
a#FlagDe:hover { background-image: url(../images/de.gif); }
a#FlagDe:active { background-image: url(../images/de.gif); }
a#FlagDe:focus { background-image: url(../images/de.gif); }

a#FlagEn { background-repeat:no-repeat; background-position:0px 0px; 
			background-image: url(../images/en_grey.gif); font-size: 18px;}
a#FlagEn:link { background-image: url(../images/en_grey.gif); }
a#FlagEn:visited { background-image: url(../images/en_grey.gif); }
a#FlagEn:hover { background-image: url(../images/en.gif); }
a#FlagEn:active { background-image: url(../images/en.gif); }
a#FlagEn:focus { background-image: url(../images/en.gif); }

a#FlagIt { background-repeat:no-repeat; background-position:0px 0px; 
			background-image: url(../images/it_grey.gif); font-size: 18px;}
a#FlagIt:link { background-image: url(../images/it_grey.gif); }
a#FlagIt:visited { background-image: url(../images/it_grey.gif); }
a#FlagIt:hover { background-image: url(../images/it.gif); }
a#FlagIt:active { background-image: url(../images/it.gif); }
a#FlagIt:focus { background-image: url(../images/it.gif); }


/******** Allgemeiner Absatz hat etwas Rand nach oben ****************/
p { margin-top: 3px; }

/******** Wenn's mal etwas kleiner sein soll *************************/
.small { font-size: 8pt; }

/******* Kopfzeile ***************************************************/
#Kopfzeile { background-image:URL(../images/lvback_long_06.png);
             height:80px;
             border:1px solid #cccccc;
           }
#Kopfzeile .Head { font-size:40px;
                   font-weight:bold;
                   color:#808080;
                   text-align:center;
                   margin-top:15px;
                 }
img#XOnLogo { position:absolute; left: 15px; top: 15px; }
img#NILogo  { position:absolute; right:15px; top: 20px; }

/****** Links, deren Schrift immer Schwarz bleibt: *******************/
a.NormalColor { text-decoration: none; color: black; background-color: white; }
a.NormalColor:link    {  }
a.NormalColor:visited {  }
a.NormalColor:hover   { background-color:#dddddd; } 
a.NormalColor:active  { background-color:#dddddd; }
a.NormalColor:focus   { background-color:#dddddd; }


/***** Suchfunktion etwas kleiner als Menu ***************************/
.search { font-size: 8pt; }



/***** Fußzeile innerhalb der Content-Area ***************************/
#footer    { position: relative; 
		   bottom: 0px;
		   text-align: left; 
		   border-top: 1px dashed black; 
		   margin-top: 2em; 
		 }

/***** Fußzeile am unteren Bildrand **********************************/
tr.footer-low { background-color: #efefef; font-size: 8pt; vertical-align: middle; height: 18pt; }

/***** Statt einer Tabelle sollte man besser diese Klasse  ***********/
/***** für einen kleinen Rand verwenden ******************************/
.MarginSmall { margin: 10px; }

/***** Bild in linker Spalte *****************************************/
#LeftImage { text-align: center; margin-top: 4em; margin-bottom: 1em;} 

/***** Allgemeine Tabelle, wird an versch. Stellen genutzt ***********/
table.RefTable { background-color:#aaaaaa; }
table.RefTable th { font-weight:bold; background-color:#dddddd; 
                    padding-left:5px; padding-right:5px; padding-top:2px; padding-bottom:2px; }
table.RefTable td { background-color:#ffffff; padding-left:5px; padding-right:5px; padding-top:2px; padding-bottom:2px;    
                    vertical-align: top;}
table.RefTable td.X { text-align:center; vertical-align:middle; }
table.RefTable td.Link { vertical-align:middle; }

/***** Tabelle für Formulare *****************************************/
table.FormTable { border:none; padding:0; width:100%; }
table.FormTable td { padding: 2px; }
table.FormTable tr.head { font-weight:normal; font-style:italic; background-color:#dfdfdf; } 

/***** Tabelle auf Kontakt-Seite *************************************/
table.ContactList { margin-left:2em; }
table.ContactList td { padding-right: 2em; padding-bottom:1em; }

/***** no comment ****************************************************/
div#kHead { display:none; color:white; }

/***** Trennzeile (z.B. für "Zwischenmenüs") *************************/
.Separator { width:100%; background-color:#dddddd; padding-top:2px; padding-bottom:2px; margin-top:2em; margin-bottom:2em; }

/***** Spezielle Formatierungen für Formular-Ausgaben ****************/
#errormsg { color: red; font-weight: bold; }
#warning  { font-weight: bold; }

/*********************************************************************/