body {
padding: 20px 0px;
background-color: #DFDFDF;
color: #000;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 101%;
margin:0;

}


.einzug {
margin-left: 20px;
}


li span {
    position: absolute;
    top: -6000px;
    left: -6000px;
    height: 1px;
    width: 1px;
    font-size: 1px;
}

/* Allgemeine Klassen */
/* * * * * * * * * * * * * * */
.unsichtbar {
position: absolute;
top: -6000px;
left: -6000px;
height: 1px;
width: 1px;
font-size: 1px;
}

.floatAus {
   display: block;
   clear: both;
   float: none;
   height: 1px;
   font-size: 1px;
   line-height: 1px;
   overflow: hidden;
}


/* Rahmen (wrapper), Kopf */
/* * * * * * * * * * * * * * */

#wrapper {
  width: 85%;
  background-color: #fff;
  font-weight: bold;
  margin: 0 auto;
}

 #logo img {
 display: block; /* Erzwingt einen Block - das Element erzeugt eine neue Zeile.*/
}


/* Menüleiste quer mit float statt display: inline*/
/* * * * * * * * * * * * * * */
#quermenue {
  background-color:  #00FF00;
  float: left; /* muss floaten, damit das Kindelement (die li's) umschlossen wird*/
               /* ansonsten würde der braune Hintergrund nicht sichtbar sein*/
  width: 100%;
  border-top:#000000 2px solid;
}

#quermenue ul {
  float: left; /* muss floaten, damit das Kindelement (die li's) umschlossen wird*/
               /* ansonsten würde der braune Hintergrund nicht sichtbar sein*/
  width: 100%;
  padding: 0;
  margin: 0;
  list-style: none;
}

.quermenue li {
  float: left;
  font-weight: bold;
  font-size: 120%;
  border-left: #008200 1px solid;
 }

.quermenue .onstart { /*keinen blauen linken Rand für die Startseite*/
                      /* betrifft hier die ausgewählte Startseite */
        border-left-width: 0px;
}

.quermenue .erster {  /*keinen blauen linken Rand für die Startseite*/
                      /* class für Startseite, wenn nicht ausgewählt*/
        border-left-width: 0px;
}

#quermenue a {

 color: #008200;
  display: block;  /* Dank dieser Anweisung ist nicht nur   */
                   /* die Schrift, sondern der ganze        */
                   /* Kasten klickbar!                      */
                   /* und die padding-Werte werden von allen Browsern */
                   /* einigermaßen einheitlich angewendet */
  position: relative;             /* Diese Anweisung wird nur gebraucht,   */
                                    /* damit auch im IE der ganze Kasten     */
                                    /* klickbar ist (fuer andere Browser     */
                                    /* schadet sie nicht)                    */
  font-size: 70%;
  font-weight: bold;
  line-height: 1.5em;/* hiermit wächst auch die Höhe der hellbraunen Leiste */
  padding: 3px 15px 2px 20px;
/*  text-decoration: none;*/
}


#quermenue a:link, #quermenue a:visited {
  color: #000000;
  text-decoration: none;
}

#quermenue a:focus, #quermenue a:hover, #quermenue a:active {
  color: #FFFFFF;
  background-color: #008200;
}

#quermenue li.on a {
  color:#FFFFFF !important;
background:#008200!important;
}

#quermenue li.onstart a {
  color: #FFFFFF !important;
  background:#008200!important;
}

/* Spalte 1: Navigationsbereich */
/* * * * * * * * * * * * * * * * * * * * * * * * * * */

#spalte1 {
float: left;
width: 22%;
padding: 28px 0px 200px 0px;
background: #D9FFD9;
align: center;
}

#hauptmenue {
  float: left;
  width: 100%;
  padding: 28px 0 0;
 margin-top: 5px;
}

#hauptmenue ul {
  list-style: none;              /* Standardlistenpunkte entfernen           */
  margin: 0;                     /* Standardmargin ueberschreiben            */
  padding: 0;                    /* Standardpadding ueberschreiben           */
 /*border-top: 5px solid #cornflowerblue;   /* #3b3b3d Rahmenlinien fuer oben, rechts und
  border-right: 10px solid #chartreuse;  /* links. Die untere Rahmenlinie bringt
  border-left: 1px solid #7F0000;   /* das letzte a-Element schon selbst mit,
                                 siehe dazu den Block #servicemenue a */
                                }

#hauptmenue ul ul {
  border: 0;               /* Die innere Liste soll ja keinen Rahmen haben,  */
}                          /* mit ul ul sprechen wir ul-Elemente innerhalb   */
                           /* von ul-Elementen an                            */

#hauptmenue li {
  line-height: 100%;       /* Wird benoetigt, weil die Standardvorgaben der  */
                           /* verschiedenen Browser so unterschiedlich sind  */

  display: inline;         /* Diese Anweisung ist nur fuer IE noetig,        */
                           /* ohne sie kommt es zu haesslichen               */
                           /* Darstellungsfehlern.                           */
                           /* Fuer andere, modernere Browser wird            */
                           /* diese Anweisung in den naechsten Zeilen        */
                          /* wieder ueberschrieben                          */
}


 html>body li {
  display: block;          /* Fuer moderne Browser die Listenelemente        */
                           /* wieder zu Block-Elementen machen. Der IE       */
                           /* versteht html>body nicht - deshalb bleibt      */
}                          /* diese Anweisung vor IE-Browsern verborgen      */


#hauptmenue a {                   /* Diese Anweisungen gelten ganz         */
                                    /* allgemein fuer die Links des Menues   */

  display: block;                   /* Dank dieser Anweisung ist nicht nur   */
                                    /* die Schrift, sondern der ganze        */
                                    /* Kasten klickbar!                      */

  position: relative;               /* Diese Anweisung wird nur gebraucht,   */
                                    /* damit auch im IE der ganze Kasten     */
                                    /* klickbar ist (fuer andere Browser     */
                                    /* schadet sie nicht)                    */
  font-weight: bold;
  font-size: 75%;
  text-decoration: none;
  padding: 3px 5px 5px 15px;
                  /* Nach oben und unten ein padding-Wert  */
                                    /* von 5 Pixeln, nach links und rechts   */
                                    /* von 10 Pixeln                         */
border-bottom: 1px solid #F0EEE1;
}

#hauptmenue a:link,
#hauptmenue a:visited {
  background:#00FF00;              /* Hintergrundfarbe der Linkkaesten      */
  color: #400040;                   /* Schriftfarbe                          */
}


#hauptmenue a:focus,
#hauptmenue a:hover,
#hauptmenue a:active {
  background: #009300;                 /* Andere Hintergrundfarbe bei Mausover  */
  color: #FFFFFF;                   /* Andere Schriftfarbe bei Mausover      */
}

#hauptmenue li.on a {
  color:#FFFFFF !important;
background:#009300 !important;
}
#hauptmenue li.on1 a {
  color: #FFFFFF !important;
   background: #009300 url(../grafik/pfeil_on.gif) no-repeat 10px 0.6em !important;
}


#hauptmenue li li a:link,
#hauptmenue li li a:visited {
    background: #80FF00 url(../grafik/pfeil_on.gif) no-repeat 10px 0.6em;
/* hellgrün Mit der background-Anweisung wird das kleine Pfeilchen eingebunden:
   Zunaechst wird die Hintergrundfarbe angegeben,
   dann der Pfad zum Bild angegeben,
   dann wird festgelegt, dass das Bild nicht gekachelt, sondern nur
   einmal angezeigt werden soll,
   und schliesslich, dass es 10px vom linken Rand des a-Elements und 0.6em
   vom oberen Rand des a-Elementes angezeigt werden soll.

   Fuer den Abstand von oben nimmt man deshalb em, weil sich diese
   Maßeinheinheit der Schriftgroesse anpasst (sonst wuerde das Bildchen bei
   groesseren Schriften zu weit oben haengen).                               */

  font-weight: normal;
  padding-left: 30px;               /* Die Schrift der Untermenüpunkte       */
                                    /* weiter einruecken                     */
}

#hauptmenue li li a:focus,
#hauptmenue li li a:hover,
#hauptmenue li li a:active {
    background: #009300 url(../grafik/pfeil_on.gif) no-repeat 10px 0.6em;
    color: #FFFFFF;
}


#hauptmenue span {
    position: absolute;
    top: -6000px;
    left: -6000px;
    height: 1px;
    width: 1px;
    font-size: 1px;
}


/*unsere Angebote*/

#style {
 background:#00FF00;
/* font-size: 70%;  */
 color: #006600;
  font-weight: bold;
 text-align: center;
 padding: 5px 0;
}

#hauptmenue1{
  float: left;
  width: 100%;

  margin-top: 20px;
 background: #D9FFD9;*/

 }

#hauptmenue1 ul {
  list-style-type: none;              /* Standardlistenpunkte entfernen           */
  margin: 0;                     /* Standardmargin ueberschreiben            */
  padding: 0;                    /* Standardpadding ueberschreiben           */
/*  margin-left: 5px;*/
}

#hauptmenue1 li {
  line-height: 100%;       /* Wird benoetigt, weil die Standardvorgaben der  */
                           /* verschiedenen Browser so unterschiedlich sind  */

  display: inline;         /* Diese Anweisung ist nur fuer IE noetig,        */
                           /* ohne sie kommt es zu haesslichen               */
                           /* Darstellungsfehlern.                           */
                           /* Fuer andere, modernere Browser wird            */
                           /* diese Anweisung in den naechsten Zeilen        */
                          /* wieder ueberschrieben                          */

}


 html>body li {
  display: block;          /* Fuer moderne Browser die Listenelemente        */
                           /* wieder zu Block-Elementen machen. Der IE       */
                           /* versteht html>body nicht - deshalb bleibt      */
}                          /* diese Anweisung vor IE-Browsern verborgen      */


#hauptmenue1 a {                   /* Diese Anweisungen gelten ganz         */
                                    /* allgemein fuer die Links des Menues   */

 display: block;                   /* Dank dieser Anweisung ist nicht nur   */
                                    /* die Schrift, sondern der ganze        */
                                    /* Kasten klickbar!                      */

 position: relative;               /* Diese Anweisung wird nur gebraucht,   */
                                    /* damit auch im IE der ganze Kasten     */
                                    /* klickbar ist (fuer andere Browser     */
                                    /* schadet sie nicht)                    */
  font-weight: bold;
  font-size: 75%;
  color: #000000;
  text-decoration: none;
 padding: 3px 5px 5px 15px;            /* Nach oben und unten ein padding-Wert  */
                                    /* von 5 Pixeln, nach links und rechts   */
                                    /* von 10 Pixeln */
    border-bottom: 1px solid #F0EEE1;
 background: #B0FFB0 url(../grafik/minidot8x8-06.gif) no-repeat 5px 0.6em;
}


#hauptmenue1 a:focus,
#hauptmenue1 a:hover,
#hauptmenue1 a:active {
                  /* Andere Hintergrundfarbe bei Mausover  */
                  /* Andere Schriftfarbe bei Mausover      */
 background: #B0FFB0 url(../grafik/minidot8x8-06.gif) no-repeat 5px 0.6em;
 color:#008200;
}}

#hauptmenue1 li.on a {
 color:#008200; !important;
 background: #B0FFB0 url(../grafik/minidot8x8-06.gif) no-repeat 5px 0.6em;

}



/* Spalte 2: Inhalt mitte */
/* * * * * * * * * * * * * * * * * * * * * * * * * * */
@media screen,projection, handheld {
        #spalte2 {
        float: left;
        width: 70%;
        background-color: #FFFFFF;
        padding: 28px 0 10px 0;
}

#spalte2 h1{
font-size: 100%;
margin-left: 30px;
color: "#800080";
}
#spalte2 h2{
font-size: 120%;
margin-left: 30px;
color: #002D0D;
font-weight: bold;
}
#spalte2 h4{
font-size: 100%;
margin-left: 30px;
color: #002D0D;
}
#spalte2 h3{
font-size: 95%;
margin-left:10px;
color: #008000;
}

table {
  width: 90%;
  margin-left: 30px;
  border: 2px solid #EAFFF0;
  border-collapse: collapse;
}
caption {
  color: "#005128";
  font-weight: bold;
  font-size: 100%;
  text-align: left;
  padding: 10px 0;
  margin-left: 30px;
}

td, th {
  font-size: 80%;
  padding: 5px 10px;
  border: 1px solid #8CBC8B;
}

th {
  color: #004212;
  background: url(images/th_hintergrund.gif) 1px 1px no-repeat;
  text-transform: uppercase;
  text-align: left;
  padding-top: 8px;
}
.streifen td {
  background: #EAFFF0;
}




/*background: #FFFFFF url(../grafik/liste_katalog.gif) no-repeat 5px 0.6em;*/
}

#spalte2 p{

margin-left: 30px;
margin-right: 200px;
line-height: 150%;
margin-bottom: 0px;
margin-top: 0px;
font-size: 90%;
padding: 0px;
}

#spalte2 p.anders1{
margin-left: 30px;
margin-right: 30px;
line-height: 150%;
margin-bottom: 0px;
margin-top: 0px;
font-size: 90%;
padding: 0px;
}
#spalte2 p.anders {
margin-left: 30px;
margin-right: 30px;
line-height: 150%;
margin-bottom: 0px;
margin-top: 0px;
font-size: 80%;
padding: 0px;
color: #001506;
}

#spalte2 ul {
     list-style: none;
     font-size: 85%;
     margin-top: 0px;
}



#spalte2 ul .text {
margin-right: 150px;
margin-bottom: 50px;
}

#spalte2 ul .text1 {
margin-right: 100px;
margin-bottom: 100px;
}
#spalte2 ul .text2 {
margin-right: 70px;
margin-bottom: 20px;
}
#spalte2 ul .bild {
  float: right;
}
 #spalte2 li {
     padding: 10px 0px 10px 20px;
     background: #FFF url(../grafik/minidot8x8-16.gif) no-repeat 0 1.3em;
}
 #spalte2 li.anders {
     padding: 10px 0px 0px 20px;
     background: #FFF url(../grafik/pfeil_rechts.gif) no-repeat 0 1.3em;
}

#spalte2 a {
color: #B54AB5;
font-weight: bold;
}


#spalte2 a:visited {
color: #B54AB5;
font-weight: bold;
}
#spalte2 a:focus,
#spalte2 a:hover,
#spalte2 a:active {
color: #8A649B;
} */

/* Footer: */
/* * * * * * * * * * * * * * * * * * * * * * * * * * */

.w3c {
  float: left;
  width: 10%;
  margin: 0;
}


.copy {
  float: right;
  width: 90%;
  margin: 0;
  color:#E4E4E4;
 }

* html .copy {
  w\idth: 80%; /* Diese Anweisung ist nur für den IE 6, er braucht mehr als 100%, die Standardbrowser verstehen es nicht */
}


#footer {
  clear: both;
  color: #09619e;
  font-size:70%;
  padding: 0px 15px 3px 0px; /*von oben im Uhrzeigersinn */
  text-align: right;
}
#footer p.anders {
text-align: left;
padding: 0;
margin: 0;
color: #FF0020;
}

#footer span {
font-size: 80%;
color: #8F8F8F;
}
#footer a:link,
#footer a:visited {
   font-weight: bold;
   text-decoration: none;
   color: #09619e;
   font-weight: bold;
   font-size:70%;
}


#footer a:focus,
#footer a:hover,
#footer a:active {
   color: #e78200;
   text-decoration: underline;
}

#goto_top {
position: relative;
background-image: url("../grafik/pfeil_hoch.gif");
background-repeat: no-repeat;
background-position: center center;
padding-left: 12px;
width: 24px;
}
#zurück{
font-size: 65%;
}
#footer .nachoben {
        clear: both;
        padding-right: 0px;
        padding-left: 0px;
        float: none;
        padding-bottom: 0px;
        padding-top: 10px;
        text-align: right
}
#footer .nachoben p {
        text-align: right;
}

#footer .nachoben img {
     border: 0;
     vertical-align: middle;
}
#footer img {
     border: 0;
     vertical-align: middle;
}

hr {
   color: #09619e;
   height: 1px;
   width: 70%;
   text-align: center;
}

hr.anders {
height: 1px;
   width: 100%;
   text-align: left;
}
#abschlusszeile p {
    text-align: center;
}
strong.orange {
     color: #E57104;
     font-weight: bold;
     font-style: normal;
 }

em.blau {
     color: #00008F;
     font-weight: bold;
     font-style: normal;
 }


.links,
.rechts {
   float: left;
   width: 180px;
}

.block {
 text-align:justify;
}

.profillinks
{
padding:0px 20px 0px 10px;
vertical-align:top;
width: 32%;
font-size:80%;
}
.hohezeilelinks
{
padding:10px 20px 0px 10px;
vertical-align:top;
width: 32%;
font-size:80%;
}

.profilrechts
{
padding:0px 20px 0px 10px;
vertical-align:top;
font-size:80%;
line-height: 150%;
}
.hohezeilerechts
{
padding:10px 20px 0px 10px;
vertical-align:top;
font-size:80%;
line-height: 150%;
}
.leftcolumnteam {
padding:0px 20px 10px 10px;
vertical-align:top;
width: 60%;
}