/* CSS-Dokument fuer die Webseite www.ksh-systems.com */
/* Erstellungsdatum: Jaenner 08 */
/* Type: Barrierefrei Level-AAA */
/* Webdesignerin: Alexandra Steiner - www.ksh-systems.com */
/* Media: Screen */
/* Bilder und Grafiken: eingebunden 3; Designelemente: 22 */
/* Inhalte: 6 IDs; 11 Klassen; 8 Globale */
/* Verwendete Farben: 
        #ffffff (Hingertrund); 
        #000000 (Fliesstexte); 
        #1c4672 (Hervorhebungen im Text); 
        #330099 (Linkfarbe Fliesstext); 
        #990000 (Hoverfarbe Fließtext); 
        #dbf8fc (Hintergrund Menueleiste); 
        #505050 (Linkfarbe Menueleiste); 
        #333399 (Hover und Focus Menueleiste) */

body {
        background-color:#ffffff;
        margin: 0;
        padding:0;
}

* {
        padding:0;
        margin:0;
        color:#000000;
        font-family: Verdana, Arial, Helvetica, sans-serif;
        background-image:none!important;
}

        /* Acronym title */

acronym {
        cursor:help;
}

        /* Absaetze */

p {
        font-size: 0.7em;
        line-height: 1.4em;}

        /* Ueberschriften */

h1 {
        background-image:url(designelemente/gelb.gif);
        background-position:left center;
        background-repeat:no-repeat;
        color:#1c4672;
        font-size: 0.8em;        
        padding: 0px 0px 0px 3px;
        margin: 5px 0;
}

h2 {
        color:#1c4672;
        font-size: 0.75em;
        font-style:italic;
        border-bottom: 1px solid #1c4672;
        margin: 5px 0 5px 5px;
}

h2 a:link    {font-style:normal; color: #330099; text-decoration: none;}
h2 a:visited {font-style:normal; color: #330099; text-decoration: none;}
h2 a:hover   {font-style:italic; color: #990000; text-decoration: underline;}
h2 a:focus   {font-style:normal; color: #000000; text-decoration: none;}
h2 a:active  {font-style:italic; color: #CC0000; text-decoration: none;}

        /* Betont - wird im Browser fett dargestellt - nicht verwechseln mit <b> */

strong {
        color:#1c4672;
}

        /* Bilderdarstellung */

img {
        border: none;
        padding: 0;
        margin: 0;
        display:none!important;
}

img.bildintext {
        float: left;
        display:none;
        margin-top: 5px;
        padding-right: 2em;
}

        /* Linkdarstellung */

a:link    {color: #330099; text-decoration: none;}
a:visited {color: #330099; text-decoration: none;}
a:hover   {color: #990000; text-decoration: underline;}
a:focus   {color: #000000; text-decoration: none;}
a:active  {color: #CC0000; text-decoration: none;}

        /* Horizontale Linie */

hr {
        margin:5px 0;
        padding:0;
        border-top: 1px solid #ffffff;
        border-right: 1px solid #ffffff;        
        border-bottom:1px dashed #333399;
        border-left: 1px solid #ffffff;
        background-color:#ffffff;
        height:1px;
        color:#ffffff;        
}

hr.text {
        margin:5px 0;
}

/* --------------------------------------------------------------- Diverse Klassen ---------------------------------------------------- */

        /* Klasse wird aufgerufen: Kooperationspartnern - dient also zur Auflistung einzelner Links */

.liste {
        margin: 5px 0 10px 0;
}
.liste li {
        font-size: 0.7em;
        line-height: 1.2em;
        list-style-image:url(designelemente/blau.gif);
        list-style-type:disc;
        margin-left: 20px;
        margin-top: 0;
        margin-bottom: 5px;
        padding:0;
}
.liste li.access {

}
.liste ul {
        padding:0;
}

        /* Darstellung eines E-Mail-Links: Support und Projektleitung */
        
.maillink {
        background-image:url(designelemente/grau.gif);
        background-position:left;
        background-repeat:no-repeat;

}

        /* Sprungmarke wurde ausserhalb des sichtbaren Bereichs platziert */

.naviblind {
        padding:0; 
        margin:0; 
        font-size:0.6em;
        display:none;
}

        /* Infos fuer blinde User, die einen Sreenreader benutzen */

.infoblind {
        padding:0; 
        margin:0;
        line-height:0;
        font-size:0.6em;
        position: absolute; 
        top:-20px; 
        left:-20px;
}

.testbutton {
        margin-top:-9px;
        margin-bottom:5px;
        text-align: right;
}
.testbutton ul {
        list-style-type:none;
}
.testbutton li {
        display: inline;
}

.projektbilder {
        float:none;
        margin: -5px 0 0 10px;
}

/* ------------------------------------------------------------------------------------------------------------------------------------ */
/* ---------------------------------------- Umschlag fuer den gesamten Inhalt und Münueleiste ----------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------ */

#wrapper {
        text-align: center;
        margin: auto;
        width:380px;
        min-height:768px;
}

/* ------------------------------------------------------------------------------------------------------------------------------------ */
/* ---------------------------------- Kopfbereich mit der oberen Menueleiste und Spracheneinstellung ---------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------ */

#kopf {
        background:url(designelemente/header.jpg) bottom no-repeat;

        text-align:left;
}

.printlogo {display:none;}

        /* Spracheneinstellung */

.sprache {
        padding:0;
        font-size: 0.7em;        
        text-align:right;
}
.sprache ul {
        margin: 0px;
        padding: 0px 1px;
}
.sprache li {
        display: inline;
        list-style-type:none;
        padding: 0px 2px;
}


/* ------------------------------------------------------------------------------------------------------------------------------------ */
/* --------------------------------------------- Menue im unteren Kopfbereich  -------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------ */

#menue_oben {
        background-color:#dbf8fc;
}

        /* Submenue im Kopfbereich */

.submenue {
        text-align:center;
        padding:0;
        font-size: 0.6em;
        letter-spacing:0.01em;

}
.submenue ul {
        padding: 0;
        margin: 0;
}
.submenue li {
        display: block;
        float:left;
        list-style-type:none;
        padding: 2px;
}
.submenue li.navi {
}
.submenue a:link    {color: #505050; text-decoration:none;}
.submenue a:visited {color: #000000; text-decoration:none;}
.submenue a:hover   {color: #333399; text-decoration:underline;}
.submenue a:focus   {color: #333399; text-decoration:underline;}
.submenue a:active  {color: #505050; text-decoration:none;}


/* ------------------------------------------------------------------------------------------------------------------------------------ */
/* --------------------------------------------- Linke Menueliste, Hauptmenue  -------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------ */

#menue_links {
        text-align:left;
        padding:0 0 10px 0;
}
#menue_links p {
        margin:0;
        margin: 0;
}

        /* Hauptmenue */

.haupt {
        text-align:right;
        font-size: 0.6em;
        letter-spacing:0.02em;
}
.haupt ul {
        padding: 0;
        margin:0;
}
.haupt li {
        background-color:#dbf8fc;
        list-style-type:none;
        padding: 3px;
        border-top: 3px solid #ffffff;
        float:left;
}
.haupt a:link    {color:#505050; text-decoration:none;}
.haupt a:visited {color:#000000; text-decoration:none;}
.haupt a:hover   {color:#333399; font-weight:700; text-decoration:underline;}
.haupt a:focus   {color:#333399; font-weight:700; text-decoration:underline;}
.haupt a:active  {color:#505050; text-decoration:none;}

        /* Darstellung der Infolinks - Impressum etc. */

.infolinks {
        font-size: 0.7em;
        font-variant:normal;
        text-align:right;
        margin: 0;
        padding: 0;
}
.infolinks ul {
        padding: 0;
        margin:0;
}

.infolinks li {
        list-style-type:none;

}
.infolinks a {
        background-image:url(designelemente/gelb.gif);
        background-position:right;
        background-repeat:no-repeat;
        padding: 1px 2px 1px 2px;
}

.infolinks a:link    {color:#999999; text-decoration:none;}
.infolinks a:visited {color:#000000; text-decoration:none;}
.infolinks a:hover   {color:#990000; text-decoration:underline;}
.infolinks a:focus   {color:#000000; background-color:#999999; text-decoration:none;}
.infolinks a:active  {color:#FF0000; text-decoration:none;}

        /* Darstellung der Kontaktlinks */

.kontakt {
        background-image:url(designelemente/logo.gif);
        background-repeat:no-repeat;
        background-position:left bottom;
        font-size:0.7em;
        font-variant:normal;
        text-align:right;

}

.kontakt li {
        background-image:url(designelemente/grau.gif);
        background-position:right;
        background-repeat:no-repeat;
        list-style-type:none;
        padding: 1px 12px 1px 0;
}

.kontakt a:link    {color:#999999; text-decoration:none;}
.kontakt a:visited {color:#000000; text-decoration:none;}
.kontakt a:hover   {color:#990000; text-decoration:underline;}
.kontakt a:focus   {color:#000000; background-color:#999999; text-decoration:none;}
.kontakt a:active  {color:#FF0000; text-decoration:none;}

.hotline {
         clear:both;
        font-size:0.5em;
        font-variant:normal;
        text-align:right;

}
.hotline p {
        padding:0;
}
.hotline a:link    {color:#333333; text-decoration:none;}
.hotline a:visited {color:#000000; text-decoration:none;}
.hotline a:hover   {color:#990000; text-decoration:underline;}
.hotline a:focus   {color:#000000; background-color:#999999; text-decoration:none;}
.hotline a:active  {color:#FF0000; text-decoration:none;}

/* ------------------------------------------------------------------------------------------------------------------------------------ */
/* ---------------------------- Inhaltsbereich mit Linklisten, Ueberschriften, Fliesstexte, Bilder etc. ------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------ */

#inhalt {
        background-image:url(designelemente/strich.gif);
        background-position:top;
        background-repeat:no-repeat;
        text-align:left;
        margin: 0;

}

        /* Begruessungstext mit Acronym Title der einzelnen Begriffe */

/* ------------------------------------------------------------------------------------------------------------------------------------ */
/* --------------------------------------------------- Fusszeile mit Quellenangabe ---------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------ */

#fusszeile {
        background-image:url(designelemente/strich.gif);
        background-repeat:no-repeat;
        background-position:top center;
        clear:both;
        text-align:center;

}

.quelle {
        font-size: 0.6em;
        padding:10px 0 5px 0;
}