@charset "utf-8";
/* * {   Das *-Element trifft alles padding: 0; margin: 0;
         schalten Voreinstellungen der Browser aus, vermurksen aber <li>

      Grundsätze

Unverwechselbare Begriffe erleichtern Search and Replace.
Elemente trennen:
-        Lage: Position
-        Breite
-        Stil: Formatierung des Inhaltes
-----------------------------------------------------------------*/

body {   color: #000000;
         background-color: #FFFFFF;
         text-align: left;
         font-size: 100%;
         font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
         vertical-align: top;
         line-height: 135%;
         }
@media print {body
        {font-size: 10pt;
         }
         } /*Ende @media print */

/*-------------------------------------------------------------------
         Sectioning:  semantische HTML-Elemente
         hier nur Größe und Lage formatieren
-------------------------------------------------------------------*/

/*-------Kopf------------------------------------------------------*/

header { margin-left: 180px;
         margin-right: 180px;
         margin-bottom: 10px; /* Luft zwischen Kopf und Körper */
         }
@media print {header
        {margin: 5px;
         }
         } /*Ende @media print */
@media only screen and (max-width: 768px) {header
        {margin: 0px
         }
         } /* Ende @media screen */

/*-------Hauptteil------------------------------------------------------*/

main    {padding: 0; /* nötig, um <ul> innen zu behalten */
         overflow: auto; /* umfließt vorstehende Container NICHT */
         }
@media only screen and (max-width: 768px) {main
        {overflow: visible; /*nutzt die Breite bei kleineren Bildschirmen*/
         }
         } /* Ende @media screen */

/*-------Navigation------------------------------------------------------*/

nav     {float: left; /* nav steht links, folgende Boxen rechts */
         /*overflow: auto; /* Was macht der Browser, wenn der Text nicht in die Box passt?*/
         margin: 0 10px 10px 0; /* Abstand nach rechts und unten */
         width: 170px; /*Breite des Feldes */
         }
@media print {nav
        {display: none; /*nav wird nicht ausgedruckt */
         }
         } /*Ende @media print */
@media only screen and (max-width: 768px) {nav
        {display: none;
         }
         } /* Ende @media screen */

.linklist { /* soll Inhalt von nav, aside und main werden */
         background-color: #FFFFA0;       /* Hintergrundfarbe */
         }

.linklist h2, h3
        {margin: 0px; /* Abstände nach außen weg */
         }

.linklist p,
.linklist ul /*vererbt sich auf ul li .. usw. */
       { padding: 2px;
         margin: 0px;
         text-align: left;
         font-size: 92%;
         border: none;
         list-style: none; /* entfernt Bullets o.ä. */
         }

.linklist ul li {
         padding-left: 5px; /* Listenelemente einrücken, ul li ul li: 2x!  */
         }

.linklist ul li ul li
        {border-bottom: 1px solid black; /* Unterstrich bei </li> */
         }

.linklist p a,
.linklist h2 a,
.linklist h3 a,
.linklist ul li a
        {text-decoration: none; /* Links ohne Unterstreichung */
         }

.linklist p a,
.linklist h2 a,
.linklist h3 a,
.linklist ul li a
        {color: #000000;/* Links ohne Hervorhebung */
         }

/* Links hervorheben, wenn Maus darüber steht
   CSS-Pseudoklassen */
.linklist h2 a:hover,
.linklist h2 a:focus,
.linklist h3 a:hover,
.linklist h3 a:focus,
.linklist ul li a:hover,
.linklist ul li a:focus
{        display: block; /* hebt den ganzen Block hervor außer Padding */
         background-color: #003366;
         border: none; /* vergrößert bei a:hover das Feld = Unruhe !! */
         color: #ffffff;
         text-decoration: underline;
         }

/*-------Seitenleiste------------------------------------------------------*/

aside{   float: right;
         min-height: 20px;
         overflow: auto;
         margin: 0 0 10px 10px; /* Abstand nach links und unten */
         width: 240px; /* Breite des Feldes, verändert sich beim Zoomen */
         }

@media print {aside
        {display: none;
         }
         } /*Ende @media print */
@media only screen and (max-width: 768px){aside
        {float: none; /* steht anfangs main über volle Breite*/
         margin: 0; /*Außenabstand*/
         width: 100%; /* volle Breite */
         /* display: none; ausgeschaltet während Corona */
         }
         } /*Ende @media screen */
aside h2 {
         margin: 0px;
         }

/*-------Fußzeile------------------------------------------------------*/

footer { clear: both;
         width: 100%;
         text-align: center;
         font-size:80%;
         margin-top: 50pt;
         background-color: #CFFF9F;
         border-top: 5px double #000000;
         }

@media print {
  footer{display: none;
         }
         } /*Ende @media print */

/* ----------------------------------------------------------------- */
/*                                                                   */
/*       Tag-Selektoren                                              */
/*                                                                   */
/* ----------------------------------------------------------------- */

th,h1,h2,h3,h4,h5,h6 {
         font-weight:bold;
         text-align:center;
         vertical-align:middle;
         padding: 0px;
         margin: 0px; }

h1 {     font-size:160%;
         background-color: #FF9F9F;
         line-height: 120%; /* nicht zu groß wegen Zeilenabstand */
         padding: 5px 0 5px 0; /* Überschrift höher machen */
         margin: 0px;
        /* width macht Probleme bei h neben einem gefloateten Container */ }
h2 {     font-size:140%;
         background-color: #FFCF9F;
         padding: 2px 2px 2px 2px; /* Ränder werden bei a:hover
                                               nicht markiert*/
         border: 1px solid #000000;
         margin-bottom: 5px; }
h3 {     font-size:120%;
         border: 1px groove #000000;
         background-color: #FFFF9F;
         margin: 0 10px 0 10px; }
h4 {     font-size:110%;
         border: 1px groove #000000;
         background-color: #FFFFFF;
         margin: 0 20px 0 20px; }
h5 {     font-size:100%;
         border-bottom:  1px groove #000000;
         width: 70%;
         margin-left: 15%; }
h6 {     font-size:100%;
         border-bottom: 1px dotted #000000;
         width: 50%;
         margin-left: 25%; }

th {     font-size:100%; }
tk {     font-size:100%; }
td {     font-size:100%; vertical-align:top; }

dt {     font-weight:bold; }
dd {     margin-bottom: 20px; }

/* -----------------------------------------------------------------

         #ID-Selektoren
         Dürfen nur 1x je Datei verwendet werden
         Dienen gleichzeitig als Anker

-------------------------------------------------------------------- */

#inhaltsbeschreibung { /*für die Stichwortliste über dem Titel */
         font-size:80%;
         margin-top:0px;
         margin: 0px 90px 0px 90px;
        /* Damit Inhaltsbeschreibungen nicht unter die Pfeile geraten */
         min-height: 50px;
         }
@media print {#inhaltsbeschreibung
         {display: none;
         }
         } /*Ende @media print */
@media only screen and (max-width: 768px) {#inhaltsbeschreibung
         {margin: 0px
         }
         } /* Ende @media screen */


#stand {  /*für die Standortbestimmung über dem Titel*/
         font-size:80%;
         background-color: #FFFF9F;
         padding-top: 10px;
         }
@media only screen and (max-width: 768px) {#stand
{        clear: both;
         }
         } /* Ende @media screen */

#koerper { /* könnte durch .Abschnitt ersetzt werden,
          aber dann kann man die Breite nicht unabhängig einstellen */
         clear: both;
         }

/* -----------------------------------------------------------------

         Seiteninterne Navigation für Sehbehinderte

-------------------------------------------------------------------- */

#topnavi { /*  */
         float: right;
         font-size: 80%;
         width: 170px;
         overflow: auto;
         }
@media print {#topnavi
         {display: none;
         }
         } /*Ende @media print */
@media only screen and (max-width: 768px) {#topnavi
         {display: none;
         }
         } /* Ende media screen */

#topnavi ul {
         list-style-type: none;
         margin: 0px;
         padding: 0px;
         }
#topnavi ul a {
         color: #ffffff;
         display: block;
         }
#topnavi ul li a:hover,
#topnavi ul li a:focus  {
         background-color: #003366;
         border: none;
         /* Schattenwirkung, vergrößert bei a:hover das Feld = Unruhe !! */
         color: #ffffff;
         text-decoration: underline;
         }


/* -------------------------------------------------------------------

         Formatierungselemente

---------------------------------------------------------------------*/

.mobile  {/* nur bei kleinen Bildschirmen angezeigt */
         display: none;
         }
@media print {.mobile
         {display: none;
         }
         } /*Ende @media print */
@media only screen and (max-width: 768px) {.mobile
         {display: block;
         }
         } /* Ende media screen */

.nonmobile  {/* bei kleinen Bildschirmen nicht angezeigt */
         }
@media print {.nonmobile
         {display: none;
         }
         } /*Ende @media print */
@media only screen and (max-width: 768px) {.nonmobile
         {display: none;
         }
         } /* Ende media screen */



.wichtig { /* für Hervorhebungen */
         background-color: #FFDFE0;
         }

.tipp { /* um besonders gutes Material hervorzuheben */
         background-color: #DFFFE0;
         }

.unsichtbar {
         width : 0;
         position : absolute;
         left : 200px;
         top : 200px;
         height : 0;
         overflow : hidden;
         color: red;
         text-decoration: none;
         }

.keinpunkt /*vererbt sich auf ul li .. usw. */
       { list-style: none; /* entfernt Bullets o.ä. */
         }

.einpunkt /*vererbt sich auf ul li .. usw. */
       { list-style: circle; /* entfernt Bullets o.ä. */
         }


/*------------------------------------------------------------------
         Für Bilder
         Textformatierung wirkt nur in DIV-Container,
         Ränder auch in IMG-Class
--------------------------------------------------------------------
*/
.bildbox        {
         background-color: #FFFFFF;
         text-align: center;
         font-style: italic;
         margin-bottom: 10px;
         padding: 10px 0 10px 0;
         border: 0; /* falls in <img class=""> eingesetzt */
         }
.bildbox img {
         border: 0;
         }

/*------------------------------------------------------------------
         Notentabellen                                 geprüft 2016
--------------------------------------------------------------------
*/
.notenliste_ {
         width: 100%;
         margin: auto;
         }

.notenliste_ td,
.notenliste_ th  {
         width: 50%;
         margin: 0px;
         padding: 5px;
         border: 1px solid #000000;
         text-align: left;
         }

.notenliste_ th  {
         background-color: #ccffcc;
         }

.notenliste_ td  {
         background-color: #ffffcc;
         }

.notenliste_ caption  { /* Über-/Unterschrift für Tabellen */
         margin-top: 10px;
         font-size: 125%;
         }


/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

         Auszeichnung für Containerboxen
         - .class -> überall einsetzbar

xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */

/*------------------------------------------------------------------
         Containerboxen: Lage
--------------------------------------------------------------------*/

.boxlage_links /* setzt den Container nach links */
{        float: left;
         min-height: 120px;
         overflow: auto;
         margin: 0 10px 10px 0; /* Abstand nach rechts und unten */
         }
.boxlage_rechts /* setzt den Container nach rechts */
{        float: right;
         min-height: 20px;
         overflow: auto;
         margin-left: 10px;
         margin-bottom: 10px
         }
.boxrest {/* setzt den Haupttext zwischen die voranstehenden */
         padding: 0;        /* nötig, um <ul> innen zu behalten */
         overflow: auto; /* umfließt vorstehende Container NICHT */
         }
@media only screen and (max-width: 768px) {
  .boxlage_links
         {float: none;
         margin-top: 10px;
         margin-bottom: 10px
         }
         } /* Ende media screen */

@media only screen and (max-width: 768px) {
  .boxlage_rechts
         {float: none;
         margin-left: 0px;
         margin-bottom: 10px
         }
         } /* Ende media screen */

.boxlage_linksfixed /* zur Zeit nicht eingesetzt */
{        position:fixed;
         top:5px;
         left: 5px;
         overflow: auto;
         }
/*------------------------------------------------------------------
         Containerboxen: Breite
--------------------------------------------------------------------*/

.boxbreite_schmal {
         width: 170px;        /* Breite des Feldes, verändert sich beim Zoomen */
         max-width: 20%; /* Begrenzt Breite beim Zoomen */
         }
.boxbreite_mittel {
         width: 240px;        /* Breite des Feldes, verändert sich beim Zoomen */
         max-width: 30%; /* Begrenzt Breite beim Zoomen */
         }
.boxbreite_breit {
         width: 340px;        /* Breite des Feldes, verändert sich beim Zoomen */
         /*max-width: 40%; /* Begrenzt Breite beim Zoomen */
         }


/*------------------------------------------------------------------
    Containerboxen: Sonderformen
--------------------------------------------------------------------*/

.clear {
         clear: both;
         }

.stapel340 { /* Fenster mit fester Breite, setzen sich nebeneinander
         abhängig von der Bildschirmbreite. Funktioniert nicht zuverlässig,
         wenn die Länge der hintereinander kommenden Fenster abnimmt.*/
         width: 340px;
         margin-right: 1px;
         float: left;
         padding: 10px;
         }

.spalten2 { /* 2-spaltiger Satz, für die linke und rechte Spalte verwenden. Das dritte <div id="Spalten2"> schließt unter der rechten Spalte an, und zwar links oder rechts unter der kürzeren Spalte. */
         width: 48%; /* Breite des Feldes */
         margin-right: 1%;
         float: left;
         }
@media only screen and (max-width: 768px) {.spalten2
        {width: 100%; /* Breite des Feldes, veränderlich beim Zoomen */
         }
         } /* Ende @media screen */

.spalten3 { /* 3-spaltiger Satz, für alle 3 nebeneinanderliegenden Spalten verwenden. */
         width: 31%; /* Breite des Feldes */
         margin-right: 1%;
         float: left;
         }
@media only screen and (max-width: 768px) {.spalten3
        {width: 100%; /* Breite des Feldes, veränderlich beim Zoomen */
         }
         } /* Ende @media screen */

/* -----------------------------------------------------------------

         Containerstile:
         sind nicht kombinierbar ?

-------------------------------------------------------------------- */
/* -----------------------------------------------------------------
         Containerstil: Seitliche Spalten
         .class, weil ursprünglich links und rechts eingesetzt
-------------------------------------------------------------------- */

/* Einheitlich verwendet Elemente */
.seitenspalte p,
.seitenspalte h3,
.seitenspalte ul,
.seitenspalte li {
         overflow: auto;
         background-color: #FFFFA0;        /* Hintergrundfarbe */
         font-size: 80%;
         padding: 2px;
         margin: 0px;
         text-align: left;
         border: none;
         }

/* Abstände nach außen weg */
.seitenspalte h2 {
         margin: 0px;
         }

/* Blöcke unterstreichen */
.seitenspalte p,
.seitenspalte h3,
.seitenspalte li {
         border-bottom: 1px solid black;
         }

/* Listenelemente einrücken */
.seitenspalte ul li {
         padding-left: 10px;
         font-size: 100%     /* ?? */
         }
.seitenspalte ul li ul li {
         padding-left: 20px;
         font-size: 100%     /* ?? */
         }

/* Links ohne Unterstreichung */
.seitenspalte p a,
.seitenspalte h2 a,
.seitenspalte h3 a,
.seitenspalte ul li a
{        text-decoration: none;
         }

/* Links ohne Hervorhebung */
.seitenspalte p a,
.seitenspalte h2 a,
.seitenspalte h3 a
{        color: #000000;
         }

/* Links hervorheben, wenn Maus darüber steht
   CSS-Pseudoklassen */
.seitenspalte h2 a:hover,
.seitenspalte h2 a:focus,
.seitenspalte h3 a:hover,
.seitenspalte h3 a:focus,
.seitenspalte ul li a:hover,
.seitenspalte ul li a:focus
{        display: block; /* hebt den ganzen Block hervor außer Padding */
         background-color: #003366;
         border: none; /* vergrößert bei a:hover das Feld = Unruhe !! */
         color: #ffffff;
         text-decoration: underline;
         }

/*------------------------------------------------------------------
         Containerstil: Zur Information
------------------------------------------------------------------*/
.infobox {
         background-color: #80FF00;
         margin-top: 0px;
         padding: 5px;
         }

.infobox p {
         padding: 5px;
         margin: 0px;
         font-size: 80%;
         }

/* Abstände nach außen weg */
.infobox h2,
.infobox h3 {
         margin: 0px;
         }


/* -----------------------------------------------------------------
         Links mit ausführlichen Beschreibungen
-------------------------------------------------------------------- */

.datumliste {
         }

.datumliste ul {
         list-style-type: none;
         text-indent: -4.1em;
         margin-left: 4.1em;
         margin-top: 0px;
         padding: 0px;
         }
.datumliste ul li {
         margin-top: 0.4em;
         }

.datumliste ul li a {
         text-decoration: none;
         color: #000000;
         }

.datumliste ul li a:hover,
.datumliste ul li a:focus,
.datumliste h3 a:hover,
.datumliste h3 a:focus  {
         background-color: #003366;
         color: #ffffff;
         text-decoration: underline;
         }

/* ----------------------------------------------------------------- */
/*                                                                   */
/*       Class-Selektoren                                            */
/*                                                                   */
/* ----------------------------------------------------------------- */

.math {  /* für die Darstellung von Formeln, siehe http://www.math.union.edu/~dpvc/jsMath/ */
                        }
/* Textausrichtung */
.links { text-align: left}
.mittig{ text-align: center}
.rechts{ text-align: right}


/*für die Rundgang-Pfeile auf jeder Seite */
.Pfeil_rechts {
         float:right;
         width: 88px;
         height: 31px;
         border: 0;
/*        background-image: url(../bilder/Pfeil_rechts.png);
          funktioniert in div und img, aber alt und title? */
         }
@media print {.Pfeil_links
         {display: none;
         }
         } /*Ende @media print */
@media only screen and (max-width: 768px) {.Pfeil_links
         {display: none;
         }
         } /* Ende media screen */


.Pfeil_links {
         float:left;
         width: 88px;
         height: 31px;
         border: 0;
         }
@media print {.Pfeil_rechts
         {display: none;
         }
         } /*Ende @media print */
@media only screen and (max-width: 768px) {.Pfeil_rechts
         {display: none;
         }
         } /* Ende media screen */


/* für die Validierungssymbole und Pfeile ohne Ausrichtung */
.validator {
         width: 88px;
         height: 31px;
         border: 0;
         }

.Befehle {
         width: 60%;
         float: right;
         background-color: #E0FFFF;
         color: #000000;
         margin-left: 5px;
         }

.uebung { /*für Übungsaufgaben innerhalb von Tutorials */
         float: right;
         background-color: #D2FFCC; color: #000000;
         border: thin solid #000000;
         padding-bottom: 5px;
         padding-left: 5px;
         padding-right: 5px;
         padding-top: 0px;
         margin-bottom: 5px;
         margin-left: 5px;
         width: 60%;
         }

.zutun { /*für projektbezogene Hinweise */
         float: left;
         background-color: #ffffff; color: #000000;
         border: thin solid #000000;
         padding-bottom: 5px;
         padding-left: 5px;
         padding-right: 5px;
         padding-top: 0px;
         margin-top: 5px;
         margin-bottom: 5px;
         margin-right: 5px;
         width: 45%;
         }
@media only screen and (max-width: 1000px) {
         .zutun
        {width: 95%; /* Breite des Feldes, veränderlich beim Zoomen */
         float: left;
         }
         } /* Ende @media screen */

.zutuncad { /*für projektbezogene Hinweise */
         /*float: left;*/
         background-color: #d2ffcc; color: #000000;
         border: thin solid #000000;
         padding-left: 5px;
         padding-right: 5px;
         margin-bottom: 5px;
         width: 95%;
         }

.projekt { /*für projektbezogene Hinweise */
         float: right;
         background-color: #b0ffff; color: #000000;
         border: thin solid #000000;
         padding-bottom: 5px;
         padding-left: 5px;
         padding-right: 5px;
         padding-top: 0px;
         margin-top: 5px;
         margin-bottom: 5px;
         margin-left: 5px;
         width: 45%;
         }
@media only screen and (max-width: 1000px) {
         .projekt
        {width: 95%; /* Breite des Feldes, veränderlich beim Zoomen */
         float: left;
         }
         } /* Ende @media screen */

.technik { /*für technische Hinweise */
         float: right;
         background-color: #b0ffb0; color: #000000;
         border: thin solid #000000;
         padding-bottom: 5px;
         padding-left: 5px;
         padding-right: 5px;
         padding-top: 0px;
         margin-top: 5px;
         margin-bottom: 5px;
         margin-left: 5px;
         width: 45%;
         }
@media only screen and (max-width: 1000px) {
         .technik
        {width: 95%; /* Breite des Feldes, veränderlich beim Zoomen */
         float: left;
         }
         } /* Ende @media screen */

.zutun h4,
.technik h4,
.projekt h4 {
         font-size:110%;
         border-bottom:  2px groove #000000;
         width: 100%;
         margin-left: 0%; }

.zutun h5,
.technik h5,
.projekt h5 {
         font-size:100%;
         border-bottom: 1px dotted #000000;
         width: 90%;
         margin-left: 5%; }

.zutun h6,
.technik h6,
.projekt h6 {
         font-size:100%;
         margin: 0%}


/*-----------------------------------------
         Klassen zum Anzeigen von Büchern
-------------------------------------------*/
.buch { /* Für Buchtitel, <div class="Buch"> einfach hintereinander setzen,
         setzt so viele Spalten, wie Platz haben (width).
         IE hat Schwierigkeiten, <h4> neben das Bild zu setzen */
         width: 340px;
         margin-right: 1px;
         margin-bottom: 5px;
         float: left;
         min-height: 400px;
         border: 1px solid #000000;
         padding-left: 5px;
         }
@media only screen and (max-width: 768px) {.buch
 {       min-height: 100px;
         }
         } /* Ende media screen */


.buch img {
         float:right;
         padding-left: 5px;
         padding-bottom: 5px;
         border: 0;
         }
.buch h4 {/* Für Titel und Autor */
         font-size: 100%;
         text-align: left;
         font-weight: bolder;
         width: 185px; /* sonst setzt IE jede Überschrift nach den Bildern. */
         margin: 0;
         padding: 0;
         border: none;
         }
.buch p  {/* Für zusätzliche Angaben */
         margin-top: 0pt;
/*        margin-left: 150px; */
         margin-right: 10px;
         }

.tf-1    {background-color: #ccffff;} /* blau */
.tf-2    {background-color: #ffffcc;} /* gelb */
.tf-3    {background-color: #ffcccc;} /* rot */
.tf-4    {background-color: #ff8000;} /* orange */
.tf-5    {background-color: #cccccc;} /* grau */
.tf-6    {background-color: #ccffcc;} /* grün */

/* für Zeitungsartikel */
.presse_titel {font-size: 16pt}
.presse_untertitel {font-size: 12pt}
.presse_vortext {font-weight: bold} /* fett */
.presse_text {}
.presse_quelle {font-style: italic} /*kursiv */
.presse_bildunterschrift {font-style: italic} /*kursiv */

.unsichtbar {color: #FFFFFF; }

.test{   border: double; color: #000000;
         border-style: solid; }

/*-----------------------------------   -*/
/*       Access-Keys               2016  */
/*---------------------------------------*/
#acc {
         float: left;
         width: 170px;
         }
@media only screen and (max-width: 768px) {#acc
         {display: none;
         }
         } /* Ende media screen */

#acc ul {
         margin : 5px 0 0 0;
         padding : 0;
         width : 10.3em;
         font-family : verdana, arial, helvetica, sans-serif;
         font-size : 1em;
         text-align : center;
         line-height : 1.1em;
         }
#acc li {
         margin : 0 0.25em 0.25em 0;
         padding : 0;
         border : 1px solid #6f6f6f;
         float : left;
         list-style : none;
         display : block;
         }
#acc li a:link, #acc li a:visited {
         color : #000000;
         background : #d3d3d3;
         padding : 0.25em 1em;
         width : 0.9em;
         display : block;
         text-decoration : none;
         }
#acc li a:hover {
         color : #fffff2;
         background : #bf0000;
         font-weight : bold;
         }
#acc li a:focus, #acc li a:active {
         color : #fffff2;
         background : #000080;
         font-weight : bold;
         }
#acc .acc-n {
         border : 1px dotted #d7e9ff;
         padding : 0.25em 1em;
         width : 0.9em;
         color : #000000;
         background : #fff;
         }
#acc li.acc-logo {
         border : 0;
         width : 6.3em;
         }
#acc .acc-logo a:link, #acc .acc-logo a:visited {
         padding : 0.25em 0 0.25em 0.1em;
         width : 6.1em;
         display : block;
         color : #ff0000;
         background : transparent;
         letter-spacing : 0;
         text-decoration : none;
         border : 1px solid #ffffff;
         }
#acc .acc-logo a:hover, #acc .acc-logo a:focus, #acc .acc-logo a:active {
         background : #d3d3d3;
         text-decoration : underline;
         border : 1px solid #6f6f6f;
         }
#acc strong {
         color : #000080;
         font-variant : small-caps;
         font-weight : bold;
         }
#acc strong em {
         color : #ff0000;
         font-style : italic;
         letter-spacing : 0;
         }
#acc span { /* wird aus dem Sichtfeld geschoben, nicht angezeigt,
         aber von Sprachausgabeprogrammen vorgelesen */
         width : 0;
         position : absolute;
         left : -1000px;
         top : -1000px;
         height : 0;
         overflow : hidden;
         }
#acc p {
         font-size: 100%;
         text-align: left;
/*       padding: 0px;*/
         margin: 0px;}
#acc h2 a { /* Rücknahme oben festgelegter Werte */
         display: block;   /* a.hover markiert über ganze Breite,
          Probleme, wenn sich mehrere <a in <h2> befinden         */
         text-decoration: none;
         color: #000000;        }

#acc h2 a:hover,
#acc h2 a:focus  {
         background-color: #003366;
         border: none;        /* Schattenwirkung, vergrößert bei a:hover das Feld = Unruhe !! */
         color: #ffffff;
         text-decoration: underline;
         }