/*
WERTE AUS DEM ALTEN SYSTEM
BGCOLOR=#FDFDFD
TABLEBGCOLOR=#999999
DESCRBGCOLOR=#6C6C6C
DESCRTEXTCOLOR=#FFFFFF
INPBGCOLOR=#a1a1a1
INPTEXTCOLOR=#000000
BUTTONBGCOLOR=#CCCCCC
VIEWTEXTCOLOR=#000000

HEADFONTSIZE=2
DESCRFONTSIZE=2
DATAFONTSIZE=2
background: linear-gradient(to bottom, #ffe399 0%,#dec785 21%,#dfc989 49%,#e5c469 49%,#b79532 100%);
*/
/* #002776 */
/* linear-gradient(to bottom, rgba(239,239,239,1) 0%, rgba(192,192,192,1) 100%); */
/* Festlegung des standsrdaussehnes von HTML Tags */
/* Formulare */

html {
        /* footer setup */
        position: relative;
        min-height: 100%;

        margin: 0px;
        padding: 0px;
        outline: 0;
        /* background-image:  url(hintergrund.png); */
        /* background-image:  url(/dbsys/images/tatami2-final.jpg); */

        /* background-color: #dfc989; */
        background-color: #ffffff;
        font-family: Arial, helvetica, sans-serif;
    }

body {
    /* footer setup */
    margin: 0 0 30px;
    /* bottom = footer height */
}

footer {
    background-color: #cccccc;
    position: absolute;
    left: 0;
    bottom: 0;
    height: 30px;
    width: 100%;
    overflow: hidden;
}

label {
                font-family: Arial, helvetica, sans-serif;
                font-size: 11pt;
                }

input, textarea {
                font-family: Arial, helvetica, sans-serif;
                font-size: 11pt;
                border-style: solid;
                border-width: 1px;
                border-color: #808080;
                padding: 2px;
                }

select {
                font-family: Arial, helvetica, sans-serif;
                background-color: #ffffff;
                font-size: 11pt;
                }

form { margin:0; padding:0;}

.ddheadline {
        border: 1px solid black;
        background-color: #159f15;
        color: #ffffff;
        font-weight: bold;
        margin: 3px;
        padding: 2px;
    }

.ddcontainer {
        display: flex;
        flex-wrap:  wrap;
        justify-content:    flex-start;
        /* justify-content:    space-around; */
        /* align-items:    stretch; */
        align-items:  flex-start;
        align-content:  flex-start;
    }

.dditem {
        width: 115px;
        height: 130px;
        overflow: hidden;
        margin: 3px;
        padding: 0px;
        border: 1px solid black;
        border-radius: 5px;
        background-color: #f0f0f0;
        /* background: linear-gradient(to bottom, #ffffff 0%,#f6f6f6 47%,#ededed 100%); */
        /* background: linear-gradient(to bottom, #eeeeee 0%,#cccccc 100%); */
    }

/* AJAX Popup */
.popup {
        display: block;
        box-sizing: border-box;
        position: fixed;
        z-index: 100;
        overflow: hidden;
        background: linear-gradient(to bottom, #fcfff4 0%,#e9e9ce 100%);
        border: 1px solid black;
        border-radius: 5px;
        box-shadow: 1px 1px 10px grey;
        margin: 0 auto;
    }

.popupvisible {
        opacity: 1;
        transition: height 0.5s, width 0.5s, opacity 0.5s;
    }

.popuphidden {
        width: 0px;
        height: 0px;
        opacity: 0;
        transition: height 0.5s, width 0.5s, opacity 0.5s;
    }

#popuphead {
        position: relative;
        box-sizing: border-box;
        width: 100%;
        height: 26px;
        background-color: #002776;
    }

#popupclose {
        position: absolute;
        width: 26px;
        right: 0px;
    }

#popupbody {
        position: relative;
        height: calc(100% - 26px);
        box-sizing: border-box;
        overflow: auto;
        padding-top: 5px;
        clear: both;
    }

/* Facebook Login */
.fblogin {
    width: 100%;
    max-width: 450px;
    min-width: 240px;
    /* height: 100px; */
    border: 1px solid black;
    background-color: #f0f2f7;
    border-radius: 5px;
    margin: 0 auto;
    margin-top: 40px;
    overflow: hidden;
}

.fblogin-head {
    position: relative;
    width: 100%;
    height: 25px;
    font-weight: bold;
    padding-left: 20px;
    padding-top: 7px;
    background-color: #3b5998;
    color: #ffffff;
}

.fblogin-body {
    padding: 5px;
    background-color: #f0f2f7;
}

/* Ende Facebook login */


/* Banner Setup */
.bannercontainer {
    width: 100%;
    height: 50px;
    text-align: center;
    background-color: #159f15;
    }

.banner {
    display: block;
    position: relative;
    margin: 0px;
    padding: 0px;
    }

.banner img {
    margin: 0px;
    padding: 0px;
    border: 0px;
    width: 100%
    }

.bannertext {
    font-family: Arial, helvetica, sans-serif;
    font-size: 24px;
    font-weight: bold;
    color: #ffffff;
    position: absolute;
    /* top: 8vmax; */
    top: 10px;
    left: 50px;
    opacity: 1;
    text-shadow:  0.0em 0.0em 0.1em black, 0.0em 0.0em 0.2em black, 0.0em 0.0em 0.3em black, 0.0em 0.0em 0.2em black  ;
    }

.logotext {
        font-family: Arial, helvetica, sans-serif;
        font-size: 24pt;
        font-weight: bold;
        text-align: center;
        color: #f0cf6d;
        opacity: 1;
        text-shadow:  0.0em 0.0em 0.1em black, 0.0em 0.0em 0.2em black, 0.0em 0.0em 0.3em black, 0.0em 0.0em 0.2em black  ;
    }

.logocontainer {
    display: inline-block;
    box-sizing: border-box;
    height: 42px;
    width: 42px;
    margin-top: 5px;
    margin-left: 5px;
    padding: 4px;
    background-color: #f0f0f0;
    float: left;
    border: 1px solid black;
    border-radius: 5px;
    }

/* Allgemeiner Container des Menues */
.pageheader {
   /* Menue immer on top z.b: fuer position = fixed in mobilen umgebungen */

   position: relative;
   z-index: 10;
   /*
   position: sticky;
   top: 0;
   */
}


/* Uebrnommen */
/* -------------------------------------------------------------------------------------------------------------------*/
/* TABLEBGCOLOR Hintergrund tabelle */
.backgroundtable {
            /* background-color:#999999; */
            /* background-color:#ffffff; */
            background: transparent;
            empty-cells:show;
            clear: both;
            /* background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(192,192,192,1) 100%); */
            /* background-image:  url(/dbsys/images/tatami2-final.jpg); */
            }

/* Tabelle in der die headline steht die tabellenzelle hat class .headline */
.headtable {}

/* Ueberschrift */
.headline {
            font-weight:bold;
            font-size:16pt;
            padding: 5px;
            color: #000000;
            background: linear-gradient(to bottom, rgba(239,239,239,1) 0%, rgba(192,192,192,1) 100%);
            text-decoration:none;
            text-align:center;
            /* background: linear-gradient(to bottom, rgba(239,239,239,1) 0%, rgba(192,192,192,1) 100%); */
            /* background: linear-gradient(to top, #b79532 0%, #d4b761 50%, #dfc989 51%, #dec785 78%, #ffffff 100%); */

            /* background: linear-gradient(to top, rgba(183,149,50,1) 0%,rgba(229,196,105,1) 50%,rgba(223,201,137,1) 51%,rgba(222,199,133,1) 79%,rgba(255,227,153,1) 100%); */
/* **** */
            /* background: linear-gradient(to top, #b79532 0%,#e5c469 50%,#dfc989 51%,#dec785 79%,#ffe399 100%); */
            /* background: -webkit-linear-gradient(bottom, #b79532 0%,#e5c469 50%,#dfc989 51%,#dec785 79%,#ffe399 100%); */

            /* border: rgba(192,192,192,1) 1px solid; */
            }


/* classe des <TR> elements einer eingabezeile*/
.inputformrow {}

/* DESCRBGCOLOR, DESCRTEXTCOLOR */
/* .resultheadline = <TR> element feldtitel der ergebnistabelle */
.inputformlabel, .resultheadline, .messagecell {
                color:#ffffff;
                background-color: #159f15;
                font-weight:bold;
                font-size: 11pt;

                /* background: linear-gradient(to bottom, rgba(96,96,96,1) 0%, rgba(32,32,32,1) 100%); */
                /* background: linear-gradient(to top, #000000 0%, #222222 50%, #3c3c3c 51%, #393939 78%, #888888 100%); */
                }

/* beschreibung eines Eingabefeldes */
.inputformlabel { text-align:left;}

.coloroutput {
    box-sizing: border-box;
    margin: 0 auto;
    width: 90%;
    height: 18px;
    border: 0px solid black;
    border-radius: 10px;

}
/* Fehlermeldungstext bei falsch eingegebenen Daten */
.errormessage {
                background-color: #ffffff;
                color: #ff0000;
                margin: 2px;
                padding: 4px;
                border: 1px solid #ff0000;
                border-radius: 5px;
            }

/* tabellenzelle des Eingabefelds */
.inputformcell {
                font-family:Arial, sans-serif;
                font-size:11pt;
                color: #000000;
                background-color: #9f9f9f;
                text-decoration:none;
                text-align:left;
                /* background-color:#938c82; */
                /* background-color: #231d17; */
                /* background: linear-gradient(to bottom, rgba(150,150,150,1) 0%, rgba(128,128,128,1) 100%); */
                /* color: #938c82; */
                }

/* class des <input> elements */
.inputformdata {}

/* single html message */
.messagetable {}

.messagecell  {
                text-decoration:none;
                text-align:center;
                color: #ffffff;
                /* background: linear-gradient(to top, #b79532 0%, #d4b761 50%, #dfc989 51%, #dec785 78%, #ffffff 100%); */
                /* background: linear-gradient(to top, rgba(183,149,50,1) 0%,rgba(229,196,105,1) 50%,rgba(223,201,137,1) 51%,rgba(222,199,133,1) 79%,rgba(255,227,153,1) 100%); */
                /* background: linear-gradient(to top, #b79532 0%,#e5c469 50%,#dfc989 51%,#dec785 79%,#ffe399 100%); */
                /* background: -webkit-linear-gradient(bottom, #b79532 0%,#e5c469 50%,#dfc989 51%,#dec785 79%,#ffe399 100%); */
                }


/* Eingabeform Tabelle mit den Eingabefeldern*/
/* .table1 { background-color:#cc3333; } */
.table1 {
                empty-cells:show;
                }

/* tabelle fuer showresult */
.resulttable {}

/* Ist die class des <TD> elements der feldtitel einer Ergebnistabelle */
.resultheadlinecell { text-align:center; }

/* zeilen einer ergebnistabelle koennen abwechselnt mit hellem und dunklem
 * Hintergrund hintergelgt werden*/
.resultdatarow0 {
                    /* background-color: #cccccc; */
                    background-color: #afafaf;
                    /* background: linear-gradient(to bottom, rgba(224,224,224,1) 0%, rgba(192,192,192,1) 100%); */
                } /*tabellen zeile aus showresult*/

.resultdatarow1 {
                    /* background-color: #aaaaaa; */
                    background-color: #cfcfcf;
                    /* background: linear-gradient(to bottom, rgba(192,192,192,1) 0%, rgba(160,160,160,1) 100%); */
                } /*tabellen zeile aus showresult*/

/* VIEWTEXTCOLOR INPBGCOLOR*/
/* class der <td> eines datenwertes in einer Ergebnistabelle */
.resultdatacell
            {
                text-align:center;
                font-size:10pt;
                /* color:#d6b961; */
                color:#000000;
                text-decoration:none;
            }

/* summen einezelne Spalten in der Tabellenansicht */
.resultdatarow {
                text-align:center;
                font-size:10pt;
                color:#000000;
                text-decoration:none;
                background-color: #ccffcc;
            }

.terminart {
    text-shadow: 0px 0px 2px #ffffff, 0px 0px 2px #ffffff, 0px 0px 3px #ffffff;
}



/* BUTTONBGCOLOR Farbe der Buttonleiste */
/* auessere Tabelle der buttonleiste im kopf einer Tabelle */
.buttontable1, .buttontable2, .pagertable {
                background: linear-gradient(to bottom, rgba(239,239,239,1) 0%, rgba(192,192,192,1) 100%);
                /* background: linear-gradient(to top, #000000 0%, #222222 50%, #3c3c3c 51%, #393939 78%, #888888 100%); */
                /* background: linear-gradient(to bottom, #888888 0%,#393939 22%,#3c3c3c 49%,#222222 50%,#000000 100%); */
                /* background: -webkit-linear-gradient(bottom, #888888 0%,#393939 22%,#3c3c3c 49%,#222222 50%,#000000 100%); */
                empty-cells:show;
                }

/* BUTTONBGCOLOR Umgebungsfarbe der <input type=button> knoepfe */
/* innere Tabelle der buttonleiste im kopf einer Tabelle */
/*.buttontable2 { background-color:#cccccc; empty-cells:show;} */

/* tabellenzelle in der ein knopf gezeigt wird */
/* .buttoncell ist die class des <td> elements der knoepfe in der kopfzeile einer tabelle */
.buttoncell, .pagercell, .resultbuttoncell, .headbuttoncell {
            font-family:Arial, sans-serif;
            font-weight:normal;
            font-size:12pt;
            text-decoration:none;
            text-align:center;
            background: linear-gradient(to bottom, rgba(239,239,239,1) 0%, rgba(192,192,192,1) 100%);
            /* background-image: linear-gradient(to top, #000000 0%, #222222 50%, #3c3c3c 51%, #393939 78%, #888888 100%); */
            /* background-image: radial-gradient( ellipse at 50% 50%, #ffffff 0%, #402b1b 40%); */
            /* background: radial-gradient(circle to center, #231d17 0%, #b79532 20%, #d4b761 50%, #dfc989 51%, #dec785 78%, #ffffff 100%); */
            /* background: linear-gradient(to bottom, rgba(239,239,239,1) 0%, rgba(192,192,192,1) 100%); */
            /* background: linear-gradient(to top, #b79532 0%, #d4b761 50%, #dfc989 51%, #dec785 78%, #ffffff 100%); */
            /* border: rgba(192,192,192,1) 0px solid; */
            }

/* class von <td> eines knopfes in einer zeile der ergebnistabelle */
.resultbuttoncell {
    /* background-color:#231d17; */
    /* background: linear-gradient(to top, #b79532 0%, #d4b761 50%, #dfc989 51%, #dec785 78%, #ffffff 100%); */
    /* background: linear-gradient(to top, rgba(183,149,50,1) 0%,rgba(229,196,105,1) 50%,rgba(223,201,137,1) 51%,rgba(222,199,133,1) 79%,rgba(255,227,153,1) 100%); */
    /* background: linear-gradient(to top, #b79532 0%,#e5c469 50%,#dfc989 51%,#dec785 79%,#ffe399 100%); */
    /* background: -webkit-linear-gradient(bottom, #b79532 0%,#e5c469 50%,#dfc989 51%,#dec785 79%,#ffe399 100%); */

}

/* Knopf zum absenden eines such/eingabe formulars */
.submitbuttoncell {
    background: linear-gradient(to bottom, rgba(239,239,239,1) 0%, rgba(192,192,192,1) 100%);       /* background: linear-gradient(to top, #b79532 0%, #d4b761 50%, #dfc989 51%, #dec785 78%, #ffffff 100%); */
    /* background: linear-gradient(to top, rgba(183,149,50,1) 0%,rgba(229,196,105,1) 50%,rgba(223,201,137,1) 51%,rgba(222,199,133,1) 79%,rgba(255,227,153,1) 100%); */
    /* background: linear-gradient(to top, #b79532 0%,#e5c469 50%,#dfc989 51%,#dec785 79%,#ffe399 100%); */
    /* background: -webkit-linear-gradient(bottom, #b79532 0%,#e5c469 50%,#dfc989 51%,#dec785 79%,#ffe399 100%); */
}

/* Knopfleise im kopf einer Tabelle */
.headbuttoncell {
    /* background-color: none; */
}

/* custom Button als link mit einer tabelle als grafische rumrandung*/
/*.button2 { text-decoration:none; border:10px} */
/*
.button2 a:link, .button2 a:visited, .button2 a:active
{ text-decoration: none; color: #000000; display: block; padding: 2px;}
.button2 a:hover { text-decoration: none; background-color: #ffffff;}
*/
/* button2 ist die class eine Formularabsende buttons z.B. in der ergebnistabelle*/

/* Knopf in der spalte der tabellenueberschrift in der nur knoepfe gezeigt werden */
/* class des input elements vom type button */
.helpbutton {}

/* link zur hilfe => [?] neben den labels der eingabefelder */
/* class des  elements des Helplinks */
.helplink{}

/* Submit Knopf im Formular eingabe oder suche*/
.button2:active  { transform: scale(2); }
.button2 { transition: transform 0.1s; }

.submit1, .button2 {
                font-family:Arial, sans-serif;
                font-size:12pt;
                color:#000000;
                text-decoration:none;
                text-align:center;
                margin: 2px;
                padding: 3px;
                border: #999999 1px solid;
                border-radius: 5px;
                }


.custombuttonborder {
                color: #000000;
                overflow: hidden;
                display: block;
                float: left;
                border: #999999 1px solid;
                margin: 2px;
                }

.custombuttonborder a:link, .button2 a:visited, .button2 a:active {
                text-decoration: none;
                color: #000000;
                display: block;
                padding: 2px;
                }

.custombuttonborder a:hover {
                text-decoration: none;
                background-color: #ffffff;
                }

/* input type range */
.inputrange {
    background: linear-gradient(to right, #bf0000 0%,#e5dd00 50%,#158200 100%);
}


/* ENDE* /

/* ---- Menue ---- */
/* Weiche mobil / desktop */
@media (min-width: 1px) and (max-width: 767px)
{
    /* mobil */

    /* Wenn fixed dann raum einnehmen */
    .pageheader {
    height: 35px; }

    /* Container für das Desktop Banner */
    .bannercontainer {
        display: none;
    }

    .logo-banner-desktop {
        display: none;
    }

    .logo-banner-mobile {
        display: inline-block;
        margin-top: 35%;
        z-index: 0;
    }

    /* Container DIV fuer desktop menue */
    .desktopmenue {
        display: none;
        }

    /* Container DIV fuer mobile menue */
    .mobilemenue {
        position: absolute;
        display: table-row;
        left: 0px;
        top: 0px;
        z-index: 10;
        }
    /* Handle Mobile Menue von Rechts */
    .rhandle {
        display: inline-block;
        }
    .slidecontainer {
        display: inline-block;
        }

    .mobilebanner {
        position: fixed;
        top: 0px;
        display: block;
        width: 100%;
        height: 30px;
        /* background: linear-gradient(to top, rgba(183,149,50,1) 0%,rgba(229,196,105,1) 50%,rgba(223,201,137,1) 51%,rgba(222,199,133,1) 79%,rgba(255,227,153,1) 100%); */
        /* background: linear-gradient(to top, #b79532 0%,#e5c469 50%,#dfc989 51%,#dec785 79%,#ffe399 100%); */
        /* background: -webkit-linear-gradient(bottom, #b79532 0%,#e5c469 50%,#dfc989 51%,#dec785 79%,#ffe399 100%); */
        color: #ffffff;
        background-color: #159f15;
        text-align: center;
        vertical-align: middle;
        font-weight: bold;
    }

    .popup {
        top: 0px;
        left: 0px;
    }

    .popupvisible {
        width: 100%;
        height: 100%;
    }

}

@media (min-width: 768px)
{
    /* desktop */

    /* Container DIV fuer desktop menue */
    .desktopmenue {
        display: block;
        margin-top: 2px;
        margin-left: 2px;
        }

    /* Container DIV fuer mobile menue */
    .mobilemenue {
        display: none;
        }
    .slidecontainer {
        display: none;
        }
    .rhandle {
        display: none;
        }
    .mobilebanner {
        display: none;
    }

    .logo-banner-desktop {
        display: block;
    }

    .logo-banner-mobile {
        display: none;
    }

    .popup {
        top: 5%;
        left: 5%;
    }

    .popupvisible {
        width: 90%;
        height: 90%;
    }
}

/* Mobil menue LI Style */
.mobilelist {
        position: relative;
        /* display: none; */
        background-color: #ffffff;
        /* background-color: rgba(255,255,255,0.5); */
        min-width: 150px;
        /* min-height: 200px; */
        border: 1px solid black;
        opacity: 1;
        overflow: hidden;
        list-style: none;
        border: 0;
        padding: 0;
        margin: 0;
        margin-left: 2px;
        }

.mobilelist li {
        margin: 2px;
        /* background: linear-gradient(to bottom, rgba(239,239,239,1) 0%, rgba(192,192,192,1) 100%);  */
        /* background: linear-gradient(to top, rgba(183,149,50,1) 0%,rgba(229,196,105,1) 50%,rgba(223,201,137,1) 51%,rgba(222,199,133,1) 79%,rgba(255,227,153,1) 100%); */
        /* background: linear-gradient(to top, #b79532 0%,#e5c469 50%,#dfc989 51%,#dec785 79%,#ffe399 100%); */
        /* background: -webkit-linear-gradient(bottom, #b79532 0%,#e5c469 50%,#dfc989 51%,#dec785 79%,#ffe399 100%); */
        background-color: #159f15;
        /* border: 1px outset #ffffff; */
        width: 100%;
        opacity: 1;
        border: 1px solid black;
        border-radius: 15px;
        padding: 5px;
        padding-left: 10px;
    }

.mobilelist li a:link, .mobilelist li a:visited {
        text-decoration: none;
        font-family: sans-serif;
        font-size: 22px;
        color: #ffffff;
        padding: 0px;
        /* font-weight: bold; */
        display: inline-block;
        width: 100%;
    }

.mobilelist li a:hover, .mobilelist li a:active {
        /* background-color: white; */
        /* background: linear-gradient(to top, #000000 0%, #222222 50%, #3c3c3c 51%, #393939 78%, #888888 100%); */
        /* background: linear-gradient(to bottom, #888888 0%,#393939 22%,#3c3c3c 49%,#222222 50%,#000000 100%); */
        /* background: -webkit-linear-gradient(top, #888888 0%,#393939 22%,#3c3c3c 49%,#222222 50%,#000000 100%); */
        color: #84b919;
        display: inline-block;
        width: 100%;
    }


/* -- DIV fuer das handele zum sichtbar machen des mobil menues -- */
.handle {
        position: relative;
        display: inline-block;
        vertical-align: top;
    }

.handle img {
        border: 0px;
        padding: 0px;
        margin: 0px;
    }

/* Handle Mobile Menue von Rechts */
.rhandle {
    /* position: absolute; */
    position: fixed;
    top: 2px;
    right: 5px;

}

.rhandle img {
        border: 0px;
        padding: 0px;
        margin: 0px;
    }

.slidecontainer {
        box-sizing: border-box;
        /* position: absolute; */
        position: fixed;
        top: 34px;
        right: 0px;
        overflow: hidden;
        padding: 0px;
        border: 0;
        z-index: 10;
    }

.slidecontainer-on {
        width: 100%;
        transition-property: width;
        transition-duration: 0.2s;
        }

.slidecontainer-off {
        width: 0px;
        transition-property: width;
        transition-duration: 0.2s;
        }

.mcontainer {
    box-sizing: border-box;
    width: 100vw;
    border: 0;
    }
/* ende mobile menue von rechts */

/* ---- Desktop Menu LI Style ----- */

/* Bereich rechts ausserhalb des menues */
.desktoplist1 {

    display: block;
    margin: 0;
    margin-bottom: 2px;
    padding: 0px;
    position: relative;
    width: 100%;
    list-style: none;
    height: 42px;
    background-color: #159f15;
    /* background: linear-gradient(to top, #000000 0%, #222222 50%, #3c3c3c 51%, #393939 78%, #888888 100%); */
    /* background: linear-gradient(to top, #b79532 0%, #d4b761 50%, #dfc989 51%, #dec785 78%, #ffffff 100%); */
    /* background: linear-gradient(to top, rgba(183,149,50,1) 0%,rgba(229,196,105,1) 50%,rgba(223,201,137,1) 51%,rgba(222,199,133,1) 79%,rgba(255,227,153,1) 100%); */
    /* background: linear-gradient(to top, #b79532 0%,#e5c469 50%,#dfc989 51%,#dec785 79%,#ffe399 100%); */
    /* background: -webkit-linear-gradient(bottom, #b79532 0%,#e5c469 50%,#dfc989 51%,#dec785 79%,#ffe399 100%); */

}

/* element der menueleiste */
.desktoplist1 li {

    display: block;
    float: left;
    background-color: #159f15;
    /* background: linear-gradient(to top, #000000 0%, #222222 50%, #3c3c3c 51%, #393939 78%, #888888 100%); */
    /* background: linear-gradient(to top, #b79532 0%, #d4b761 50%, #dfc989 51%, #dec785 78%, #ffffff 100%); */
    /* background: linear-gradient(to top, rgba(183,149,50,1) 0%,rgba(229,196,105,1) 50%,rgba(223,201,137,1) 51%,rgba(222,199,133,1) 79%,rgba(255,227,153,1) 100%); */
    /* background: linear-gradient(to top, #b79532 0%,#e5c469 50%,#dfc989 51%,#dec785 79%,#ffe399 100%); */
    /* background: -webkit-linear-gradient(bottom, #b79532 0%,#e5c469 50%,#dfc989 51%,#dec785 79%,#ffe399 100%); */
    padding: 0;
    margin: 0;
}

/* .desktoplist1 li a */
.desktoplist1 li a.menulink
{
    font-size: 14px;
    font-weight:bold;
    display: block;
    float: left;
    color: #ffffff;
    text-decoration: none;
    padding: 14px 22px 0 22px;
    height:28px;
    border-right: 5px solid rgba(255, 255, 255, 0.15);
}

/* .desktoplist1 li a:hover, .desktoplist li a:active */
.desktoplist1 li a.menulink:hover, .desktoplist1 li a.menulink:active
{
    /* background: linear-gradient(to top, #b79532 0%, #d4b761 50%, #dfc989 51%, #dec785 78%, #ffffff 100%); */
    /* background: linear-gradient(to top, #000000 0%, #222222 50%, #3c3c3c 51%, #393939 78%, #888888 100%); */
    /* background: linear-gradient(to bottom, #888888 0%,#393939 22%,#3c3c3c 49%,#222222 50%,#000000 100%); */
    /* background: -webkit-linear-gradient(top, #888888 0%,#393939 22%,#3c3c3c 49%,#222222 50%,#000000 100%); */
    background-color: #84b919;
    color: #ffffff;
}

.desktoplist2
{
    display: block;
    padding: 0px;
    margin: 0;
    margin-bottom: 10px;
    position: relative;
    width: 100%;
    list-style: none;
    height: 42px;
    /* background-color: #231d17; */
    background-color: #159f15;
}

.desktoplist2 li
{
    display: block;
    float: left;
    /* background-color: #231d17; */
    background-color: #159f15;
}


/* .desktoplist2 li a */
.desktoplist2 li a.menulink
{
       font-size: 14px;
       display: block;
       float: left;
       /* color: #938c82; */
       font-weight:bold;
       color: #ffffff;
       text-decoration: none;
       padding: 14px 22px 0 22px;
       height:28px;
       border-right: 5px solid rgba(255, 255, 255, 0.15);
}

/* .desktoplist2 ul li a:hover, .meinmenu2 ul li a:active */
.desktoplist2 li a.menulink:hover, .desktoplist2 li a.menulink:active
{
    background-color: #84b919;
    color: #ffffff;
}

/* ---- Shortcuts ---- */
.shortcutcontainer {
        margin-top: 36px;
        padding: 2px;
    }

.shortcut img {
        margin: 0px;
        padding: 1px;
        /* border: 1px solid black; */
        /* border-radius: 5px; */
    }

.shortcut {
        display: inline-block;
        font-family: Arial, helvetica, sans-serif;
        /* text-shadow:  0.0em 0.0em 0.5em white, 0.0em 0.0em 0.6em white, 0.0em 0.0em 0.6em white; */
        font-size: 10px;
        text-align: center;
        max-width: 72px;
        vertical-align: top;
        padding-bottom: 10px;
        padding-right: 10px;
        padding-top: 2px;
    }

.shortcut div {
    color: #000000;
    font-weight: bold;
    position: relative;
}

/* DATA Anzeige in den Shortcuts */
.shortcut div.shortcutdata {
    position: absolute;
    top: 0px;
    right: 0px;
    display: inline-block;
    padding: 3px;
    border-radius: 50%;
}


/* ---- ENDE Shortcuts ---- */

/* Tooltip output div */
.tooltip {
        display: table;
        max-width: 400px;
        min-width: 250px;
        padding: 2px;
        position: absolute;
        border: 1px solid black;
        left: 10px;
        top: 10px;
        font-family: Arial, helvetica, sans-serif;
        font-size: 10pt;
        font-weight: normal;
        color: black;
        background-color: lightgrey;
        z-index: 1;
}

/* Tooltip icon [?] container div in den Menueleisten*/
.menuedata
{
    position: absolute;
    bottom: -39px;
    right: 6px;
    display: inline-block;
    padding: 2px;
    background-color: red;
    color: white;
    border-radius: 15px;
    font-weight: bold;
    font-size: 12px;
}

.tooltipicon
{
    position: absolute;
    top: 0px;
    right: 4px;
}

/* Bild im Tooltip das die edit funktion aufruft */
.tooltipeditimage
{
    padding-left: 6px;
}


/* DIV STYLE --------------------------------------------------------------------------------------- */

/* ---- Elemente Desktop ---- */
.buttonborder, .buttonborder1, .buttonborder2, .buttonborder3 {
                background: linear-gradient(to bottom, rgba(239,239,239,1) 0%, rgba(192,192,192,1) 100%);
                overflow: hidden;
                display: block;
                float: left;
                border: #000000 0px solid;
                border-radius: 5px;
                margin: 2px;
                margin-right: 5px;
                padding: 0px;}


.menueleiste1 { background-color:#cccccc;
                background: linear-gradient(to bottom, rgba(192,192,192,1) 0%, rgba(112,112,112,1) 100%);
                padding: 6px;
                margin-bottom: 10px;
                position:relative;
                overflow: hidden;
                border-radius: 10px;
                box-shadow: 5px 5px 5px #808080;
                width: 98%;
                opacity:1.0;}

.menueleiste1 a:link, .menueleiste1 a:visited, .menueleiste1 a:active {
                text-decoration: none;
                color: #000000;
                display: block;
                padding: 10px;
                /*border: 1px outset #999999*/ ;}

.menueleiste1 a:hover { text-decoration: none; background-color: #ffffff; }

.menueleiste2 { background-color:#ccccff;
                background: linear-gradient(to bottom, rgba(192,192,192,1) 0%, rgba(112,112,112,1) 100%);
                padding: 6px;
                margin-bottom: 10px;
                border-bottom: #000000 1px solid;
                position:relative;
                overflow: hidden;
                border-radius: 10px;
                box-shadow: 5px 5px 5px #808080;
                width: 98%;
                opacity:1.0;}

.menueleiste2 a:link, .menueleiste2 a:visited, .menueleiste2 a:active {
                text-decoration: none;
                color: #000000;
                display: block;
                padding: 10px;}

.menueleiste2 a:hover { text-decoration: none; background-color: #ffffff; }

/* ---- Elemente mobile ----  DIV Style Menue*/
/* -- DIV fuer das menue -- */
.mmenu {
        position: relative;
        /* display: inline-block; */
        display: none;
        background-color: #D4B761;
        min-width: 150px;
        border: 1px solid black;
        opacity: 1;
        overflow: hidden;
        }

/* -- DIV fuer einen knopf -- */
.mbutton, .mbutton1, .mbutton2, .mbutton3 {
        margin-bottom: 2px;
        background: linear-gradient(to bottom, rgba(239,239,239,1) 0%, rgba(192,192,192,1) 100%);
        border: 1px outset #ffffff;
        width: 100%;
        opacity: 1;
    }

/* -- DIV fuer einen link -- */
.mlink, .mlink1, .mlink2, .mlink3 {
        text-decoration: none;
        font-family: sans-serif;
        font-size: 22px;
        color: black;
        padding: 0px;
        /* font-weight: bold; */
        width: 100%;
    }

/* -- DIV innerhalb des links damit der link volle breite hat -- */
.mlink:active div, .mlink1:active div, .mlink2:active div, .mlink3:active div {
        background-color: white;
    }

/* --------------------------------------------------------------------------- */


/* Homepage Einstellungen */

.homepagecontainer
{
        text-decoration: none;
        font-family: sans-serif;
        font-size: 14pt;
        color: white;
        padding: 20px;
        width: 100%;
}

/* --------------------------------------------------------------------------- */