/*
 FARBEN
 ------
 Die CSS-Vorlagen sind auf 2 Dateien verteilt.
 Zum besseren Handling für Anpassungen speziell in den
 Landesämtern, wurden die BLAUEN Farbtöne in eine separate Datei ausgelagert.
 So sind lediglich hier Anpassungen nötig, um z.B. auf ein grünes Farbschema
 zu wechseln.

Grundsätzlicher Aufbau der Website (NICHT Header & Footer)

<section class=" "class-name" ">
Klassenname zur Orientierung, diese Klasse muß nicht gestylt werden

    <div class="container">
    min- und max-width, Aussenabstände für flex-grid, Abstände oben & unten zum nächsten Container (in der Regel eine <section>), zentrierte Anordnung

        <h3> Headline der <section>

        <div class="flex-grid">
        container definiert den Inhalt als flex-grid (display: flex)

            <div vlass="column-l-"x" cloumn-s-"x">"
            defniert die Anzahl der Spalten für Desktop und Smartphone (Tablet = Smartphone)



Hier der Code ohne Anmerkungen:

<section class=" "class-name" ">
    <div class="container">
        <h3></h3>
        <div class="flex-grid">
            <div class="column-l-"x" cloumn-s-"x">
                ...

            </div>
        </div>
    </div>
</section>
*/


/*/////////// colors ////////////*/
/*
primary colors:
    blue            #2d73b4; / rgba(45,115,180,1);
    turquoise       #82dcdc;
    white           #ffffff;

secondary colors:
    light blue      #d7e1f0;
    dark blue       #143250;
    dark turquoises #5a9696;
    x gray          #f5f5f5;
    light gray      #e1e1e1;
    gray            #a5a5a5;
    dark grey       #2d2d2d;

error:
    red             #fd484e;
*/


/* Reihenfolger der CSS-Deklarationen?
    1. Anordnung,
    2. Aussehen,
    3. Typo,
    4. Abstände ???

Vorschlag von:
https://little-boxes.de/lb1/8.4-die-reihenfolge-der-deklarationen-im-style.html
    1. Positionsangaben des Elements
    2. Eigenschaften für den Inhalt
    3. Eigesnchaften für das Element
*/

/* border-radius: 0.25rem (Ausnahme .stage = border-radius: 0.5rem) */

/* flex-grid nicht optimiert für IE11:
https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/dev-guides/hh673531(v=vs.85)
*/


/*/////////// font ////////////*/
/*
Schrift:    Statis Sans

Schriftschnitte:
- Statis Sans Light
- Statis Sans Regular
- Statis Sans Italic
- Statis Sans SemiBold
- Statis Sans SemiBold Italic
*/
@font-face {
  font-family   : 'Statis Sans';
  src           : url( "../fonts/StatisSans-Light.woff2" ) format( "woff2"    ),
                  url( "../fonts/StatisSans-Light.ttf"   ) format( "ruetype" );
  font-weight   : 200;
  font-style    : normal;
  }
@font-face {
  font-family   : 'Statis Sans';
  src           : url( "../fonts/StatisSans-Regular.woff2" ) format( "woff2"    ),
                  url( "../fonts/StatisSans-Regular.ttf"   ) format( "truetype" );
  font-weight   : 400;
  font-style    : normal;
}
@font-face {
  font-family   : 'Statis Sans';
  src           : url( "../fonts/StatisSans-Italic.woff2" ) format( "woff2" ),
                  url( "../fonts/StatisSans-Italic.ttf"   ) format( "truetype" );
  font-weight   : 400;
  font-style    : italic;
}
@font-face {
  font-family   : 'Statis Sans';
  src           : url( "../fonts/StatisSans-SemiBold.woff2" ) format( "woff2" ),
                  url( "../fonts/StatisSans-SemiBold.ttf"   ) format( "truetype" );
  font-weight   : 600;
  font-style    : normal;
}
@font-face {
  font-family   : 'Statis Sans';
  src           : url( "../fonts/StatisSans-SemiBoldItalic.woff2" ) format( "woff2" ),
                  url( "../fonts/StatisSans-SemiBoldItalic.ttf"   ) format( "truetype" );
  font-weight   : 600;
  font-style    : italic;
}
/*
Schrift:    Fira Mono

Schriftschnitte:
- Statis Sans Regular
- Statis Sans Medium
- Statis Sans Bold
*/
@font-face {
    font-family : 'Fira Mono';
    src         : url( "../fonts/FiraMono-Regular.woff2" ) format( "woff2"    ),
                  url( "../fonts/FiraMono-Regular.ttf"   ) format( "truetype"    );
    font-weight : 400;
    font-style  : normal;
}
@font-face {
    font-family : 'Fira Mono';
    src         : url( "../fonts/FiraMono-Medium.woff2" ) format( "woff2"    ),
                  url( "../fonts/FiraMono-Medium.ttf"   ) format( "truetype"    );
    font-weight : 400;
    font-style  : normal;
}
@font-face {
    font-family : 'Fira Mono';
    src         : url( "../fonts/FiraMono-Bold.woff2" ) format( "woff2"    ),
                  url( "../fonts/FiraMono-Bold.ttf"   ) format( "truetype"    );
    font-weight : 600;
    font-style  : normal;
}


/*/////////// html ////////////*/
/*
16.10.2019
https://wiki.selfhtml.org/wiki/CSS/Selektoren/Universalselektor
Das Sternzeichen „*“ (der Asterisk) ist der Universalselektor. Mit ihm werden alle Elemente in einem Dokument angesprochen.
*/

/* 14.11.2019: https://www.mediaevent.de/css/box-sizing.html */
*, *:before, *:after {
/*
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
*/
  box-sizing: border-box; /* Die Werte width und height enthalten padding und border, aber nicht margin. */
}

html {
    font-family: "Statis Sans", sans-serif;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5rem;
    color: #2d2d2d;
}
/* in der Smartphone-Ansicht sollte die font-size von p ebenfalls 1rem betragen - die folgende einfache Lösung ist daher nur eine Zwischenlösung, die Texte werden zu klein ... */
@media only screen and (max-width: 639px) {
    html {
        font-size: 0.875rem;
    }
}


/*/////////// typo ////////////*/
/* h1 wird ausschließlich im <header> (.stage) verwendet */
h1 {
    font-size: 2.25rem;
    font-weight: 200;
    color: #ffffff;
    text-align: center;
    line-height: 2.75rem;
    margin-top: 0;
    margin-bottom:  0;
}
/* Feintuning */
@media only screen and (max-width: 1023px) {
h1 {
    margin-top: 1rem;
    }
}
/* h2 wird ausschließlich im <header> (.stage) verwendet */
h2 {
    font-size: 1.5rem;
    font-weight: 200;
    color: #ffffff;
    line-height: 2.25rem;
    text-align: center;
    margin-top: 0;
    margin-bottom: 0;
    padding-bottom: 3.125rem;
    }
/* h3 leitet eine <section> ein */
h3 {
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 2.25rem;
    margin-top: 0;
    margin-bottom: 3rem;
}
h3::after {
    display: block;
    content: '';
    width: 3.75rem;
    border-top: 0.1875rem solid #2d2d2d;
    margin-top: 0.75rem;
    }
.h3-lookalike {
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 2.25rem;
}
h4 {
    font-size: 1.75rem;
    font-weight: 200;
    line-height: 2rem;
    margin-top: 3.75rem;
    margin-bottom: 2.25rem;
}
.h4-lookalike {
    font-size: 1.75rem;
    font-weight: 200;
    line-height: 2rem;
    }
h5 {
    font-size: 1.5rem;
    font-weight: 200;
    line-height: 2rem;
    margin-top: 2.25rem;
    margin-bottom: 0.75rem;
    }
.h5-lookalike {
    font-size: 1.5rem;
    font-weight: 200;
    line-height: 1.75rem;
    }
/* h6 würde visuell p entsprechen */
p {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5rem;
    color: #2d2d2d;
    margin-top: 0;
    margin-bottom: 0.75rem;
    }
.margintext {
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.125rem;
    }
.text-aling-center {
    text-align: center;
}


/*/////////// links ///////////*/
a {
    font-weight: 600;
    text-decoration: none;
    }
a:hover {
    text-decoration: underline;
    }
.textlink {
    display: inline-block;
    text-transform: uppercase;
    font-size: 0.96rem;
    letter-spacing: 0.0625rem;
    font-weight: 600;
    }
/*  Unterschied zu .textlink (neben Farbe): letter-spacing */
.textlink-white {
    display: inline-block;
    text-transform: uppercase;
    font-size: 0.96rem;
    color: #ffffff;
    letter-spacing: 0.125rem;
    font-weight: 600;
    }
.strong {
    font-weight: 600;
}
ul {
    padding: 0 0 0 1.125rem;
}
li {
    margin-bottom: 0.5rem;
}


/*/////////// buttons ///////////*/
/*primary button*/
.btn-prim {
    display: flex;
    justify-content: center;
}
.btn-prim a,
.btn-prim button {
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.0625rem;
    font-weight: 600;
    font-size: 0.96rem;
    line-height: 1.5rem;
    border-radius: 0.25rem;
    cursor: pointer;
    padding-top: 0.625rem;
    padding-right: 2.25rem;
    padding-bottom: 0.625rem;
    padding-left: 2.25rem;
}
.btn-prim a:hover,
.btn-prim button:hover {
    text-decoration: none;
}

/*primary button external*/
.btn-prim-ext a::after,
.btn-prim-ext button::after {
    position: relative;
    top: 0.3125rem;
    display: inline-block;
    content: '';
    width: 1.5rem;
    height: 1.5rem;
    background: url("../images/link-button-external-white.svg") no-repeat;
    margin-top: -0.75rem;
    margin-left: 0.75rem;
}
.btn-prim-ext a:hover::after,
.btn-prim-ext button:hover::after {
    background: url("../images/link-button-external-blue.svg") no-repeat;
}
.btn-prim-mono-ext a:hover::after,
.btn-prim-mono-ext button:hover::after {
    background: url("../images/link-button-external-dark-grey.svg") no-repeat;
}
/*secondary button*/
.btn-sec {
    display: flex;
    justify-content: center;
}
.btn-sec a,
.btn-sec button {
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.0625rem;
    font-weight: 600;
    font-size: 0.96rem;
    line-height: 1.5rem;
    border-radius: 0.25rem;
    cursor: pointer;
    padding-top: 0.625rem;
    padding-right: 2.25rem;
    padding-bottom: 0.625rem;
    padding-left: 2.25rem;
}
.btn-sec a:hover,
.btn-sec button:hover {
    text-decoration: none;
}
.btn-sec button:disabled,
.btn-sec button:disabled:hover {
    background-color:   #ffffff;
    color:              #878787;
    cursor:             inherit;
    border:             #878787 2px solid;
}
.btn-sec-ext a::after,
.btn-sec-ext button::after {
    position: relative;
    top: 0.3125rem;
    display: inline-block;
    content: '';
    width: 1.5rem;
    height: 1.5rem;
    background: url("../images/link-secundary-extern.svg") no-repeat;
    margin-top: -0.75rem;
    margin-left: 0.75rem;
}
.btn-sec-ext a:hover::after,
.btn-sec-ext button:hover::after {
    background: url("../images/link-secundary-extern-hover.svg") no-repeat;
}
.btn-sec-mono a,
.btn-sec-mono button {
    color: #2d2d2d;
    border: #2d2d2d 2px solid;
}
.btn-sec-mono a:hover,
.btn-sec-mono button:hover {
    color: #ffffff;
    background-color: #2d2d2d;
}
.btn-sec-mono-ext a::after,
.btn-sec-mono-ext button::after {
    background: url("../images/link-secundary-monochrome-external.svg") no-repeat;
}
/* buttons generally*/
/* füllt die gesamte Breite einer flex-grid Spalte aus */
.btn-flex-grid {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
}


/*/////////// container ///////////*/
.container {
    max-width: 1240px;
    min-width: 320px;
    padding: 1.5rem 2.25rem 1.5rem 2.25rem;
    margin-right: auto; /* zentriert */
    margin-left: auto; /* zentriert */
}
/* setzt margin-top der ersten verwendeten Elemente <h4> und <h5> auf 0, relevant für reine Text-Seiten wie z.B. Kontakt, Webservices, Impressum */
.container h4:first-child,
.container h5:first-child {
    margin-top: 0;
}


/*/////////// flexbox grid ///////////*/
/* 12 columns, column-gab 36px, margin 36px */
/*  info:
    16.10.2019:
    https://blog.kulturbanause.de/2013/07/einfuhrung-in-das-flexbox-modell-von-css/

    "flex: 0 1 8.33%;" bedeutet:
    flex-grow: 0; / Items dürfen nicht größer werden als festgelegt
     flex-shrink: 1; / Items dürfen kleiner werden als festgelegt
     flex-basis: 8.33%; / Größe der Items
*/
.flex-grid {
    display: flex;
    flex-direction: row; /* row = horiziontal */
    margin-right: -1.125rem;
    margin-left: -1.125rem;
}
/* flex-grid-l */
.flex-grid-l-column {
    flex-direction: column;    /* column = vertikal */
}

.column-l-0 {
        flex: 0 1 0%;
        max-width: calc(0% - 2.25rem);
        margin-right: 1.125rem;
        margin-left: 1.125rem;
    }

.column-l-1 {
    flex: 0 1 8.33%;
    max-width: calc(8.333% - 2.25rem);
    margin-right: 1.125rem;
    margin-left: 1.125rem;
}
.column-l-2 {
    flex: 0 1 16.667%;
    max-width: calc(16.667% - 2.25rem);
    margin-right: 1.125rem;
    margin-left: 1.125rem;
}
.column-l-3 {
    flex: 0 1 25%;
    max-width: calc(25% - 2.25rem);
    margin-right: 1.125rem;
    margin-left: 1.125rem;
}
.column-l-4 {
    flex: 0 1 33.333%;
    max-width: calc(33.333% - 2.25rem);
    margin-right: 1.125rem;
    margin-left: 1.125rem;
}
.column-l-5 {
    flex: 0 1 41.667%;
    max-width: calc(41.667% - 2.25rem);
    margin-right: 1.125rem;
    margin-left: 1.125rem;
}
.column-l-6 {
    flex: 0 1 50%;
    max-width: calc(50% - 2.25rem);
    margin-right: 1.125rem;
    margin-left: 1.125rem;
}
.column-l-7 {
    flex: 0 1 58.333%;
    max-width: calc(58.333% - 2.25rem);
    margin-right: 1.125rem;
    margin-left: 1.125rem;
}
.column-l-8 {
    flex: 0 1 66.667%;
    max-width: calc(66.667% - 2.25rem);
    margin-right: 1.125rem;
    margin-left: 1.125rem;
}
.column-l-9 {
    flex: 0 1 75%;
    max-width: calc(75% - 2.25rem);
    margin-right: 1.125rem;
    margin-left: 1.125rem;
}
.column-l-10 {
    flex: 0 1 83.333%;
    max-width: calc(83.333% - 2.25rem);
    margin-right: 1.125rem;
    margin-left: 1.125rem;
}
.column-l-11 {
    flex: 0 1 91.667%;
    max-width: calc(91.667% - 2.25rem);
    margin-right: 1.125rem;
    margin-left: 1.125rem;
}
.column-l-12 {
    flex: 0 1 100%;
    max-width: calc(100% - 2.25rem);
    margin-right: 1.125rem;
    margin-left: 1.125rem;
}


/* flex-grid-l-s */
@media only screen and (max-width: 1023px) {
    .flex-grid {
        flex-direction: column;
    }

    .flex-grid-s-row {
        flex-direction: row;
    }

    .column-s-0 {
        flex: 0 1 0%;
        max-width: calc(0% - 2.25rem);
        margin-right: 1.125rem;
        margin-left: 1.125rem;
    }

    .column-s-1 {
        flex: 0 1 8.333%;
        max-width: calc(8.333% - 2.25rem);
        margin-right: 1.125rem;
        margin-left: 1.125rem;
    }

    .column-s-2 {
        flex: 0 1 16.667%;
        max-width: calc(16.667% - 2.25rem);
        margin-right: 1.125rem;
        margin-left: 1.125rem;
    }

    .column-s-3 {
        flex: 0 1 25%;
        max-width: calc(25% - 2.25rem);
        margin-right: 1.125rem;
        margin-left: 1.125rem;
    }

    .column-s-4 {
        flex: 0 1 33.333%;
        max-width: calc(33.333% - 2.25rem);
        margin-right: 1.125rem;
        margin-left: 1.125rem;
    }

    .column-s-5 {
        flex: 0 1 41.667%;
        max-width: calc(41.667% - 2.25rem);
        margin-right: 1.125rem;
        margin-left: 1.125rem;
    }

    .column-s-6 {
        flex: 0 1 50%;
        max-width: calc(50% - 2.25rem);
        margin-right: 1.125rem;
        margin-left: 1.125rem;
    }

    .column-s-7 {
        flex: 0 1 58.333%;
        max-width: calc(58.333% - 2.25rem);
        margin-right: 1.125rem;
        margin-left: 1.125rem;
    }

    .column-s-8 {
        flex: 0 1 66.667%;
        max-width: calc(66.667% - 2.25rem);
        margin-right: 1.125rem;
        margin-left: 1.125rem;
    }

    .column-s-9 {
        flex: 0 1 75%;
        max-width: calc(75% - 2.25rem);
        margin-right: 1.125rem;
        margin-left: 1.125rem;
    }

    .column-s-10 {
        flex: 0 1 83.333%;
        max-width: calc(83.333% - 2.25rem);
        margin-right: 1.125rem;
        margin-left: 1.125rem;
    }

    .column-s-11 {
        flex: 0 1 91.667%;
        max-width: calc(91.667% - 2.25rem);
        margin-right: 1.125rem;
        margin-left: 1.125rem;
    }

    .column-s-12 {
        flex: 0 1 100%;
        max-width: calc(100% - 2.25rem);
        margin-right: 1.125rem;
        margin-left: 1.125rem;
    }
}

.flex {
    display:       flex;
}
.flex-ai-c  {
    align-items:   center;
}

/*/////////// vertical distances ///////////*/
/* Feintuning der (optischen) Abstände einzelner Elemente */
.mb-0 {
    margin-bottom: 0; /* = 0 px */
}
.mb-0-25 {
    margin-bottom: 0.25rem; /* = 4 px */
}
.mb-0-5 {
    margin-bottom: 0.5rem; /* = 8 px */
}
.mb-0-625 {
    margin-bottom: 0.625rem; /* = 10 px */
}
.mb-0-75 {
    margin-bottom: 0.75rem; /* = 12 px */
    }
.mb-1 {
    margin-bottom: 1rem; /* = 16 px */
    }
.mb-1-25 {
    margin-bottom: 1.25rem; /* = 20 px */
}
.mb-1-5 {
    margin-bottom: 1.5rem; /* = 24 px */
}
.mb-1-75 {
    margin-bottom: 1.75rem; /* = 28 px */
}
.mb-2 {
    margin-bottom: 2rem; /* = 32 px */
}
.mb-2-25 {
    margin-bottom: 2.25rem; /* = 36 px */
}
.mb-3 {
    margin-bottom: 3rem; /* = 48 px */
}
.mb-3-75 {
    margin-bottom: 3.75rem; /* = 60 px */
}
.mb-4-5 {
    margin-bottom: 4.5rem; /* = 72 px */
}
.mb-6 {
    margin-bottom: 6rem; /* = 96 px */
}
.mb-6-75 {
    margin-bottom: 6.75rem; /* = 108 px */
}
.mb-7-5 {
    margin-bottom: 7.5rem; /* = 120 px */
}


.mt-1-5 {
    margin-top: 1.5rem;
}




.pt-0 {
    padding-top: 0;
}



.pb-0 {
    padding-bottom: 0;
}



/*/////////// header ///////////*/
/* setzt margin-bottom der Elemente p und li auf 0 */
header p,
header li
{
    margin-bottom: 0;
}
/* setzt padding-top und padding-bottom der Klasse .container auf 0 */
header .container,
footer .container {
    padding-top: 0;
    padding-bottom: 0;
}


/* logos */
.logos {
}
.logos-container {
    position: relative;
    height: 6.75rem;
}
.logo-destatis-container {
    position: absolute;
    top: 1.5rem;
    left: 1.85rem;
}
.logo-destatis-container-right {
    position:   absolute;
    top:        1.5rem;
    right:      1.85rem;
}

.logo-destatis {
    width: 8.25rem;
    height: auto;
}
.logo-genesisonline {
    position: absolute;
      bottom: -1.875rem;
    z-index: 999;
}
.logo-genesisonline-right {
    position:   absolute;
    bottom:     -1.875rem;
    z-index:    999;
    right:      0rem;
}

.logo-genesisonline div, /* logo-genesisonline auf der Startseite */
.logo-genesisonline a,          /* logo-genesisonline auf allen anderen Seiten */
.logo-genesisonline-right div,  /* logo-genesisonline auf der Startseite */
.logo-genesisonline-right a {   /* logo-genesisonline auf allen anderen Seiten */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 12rem;
    height: 3.75rem;
    border-radius: 0.25rem;
}
.logo-genesisonline a:hover {
    text-decoration: none;
    }
.genesisonline {
    font-family: "Statis Sans", sans-serif;
    font-weight: 600;
    color: #2d2d2d;
    letter-spacing: 0.0625rem;
}


/* nav */
.main-nav {
    display: flex;
    justify-content: flex-end;
    height: 100%;
}
.main-nav-left {
    display: flex;
    justify-content: flex-start;
    height: 100%;
}
.main-nav-items {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    list-style: none;
}
.main-nav-items .login-top,
.main-nav-items .main-nav-item {
    margin-left: 2.25rem;
}
.main-nav-item a {
    font-family: "Statis Sans", sans-serif;
    font-size: 0.875rem;
    font-weight: 600;
}
@media only screen and (max-width: 1023px) {
    .main-nav-items .hide {
        display: none;
}
}
@media only screen and (max-width: 1023px) {
    .main-nav-items .antihide {
        display: block;
}
}
.login a,
.login button {
    border-radius: 0.25rem;
    font-size: 1rem;
    font-weight: 600;
    padding-top: 0.40625rem;
    padding-right: 1rem;
    padding-left: 1rem;
    padding-bottom: 0.40625rem;
}
.login a:hover,
.login button:hover {
    text-decoration: none;
}


/* main-menu */
.main-nav-container {
    display: flex;
    justify-content: flex-end;
    height: 100%;
}
.main-nav-items-container {
    display: flex;
    align-items: center;
    list-style: none;
}
.main-nav-item {
    margin-left: 2.25rem;
}
.main-dropdown-menu-container {
      position: relative;
}
.main-dropdown-menu-btn {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    min-height: 2.25rem;
    border: none;
    background-color: #ffffff;
    padding: 0;
    color: #2d2d2d;
    font-size: 1.25rem;
    font-weight: 600;
    cursor: pointer;
}
.main-dropdown-menu-btn:hover {
    text-decoration: underline;
}
.main-dropdown-menu-btn::before {
    content: '';
    height: 0.875rem;
    width: 1.25rem;
    background: url("../images/burger.svg") no-repeat;
    margin-right: 0.5rem;
}
/* hoverable dropdown */
.main-dropdown-menu {
    position: absolute;
    display: none;
    z-index: 99999;
    left: 0.25rem;
    background-color: #ffffff;
    box-shadow: 0 0 0.5rem #a5a5a5;
    border-radius: 0.25rem;
    list-style-type: none;
    padding: 0.75rem 1.5rem 0.75rem 1.5rem;
    white-space: nowrap;
}
@media only screen and (max-width: 1023px) {
    .main-dropdown-menu {
        left: initial;
        right: 0;
    }
}
.main-dropdown-menu-container:hover .main-dropdown-menu {
    display: block;
}
.main-dropdown-menu-item-primary {
    display: block;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.5rem;
    padding: 0.25rem 0 0.25rem 0;
    margin: 0;
}
.login {
    display: block;
    text-align: center;
    font-weight: 600;
    line-height: 1.5rem;
    border-radius: 0.25rem;
    background-color: initial;
    cursor: pointer;
    background-color: #ffffff;    font-size: 1rem;
    padding: 0.40625rem 1rem 0.40625rem 1rem;
}
.login:hover {
    color: #ffffff;
    text-decoration: none;
}
.main-dropdown-menu-item-secondary {
    display: block;
}



/* stage */
/*
Es gibt zwei Bühnen:
- die Bühne auf der Startseite
- die Bühne auf den übrigen Seiten
*/
.stage {
    max-width: 1440px;
    min-height: 22.5rem; /* 360px */
    border-radius: 0.5rem;
    padding-top: 2.25rem;
    padding-bottom: 2.25rem;
    margin-right: auto;
    margin-left: auto;
}
/* noch nicht optimal */
@media only screen and (max-width: 1440px) {
    .stage {
        border-radius: 0;
        }
    }


/* stage search */
/*
es fehlt noch:
- Lupe (im Suchfeld rechts in Form eines Buttons in "turquoise" )
- evtl. "x" zum löschen des Suchbegriffs
- CSS "Vorschläge der Autovervollständigung"
- ...
*/
.search-box {
    display: flex;
    align-items: center;
    width: 100%;
    height: 3.75rem;
    border-style: none;
    border-radius: 0.25rem;
    font-size: 1.75rem;
    font-style: oblique;
    opacity: 1;
    font-weight: 400;
    padding-right: 0.75rem;
    padding-left: 1.5rem;

}
::-webkit-input-placeholder {opacity: 1;}
::-moz-placeholder {opacity: 1;}
.search-box:focus {
    color: #2d2d2d;
}
/* search */
.stage-headlines-container {
    min-height: 7.5rem;
}
/* Feintuning */
@media only screen and (max-width: 1023px) {
    .stage-headlines-container {
        min-height: 13.25rem;
    }
}
/* Feintuning */
.stage label span {
    color: #ffffff;
    display: inline-block;
    margin-left: -0.125rem;
}


/* top 5 tables */
/* Begrenzung der Zeichenlänge? */
.top5tables p {
    /* entspricht margintext */
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.125rem;
    color: #ffffff;
    margin-top: 2.25rem;
    margin-bottom: 0.5rem;
}
.top5tables-links {
    display: flex;
    flex-wrap: wrap;
}
.top5tables-links a {
    /* entspricht margintext */
    font-size: 0.875rem;
    line-height: 1.125rem;

    color: #ffffff;
    margin-right: 0.75rem;
    margin-bottom: 0.5rem;
}
.top5tables-links a:hover {
    color: #ffffff;
}


/* breadcrumb */
.breadcrumb {
    overflow-x: auto;
    white-space: nowrap;
    padding-top: 0;
    padding-bottom: 0;
    margin-bottom: 1.5rem;
}
.breadcrumb ul {
    display: flex;
    align-items: center;
    border-bottom: 2px solid #e1e1e1;
    list-style: none;
    padding: 1.25rem 0 1.25rem 0;
    margin: 0;
}
.breadcrumb li {
    /* entspricht margintext */
    font-size: 0.875rem;
    line-height: 1.125rem;
    font-weight: 400;
    margin-bottom: 0;
}
.breadcrumb a:after {
    content: '';
    display: inline-block;
    position: relative;
    top: 0.0625rem;
    width: 0.75rem;
    height: 0.75rem;
    background: url("../images/breadcrumb-arrow-test.svg") no-repeat;
    margin: 0 0.5rem;
}
.breadcrumb a {
    /* entspricht margintext */
    font-size: 0.875rem;
    line-height: 1.125rem;
    font-weight: 600;
}


/*/////////// footer ///////////*/
footer p,
footer li{
    margin-bottom: 0;
}
footer {
    margin-top: 1.5rem;
    overflow: auto;
    }
.footer-section-share,
.footer-section-links {
    background-image: linear-gradient(180deg, #2d73b4, #143250);
    }
/* footer: section "share" */
.footer-section-share {
    border-bottom: solid 2px #ffffff;
    }
.footer-section-share a {
    margin-top: 0.8125rem;
    margin-bottom: 0.8125rem;
    }
/* footer: section "links" */
.footer-section-links {
    min-height: 19.5rem;
    padding-top: 1rem;
    }
.footer-section-links ul {
    list-style: none;
    padding: 0;
}


/* footer: section "legalnotice" */
.footer-section-legalnotice p {
    margin-top: 0.8125rem;
    margin-bottom: 0.8125rem;
}
.navcopyright {
    text-align: right;
}
/* Feintuning */
@media only screen and (max-width: 1023px) {
    .genesis-version,
    .copyright {
        text-align: center;
    }
    .genesis-version {
        margin-top: 0.75rem;
    }
    .copyright {
        margin-bottom: 0.75rem;
    }
}
/* Feintuning */
.copyright span {
    vertical-align: -0.125rem;
}


/*/////////// themecards ///////////*/
.themecards {
    margin-bottom: -0.75rem;
    }
.themecard-number-position {
    position: relative;
    margin-bottom: 2.25rem;
}
.themecard-number-container {
    position: absolute;
    top: 0;
    z-index: -999;
    display: flex;
    align-items: center;
     height: 8.75rem;
}
.themecard-number {
    width: 7.5rem;
    font-size: 6.25rem;
    font-weight: 600;
    line-height: 6.25rem;
    text-align: center;
    margin-bottom: 0;
    }
.themecard-link {
    display: block;
    height: 8.75rem;
    box-shadow: 0 0 0.5rem #a5a5a5;
    border-radius: 0.25rem;
    }
.themecard-link:hover {
    box-shadow: 0 0 1rem #a5a5a5;
    }
.themecard-content {
    display: flex;
    align-items: center;
    height: 100%;
    padding-left: 7.5rem;
    }
.themecard-text {
    font-weight: 600;
    line-height: 1.25rem;
    padding-right: 2.25rem;
    margin-bottom: 0;
    }


/*/////////// new data ///////////*/
.new-data {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    }
.new-data .table-list-container a {
    color: #2d2d2d;
    text-decoration: underline;
    }
.new-data .table-list-container a:hover {
    text-decoration: none;
    }
.new-data .textlink {
    color: #2d2d2d;
}
.new-data div .table-list .tr:hover {
    background-color: #ffffff;
}
.new-data div .table-list .td {
    border-bottom: 2px solid #ffffff;
}


/*/////////// div .table-list ///////////*/
/* vorher: div .table-container */
div .table-list-container {
     overflow-x: auto;
    }
/* vorher: div .table */
div .table-list {
    display: table;
    width: 100%;
    border-collapse: collapse;
    }
div .table-list .tcg { /* colgroup */
    display: table-column-group;
    }
div .table-list .tc { /* col */
    display: table-column;
    }
div .table-list .th {
    display: table-header-group;
    font-weight: 600;
    }
div .table-list .tr {
    display:table-row;
    }
div .table-list .tr:hover {
    background-color:#f5f5f5;
    }
div .table-list .td {
    display: table-cell;
    border-bottom: 2px solid #e1e1e1;
    padding-right: 0.75rem;
    padding-left: 0.75rem;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    }
div .table-list .attributes {
    width: 9rem;
    text-align: right;
}
div .table-list .color {
    width: 1.5rem;
}
div .table-list .code-5 {
    width: 5.25rem;
}
div .table-list .code-6 {
    width: 5.5rem;
}
div .table-list .code-8 {
    width: 6.5rem;
}
div .table-list .code-9 {
    width: 7rem;
}
div .table-list .code-10 {
    min-width: 7.5rem;
}
div .table-list .code-11 {
    min-width: 11rem;
}
div .table-list .content {
}
div .table-list .content-long {
    min-width: 40rem;
}
div .table-list .date {
    width: 7.5rem;
}
div .table-list .symbol {
    width: 4.5rem;
}
div .table-list .new {
    width: 8rem;
    text-align: right;
}
div .table-list .type {
    width: 11.5rem;
}
/* entspricht Sortierfunktion von <button> in <table> */
div .table-list .td button {
    display: inline;
    cursor: pointer;
    /* entspricht .th */
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.5rem;
    background-color: initial;
    border: none;
    padding-right: 0;
    padding-left: 0;
}
/* Platzhalter (aufsteigend sortiert) für 3 Zustände: nicht sortiert, aufsteigend sortiert, absteigend sortiert */
div .table-list .td button::after {
    display: inline-block;
    content: '';
    width: 1.375rem;
    height: 0.6875rem;
    margin-left: 0.5rem;
}
div .table-list .td button:hover::after {
    background: url("../images/sort-table-blue.svg") no-repeat;
}


/*// table-retrieval //*/
.table-retrieval h5 {
    margin-top: 0;
    margin-bottom: 0;
}
.table-retrieval p {
    margin-top: 1.5rem;
}
.start-value-retrieval-ml {
    margin-right: 0.25rem;
}
.table-retrieval .start-value-retrieval {
    text-transform: uppercase;
    letter-spacing: 0.1rem;
    font-weight: 600;
    font-size: 0.875rem;
    line-height: 1rem;
    border-radius: 0.25rem;
    cursor: pointer;
    padding-top: 0.125rem;
    padding-right: 0.5rem;
    padding-bottom: 0.125rem;
    padding-left: 0.5rem;
}
.table-retrieval .start-value-retrieval:hover {
    text-decoration: none
}


/*/////////// table-structure ///////////*/
.table-structure div .table-list .tr:hover {
    background-color: initial;
    }
.table-structure div .table-list .td {
    white-space: nowrap;
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
    }
/* padding & border first column (position) */
.table-structure div .table-list .td:first-child {
    padding-left: 0;
    border-bottom: none;
}
.table-structure div .table-list .position-symbol-container {
    position: relative;
}
.table-structure div .table-list .position-symbol {
    position: absolute;
    top: 0.3125rem;
    left: 0.5rem;
    width: 1.75rem;
    height: 1.75rem;
}
.table-structure div .table-list .position {
    width: 6rem;
}
/* entfernt Icon sortieren */
.table-structure div .table-list .td button::after {
    background: initial;
}
.table-structure div .table-list .button-switch button {
    background: url("../images/switch.svg") no-repeat;
    width: 2.625rem;
    height: 2.625rem;
}
.table-structure div .table-list .button-switch button:hover {
    background: url("../images/switch-hover.svg") no-repeat;
}
.table-structure div .table-list .button-switch .td {
    border-bottom: none;
    padding-top: 0.4375rem;
    padding-bottom: 0;
    }
/* checkbox margin */
.table-structure div .table-list .td input {
    margin-right: 0.75rem;
    }
.table-structure div .table-list .select {
    width: 12rem;
}
.table-structure div .table-list .table-structure-select {
    display: block;
    text-align: center;
    text-transform: uppercase;
    color: #ffffff;
    letter-spacing: 0.1rem;
    font-weight: 600;
    font-size: 0.875rem;
    line-height: 1rem;
    border-radius: 0.25rem;
    cursor: pointer;
    padding: 0.125rem 0.5rem 0.125rem 0.5rem;
}
.table-structure div .table-list .table-structure-select:hover {
    text-decoration: none;
}
.table-structure div .table-list .table-structure-select:disabled {
    color: #878787;
    background-color: #ffffff;
    text-decoration: none;
}
.table-structure div .table-list .table-structure-content-order {
    width: 0.75rem;
    height: 0.75rem;
    margin-left: 0.75rem;
    margin-right: 0.75rem;
}


/*/////////// semantic filter ///////////*/
.semantic-filter {
}
.semantic-filter-container {
    margin-top: 1rem;
    margin-bottom: 4.5rem;
}
.semantic-filter legend {
    margin-bottom: 1.5rem;
}
.semantic-filter fieldset {
    margin-bottom: 2.25rem;
}
.semantic-filter-container .btn-sec {
    display: block;
}
.btn-width-8 {
    width: 12rem;
}
.semantic-filter .semantic-filter-options-sec {
    margin-left: 1rem;
}
.semantic-filter .semantic-filter-search-field {
    display: block;
    width: 12rem;
    min-height: 3rem;
    border-radius: 0.25rem;
    font-weight: 600;
    font-style: normal;
    padding: 0 0.5rem 0 0.5rem;
}


/*/////////// cards ///////////*/
.cards {
}
.cards p,
.cards h4 {
    margin-top: 0;
    margin-bottom: 0.75rem;
}
.card-container {
    margin-bottom: 3rem;
}
.card {
    height: 100%;
    border-radius: 0.25rem;
    box-shadow: 0 0 0.5rem #a5a5a5;
    padding: 2.25rem;
    }
.card-info{
    margin-top: 1.5rem;
    min-height: 6rem;
}
.card-list{
    margin-top: 1.5rem;
    min-height: 24rem;
}
.card-btn{
    margin-top: 1.5rem;
}

/*/////////// news ///////////*/
.news ul {
    list-style: none;
    padding-left: 0;
    }
.news li {
    margin-bottom: 3rem;
    }


/*/////////// register ///////////*/
.register .card {
    display: flex;
    flex-direction: column;
}
.register .card h4 {
    margin-bottom: 0.75rem;
}
.register .card ul {
    padding-left: 1rem;
}
.register .card li {
    margin-bottom: 0.75rem;
}
.register .card .textlink {
    color: #2d2d2d;
    margin-top: 0.75rem;
}
.register .card .card-btn-container {
    flex-grow: 1;
    display: flex;
    justify-content: center;
    align-items: flex-end;
}
.register .card .btn-sec {
    margin-top: 0.75rem;
}


/*/////////// themes ///////////*/
/* themes-accordion */
.accordion {
}
.accordion ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.accordion .first-accordion {
    border-top: 2px solid #e1e1e1;
}
.accordion li {
    margin: 0;
}
.accordion-level-1 {
    display: block;
    /* Schriftgröße wird nur hier verwendet! Passt eigentlich nicht in die Typohierachie */
    font-size: 1.25rem;
    font-weight: 400;
    color: #2d2d2d;
    line-height: 1.75rem;
    border-bottom: 2px solid #e1e1e1;
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
    }
.accordion-level-1 .no1 {
    letter-spacing: 1.5rem;
    }
.accordion-level-2 {
    display: block;
    /* Schriftgröße wird nur hier verwendet! Passt eigentlich nicht in die Typohierachie */
    font-size: 1.25rem;
    font-weight: 400;
    color: #2d2d2d;
    line-height: 1.75rem;
    border-bottom: 2px solid #e1e1e1;
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
    margin-left: calc(8.333% + 0.1875rem);
}
.accordion-level-2 .no2 {
    letter-spacing: 1.25rem;
    }
.accordion-level-3 {
    display: block;
    /* Schriftgröße wird nur hier verwendet! Passt eigentlich nicht in die Typohierachie */
    font-size: 1.25rem;
    font-weight: 400;
    color: #2d2d2d;
    line-height: 1.75rem;
    border-bottom: 2px solid #e1e1e1;
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
    margin-left: calc(16.667% + 0.375rem);
}
.accordion-level-3 .no3 {
    letter-spacing: 1rem;
    }
.accordion-level-4 {
    font-size: 1.25rem;
    line-height: 1.75rem;
    display: block;
    border-bottom: 2px solid #e1e1e1;
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
    margin-left: calc(25% + 0.5625rem);
}
.accordion-level-4 .no5 {
    letter-spacing: 0.75rem;
    }
.accordion-level-1:hover,
.accordion-level-2:hover{
    cursor: pointer;
}

.accordion .open {
    padding-right: 5.5rem;
    background: url("../images/accordion-open.svg") no-repeat;
    background-size: 1.875rem;
    background-position: right;
}

.accordion .open:hover {
    padding-right: 5.5rem;
    background: url("../images/accordion-open-hover.svg") no-repeat;
    background-size: 1.875rem;
    background-position: right;
}

.accordion .close {
    padding-right: 5.5rem;
    background: url("../images/accordion-close.svg") no-repeat;
    background-size: 1.875rem;
    background-position: right;
}

.accordion .close:hover {
    padding-right: 5.5rem;
    background: url("../images/accordion-close-hover.svg") no-repeat;
    background-size: 1.875rem;
    background-position: right;
}

/*/////////// Eigenschaften-Dialoge ///////////*/
/* Feintuning */
@media only screen and (max-width: 1023px) {
    .properties-dialog h3 {
        margin-bottom: 3rem;
    }
}
.properties-dialog h4 {
    margin-bottom: 1.5rem;
}
.properties-dialog h5 {
    margin: 0;
}
.properties-dialog .mb-1-5 {
    margin-bottom: 1.5rem;
}
.properties-dialog .accordion-level-4 {
    margin-left: 0;
}
.properties-dialog .accordion-level-4 .no10 {
    letter-spacing: 0.75rem;
    }


/* link-list */
.link-list ul {
    list-style: none;
    padding-left: 0;
}
.link-list ul:first-child {
    border-top: 0.125rem solid #e1e1e1;
}
.link-list li {
    border-bottom: 2px solid #e1e1e1;
    padding-top: 1.625rem;
    padding-bottom: 1.625rem;
}


/* form */
form fieldset {
    border: none;
    padding: 0;
}
form fieldset legend {
    /* entspricht h5 */
    font-size: 1.5rem;
    font-weight: 200;
    color: #2d2d2d;
    line-height: 1.75rem;
}
form ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
form label {
    line-height: 1.5rem;
}


/* form-input-field */
.form-input-field {
    width: 100%;
    min-height: 3rem;
    border-radius: 0.25rem;
    padding: 0 0.5rem 0 0.5rem;
}
.form-input-field-error {
    border: #fd484e 3px solid;
}
.form-input-field-error:hover,
.form-input-field-error:focus {
    border: #fd484e 2px solid;
}
.testtestbutton {
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.0625rem;
    font-weight: 600;
    border-radius: 0.25rem;
    padding: 0.75rem 2.25rem 0.75rem 2.25rem;
}
.testtestbutton:hover {
    text-decoration:    none;
}


/*/////////// table-result ///////////*/
.table-result {
}
.table-result-container {
    min-width:      320px;
    margin-right:   auto; /* zentriert */
    margin-left:    auto; /* zentriert */
}
.table-result .table-overflow {
    overflow: auto;
    max-height: 90vh;
}
@media only screen and (max-width: 1023px) {
    .table-result .table-overflow {
        max-height: 100%;
    }
}


/* table options */
.table-options {
}
.table-options .container {
    padding-top: 0;
    padding-bottom: 0;
}

@media only screen and (max-width: 1023px) {
    .hide {
        display: none;
    }
}
/* hide & show */
.hide-l {
        display: none;
    }
@media only screen and (max-width: 1023px) {
    .show-s {
    display: block;
    }
}
.show-l {
    display: block;
}
@media only screen and (max-width: 1023px) {
    .hide-s {
    display: none;
    }
}

.table-options .downloads,
.table-options .options {
    display: flex;
    align-items: center;
}

@media only screen and (max-width: 1023px) {
    .table-options .downloads,
    .table-options .options {
        display: block;
        margin-bottom: 0.75rem;
    }
}

.table-options .tab {
    margin-right: 0.75rem;
}

@media only screen and (max-width: 1023px) {
    .table-options .tab {
        margin-right: initial;
        width: 6rem;
    }
}

.table-options p {
    margin-top: 0;
    margin-bottom: 0.5rem;
}

.table-options button {
    border: 0;
    background-color: initial;
    width: 2.25rem;
    height: 2.25rem;
    cursor: pointer;
    margin-right: 0.75rem;
}

.table-options .xlsx {
    background: url("../images/xlsx.svg") no-repeat;
}
.table-options .xlsx:hover {
    background: url("../images/xlsx-active.svg") no-repeat;
}
.table-options .csv {
    background: url("../images/csv.svg") no-repeat;
}
.table-options .csv:hover {
    background: url("../images/csv-active.svg") no-repeat;
}
.table-options .xml {
    background: url("../images/xml.svg") no-repeat;
}
.table-options .xml:hover {
    background: url("../images/xml-active.svg") no-repeat;
}
.table-options .flat {
    background: url("../images/flat.svg") no-repeat;
}
.table-options .flat:hover {
    background: url("../images/flat-active.svg") no-repeat;
}
.table-options .hide-empty-rows  {
    background: url("../images/hide-empty-rows.svg") no-repeat;
}
.table-options .hide-empty-rows:hover  {
    background: url("../images/hide-empty-rows-active.svg") no-repeat;
}
.table-options .show-empty-rows  {
    background: url("../images/show-empty-rows.svg") no-repeat;
}
.table-options .show-empty-rows:hover  {
    background: url("../images/show-empty-rows-active.svg") no-repeat;
}
.table-options .hide-empty-columns  {
    background: url("../images/hide-empty-columns.svg") no-repeat;
}
.table-options .hide-empty-columns:hover  {
    background: url("../images/hide-empty-columns-active.svg") no-repeat;
}
.table-options .show-empty-columns  {
    background: url("../images/show-empty-columns.svg") no-repeat;
}
.table-options .show-empty-columns:hover  {
    background: url("../images/show-empty-columns-active.svg") no-repeat;
}
.table-options .qualitaetSeparat-einblenden  {
    background: url("../images/show-quality-separate.svg") no-repeat;
}
.table-options .qualitaetSeparat-einblenden:hover  {
    background: url("../images/show-quality-separate-active.svg") no-repeat;
}
.table-options .qualitaetSeparat-ausblenden  {
    background: url("../images/show-quality-together.svg") no-repeat;
}
.table-options .qualitaetSeparat-ausblenden:hover  {
    background: url("../images/show-quality-together-active.svg") no-repeat;
}

.table-options .line {
    background: url("../images/line.svg") no-repeat;
}
.table-options .line:hover {
    background: url("../images/line-active.svg") no-repeat;
}
.table-options .line:disabled {
    background: url("../images/line-grey.svg") no-repeat;
    cursor: initial;
}

.table-options .line-dots {
    background: url("../images/line-dots.svg") no-repeat;
}
.table-options .line-dots:hover {
    background: url("../images/line-dots-active.svg") no-repeat;
}
.table-options .line-dots:disabled {
    background: url("../images/line-dots-grey.svg") no-repeat;
    cursor: initial;
}

.table-options .bar {
    background: url("../images/bar.svg") no-repeat;
}
.table-options .bar:hover {
    background: url("../images/bar-active.svg") no-repeat;
}
.table-options .bar:disabled {
    background: url("../images/bar-grey.svg") no-repeat;
    cursor: initial;
}

.table-options .pie {
    background: url("../images/pie.svg") no-repeat;
}
.table-options .pie:hover {
    background: url("../images/pie-active.svg") no-repeat;
}
.table-options .pie:disabled {
    background: url("../images/pie-grey.svg") no-repeat;
    cursor: initial;
}

.table-options .detail {
    background: url("../images/detail.svg") no-repeat;
}

.table-options .detail:hover {
    background: url("../images/detail-active.svg") no-repeat;
}

.table-options .pie-five {
    background: url("../images/pie-five.svg") no-repeat;
}
.table-options .pie-five:hover {
    background: url("../images/pie-five-active.svg") no-repeat;
}
.table-options .pie-all {
    background: url("../images/pie-all.svg") no-repeat;
}
.table-options .pie-all:hover {
    background: url("../images/pie-all-active.svg") no-repeat;
}
.table-options .without-zero {
    background: url("../images/without-zero.svg") no-repeat;
}
.table-options .without-zero:hover {
    background: url("../images/without-zero-active.svg") no-repeat;
}
.table-options .with-zero {
    background: url("../images/with-zero.svg") no-repeat;
}
.table-options .with-zero:hover {
    background: url("../images/with-zero-active.svg") no-repeat;
}
.table-options .classification-2 {
    background: url("../images/classification-2.svg") no-repeat;
}
.table-options .classification-2:hover {
    background: url("../images/classification-2-active.svg") no-repeat;
}
.table-options .classification-2:disabled {
    background: url("../images/classification-2-grey.svg") no-repeat;
    cursor: initial;
}
.table-options .classification-3 {
    background: url("../images/classification-3.svg") no-repeat;
}
.table-options .classification-3:hover {
    background: url("../images/classification-3-active.svg") no-repeat;
}
.table-options .classification-3:disabled {
    background: url("../images/classification-3-grey.svg") no-repeat;
    cursor: initial;
}
.table-options .classification-4 {
    background: url("../images/classification-4.svg") no-repeat;
}
.table-options .classification-4:hover {
    background: url("../images/classification-4-active.svg") no-repeat;
}
.table-options .classification-4:disabled {
    background: url("../images/classification-4-grey.svg") no-repeat;
    cursor: initial;
}
.table-options .classification-5 {
    background: url("../images/classification-5.svg") no-repeat;
}
.table-options .classification-5:hover {
    background: url("../images/classification-5-active.svg") no-repeat;
}
.table-options .classification-5:disabled {
    background: url("../images/classification-5-grey.svg") no-repeat;
    cursor: initial;
}
.table-options .classification-equal-range {
    background: url("../images/classification-equal-range.svg") no-repeat;
}
.table-options .classification-equal-range:hover {
    background: url("../images/classification-equal-range-active.svg") no-repeat;
}
.table-options .classification-equal-frequencies {
    background: url("../images/classification-equal-frequencies.svg") no-repeat;
}
.table-options .classification-equal-frequencies:hover {
    background: url("../images/classification-equal-frequencies-active.svg") no-repeat;
}


/* <table> */
table {
    border-collapse: collapse;
    font-size: 0.875rem;
    line-height: 1.25rem;
}
table a:hover {
    text-decoration: underline;
}
caption {
    font-weight: 600;
    text-align: left;
    border-top: 2px solid #e1e1e1;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}
.th-first-raw {
    text-align: left;
}
th {
    font-weight: 600;
    text-align: center;
    border-collapse: collapse;
    padding: 0.5rem 0.75rem 0.5rem 0.75rem;
}
table button {
    /* entspricht th */
    display: block;
    font-weight: 600;
    border: none;
    cursor: pointer;
    margin-right: auto;
    margin-left: auto;
}
/* Platzhalter (aufsteigend sortiert) für 3 Zustände: nicht sortiert, aufsteigend sortiert, absteigend sortiert */
table th button:after {
    position: relative;
    top: 0.25rem;
    display: block;
    content: '';
    width: 1.375rem;
    height: 0.6875rem;
    margin-bottom: 0.5rem;
}
tr:hover {
    background-color:#f5f5f5;
}
td {
    text-align: right;
    border-right: 0.125rem solid #e1e1e1;
    border-left: 0.125rem solid #e1e1e1;
    padding-top: 0.5rem;
    padding-right: 0.75rem;
    padding-bottom: 0.5rem;
    padding-left: 0.75rem;
}
tr th:first-child,
tr td:first-child {
    border-left: none;
}
tr th:last-child,
tr td:last-child {
    border-right: none;
}
.sub-caption {
    /* entspricht th */
    font-weight: 600;
    text-align: center;
    padding: 0.5rem;
}
/* vorspalte */
tbody td:first-child {
    font-weight: 600;
}
tfoot td {
    text-align: left;
    font-size: 0.75rem;
}


/* dropdown */
.dropdown-menu-container {
    position: relative;
}
@media only screen and (max-width: 1023px) {
    .dropdown-menu-container  {
        margin-bottom: 0.75rem;
    }
    .dropdown-menu-container:last-child  {
        margin-bottom: 0;
    }
}
.dropdown-menu-container button {
    border: none;
    cursor: pointer;
    padding: 0;
    margin-right: 2.25rem;
    display: inline-block;
    text-transform: uppercase;
    font-size: 0.96rem;
    letter-spacing: 0.0625rem;
    font-weight: 600;
}
.dropdown-menu-container button:hover {
    text-decoration: underline;
}
@media only screen and (max-width: 1023px) {
    .dropdown-menu-container button {
        margin-right: 0;
    }
}
.dropdown-menu {
    display: none;
}
.dropdown-menu-container ul {
    position: absolute;
    z-index: 999;
    border-radius: 0.25rem;
    background-color: #ffffff;
    box-shadow: 0 0 0.5rem #a5a5a5;
    list-style: none;
    padding: 0;
    margin: 0;
}
.dropdown-menu-container li {
    display: flex;
    justify-content: space-between;
    white-space: nowrap;
    width: 18rem;
    margin-bottom: 0;
}
.dropdown-menu-container li:hover {
    background-color: #f5f5f5;
}
.dropdown-menu-container li a {
    display: block;
    width: 100%;
    padding: 0.375rem 2.25rem 0.375rem 2.25rem;
}
.dropdown-menu-container .dropdown-checkbox label {
    display: block;
    width: 100%;
    padding: 0.375rem 2.25rem 0.375rem 2.25rem;
}
.dropdown-menu-container .dropdown-checkbox input {
    position: absolute;
    margin-top: -0.375rem;
    right: 2.25rem;
}
.show {
    display:block;
}


/* Klassennamen (in der Regel einer <section>, die nur der Orientierung dienen: */

/*/////////// variables ///////////*/
/* allgemeine Übersichtsseite Merkmale */
.variables {
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/*                        ERGÄNZUNGEN VON C304                  */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.dropdown-content {
    display:            none;
    background-color:   #ffffff;
    box-shadow:         0 0 0.5rem #222222;
    z-index:            99999;
    position:           absolute;
    width:              17.5rem;
    margin-left:        0.75em;
    border-radius:      0.25rem;
}
@media only screen and (max-width: 1023px) {
    .dropdown-content {
       right: 0;
    }
}
.dropdown:hover .dropdown-content {
    display:            block;
}
.high{
    color:              #FF0000;
}
.emph{
    font-weight:        bold;
}
.highEmph{
    font-weight:        bold;
    color:              #FF0000;
}


/* ++++++++++++++++++++++++++++++ */
/* +    Dropzones  Version 1    + */
/* ++++++++++++++++++++++++++++++ */
.DropzoneUp {
    width:                  100%;
    height:                 0.5em;
}
.DropzoneRight {
    width:                  1em;
    height:                 1.65em;
    left:                   98%;
    float:                  right;
}
.DropzoneRightDouble {
    width:                  1em;
    height:                 3.3em;
    left:                   98%;
    float:                  right;
}
.DropzoneDown {
    height:                 0.5em;
    bottom:                 0px;
    clear:                  left;
}
.DropzoneLeft {
    width:                  1em;
    height:                 1.65em;
    float:                  left;
}
.DropzoneLeftDouble {
    width:                  1em;
    height:                 3.3em;
    float:                  left;
}
.wrapperDropzones{
    overflow:               auto;
    height:                 100%;
    padding:                0px;
    display:                block;
}
.droppableCell{
    min-width:              -moz-max-content; /*Firefox*/
    min-width:              -webkit-max-content; /*Chrome, Opera*/
}
.marked {
    background-color:       #FF9900;
}
.grabbable {
    cursor:                 grab;
    cursor:                 -moz-grab;
    cursor:                 -webkit-grab;
    user-select:            none;
    -moz-user-select:       none;
    -webkit-user-select:    none;
    -ms-user-select:        none;
}
.grabbable:active {
    cursor:                 grabbing;
    cursor:                 -moz-grabbing;
    cursor:                 -webkit-grabbing;
    user-select:            none;
    -moz-user-select:       none;
    -webkit-user-select:    none;
    -ms-user-select:        none;
}
.grabbable:hover {
    color:                  white;
    user-select:            none;
    -moz-user-select:       none;
    -webkit-user-select:    none;
    -ms-user-select:        none;
}


/* ++++++++++++++++++++++++ */
/* +   Ergebnistabellen   + */
/* ++++++++++++++++++++++++ */
.ergebnistabelle {
    margin-bottom:          10px;
    margin-left:            1px;
    margin-right:           10px;
    border-collapse:        collapse;
    line-height:            140%;
    font-size:              100%;
}

/* Ergebnistabelle */
caption {
    border:             0;
}
caption {
    margin-right:       10px;
    margin-left:        0px;
    border-width:       1px;
    border-bottom-width:0px;
    border-style:       solid;
    padding:            4px 0 12px 4px;
    text-align:         left;
    background-color:   #FFFFFF;
    font-weight:        bold;
    font-size:          112%;
    border:             0;
}
tfoot{
    border-width:       0px;
    border-collapse:    collapse;
}
.etfoottext{
    width:              100%;
    border-width:       0px;
    border-collapse:    collapse;
    margin-bottom:      10px;
    line-height:        115%;
    padding-top:        12px;
    font-family:        "Fira Mono", monospace;
    font-size:          1em;
}
.etueberschrift{
    border-width:       1px;
    border-style:        solid;
    color:              #000000;
    vertical-align:     middle;
    padding:            2px 2px 2px 4px;
    text-align:         left;
    font-weight:        normal;
}
.etueberschrift input{
    border-width:       0px;
    padding:            0px 0px 0px 0px;
    margin-left:        0px;
    margin-right:       0px;
    text-align:         left;
    font-size:          1em;
}
th.etkopfvorspalte{
    border-width:       1px;
    border-style:       solid;
    color:              #000000;
    vertical-align:     middle;
    padding:            2px;
    text-align:         center;
    font-weight:        normal;
}
th.etkopfvorspalte input{
    border-width:       0px;
    padding:            0px 0px 0px 0px;
    margin-left:        0px;
    text-align:         center;
    font-size:          1em;
}
th.etvorspalte{
    border-width:       1px;
    border-style:       solid;
    color:              #000000;
    vertical-align:     top;
    padding:            2px 2px 2px 4px;
    text-align:         left;
    white-space:        nowrap;
    font-weight:        normal;
}
th.etvorspalte input{
    border-width:       0px;
    padding:            0px 0px 0px 0px;
    margin-left:        0px;
    text-align:         left;
    font-size:          1em;
}
th.etvorspaltedok{
    border-width:       1px;
    border-style:       solid;
    color:              #000000;
    vertical-align:     top;
    white-space:        nowrap;
    padding:            2px 2px 2px 4px;
    text-align:         left;
    font-weight:        normal;
}
th.etvorspaltedok input{
    border-width:       0px;
    padding:            0px 0px 0px 0px;
    margin-left:        0px;
    text-align:         left;
    font-size:          1em;
}
th.etzelledok{
    border-width:       1px;
    border-style:       solid;
    background-color:   #FFFFFF;
    color:              #000000;
    padding:            3px;
    text-align:         right;
    font-size:          100%;
}
td.etvorspalte{
    border-width:       1px;
    border-style:       solid;
    background-color:   #FFFFFF;
    color:              #000000;
    vertical-align:     top;
    padding:            2px 5px 2px 5px;
    text-align:         left;
    font-size:          100%;
}
td.etvorspalte input{
    border-width:       0px;
    padding:            0px 0px 0px 0px;
    margin-left:        0px;
    text-align:         left;
    font-size:          1em;
}
th.etvorspalte-ind1{
    border-width:       1px;
    border-style:       solid;
    color:              #000000;
    vertical-align:     top;
    padding:            2px 2px 2px 15px;
    text-align:         left;
    white-space:        nowrap;
    font-weight:        normal;
}
th.etvorspalte-ind1 input{
    border-width:       0px;
    padding:            0px 0px 0px 0px;
    margin-left:        0px;
    text-align:         left;
    font-size:          1em;
}
th.etvorspalte-ind2{
    border-width:       1px;
    border-style:       solid;
    color:              #000000;
    vertical-align:     top;
    padding:            2px 2px 2px 30px;
    text-align:         left;
    white-space:        nowrap;
    font-weight:        normal;
}
th.etvorspalte-ind2 input{
    border-width:       0px;
    padding:            0px 0px 0px 0px;
    margin-left:        0px;
    text-align:         left;
    font-size:          1em;
}
th.etvorspalte-ind3{
    border-width:       1px;
    border-style:       solid;
    color:              #000000;
    vertical-align:     top;
    padding:            2px 2px 2px 45px;
    text-align:         left;
    white-space:        nowrap;
    font-weight:        normal;
}
th.etvorspalte-ind3 input{
    border-width:       0px;
    padding:            0px 0px 0px 0px;
    margin-left:        0px;
    text-align:         left;
    font-size:          1em;
}
th.etvorspalte-ind4{
    border-width:       1px;
    border-style:       solid;
    color:              #000000;
    vertical-align:     top;
    padding:            2px 2px 2px 60px;
    text-align:         left;
    white-space:        nowrap;
    font-weight:        normal;
}
th.etvorspalte-ind4 input{
    border-width:       0px;
    padding:            0px 0px 0px 0px;
    margin-left:        0px;
    text-align:         left;
    font-size:          1em;
}
th.etvorspalte-ind5{
    border-width:           1px;
    border-style:           solid;
    color:                  #000000;
    vertical-align:         top;
    padding:                2px 2px 2px 75px;
    text-align:             left;
    white-space:            nowrap;
    font-weight:            normal;
}
th.etvorspalte-ind5 input{
    border-width:           0px;
    padding:                0px 0px 0px 0px;
    margin-left:            0px;
    text-align:             left;
    font-size:              1em;
}
th.etvorspalte-ind6{
    border-width:           1px;
    border-style:           solid;
    color:                  #000000;
    vertical-align:         top;
    padding:                2px 2px 2px 90px;
    text-align:             left;
    white-space:            nowrap;
    font-weight:            normal;
}
th.etvorspalte-ind6 input{
    border-width:           0px;
    padding:                0px 0px 0px 0px;
    margin-left:            0px;
    text-align:             left;
    font-size:              1em;
}
th.etvorspalte-ind7{
    border-width:           1px;
    border-style:           solid;
    color:                  #000000;
    vertical-align:         top;
    padding:                2px 2px 2px 105px;
    text-align:             left;
    white-space:            nowrap;
    font-weight:            normal;
}
th.etvorspalte-ind7 input{
    border-width:           0px;
    padding:                0px 0px 0px 0px;
    margin-left:            0px;
    text-align:             left;
    font-size:              1em;
}
th.etvorspalte-ind8{
    border-width:           1px;
    border-style:           solid;
    color:                  #000000;
    vertical-align:         top;
    padding:                2px 2px 2px 120px;
    text-align:             left;
    white-space:            nowrap;
    font-weight:            normal;
}
th.etvorspalte-ind8 input{
    border-width:           0px;
    padding:                0px 0px 0px 0px;
    margin-left:            0px;
    text-align:             left;
    font-size:              1em;
}
th.etvorspalte-ind9{
    border-width:           1px;
    border-style:           solid;
    color:                  #000000;
    vertical-align:         top;
    padding:                2px 2px 2px 135px;
    text-align:             left;
    font-size:              100%;
}
th.etvorspalte-ind9 input{
    border-width:           0px;
    padding:                0px 0px 0px 0px;
    margin-left:            0px;
    text-align:             left;
    font-size:              1em;
}
th.etkopfzeile{
    border-width:           1px;
    border-style:           solid;
    color:                  #000000;
    vertical-align:         middle;
    padding:                5px;
    text-align:             center;
    font-weight:            normal;
}
th.etkopfzeile input{
    border-width:           0px;
    padding:                0px 0px 0px 0px;
    margin-left:            0px;
    vertical-align:         middle;
    text-align:             center;
    font-size:              1em;
}
.etuntertitel{
    border-width:           1px;
    border-style:           solid;
    text-align:             left;
    font-weight:            normal;
    font-size:              100%;
}
.etuntertitel input{
    border-width:           0px;
    padding:                0px 0px 0px 0px;
    margin-left:            0px;
    text-align:             left;
    background-color:       #FFFFFF;
    font-size:              1em;
}
.etzwischentitel{
    border-width:           1px;
    border-style:           solid;
    text-align:             left;
    font-weight:            normal;
    font-size:              100%;
}
.etzwischentitel input{
    border-width:           0px;
    padding:                0px 0px 0px 0px;
    margin-left:            0px;
    text-align:             left;
    background-color:       #FFFFFF;
    font-size:              1em;
}
.etzelle{
    border-width:           1px;
    border-right-style:     solid;
    border-left-style:      none;
    border-top-style:       none;
    border-bottom-style:    none;
    background-color:       #FFFFFF;
    border-color:           #E1E1E1;
    color:                  #000000;
    padding:                3px;
    text-align:             right;
    font-size:              100%;
    white-space:            nowrap;
}
p.etfussnote{
    margin-top:         2.0em;
    background-color:   #FFFFFF;
    color:              #000000;
    text-align:         left;
    font-family:        "Fira Mono", monospace;
    font-size:          100%;
}
.ethinweiskurz{
    border-width:       1px;
    background-color:   #FFFFFF;
    color:              #FF0000;
    padding-top:        1.0em;
    padding:            5px;
    text-align:         left;
    font-weight:        bold;
    font-size:          100%;
}
.etlinkcomplete a:link{
    font-size:          100%;
    text-decoration:    none;
    }
.etlinkcomplete a:visited{
    font-size:          100%;
    text-decoration:    none;
    }
.etlinkcomplete a:hover{
    font-size:          100%;
    text-decoration:    underline;
    }
.copyright{
    background-color:   #FFFFFF;
    color:              #606060;
    line-height:        140%;
    font-size:          90%;
    z-index:            8;
}


/*/////////// cube-structure ///////////*/
.cube-structure div .table-list {
    font-size:          1rem;
}

.cube-structure div .table-list .tr:hover {
    background-color:   initial;
    }


.cube-structure div .table-list .td {
    white-space:        nowrap;
    padding-top:        0.75rem;
    padding-bottom:     0.75rem;
    }


/* entfernt Icon sortieren */
.cube-structure div .table-list .td button::after {
    background:         initial;
}

.cube-structure div .table-list .button-switch button {
    background:         url("../images/switch.svg") no-repeat;
    width:              3rem;
    height:             3rem;
}

.cube-structure div .table-list .button-switch button:hover {
    background:         url("../images/switch-hover.svg") no-repeat;
}

.cube-structure div .table-list .button-switch .td {
    border-bottom:      none;
    padding-top:        0.4375rem;
    padding-bottom:     0;
    }

/* checkbox margin */
.cube-structure div .table-list .td input {
    margin-right:       0.75rem;
    }

.cube-structure div .table-list .select {
    width:              12rem;
}

.cube-structure div .table-list .cube-structure-select {
    display:            block;
    text-align:         center;
    text-transform:     uppercase;
    letter-spacing:     0.1rem;
    font-weight:        600;
    font-size:          0.875rem;
    line-height:        1rem;
    border-radius:      0.25rem;
    cursor:             pointer;
    padding-top:        0.125rem;
    padding-bottom:     0.125rem;
}

.cube-structure div .table-list .cube-structure-select:hover {
    text-decoration:    none;
}

.cube-structure div .table-list .cube-structure-select:disabled {
    color:              #878787;
    background-color:   #ffffff;
    text-decoration:    none;
}

.cube-structure div .table-list .cube-structure-content-order {
    width:              0.75rem;
    height:             0.75rem;
    margin-left:        0.75rem;
    margin-right:       0.75rem;
}


/* SUCHBEGRIFFE: Box mit Vorschlägen*/
.suchanweisung_vorschlag ul{
    position:           absolute;
    margin:             0;
    padding:            0;
    background:         #E7EAEC;
    color:              #000000;
    text-align:         left;
    line-height:        1em;
    border-left:        1px solid #C8CCD0;
    border-right:       1px solid #C8CCD0;
    border-bottom:      1px solid #C8CCD0;
    border-radius:      0.25rem;
    box-shadow:         0 0 0.5rem #222222;
    z-index:            99999;
}

.suchanweisung_vorschlag li{
    padding:            1px 0px 1px 5px;
}

.suchanweisung_vorschlag li a{
    color:              dimgrey;
    text-decoration:    none;
    display:            block;
}

.suchanweisung_vorschlag li.selected {
    background:         #C8CCD0;
}

.suchanweisung_vorschlag li.selected a{
    color:              #000000;
    text-decoration:    none;
}

.suchanweisung_vorschlag li a span{
    font-weight:        bold;
    color:              black;
}

.recherche:disabled {
    color:              #878787;
    background-color:   #ffffff;
    text-decoration:    none;
    cursor:             inherit;
}
.recherche:disabled:hover {
    color:              #878787;
    background-color:   #ffffff;
    text-decoration:    none;
    cursor:             inherit;
}

/* COOKIE-BANNER */
 .cookiebanner {
    background-color:   rgba( 117, 117, 117, 0.8);
    border:             none;
    position:           fixed;
    z-index:            1099;
    overflow:           visible;
    bottom:             0px;
    width:              100%;
}
.cookiebannerbox {
    background:         #FFFFFF;
    width:              70%;
    margin:             0 auto;
    position:           relative;
    padding:            10px 10px 10px 10px;
    top:                -15px;
    border-radius:      0.25rem;
    box-shadow:         0 0 0.5rem #a5a5a5;
    max-width:          960px;
}

.cookiebannerbox h2 {
    text-align:         left;
    font-size:          1.8rem;
    font-weight:        300;
    letter-spacing:     0.5px;
    margin-bottom:      20px;
    color:              #333333;
    padding-bottom:     0;
}

.cookiebanner .okbutton a {
    font-weight:        bold;
    padding:            9px 10px;
    border-radius:      5px;
}

.cookiebanner .okbutton a:hover {
    background:         #585858;
}

/* LANGTEXTE */
.langtextH1{
    background-color:       #FFFFFF;
    color:                  #000000;
    margin-top:             0.7em;
    margin-bottom:          0.4em;
    font-family:            "Fira Mono", monospace;
    font-weight:            bold;
    font-size:              1.2em;
    }
.langtext{
    background-color:       #FFFFFF;
    color:                  #000000;
    margin-top:             0px;
    margin-bottom:          0px;
    font-family:            "Fira Mono", monospace;
    font-size:              1em;
    line-height:            115%;
    }
.langtextLI{
    margin-left:        1em;
    padding-left:       1em;
    margin-top:         0px;
    margin-bottom:      0px;
    font-family:        "Fira Mono", monospace;
    list-style-image:   url(../images/langtext_LI.gif);
}


/* Registrierung */
.registrationstep2 input {
    border:             0;
    cursor:             pointer;
    font-weight:        600;
    padding:            0;
}


/* Navigationszeile */
.buttonNavi{
    text-align:         center;
    color:              transparent;
    letter-spacing:     0.0625rem;
    font-weight:        600;
    font-size:          0.96rem;
    background-color:   initial;
    border-radius:      0.25rem;
    border:             0;
    cursor:             pointer;
    padding-top:        0.5rem;
    padding-right:      0.5rem;
    padding-bottom:     0.5rem;
    padding-left:       0.5rem;
    width:              3rem;
}
.forward {
    background:             url("../images/picto_Forward.svg") no-repeat;
    background-size:        2em;
    background-position:    left;
    width:                  2rem;
}
.forward:disabled {
    background:             url("../images/picto_Forward_Disabled.svg") no-repeat;
    background-size:        2em;
    background-position:    left;
    width:                  2rem;
    cursor:                 inherit;
}
.fastforward {
    background:             url("../images/picto_FastForward.svg") no-repeat;
    background-size:        2em;
    background-position:    left;
}
.fastforward:disabled {
    background:             url("../images/picto_FastForward_Disabled.svg") no-repeat;
    background-size:        2em;
    background-position:    left;
    cursor:                 inherit;
}
.rewind {
    background:             url("../images/picto_Rewind.svg") no-repeat;
    background-size:        2em;
    background-position:    right;
    width:                  2rem;
}
.rewind:disabled {
    background:             url("../images/picto_Rewind_Disabled.svg") no-repeat;
    background-size:        2em;
    background-position:    right;
    width:                  2rem;
    cursor:                 inherit;
}
.fastrewind {
    background:             url("../images/picto_FastRewind.svg") no-repeat;
    background-size:        2em;
    background-position:    right;
}
.fastrewind:disabled {
    background:             url("../images/picto_FastRewind_Disabled.svg") no-repeat;
    background-size:        2em;
    background-position:    right;
    cursor:                 inherit;
}

.seitenlaenge {
    text-align:         center;
    letter-spacing:     0.0625rem;
    font-weight:        600;
    font-size:          0.96rem;
    border-radius:      0.25rem;
    cursor:             pointer;
    padding-top:        0.5rem;
    padding-right:      0.5rem;
    padding-bottom:     0.5rem;
    padding-left:       0.5rem;
    width:              3rem;
}
.seitenlaenge:disabled {
    color:              #878787;
    background-color:   initial;
    cursor:             inherit;
    border-color:       #878787;
}
/* WIKI-Formatierung */
.spacer {
margin-left:            1em;
}
.text_fett {
font-weight:            bold;
}
.text_kursiv {
font-style:             italic;
}
.wikiH2 {
margin-top:             1.5em;
background-color:       #FFFFFF;
font-weight:            bold;
font-size:              100%;
}
.wikiH3 {
margin-top:             1.0em;
background-color:       #FFFFFF;
font-size:              100%;
}
.wikiH4 {
margin-top:             0.5em;
background-color:       #FFFFFF;
font-style:             italic;
font-size:              100%;
}