/*
Cascading Stylesheet für ergovia STEPnova

kompatibel zu Mozilla Firefox 3.x
Bildschirmauflösung 1024 x 768 Pixel

Version: 1.0
Autor: Lars Müller

Inhaltsverzeichnis
------------------

 1. Generelles
 2. Hauptbereich
 3. Fading-Effekt
 4. Login-Seite
 5. Hauptnavigation
 6. Schnellnavigation
 7. Meldungen
 8. Panels
 9. Inhalte
10. Tabellen
11. Listen
12. Reiternavigation
13. Infoleiste und Startmenü
14. Nachrichtenbereich
15. Titel
16. Aktionssymbole
17. Modale Dialoge
18. Datepicker

*/

/*** 1. Generelles ***/
html {

}

body {
    margin: 0;
    font: 62.5% Arial, Helvetica, sans-serif;
    cursor: default;
}

/* stepnova Login-Seiten: */
body.start.stepnova {
    background-position: center top;
    background-repeat: no-repeat;
    background-size: auto, cover;
    background-image: url(../_images/back/login/sn_login.png), radial-gradient(ellipse closest-side, #FFFFFF, #F9F7F4);
}

/* Login - mit Error */
body.start.stepnova.login.error {
    background-size: auto, auto, cover;
    background-image: url(../_images/back/login/sn_03_alert_blank.png), url(../_images/back/login/sn_login.png), radial-gradient(ellipse closest-side, #FFFFFF, #F9F7F4);
}

/* stepfolio Login-Seiten: */
body.start.stepfolio {
    background-position: center top;
    background-repeat: no-repeat;
    background-size: auto, cover;
    background-image: url(../_images/back/login/sf_login.png), radial-gradient(ellipse closest-side, #FFFFFF, #D9F0FB);
}

/* Login - mit Error */
body.start.stepfolio.login.error {
    background-size: auto, auto, cover;
    background-image: url(../_images/back/login/sf_03_alert_blank.png), url(../_images/back/login/sf_login.png), radial-gradient(ellipse closest-side, #FFFFFF, #D9F0FB);
}

img {
    border-style: none;
}

input.pagebutton, button.pagebutton {
    display: none;
}

/*** 2. Hauptbereich ***/
#main {
    min-width: 960px;
    padding-top: 20px;
    padding-left: 20px;
    position: relative;
    padding-right: 0;
}

/*** 3. Fading-Effekt ***/
#fade {
    background: #000;
    opacity: 0.8;
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 2;
}

#fade.opacity-50 {
    opacity: 0.5;
}

#fade.opacity-70 {
    opacity: 0.7;
}

#fade.opacity-90 {
    opacity: 0.9;
    z-index: 200;
}

/*** 4. Login-Seite ***/
div.login {
    position: fixed;
    top: 225px;
    left: 50%;

    height: 209px;
    width: 350px;

    margin-left: -275px;
    padding: 125px 150px 20px 100px;

    cursor: auto;
}

div.login a.password {
    font-size: 10px;
    line-height: 20px;
    color: #8D8D8D;
    text-decoration: underline;
    font-weight: bold;
    font-style: italic;
    margin-left: 10px;
    display: block;
}

div.login a.stepnova {
    position: absolute;
    top: 45px;
    height: 76px;
    width: 300px;
    margin-left: 26px;
}

div.login a.ergovia {
    position: absolute;
    top: -125px;
    height: 50px;
    width: 154px;
    margin-left: 440px;
}

div.login form br {
    clear: left;
}

div.login fieldset {
    margin: 0;
    padding: 0 0 20px;
    border-style: none;
    width: 367px;
}

div.login input {
    vertical-align: middle;
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
}

div.login input.text {
    border: 2px dotted #BDBDBD;
    padding: 1px 2px 2px 7px;
    background: #FFF;
    margin: 0 0 7px;
    width: 354px;
    /* Breite von div.login bzw. umgebenen fieldset minus (Padding + Margin + Border): 337 - 13 = 354 */
    height: 18px;
    color: #7D7D7D;
    font-size: 11px;
    font-weight: bold;
}

div.login input.text:focus, #form input.focus {
    border: 1px solid #9CB40D;
    padding: 2px 3px 3px 8px;
}

div.login input.horizontal {
    border-style: none;
    vertical-align: middle;
    margin: 0 8px 0 6px;
    padding: 0;
    background: none;
    height: 13px;
    width: 13px;
}

div.login div.button {
    float: right;
    width: 142px;
    border: 2px dotted #BDBDBD;
    height: 26px;
    margin-right: -17px;
}

div.login input.button,
div.login button.button {
    width: 138px;
    background: #9CB40D;
    border: none;
    height: 22px;
    padding: 0 0 2px;
    margin: 2px 0 0 2px;
    font-weight: bold;
    color: #FFF;
    font-size: 12px;
    font-style: italic;
    line-height: 20px;
}

body.stepfolio div.login input.button {
    background: #00a6e4;
}

div.login div.text {
    background: #FFF;
    height: 136px;
    width: 300px;
    border: 1px solid #BEC9D5;
    margin-left: 26px;
    padding: 6px 7px;
}

div.login div.error {
    min-height: 30px;
    max-height: 45px;
    padding: 3px 5px;
}

div.login div.forbidden {
    height: 90px;
    width: 355px;
    margin-top: -20px;
    margin-left: 5px;
    padding: 5px 0;
}

div.login div.forbidden p.error {
    color: black;
    font-size: 11px;
    text-align: center;
}

div.login div.forbidden p.error.head {
    font-size: 12px;
    font-weight: bold;
    background: none;
}

/* Servicenavigation */
div.service {
    height: 0;
    top: 125px;
    position: absolute;
}

div.service ul {
    margin: 0;
    padding: 0;
    list-style: none;
    width: 0;
    height: 0;
}

div.service ul li a {
    position: relative;
    height: 18px;
    left: 420px;
    padding: 0 0;
    color: #8D8D8D;
    cursor: pointer;
}

div.service ul li a:visited {
    color: #8D8D8D;
}

div.service ul li a:hover {
    color: #000000;
}

body.stepnova div.service ul li a.selected {
    color: #9CB40D;
}

body.stepfolio div.service ul li a.selected {
    color: #00BBFD;
}

/* stepnova */
div.service li.login a {
    top: -72px;
}

div.service li.datenschutz a {
    top: -51px;
}

div.service li.impressum a {
    top: -33px;
}

div.service li.credits a {
    top: -18px;
}

div.service a {
    font-family: Arial;
    font-size: 12px;
    font-style: oblique;
    font-weight: bold;
}

/* Custom Style für timeline Icon*/
.timeline-icon {
    display: inline-flex;
    justify-content: center;
    width: 50px; /* Set your desired width */
    height: 50px; /* Set your desired height */
    position: relative;
    background: url('../_images/icon/timeline/menu_icon.svg') no-repeat;
    background-size: contain;
    &:focus, &:hover {
        transform: scale(1.1);
    }
}


/* stepfolio */
body.stepfolio div.service li.login a:hover {

}

body.stepfolio div.service li.datenschutz a {

}

body.stepfolio div.service li.impressum a {

}

body.stepfolio div.service li.credits a {

}

/*** 6. Schnellnavigation ***/

div.quick {
    position: absolute;
    width: 75px;
    top: 151px;
    left: -75px;
    z-index: 50;
    padding-right: 20px;
    transition-delay: .5s;
    transition-duration: .3s;
    transition-timing-function: ease-in;
    transition-property: all;
}

div.quick.open {
    left: 0;
}

div.opener {
    width: 20px;
    height: 250px;
    background: rgba(0, 0, 0, .7) url(../_images/back/opener-grid.png) no-repeat left top;
    border-radius: 0 6px 6px 0;
    position: absolute;
    top: 188px;
    left: 0;
    z-index: 25;
    transition-delay: .5s;
    transition-duration: .3s;
    transition-timing-function: ease-in;
    transition-property: all;
}

div.opener.open {
    left: 75px;
}

div.quick.expanded {
    left: 0;
}

div.quick div.icons {
    padding: 14px 0;
    border-radius: 0 2px 2px 0;
    background: rgba(0, 0, 0, .7);
}

div.quick ul {
    margin: 0 auto;
    padding: 0;
    list-style: none;
    width: 36px;
}

div.quick ul.workspaces {
    border-bottom: 1px solid #BBB;
    margin-bottom: 10px;
    padding-bottom: 10px;
}

div.quick ul.areas {
    border-bottom: 1px solid #BBB;
    margin-bottom: 10px;
    padding-bottom: 10px;
}

div.quick li {
    margin: 0;
    padding: 0 0 2px 5px;
}

div.quick li a {
    display: block;
}

div.quick.smallDevices ul {
    width: unset;
}

div.quick.smallDevices li {
    display: inline-block;
}

/*** 7. Meldungen ***/
div.prompt {
    background: url(../_images/back/back_prompt.png) no-repeat left top;
    position: absolute;
    z-index: 60;
    left: -671px;
    top: 437px;
    padding: 1px;
}

#promptContent {
    position: relative;
    z-index: 5;
}

#promptContent .pin {
    color: #FFF;
    font-size: 14px;
    font-style: normal;
}

#promptBG {
    background: rgba(82, 82, 82, .7);
    height: 100%;
    position: absolute;
    top: 1px;
    left: 0;
    right: 32px;
    bottom: 0;
    z-index: 0;
}

div.prompt.expanded {
    left: 0;
}

div.prompt p {
    font-size: 15px;
    line-height: 20px;
    color: #FFF;
    padding: 0 100px 5px;
    font-weight: bold;
    float: left;
    width: 400px;
    margin: 20px 0 0;
    height: 70px;
}

div.prompt p.error {
    background: url(../_images/icon/prompt/icon_error.png) no-repeat right top;
}

div.prompt p.info {
    background: url(../_images/icon/prompt/icon_info.png) no-repeat right top;
}

div.prompt p.success {
    background: url(../_images/icon/prompt/icon_success.png) no-repeat right top;
}

div.prompt div.paging {
    text-align: right;
    clear: left;
    float: right;
    margin-top: 5px;
    margin-right: 10px;
}

div.prompt div.paging input {
    background: url(../_images/elem/elem_paging.png) no-repeat center center;
    height: 9px;
    width: 10px;
    border-style: none;
    vertical-align: middle;
    cursor: pointer;
    padding: 0;
    margin: 0;
}

div.prompt div.paging input.current {
    background: url(../_images/elem/elem_paging_current.png) no-repeat center center;
}

div.prompt div.close {
    margin-top: 5px;
    float: right;
    margin-right: 5px;
    height: 20px;
    width: 20px;
}

div.prompt div.grip {
    float: right;
    margin-top: 2px;
    margin-right: 15px;
}

/*** 8. Panels ***/
#menu {
    color: #FFF;
    float: right;
    /* position: relative; */
    z-index: 50;
}

#menu h2 {
    font-size: 11px;
    font-weight: bold;
    color: #FFF;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%,
    rgba(152, 153, 154, 1) 4%, rgba(133, 134, 135, 1) 8%,
    rgba(105, 107, 107, 1) 29%, rgba(92, 93, 94, 1) 38%,
    rgba(25, 27, 28, 1) 42%, rgba(25, 27, 28, 1) 75%, rgba(0, 0, 0, 1) 79%,
    rgba(0, 0, 0, 0.24) 83%, rgba(0, 0, 0, 0.2) 88%, rgba(0, 0, 0, 0.05) 100%);
    line-height: 20px;
    margin: 0 1px;
    padding: 0 0 5px 9px;
}

#menu span.itemName {
    font-size: 14px;
    font-weight: 700;
    display: block;
    margin: 2px 20px 5px;
    line-height: 16px;
    overflow: hidden;
    white-space: nowrap;
    padding: 0;
}

#menu p.itemData {
    font-size: 11px;
    font-weight: bold;
    margin: 0 20px 3px;
    line-height: 18px;
    padding: 0;
    white-space: nowrap;
    overflow: hidden;
}

#menu p {
    font-size: 11px;
    padding-left: 20px;
    margin: 0;
}

#menu a {
    color: #FFF;
    text-decoration: none;
}

#menu hr {
    display: block;
    height: 1px;
    border-top: 1px solid #FFF;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    margin: 10px 5px 10px 10px;
}

#menu img {
    border-style: none;
}

#menu img.pin {
    float: left;
    margin-right: 5px;
    height: 20px;
    width: 20px;
    display: none;
}

#menu .arrowDiv {
    float: right;
}

#menu .arrowDiv img.pin {
    display: block;
}

#menu .arrowDiv a.concurrent,
#menu .grip a.concurrent {
    width: 20px;
    height: 20px;
    display: inline-block;
}

#menu img.notes {
    height: 16px;
    width: 22px;
    margin-right: 5px;
}

#menu table {
    table-layout: fixed;
    border-style: none;
}

#menu col.clock {
    width: 18px;
}

#menu col.email {
    width: 16px;
}

#menu col.attention {
    width: 6px;
}

#menu col.envelope {
    width: 28px;
}

#menu col.type {
    width: 65px;
}

#menu col.category {
    width: 100px;
}

#menu col.datetime {
    width: 110px;
}

#menu col.priority {
    width: 60px;
}

#menu tr {
    color: #FFF;
}

#menu tr.illness {
    color: #FF6E0A;
}

#menu tr.blind {
    display: none;
}

#menu th {
    font-size: 14px;
    font-weight: bold;
    text-align: left;
    vertical-align: top;
    padding-right: 5px;
    line-height: 18px;
    padding-bottom: 10px;
}

#menu th.filtered {

    background: rgba(190, 252, 48, 0.45);

}

#menu th.icon {
    border-right-style: none;
}

#menu td {
    padding: 0 0 1px 3px;
    font-size: 11px;
    line-height: 14px;
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    height: 14px;
}

#menu td img {
    vertical-align: middle;
}

#menu td.warning {
    color: #F33;
}

#menu td.illness {
    color: #FF6E0A;
}

#menu td.extended {
    border-left: 1px solid #FFF;
    padding-left: 8px;
}

#menu td.filtered {
    background: rgba(190, 252, 48, 0.45);

}

#menu td.icon {
    border-right-style: none;
}

#menu tr:hover td {
    background: #CCD1CA;
    color: #000;
}

#menu tr:hover td.illness, #menu tr.illness:hover td {
    color: #FF6E0A;
}

#menu tr.current td, #menu tr.current:hover td {
    background: #FFF;
    color: #000;
}

#menu form {
    margin: 0;
    padding: 0;
    color: #09F;
}

#menu label {
    font-size: 11px;
    font-weight: bold;
    vertical-align: middle;
    line-height: 20px;
}

#menu select {
    font: 11px Arial, Helvetica, sans-serif;
    background: #FFF;
    border: 1px solid #000;
    padding: 0;
    margin: 0 0 2px;
}

#menu input {
    font: 11px Arial, Helvetica, sans-serif;
    background: #FFF;
    border: 1px solid #000;
    padding: 1px 2px 1px 4px;
    margin: 0;
}

#menu input.check {
    background: none;
    border-style: none;
    margin-left: 10px;
    vertical-align: middle;
    margin-right: 5px;
}

/* schmale Panels */
#menu div.narrow {
    padding-bottom: 7px;
    width: 220px;
    position: absolute;
    right: 7px;
    z-index: 2;
    background-color: #595959;
}

#menu div.narrow div.filter {
    width: 200px;
}

#menu div.narrow div.portrait {
    display: none;
}

#menu div.narrow col.blind {
    width: 0;
    display: block;
}

#menu div.narrow col.measure {
    width: 80px;
}

#menu div.narrow tr.blind {
    display: none;
}

#menu div.narrow td {
    border-right-style: none;
}

#menu div.narrow th {
    border-right-style: none;
}

#menu div.narrow ul.blind {
    display: none;
}

#menu div.narrow span.blind {
    display: none;
}

#menu div.narrow table {
    width: 170px;
}

#menu div.narrow select {
    width: 205px;
}

#menu div.narrow input.search {
    width: 197px;
}

#menu div.narrow div.tree li dl {
    display: none;
}

#menu div.narrow.hybrid div.tree {
    display: none;
}

/* breite Panels */
#menu div.wide {
    width: 350px;
    margin-bottom: 0;
    padding-bottom: 7px;
    position: absolute;
    right: 7px;
    z-index: 2;
    background-color: #595959;
}

#menu div.wide col.measure {
    width: 100px;
}

#menu div.wide div.portrait {
    display: block;
    float: right;
    border: 1px solid #FFF;
    margin-left: 10px;
    height: 80px;
    width: 60px;
}

#menu div.wide div.portrait div.upload {
    padding: 6px;
    margin: 41px -1px -1px;
    background: rgba(0, 0, 0, 0.5);
    display: none;
}

#menu div.wide div.portrait div.upload a {
    font-size: 11px;
    text-decoration: underline;
    background: url(../_images/icon/icon_photo-upload.png) no-repeat right top;
    display: block;
}

#menu div.wide div.portrait:hover div.upload {
    display: block;
}

#menu div.wide table {
    width: 300px;
}

#menu div.wide tr.blind {
    display: block;
}

#menu div.wide select {
    width: 335px;
}

#menu div.wide input.search {
    width: 327px;
}

#menu div.wide div.booking select {
    width: 300px;
}

#menu div.wide div.booking input {
    width: 292px;
}

#menu div.wide.hybrid div.list {
    display: none;
}

/*
#menu div.adminContext.wide.hybrid div.list {
    display: block;
}
*/
#menu div.wide.hybrid div.header {
    display: none;
}

#menu div.wide.hybrid div.list {
    display: none;
}

#menu div.wide.hybrid div.paging {
    display: none;
}

#menu div.adminContext.wide.hybrid div.list {
    display: block;
}

/* extrabreite Panels */
#menu div.extra {
    width: 455px;
}

#menu div.extra table {
    width: 405px;
}

#menu div.extra select {
    width: 440px;
}

#menu div.extra input.search {
    width: 432px;
}

/* selektierte Zeile */
#menu div.selected {
    padding: 0 10px 0 20px;
}

#menu div.selected tr:hover {
    color: #FFF;
    background: none;
}

#menu div.selected td {
    font-size: 14px;
    line-height: 16px;
    font-weight: bold;
    padding: 2px 0 5px 2px;
    height: 16px;
}

#menu div.header {
    padding: 0 6px 0 10px;
}

#menu div.header tr:hover {
    background: none;
}

#menu div.header th {
    font-size: 11px;
    line-height: 16px;
    font-weight: normal;
    padding: 4px 0 0 3px;
    border-bottom: 1px solid #FFF;
    border-right: 1px solid #FFF;
}

#menu div.header th:last-child {
    border-right-style: none;
}

#menu div.header th.ascending {
    background: url(../_images/back/back_menu-ascending.gif) no-repeat center top;
}

#menu div.header th.descending {
    background: url(../_images/back/back_menu-descending.gif) no-repeat center top;
}

#menu div.header a.reset {
    float: right;
}

#menu div.header div.sort {
    background: linear-gradient(to right, rgba(255, 255, 255, 0.93) 0%, rgba(255, 255, 255, 0.93) 100%);
    border: 1px solid #000;
    position: absolute;
    z-index: 2;
    visibility: hidden;
    margin-top: -7px;
    height: 102px;
    width: 146px;
    padding: 8px 16px 0;
    margin-left: -14px;
    color: #000;
}

#menu div.header th:hover div.sort {
    visibility: visible;
}

#menu div.header div.sort label {
    font-size: 11px;
    font-weight: bold;
    display: block;
    margin: 0;
    padding: 0;
    line-height: 20px;
    color: #000;
}

#menu div.header div.sort select {
    width: 148px;
    height: 18px;
}

#menu div.header div.sort input {
    width: 120px;
}

#menu div.header div.sort hr {
    display: block;
    margin: 8px 0 2px;
    padding: 0;
    height: 1px;
    border-top: 1px solid #000;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
}

#menu div.messages td {
    border-right: 1px solid #FFF;
    line-height: 20px;
}

#menu div.messages td:last-child {
    border-right-style: none;
}

/* Inhalte der Panels */
#menu div.data {
    padding: 0 10px 0 20px;
    margin: 0 5px 5px 0;
    overflow: auto;
    height: 45px;
}

#menu div.filter {
    padding: 4px 5px 0 10px;
    margin: 0 5px 10px 0;
}

#menu div.list {
    height: 165px;
    overflow: auto;
    padding: 0 10px;
    margin: 0 5px 0 0;
}

#menu div.bottom {
    height: 20px;
    margin-left: 10px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #FFF;
    margin-right: 5px;
}

#menu div.mode {
    border: 2px solid #FF0;
    margin: -2px -2px 8px;
    z-index: 3;
}

#menu div.mode div.list {
    height: 125px;
}

/* Baumdarstellung */
#menu div.tree {
    margin-left: 10px;
    margin-right: 5px;
    overflow: auto;
    padding-bottom: 5px;
    height: 400px;
}

#menu div.tree ul {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
}

#menu div.tree li {
    margin: 0;
    font-size: 11px;
    line-height: 20px;
    padding: 0 0 0 20px;
    white-space: nowrap;
    display: block;
}

#menu div.tree li span.collapsed {
    float: left;
    height: 10px;
    width: 10px;
    display: block;
    cursor: pointer;
    margin: 5px 0 5px -20px;
}
#menu div.tree li span.collapsed:before {
    content: "\f0da";
}

#menu div.tree li span.expanded {
    float: left;
    height: 10px;
    width: 10px;
    cursor: pointer;
    margin: 5px 5px 5px -20px;
}
#menu div.tree li span.expanded:before {
    content: "\f0d7";
}
#menu div.tree li span.collapsed:before,
#menu div.tree li span.expanded:before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 15px;
    position: relative;
    top: -4px;
    left: 6px;
}

#menu div.tree li a {
    display: block;
    margin-left: -5px;
}

#menu div.tree li a:hover {
    background: #CCD1CA;
    color: #000;
}

#menu div.tree li a.warning {
    color: #F33;
}

#menu div.tree li a.illness {
    color: #FF6E0A;
}

#menu div.tree li a.current {
    color: #000;
    background: #FFF;
}

#menu div.tree li a.current span {
    background-color: #FFF !important;
}

#menu div.tree li a span {
    margin-left: 5px;
    display: block;
    line-height: 20px;
    padding: 0 80px 0 20px;
}

#menu div.tree li a span:hover {
    background-color: #CCD1CA !important;
}

#menu div.tree li a span.node-allgemein {
    background: url(../_images/icon/baum/node_allgemein.png) no-repeat left;
}

#menu div.tree li a span.node-daten {
    background: url(../_images/icon/baum/node_daten.png) no-repeat left;
}

#menu div.tree li a span.node-daten-produkt {
    background: url(../_images/icon/baum/node_daten-produkt.png) no-repeat left;
}

#menu div.tree li a span.node-details {
    background: url(../_images/icon/baum/node_details.png) no-repeat left;
}

#menu div.tree li a span.node-dokument {
    background: url(../_images/icon/baum/node_dokument.png) no-repeat left;
}

#menu div.tree li a span.node-editieren {
    background: url(../_images/icon/baum/node_editieren.png) no-repeat left;
}

#menu div.tree li a span.node-gruppe {
    background: url(../_images/icon/baum/node_gruppe.png) no-repeat left;
}

#menu div.tree li a span.node-gruppe-dyn {
    background: url(../_images/icon/baum/node_gruppe-dyn.png) no-repeat left;
}

#menu div.tree li a span.node-kurs {
    background: url(../_images/icon/baum/node_kurs.png) no-repeat left;
}

#menu div.tree li a span.node-ordner {
    background: url(../_images/icon/baum/node_ordner.png) no-repeat left;
}

#menu div.tree li a span.node-ordner-offen {
    background: url(../_images/icon/baum/node_ordner-offen.png) no-repeat left;
}

#menu div.tree li a span.node-root {
    background: url(../_images/icon/baum/node_root.png) no-repeat left;
}

#menu div.tree li a span.node-spezial {
    background: url(../_images/icon/baum/node_spezial.png) no-repeat left;
}

#menu div.tree li a span.node-standort {
    background: url(../_images/icon/baum/node_standort.png) no-repeat left;
}

#menu div.tree li a span.node-vorlage {
    background: url(../_images/icon/baum/node_vorlage.png) no-repeat left;
}

#menu div.tree li dl {
    float: right;
    display: block;
    margin-right: -80px;
}

#menu div.tree li dt {
    text-align: right;
    width: 20px;
    border-right: 1px solid #CCD1CA;
    display: block;
    float: left;
    padding-right: 5px;
}

#menu div.tree li dt:last-child {
    border-right-style: none;
}

#menu div.paging ul {
    margin: 5px 0 0 5px;
    padding: 0;
    list-style: none;
    text-align: center;
}

#menu div.paging li {
    font-size: 11px;
    line-height: 15px;
    margin: 0;
    padding: 0;
    display: inline;
}

#menu div.paging li a {
    padding-right: 5px;
    padding-left: 5px;
}

#menu div.paging li a:hover {
    background: #CCC;
    color: #000;
}

#menu div.paging li span.current {
    background: #FFF;
    color: #000;
    padding-right: 5px;
    padding-left: 5px;
}

/* Positionen der Panels */
#panel1 {
    position: absolute;
    top: 10px;
    overflow: hidden;
    height: 105px;
}

#panel2 {
    position: absolute;
    top: 132px;
    overflow: hidden;
    height: 98px;
}

#panel3 {
    position: absolute;
    top: 132px;
}

#panel2 ~ #panel3 {
    position: absolute;
    top: 247px;
}

#panel2 ~ #panel3.adminContext {
    top: 392px;
}

[id^='panel'].narrow.hide {
    width: 0 !important;
    right: 0 !important;
}

#menu .narrow.hide .grip {
    left: unset !important;
    right: 5px !important;
}

#menu .pin {
    float: right;
    margin-right: 5px;
    font-size: 14px;
    font-style: normal;
    margin-top: 3px;
}

#menu .narrow.hide .panelData,
#menu .narrow.hide .filter {
    width: 0;
    overflow: hidden;
    visibility: hidden;
}

/** Muss relativ sein, damit der Reset-Button für SFP die richtige Position hat (absolut) **/
#teilnehmer_list, #kunde_list, #raumeditor_list, #formulareditor_list, #gruppe_list,
#massnahmearteditor_list, #suchprofileditor_list, #ausgabeeditor_list, #kurseditor_list, #vorlagenSelector, #kontakt_list,
#personal_list, #nachrichtenContextListDiv, #leistungsEditorContextListDiv, #benutzer_list, #anwesenheit_gruppe_list, #doku_gruppe_list {
    position: relative;
}

/*** ZU HINTERFRAGEN ***/
#menu div#panel3 table th.icon, #menu div#panel3 table th.icon a {
    vertical-align: middle;
    line-height: 11px;
}

#menu div.wide tr.narrow {
    display: none;
}

#menu div.wide tr.blind {
    display: table-row;
}

#menu div.narrow tr.wide {
    display: none;
}

#menu div.narrow .blind {
    display: none;
}

#menu div.narrow col.blind {
    display: table-column;
}

/*** 9. Inhalte ***/
div.content {
    width: 760px;
}

/*** 10. Tabellen ***/
div.table {
    background: #FFF;
    padding: 5px 8px;
    border: 1px solid #000;
    position: relative;
}

div.table div.data {
    overflow: auto;
    width: 100%;
}

div.table div.dragdrop {
    background: url(../_images/back/back_dragdrop.png) no-repeat right bottom;
}

div.table table {
    table-layout: fixed;
    border-style: none;
}

div.table tr {
    color: #000;
}

/* Tabellenüberschriften */
div.table th {
    font-size: 11px;
    text-align: left;
    font-weight: normal;
    padding: 0 5px;
    border-bottom: 1px solid #000;
    border-right: 1px solid #000;
    height: 20px;
    line-height: 20px;
    white-space: nowrap;
    overflow: hidden;
}

div.table th.actionIcon {
    text-align: center;
}

th.actionIcon .fas.fa-save {
    border: 1px solid rgb(0, 0, 0);
    padding: 1px;
}

div.table th.last {
    border-right-style: none;
}

div.table th.ascending {
    background: url(../_images/elem/elem_sort-ascending.png) no-repeat center top;
}

div.table th.descending {
    background: url(../_images/elem/elem_sort-descending.png) no-repeat center top;
}

div.table th.filtered {
    background: #BF3 no-repeat center top;
}

div.table th.filtered.ascending {
    background-image: url(../_images/elem/elem_filter-ascending.png);
}

div.table th.filtered.descending {
    background-image: url(../_images/elem/elem_filter-descending.png);
}

div.table th a {
    color: #000;
    text-decoration: none;
    display: block;
}

/* Tabellenzellen */
div.table td {
    font-size: 11px;
    border-right: 1px solid #000;
    line-height: 20px;
    padding: 0 5px;
    white-space: nowrap;
    overflow: hidden;
}

div.table td.last {
    border-right-style: none;
}

div.table td.filtered {
    background: #BF3;
}

div.table tr:hover td {
    background: #EEE;
}

div.table tr.active td {
    background: #666;
    color: #FFF;
}

div.table tr td {
    -moz-user-select: none;
}

/* Sortierungsdialog */
div.table div.sort {
    background: linear-gradient(to right, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.95) 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border: 1px solid #000;
    height: 97px;
    margin-left: -8px;
    margin-top: -3px;
    padding: 3px 10px 0;
    position: absolute;
    visibility: hidden;
    width: 146px;
    z-index: 2;
}

div.table th:hover div.sort {
    visibility: visible;
}

/*** 11. Listen ***/
#list {
    background: linear-gradient(rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.5) 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);

    margin-bottom: 15px;
    width: 710px;
    height: 175px;
    padding: 15px 20px 0 20px;

    box-shadow: 6px 7px 11px -4px rgba(0, 0, 0, 0.45);
}

#list.expanded {
    height: 560px;
}

#list.expanded:after {
    background: linear-gradient(147deg, rgba(255, 254, 212, 1) 0%,
    rgba(255, 254, 203, 1) 15%, rgba(255, 254, 183, 1) 30%,
    rgba(255, 254, 187, 1) 48%, rgba(255, 254, 177, 1) 68%,
    rgba(248, 245, 162, 1) 85%, rgba(218, 215, 140, 1) 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
    content: "";
    height: 355px;
    left: 20px;
    position: absolute;
    top: 255px;
    width: 750px;
    box-shadow: 0 1px 9px 0 rgba(0, 0, 0, 0.8);
    z-index: -1;
}

#list.expanded:before {
    background: linear-gradient(147deg, rgba(255, 254, 212, 0) 0%,
    rgba(255, 254, 211, 0) 1%, rgba(255, 254, 203, 0) 15%,
    rgba(255, 254, 186, 0) 28%, rgba(255, 254, 183, 0.15) 30%,
    rgba(255, 254, 185, 1) 41%, rgba(255, 254, 187, 1) 48%,
    rgba(255, 254, 177, 1) 68%, rgba(248, 245, 162, 1) 85%,
    rgba(218, 215, 140, 1) 100%);
    content: "";
    box-shadow: 1px 1px 6px -1px rgba(0, 0, 0, 0.8);
    height: 355px;
    left: 22px;
    position: absolute;
    top: 255px;
    width: 750px;
    z-index: -2;
    transform: rotate(-0.8deg);
}

#list h4 {
    font-size: 15px;
    font-weight: bold;
    color: #FFF;
    line-height: 20px;
    padding-bottom: 5px;
    border-bottom: 1px solid #FFF;
    margin: 0 0 15px;
}

#list div.filter {
    float: right;
    margin-bottom: 5px;
}

#list div.filter label {
    font-size: 11px;
    margin-left: 20px;
    margin-right: 5px;
}

#list input {
    font: 11px Arial, Helvetica, sans-serif;
    margin: 0;
}

#list select {
    font: 11px Arial, Helvetica, sans-serif;
    background: #FFF;
    padding: 0;
    border: 1px solid #000;
    width: 140px;
}

#list div.data {
    height: 80px;
}

#list.expanded div.data {
    height: 460px;
}

#list table {
    width: 674px;
}

#list div.sort label {
    font-size: 11px;
    font-weight: bold;
    display: block;
    margin: 0;
    padding: 0;
    line-height: 20px;
}

#list div.sort select {
    width: 148px;
    height: 17px;
}

#list div.sort hr {
    display: block;
    margin: 9px 0 2px;
    padding: 0;
    height: 1px;
    border-top: 1px solid #000;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
}

#list div.expand {
    height: 20px;
    text-align: center;
}

#list div.expand img {
    margin: 6px 0 0;
}

.eingabehilfe:focus {
    outline: dotted 2px rgb(0, 0, 0);
}

.ui-keyboard-keyset button:focus {
    outline: dotted 2px rgb(0, 0, 0);
}

.ui-keyboard-button span:focus {
    outline: dotted 2px rgb(0, 0, 0);
}

/*** 12. Reiternavigation ***/
div.tabs {
    color: #59D;
    display: block;
    margin-top: 3px;
    margin-right: auto;
    margin-left: auto;
}

div.tabs ul {
    margin: 0;
    padding: 0;
    list-style: none;
    position: absolute;
    z-index: 1;
}

div.tabs li {
    float: left;
    padding: 0;
    color: #FFF;
    line-height: 15px;
    white-space: nowrap;
    margin: 0 -30px 0 0;
}

div.tabs li a {
    color: rgba(0, 0, 0, .8);
    text-decoration: none;
    font-weight: bold;
    display: block;
    padding: 0 0 0 30px;
    font-size: 11px;
}

div.tabs li span {
    display: block;
    padding: 11px 30px 4px 0;
}

div.tabs li a:hover {
    color: #000;
}

div.tabs li a.current {
    color: #000;
}

/* einfache Reiterleiste */
div.tabs ul.single {
    height: 30px;
    width: auto;
    padding-left: 10px;
}

div.tabs ul.single li a {
    background: url(../_images/tabs/tabs_single-left.png) no-repeat left top;
}

div.tabs ul.single li span {
    padding-top: 11px;
    background: url(../_images/tabs/tabs_single-right.png) no-repeat right top;
}

div.tabs ul.single li.first a {
    background: url(../_images/tabs/tabs_single-first-left.png) no-repeat left top;
}

div.tabs ul.single li a.current {
    background: url(../_images/tabs/tabs_single-left_current.png) no-repeat left top;
    padding-left: 30px;
}

div.tabs ul.single li a.current span {
    background: url(../_images/tabs/tabs_single-right_current.png) no-repeat right top;
}

/* oberere Reiterleiste */
div.tabs ul.top {
    height: 30px;
    position: absolute;
    width: 740px;
    padding-left: 10px;
}

div.tabs ul.top li a {
    background: url(../_images/tabs/tabs_top-left.png) no-repeat left top;
}

div.tabs ul.top li span {
    background: url(../_images/tabs/tabs_top-right.png) no-repeat right top;
}

div.tabs ul.top li.first a {
    background: url(../_images/tabs/tabs_top-first-left.png) no-repeat left top;
}

div.tabs ul.top li.first a span {
    background: url(../_images/tabs/tabs_top-first-right.png) no-repeat right top;
}

/* untere Reiterleiste */
div.tabs ul.bottom {
    clear: left;
    float: left;
    height: 30px;
    background: url(../_images/tabs/tabs_bottom-back.png) no-repeat;
    margin-top: 25px;
    width: 750px;
    padding-left: 10px;
}

div.tabs ul.bottom li a {
    background: url(../_images/tabs/tabs_bottom-left.png) no-repeat left top;
}

div.tabs ul.bottom li span {
    background: url(../_images/tabs/tabs_bottom-right.png) no-repeat right top;
}

div.tabs ul.bottom li.first a {
    background: url(../_images/tabs/tabs_bottom-first-left.png) no-repeat left top;
}

div.tabs ul.bottom li a.current {
    background: url(../_images/tabs/tabs_bottom-left_current.png) no-repeat left top;
}

div.tabs ul.bottom li a.current span {
    background: url(../_images/tabs/tabs_bottom-right_current.png) no-repeat right top;
}

/*** 12. Formularemente ***/
#form {
    padding: 20px 19px 10px 20px;
    width: 710px;
    float: left;
}

#form.max, #form.large, #form.small, #form.extra-small {
    box-shadow: 0 1px 9px 0 rgba(0, 0, 0, 0.8);

    background: linear-gradient(135deg, rgba(255, 254, 212, 1) 0%,
    rgba(255, 254, 203, 1) 15%, rgba(255, 254, 183, 1) 30%,
    rgba(255, 254, 187, 1) 48%, rgba(255, 254, 177, 1) 68%,
    rgba(248, 245, 162, 1) 85%, rgba(218, 215, 140, 1) 100%);
}

#form.max:before, #form.large:before, #form.small:before, #form.extra-small:before {
    background: linear-gradient(147deg, rgba(255, 254, 212, 0) 0%,
    rgba(255, 254, 211, 0) 1%, rgba(255, 254, 203, 0) 15%,
    rgba(255, 254, 186, 0) 28%, rgba(255, 254, 183, 0.15) 30%,
    rgba(255, 254, 185, 1) 41%, rgba(255, 254, 187, 1) 48%,
    rgba(255, 254, 177, 1) 68%, rgba(248, 245, 162, 1) 85%,
    rgba(218, 215, 140, 1) 100%);

    height: inherit;
    content: " ";
    left: 22px;
    margin-top: inherit;
    padding: inherit;
    position: absolute;
    top: 27px;
    transform: rotate(-0.8deg);
    width: inherit;
    z-index: -1;
    box-shadow: 1px 1px 6px -1px rgba(0, 0, 0, 0.8)
}

#form.small {
    height: 395px;
    margin-top: 30px;
}

#form.small:before, #form.extra-small:before {
    top: 225px;
}

#form.small div.table div.height {
    height: 260px;
}

#form.large {
    height: 615px;
    margin-top: 55px;
}

#form.large div.table div.height {
    height: 440px;
}

#form.max {
    height: 600px;
    margin-top: 30px;
}

#form.max div.table div.height {
    height: 460px;
}

/* Administrationsbereich */
#form.admin {
    background: url("../_images/back/back_admin_zahnrad.png") repeat scroll 100% 100%, linear-gradient(135deg, rgba(255, 254, 212, 1) 0%,
    rgba(255, 254, 203, 1) 15%, rgba(255, 254, 183, 1) 30%,
    rgba(255, 254, 187, 1) 48%, rgba(255, 254, 177, 1) 68%,
    rgba(248, 245, 162, 1) 85%, rgba(218, 215, 140, 1) 100%);
}

#form.search {
    background: url(../_images/back/back_search.png) no-repeat left top;
    height: 580px;
    padding-top: 0;
    padding-bottom: 20px;
}

#form.search h4 {
    font-size: 15px;
    line-height: 20px;
    margin: 0;
    padding: 20px 0 10px;
}

#form.search div.left {
    border-right-style: none;
    height: 355px;
    width: 380px;
    overflow-y: auto;
}

#form.search div.full {
    clear: left;
}

#form.search div.full button {
    font: bold 11px Arial, Helvetica, sans-serif;
    width: 330px;
}

#form.search div.full fieldset {
    margin-top: 30px;
}

#form.search input.date {
    width: 106px;
}

#form.search select {
    vertical-align: middle;
}

#form.search button.add {
    background: url(../_images/icon/suche/icon_plus.png) no-repeat center center;
    height: 16px;
    width: 16px;
    vertical-align: middle;
    margin: 2px 0 0 10px;
    padding: 0;
    border-style: none;
}

#form.search button.add:hover {
    background: url(../_images/icon/suche/icon_plus_hover.png) no-repeat center center;
    cursor: pointer;
}

#form.search button.remove {
    background: url(../_images/icon/suche/icon_minus.png) no-repeat center center;
    height: 16px;
    width: 16px;
    vertical-align: middle;
    margin: 2px 0 0 10px;
    padding: 0;
    border-style: none;
}

#form.search button.remove:hover {
    background: url(../_images/icon/suche/icon_minus_hover.png) no-repeat center center;
    cursor: pointer;
}

#form.mail {
    width: unset;
    padding: 0;
    position: relative;
}

#form.config {
    padding-top: 0;
    background: url(../_images/back/back_config.png) no-repeat left top;
    height: 580px;
}

#form.config div.left {
    border-right-style: none;
}

#form.config div.right {
    border-left-style: none;
}

/* verschiedene Breiten und Höhen */
#form div.full {
    margin-bottom: 10px;
}

#form div.full table {
    width: 674px;
}

#form div.left {
    float: left;
    padding-right: 24px;
    border-right: 1px solid #59D;
    width: 330px;
    margin-bottom: 10px;
}

#form div.left table {
    width: 294px;
}

#form div.right {
    float: left;
    width: 330px;
    border-left: 1px solid #59D;
    margin-left: -1px;
    padding-left: 25px;
    margin-bottom: 10px;
}

#form #versicherung.right {
    margin-bottom: 60px;
}

#form div.right table {
    width: 294px;
}

#form div.data {
    height: 190px;
}

/* Erweiterter Eingabebereich */
#form.advanced {
    padding: 0;
}

#form .advancedBoxBG {
    position: absolute;
    top: 90px;
    right: 40px;
    bottom: 20px;
    left: 30px;
    background: #fff;
    border: 1px #000 solid;
    border-radius: 5px;
    height: 500px;
    width: 730px;
}

#form .advanced {
    background: url(../_images/back/back_form_advanced.png) no-repeat left top;
    height: 530px;
    width: 710px;
    padding: 90px 25px 20px;
    position: relative;
}

#form .advanced div.left {
    border-right: 1px solid #96928C;
}

#form .advanced div.right {
    border-left: 1px solid #96928C;
}

/* Formulareditor */
#form div.edit {
    margin-bottom: 10px;
    height: 500px;
    overflow: auto;
}

#form div.edit dl {
    margin: 0;
    padding: 0;
    list-style: none;
    height: 100%;
}

#form div.edit dt {
    margin: 0 1% 0 0;
    padding: 0 0 0 1%;
    clear: left;
    float: left;
    width: 98%;
}

#form div.edit a {
    float: right;
    display: none;
    margin: 4px 8px 4px 0;
}

#form div.edit img {
    display: block;
    margin: 0;
    padding: 0;
}

#form div.edit input.small {
    width: 50px;
}

#form div.edit input.normal {
    width: 200px;
}

#form div.edit input.large {
    width: 500px;
}

#form div.edit textarea.normal {
    width: 200px;
}

#form div.edit textarea.large {
    width: 500px;
}

#form div.edit select.small {
    width: 56px;
}

#form div.edit select.normal {
    width: 206px;
}

#form div.edit dt:hover {
    background: #776;
}

#form div.edit dt:hover label {
    color: #FFF;
}

#form div.edit dt:hover a {
    display: block;
}

#form div.edit dt:hover span {
    color: #FFF;
}

/* Akkordeon */
#form div.accordion {
    display: none;
}

#form div.current {
    clear: left;
    margin: 0 0 20px;
}

#form div.current hr {
    border-top: 1px solid #59D;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    height: 1px;
}

/* Formulare */
#form form {
    margin: 0;
    padding: 0;
}

#form form br {
    clear: left;
}

#form form abbr {
    color: #F33;
    border-style: none;
    cursor: help;
}

#form fieldset {
    border-style: none;
    margin: 0;
    padding: 10px 0 0;
}

#form fieldset + fieldset {
    margin-top: 20px;
}

#form h2 {
    margin-top: 0;
}

#form h4 {
    padding-bottom: 13px;
    font-size: 11px;
    font-weight: bold;
    margin: 0;
    color: #000;
}

#form legend {
    padding: 0;
    font-size: 11px;
    font-weight: bold;
    margin: 0;
    color: #000;
}

/* Labels */
#form label {
    font-size: 11px;
    line-height: 24px;
    vertical-align: middle;
    display: block;
    margin: 0;
    padding: 0;
}

#form label.left {
    float: left;
    width: 115px;
    margin-right: 5px;
    height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#form label.none {
    float: left;
    white-space: nowrap;
    width: 0;
}

#form label.row, div.dialogue label.row {
    margin-right: 6px;
    vertical-align: middle;
    display: inline;
}

#form label.list, div.dialogue label.list {
    line-height: 15px;
    float: left;
    padding-top: 4px;
    padding-bottom: 2px;
}

#form label.between, div.dialogue label.between {
    display: inline;
    line-height: 18px;
    padding-top: 3px;
    padding-left: 4px;
    padding-right: 3px;
}

#form label.error, div.dialogue label.error {
    color: #F33;
}

#form label.deadline {
    line-height: 18px;
    display: inline;
    padding-top: 3px;
    padding-right: 3px;
    padding-left: 4px;
    margin-right: 8px;
    margin-left: 49px;
}

/* Eingabefelder */
#form input {
    font: 11px Arial, Helvetica, sans-serif;
    vertical-align: middle;
    margin: 0;
}

#form input[type=text], div.dialogue input[type=text] {
    border: 1px solid #000;
    background: #FFF;
    margin: 3px 0 0;
    padding: 1px 2px;
}

#form input[type=text]:focus, div.dialogue input[type=text]:focus {
    border: 1px solid #3F3;
}

#form input[readonly=readonly], div.dialogue input[readonly=readonly] {
    background-color: #E6E6E6;
    color: #595959;
    border: 1px solid #595959;
}

#form input[readonly=readonly]:focus, div.dialogue input[readonly=readonly]:focus {
    background-color: #E6E6E6;
    color: #595959;
    border: 1px solid #595959;
}

#form input.row {
    border-style: none;
    vertical-align: middle;
    font-size: 10px;
    margin: 0 6px 0 0;
    padding: 0;
    height: 14px;
    width: 14px;
}

#form input.list {
    border-style: none;
    margin: 5px 9px 5px 0;
    padding: 0;
    float: left;
    font-size: 10px;
    display: block;
    height: 14px;
    width: 14px;
}

#form input.single {
    vertical-align: middle;
    height: 14px;
    width: 14px;
    margin: 4px 16px 0 0;
    padding: 0;
    border-style: none;
}

#form input.entire {
    width: 203px;
}

#form input.half {
    width: 97px;
}

#form input.one-third {
    width: 65px;
}

#form input.two-thirds {
    width: 129px;
}

#form input.one-quarter {
    width: 40px;
}

#form input.three-quarters {
    width: 154px;
}

#form input.extra {
    width: 318px;
}

#form input.full {
    width: 584px;
}

#form input.date, div.dialogue input.date {
    width: 67px;
}

#form input.until, div.dialogue input.until {
    margin-left: 10px;
}

#form input.time, div.dialogue input.time {
    width: 37px;
}

#form input.number, div.dialogue input.number {
    text-align: right;
}

#form input.symbol {
    width: 174px;
}

#form input.select, div.dialogue input.select {
    background: #FFF url(../_images/icon/icon_autocomplete.png) no-repeat right center !important;
}

#form input.suggest, div.dialogue input.suggest {
    background: #FFF url(../_images/icon/icon_suggest.png) no-repeat right center;
}

#form input.wait, div.dialogue input.wait {
    background: #FFF url(../_images/icon/icon_wait.gif) no-repeat right center !important;
}

#form input.file {
    padding: 1px 2px;
    margin: 3px 0 0;
    background: #FFF;
}

#form input.error, div.dialogue input.error {
    border: 1px solid #F33 !important;
}

#form input.error:focus, div.dialogue input.error:focus {
    border: 1px solid #F33;
}

/* Schaltflächen */
#form button.image, div.dialogue button.image {
    margin: -1px 0 0 -3px;
    padding: 0;
    border-style: none;
    background: none;
    vertical-align: top;
    cursor: pointer;
    width: 24px;
}

#form button.image img, div.dialogue button.image img {
    display: block;
    font-size: 10px;
    margin: 0;
    padding: 0;
}

/* Auswahllisten */
#form select {
    font: 11px Arial, Helvetica, sans-serif;
    background: #FFF;
    border: 1px solid #000;
    padding: 0;
    margin: 3px 0 0;
}

#form select:focus {
    border: 1px solid #3F3;
}

#form select.entire {
    width: 209px;
}

#form select.half {
    width: 103px;
}

#form select.one-third {
    width: 71px;
}

#form select.two-thirds {
    width: 135px;
}

#form select.one-quarter {
    width: 46px;
}

#form select.three-quarters {
    width: 160px;
}

#form select.extra-long {
    width: 318px;
}

#form select.error {
    border: 1px solid #F33;
}

#form select.error:focus {
    border: 1px solid #F33;
}

#form select[multiple=multiple] {
    vertical-align: top;
    padding-top: 1px;
}

#form option.archived, div.dialogue option.archived {
    font-style: italic;
    color: #666;
}

/* Textbereiche  */
#form textarea {
    font: 14px Arial, Helvetica, sans-serif;
    border: 1px solid #000;
    padding: 1px 2px;
    margin: 3px 0;
}

#form textarea:focus {
    border: 1px solid #3F3;
}

#form textarea.entire {
    width: 204px;
}

#form textarea.extra {
    width: 318px;
}

#form textarea.full {
    width: 584px;
}

#form textarea.maximum {
    width: 704px;
}

#form textarea.error {
    border: 1px solid #F33;
}

#form textarea[readonly=readonly], div.dialogue textarea[readonly=readonly] {
    background-color: #E6E6E6;
    color: #595959;
    border: 1px solid #595959;
}

#form textarea[readonly=readonly]:focus, div.dialogue textarea[readonly=readonly]:focus {
    background-color: #E6E6E6;
    color: #595959;
    border: 1px solid #595959;
}

#form span.value {
    font-size: 11px;
    line-height: 24px;
    font-weight: bold;
}

#form h4.global_h4_barrier {
    font-size: 11px;
    line-height: 24px;
    font-weight: bold;
    padding: 0;
}

#form div.value {
    font-size: 11px;
    line-height: 18px;
    margin: 3px 0 0 105px;
    font-weight: bold;
}

#form h3,
#form h5 {
    margin: 0 0 10px;
    padding: 0;
    font-size: 11px;
    line-height: 15px;
}

#form h3 a,
#form h5 a {
    border-bottom: 1px solid #C12;
    color: #886;
    background: url(../_images/back/back_accordion.png) no-repeat left top;
    clear: left;
    display: block;
    margin: 0;
    padding: 0 0 4px 20px;
}

#form h3 a:hover,
#form h5 a:hover {
    color: #000;
    background: url(../_images/back/back_accordion_hover.png) no-repeat left top;
}

#form h3 a.current,
#form h5 a.current {
    font-size: 15px;
    background: url(../_images/back/back_accordion_current.png) no-repeat left top;
    color: #000;
    display: block;
    border-bottom: 2px solid #C12;
    margin-bottom: 10px;
}

#form p {
    font-size: 11px;
    line-height: 15px;
    margin: 0 0 10px;
}

/* Fehlerhinweis */
#form ul.error, div.dialogue ul.error {
    padding: 4px 8px;
    list-style: none;
    background: #FDD;
    border: 1px solid #F33;
    position: absolute;
    margin: 2px 0 0 120px;
    max-width: 400px;
    z-index: 150;
}

#form ul.error li, div.dialogue ul.error li {
    font-size: 11px;
    color: #000;
    margin: 0;
    padding: 0;
}

/* Links und Bilder */
#form a {
    color: #59D;
    text-decoration: none;
}

#form a:hover {
    color: #F33;
}

#form th a {
    color: #000;
    display: block;
}

#form th a:hover {
    color: #000;
}

#form img {
    margin: 0 5px 0 0;
    padding: 0;
    vertical-align: middle;
}

#form img.symbol {
    margin: 2px 0 0 4px;
    padding: 0;
}

#form .imgBack {
    height: 55px;
    width: 55px;
    border-style: none;
    display: block;
    position: absolute;
    right: 20px;
    top: 520px;
}

#form a.reset img {
    margin-right: 0;
}

#form a.timestamp, div.dialogue a.timestamp {
    height: 24px;
    width: 24px;
    padding: 0;
    margin: 1px 0 0 -30px;
    float: left;
    display: block;
}

div.dialogue a.timestamp.asaFlexBemerkung {
    margin: 30px 0 0 -30px;
}

#form hr {
    margin: 5px 0 0;
    border-top: 2px solid #C12;
    border-right-style: none;
    border-left-style: none;
    clear: left;
    border-bottom: none;
    padding: 0 0 15px;
}

/* Sortierung in Tabellen */
#form div.sort label {
    font-size: 11px;
    font-weight: bold;
    display: block;
    margin: 0;
    padding: 0;
    line-height: 20px;
}

#form div.sort select {
    width: 148px;
    height: 17px;
    padding: 0;
    margin: 0;
}

#form div.sort select:focus {
    border: 1px solid #000;
}

#form div.sort input {
    height: 15px;
    width: 140px;
    margin: 0;
    padding: 0 3px;
}

#form div.sort input:focus {
    border: 1px solid #000;
}

#form div.sort hr {
    display: block;
    margin: 9px 0 2px;
    padding: 0;
    height: 1px;
    border-top: 1px solid #000;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
}

/* Autovervollständigen */
#form div.autocomplete, div.dialogue div.autocomplete {
    color: #000;
    background-color: #FFF;
    z-index: 1;
}

#form div.autocomplete ul, div.dialogue div.autocomplete ul {
    border-left: 1px solid #000;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
    list-style: none;
    margin: 0;
    padding: 0;
}

#form div.autocomplete ul.scroll, div.dialogue div.autocomplete ul.scroll {
    max-height: 200px;
    overflow: auto;
}

#form div.autocomplete li, div.dialogue div.autocomplete li {
    cursor: pointer;
    padding: 0 5px;
    font-size: 11px;
    line-height: 20px;
}

#form div.autocomplete li.selected, div.dialogue div.autocomplete li.selected {
    background: #EEE;
}

#form div.autocomplete li.archived, div.dialogue li.archived {
    color: #666;
    font-style: italic;
}

/* Administrierbare Felder */
#form legend.admin {
    background: rgba(43, 43, 43, 0.15);
    position: relative;
    display: block;
    float: left;
    width: 100%;
    margin: -13px 0 7px -3px;
    padding: 3px;
}

#form legend.admin:hover {
    background: rgba(43, 43, 43, 0.25);
    cursor: pointer;
}

#form span.admin {
    display: block;
    background: rgba(43, 43, 43, 0.15);
    padding: 0 3px;
    margin: 0 -3px 1px;
    float: left;
    position: relative;
}

#form span.admin.lead {
    padding-right: 1px;
}

#form span.admin.follow {
    margin-left: 4px;
    padding-left: 1px;
    padding-bottom: 3px;
}

#form span.admin.until {
    padding-bottom: 1px;
    margin-left: 4px;
    padding-left: 1px;
}

#form span.admin.textarea {
    padding-bottom: 3px;
}

#form span.admin div.hover {
    position: absolute;
    background: rgba(43, 43, 43, 0.25);
    left: 0;
    right: 0;
    top: 0;
    bottom: 1px;
    visibility: hidden;
}

#form span.admin * {
    margin-bottom: -1px;
}

#form span.admin:hover div.hover {
    visibility: visible;
    cursor: pointer;
}

#form legend {
    padding: 0;
    font-size: 11px;
    font-weight: bold;
    margin: 0;
    color: #000;
}

/*** 13. Infoleiste und Startmenü ***/
#info {
    background: #FFF;
    position: fixed;
    bottom: 0;
    width: 100%;
    border-top: 1px solid #000;
    height: 50px;
    z-index: 100;
}

#start ul {
    margin: 0 0 0 10px;
    padding: 0;
}

#start li {
    position: relative;
    list-style: none;
    padding: 9px 10px 8px;
    float: left;
    margin-right: 30px;
}

li#indicator {
    position: static;
}

li#indicator img {
    line-height: 60px;
}


#start li.main {
    margin-top: -25px;
    padding-right: 0;
}

#start li.main a {
    position: relative;
    z-index: 250;
}

#start li.wait {
    background: url(../_images/icon/icon_wait-32px.gif) no-repeat center 34px;
    height: 57px;
    width: 42px;
}

#start li a {
    display: block;
}

#start img {
    display: block;
}

#start li.wait img {
    display: none;
}

/*** 14. Nachrichtenbereich ***/
#news {
    position: fixed;
    left: 0;
    bottom: 51px;
    padding: 25px 20px 15px;
}

#newsBox {
    background: url(../_images/back/back_news.png) no-repeat -10px -10px;
    background-size: cover;
    position: relative;
    z-index: 1;
}

#newsContainerBG {
    background: #e9e9e9;
    position: absolute;
    top: 90px;
    left: 80px;
    width: 580px;
    height: 430px;
    z-index: 0;
    border: 1px #000 solid;
    border-radius: 6px;
}

#news p {
    font-size: 11px;
    line-height: 20px;
    margin: 0;
    padding: 0;
}

#news table {
    table-layout: fixed;
    border-style: none;
}

#news tr {
    font-size: 11px;
    font-weight: normal;
}

#news tr:hover td {
    background: #EEE;
}

#news th {
    font-size: 11px;
    margin: 0;
    padding: 0;
    white-space: nowrap;
}

#news td {
    font-size: 11px;
    margin: 0;
    padding: 0;
    white-space: nowrap;
}

#news img {
    border-style: none;
}

#news a {
    color: #000;
}

#news a:hover {
    color: #999;
}

#news select {
    font: 11px Arial, Helvetica, sans-serif;
    background: #FFF;
    padding: 0;
    margin: 0;
    border: 1px solid #000;
}

#news div.type {
    float: left;
    padding-right: 20px;
}

#news div.type img {
    display: block;
    margin: 0;
    padding: 0;
}

#news div.type a {
    display: block;
    margin: 0;
    padding: 0;
}

#news div.switch {
    background: url(../_images/back/back_news-switch.png) repeat-y left;
    height: 200px;
    width: 50px;
    float: left;
    margin-right: 10px;
}

#news div.switch img {
    display: block;
    margin: 0;
    padding: 0;
}

#news div.switch a {
    display: block;
}

/* Nachrichten */
#news div.messages {
    width: 792px;
    float: left;
}

#news div.messages tr:hover td {
    background: #EEE;
}

#news div.messages tr.active td {
    background: #666;
    color: #FFF;
}

#news div.messages tr.active a {
    color: #FFF;
}

#news div.messages th {
    font-size: 11px;
    text-align: left;
    font-weight: bold;
    padding: 0 0 0 5px;
    border-bottom: 1px solid #000;
    height: 20px;
    line-height: 25px;
    white-space: nowrap;
    overflow: hidden;
}

#news div.messages th:first-child {
    width: 20px;
    text-align: left;
    padding-right: 5px;
}

#news div.messages td {
    padding: 5px;
    line-height: 15px;
    overflow: hidden;
    vertical-align: top;
}

#news div.messages td.first {
    text-align: center;
    width: 20px;
}

#news div.messages td.first img {
    display: inline;
    margin-top: 3px;
}

#news div.messages strong.current {
    font-size: 16px;
}

#news div.messages select {
    float: right;
    width: 150px;
}

#news div.messages div.sort select {
    float: none;
}

#news div.table {
    background: #FFF;
    padding: 0;
    overflow: hidden;
}

#news div.table table {
    width: 770px;
}

#news div.data {
    height: 160px;
    overflow: auto;
    width: 791px;
    margin-top: 0;
}

#news div.data table {
    width: 330px;
}

#news div.data tr {
    cursor: pointer;
}

#news div.details {
    float: left;
    width: 250px;
    padding-left: 20px;
}

#news div.details textarea {
    width: 240px;
    border: 1px solid #000;
    display: block;
    font: 11px Arial, Helvetica, sans-serif;
    margin: 0;
    padding: 5px;
    float: left;
    height: 160px;
    overflow: auto;
}

#news div.details ul {
    background: none;
    margin: 0;
    padding: 0;
    list-style: none;
    height: 25px;
}

#news div.details li {
    background: none;
    margin: 0;
    padding: 0;
    float: left;
    height: auto;
    width: auto;
    font-size: 11px;
}

#news div.details a {
    color: #000;
    text-decoration: underline;
    font-size: 11px;
    float: left;
    font-weight: normal;
    margin: 0 10px 0 0;
    padding: 0;
}

#news div.details a:hover {
    color: #999;
}

/* Kalender */
#news div.calendar {
    float: left;
    width: 280px;
    padding-left: 10px;
    margin-right: 20px;
}

#news div.calendar ul {
    margin: 0;
    padding: 0;
    list-style: none;
    float: none;
    width: 100%;
    height: 25px;
}

#news div.calendar li {
    float: left;
    width: 30px;
    line-height: 20px;
}

#news div.calendar li.month {
    width: 160px;
}

#news div.calendar select {
    width: 140px;
}

#news div.calendar table {
    table-layout: fixed;
    border-style: none;
    margin-bottom: 10px;
}

#news div.calendar th {
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
    border-bottom: 1px solid #999;
    font-size: 11px;
    line-height: 20px;
    width: 35px;
}

#news div.calendar th.none {
    border-style: none;
}

#news div.calendar td {
    text-align: center;
    vertical-align: middle;
    width: 35px;
}

#news div.calendar td.day {
    font-size: 14px;
    line-height: 20px;
    font-weight: bold;
}

#news div.calendar td.off {
    color: #BBB;
}

#news div.calendar td.week {
    font-size: 11px;
    border-right: 1px solid #999;
    text-align: left;
}

#news div.calendar tr:hover td.week {
    background: #FFF;
}

#news div.calendar td a {
    text-decoration: none;
    display: block;
    height: 20px;
    width: 25px;
    margin-right: auto;
    margin-left: auto;
}

#news div.calendar td a:hover {
    background: #DDD;
    color: #000;
}

#news div.calendar td a.date {
    background: url(../_images/icon/news/icon_day-date.png) no-repeat right bottom;
}

#news div.calendar td a.date:hover {
    background: #DDD url(../_images/icon/news/icon_day-date.png) no-repeat right bottom;
}

#news div.calendar td a.today {
    border: 1px solid #F33;
}

#news div.month {
    clear: left;
}

#news div.schedule {
    float: left;
}

#news div.schedule form {
    margin: 0;
    padding: 0;
}

#news div.schedule label {
    font-size: 11px;
    line-height: 15px;
    vertical-align: middle;
    font-weight: bold;
    margin: 0;
    padding: 0;
}

#news div.schedule input.horizontal {
    vertical-align: middle;
    height: 15px;
    width: 15px;
    margin: 0 10px 0 5px;
    padding: 0;
}

#news div.tasks {
    height: 160px;
    overflow: auto;
    width: 320px;
    margin-top: 10px;
    background: #FFF;
    padding: 5px;
    border: 1px solid #000;
}

#news div.tasks table {
    width: 300px;
}

#news div.tasks td {
    padding: 5px;
    line-height: 15px;
}

#news div.tasks td.first {
    text-align: center;
    border-right: 1px solid #000;
    width: 25px;
}

/*** StepBot-Panel ***/
#stepBotPanel {
    position: fixed;
    left: 0;
    bottom: 50px;
    padding: 25px 20px 15px;
    z-index: 2001;
}

#stepBotBox {
    width: 600px;
    height: 480px;
    position: relative;
    z-index: 50;
    background: white;
    border-radius: 25px;
    outline: 1px solid #CCCCCC;
    overflow: hidden;
}

#stepBotContainer {
    width: 100%;
    height: 100%;
}

/*** 15. Titel ***/
#title {
    float: left;
    margin: 9px 10px 8px;
    line-height: 32px;
    font-size: 11px;
    font-weight: bold;
}

#title h1 {
    font-size: 15px;
    padding-left: 20px;
    display: inline;
}

/*** 16. Aktionssymbole ***/
#action {

}

#action ul {
    margin: 0 14px 0 0;
    padding: 0;
    float: right;
}

#action ul ul {
    position: absolute;
    margin: 0;
    float: none;
    background: #DDD;
    left: 0;
    bottom: 51px;
    padding: 1px;
}

#action ul ul.right {
    left: auto;
    right: 0;
}

#action li {
    float: left;
    list-style: none;
    display: block;
    margin: 0;
    position: relative;
}

#action li li {
    padding: 0;
    margin: 0;
    font-size: 11px;
    line-height: 20px;
}

#action li li:first-child {
    padding: 0 10px;
    font-weight: bold;
    border-bottom: 1px solid #FFF;
    background-color: #BBB;
    width: 150px;
}

#action li a {
    display: block;
    margin: 0;
}

#action li li a {
    color: #000;
    padding: 0 10px;
    width: 150px;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
}

/** Auskommentierung wg SNOVA-1870 (wird umgestellt auf JS)
#action li:hover ul {
	visibility: visible;
}
**/
#action li li a:hover {
    background: #FFF;
}

#action img {
    border-style: none;
    margin: 0;
    padding: 0;
    display: block;
}

/*** 17. Modale Dialoge ***/
input.focus + .fileInputLabel {
    border: 2px dotted #000;
    margin: -1px 0 0 -1px;
}

input[type="file"]:focus,
input[type="file"]:focus-within {
    border: 2px dotted #000;
    margin: -2px 0 0 -2px;
}

div.dialogue {
    z-index: 300;
    width: 590px;
    position: fixed;
    left: 50%;
    top: 10%;
    margin-left: -295px;
    color: #7D7D7D;
}

div.dialogue h6 {
    font-size: 11px;
    line-height: 20px;
    color: #018;
    margin: 0;
    background-color: #FFF;
    padding: 0 10px 0 0;
}

div.dialogue h6:before {
    content: " ";
    position: absolute;
    z-index: 2;
    /*	background:	url("") repeat scroll 0% 0% transparent; */
    height: 74px;
    top: -26px;
    left: 80%;
    width: 35px;
}

div.dialogue h6 span {
    border-bottom: 1px solid #C9A;
    margin: 30px 0 20px;
    display: block;
}

div.dialogue div.wrapper {
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 58%, rgba(247, 247, 247, 1) 100%);
    padding: 15px 25px 17px 40px;
    min-height: 150px;
    margin: 0 30px 0 26px;
    box-shadow: 0 0 20px 0;
}

div.dialogue form {
    min-height: 150px;
    margin: 0;
    padding: 0;
}

div.dialogue form br {
    clear: left;
}

div.dialogue form abbr {
    color: #F33;
    border-style: none;
    cursor: help;
}

div#dialogue form#beratungDialog #abrechnungsrelevant{
    font-size: 11px;
    line-height: 20px;
    font-weight: bold;
    margin-left: 120px;
}

/* Tabellen */
div.dialogue table {
    width: 424px;
}

div.dialogue div.data {
    height: 200px;
}

/* Labels */
div.dialogue label {
    font-size: 11px;
    line-height: 24px;
    vertical-align: middle;
    display: block;
    margin: 0;
    padding: 0;
}

div.dialogue label.left {
    float: left;
    width: 115px;
    margin-right: 5px;
    height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

div.dialogue label.none {
    float: left;
    white-space: nowrap;
    width: 0;
}

/* Eingabefelder */
div.dialogue input {
    font: 11px Arial, Helvetica, sans-serif;
    vertical-align: middle;
    margin: 0;
}

div.dialogue input[type=text] {
    border: 1px solid #BEC9D5;
    color: #7D7D7D;
}

div.dialogue input.row {
    border-style: none;
    vertical-align: middle;
    font-size: 10px;
    margin: 0 6px 0 0;
    padding: 0;
    height: 14px;
    width: 14px;
}

div.dialogue input.list {
    border-style: none;
    margin: 5px 9px 5px 0;
    padding: 0;
    float: left;
    font-size: 10px;
    display: block;
    height: 14px;
    width: 14px;
}

div.dialogue input.list.right {
    margin: 5px 9px 5px 0;
}

div.dialogue input.entire {
    width: 333px;
}

div.dialogue input.half {
    width: 162px;
}

div.dialogue input.one-third {
    width: 65px;
}

div.dialogue input.two-thirds {
    width: 259px;
}

div.dialogue input.one-quarter {
    width: 40px;
}

div.dialogue input.three-quarters {
    width: 284px;
}

div.dialogue input.text:focus {
    border: 1px solid #3F3;
}

div.dialogue input.button {
    width: 168px;
    font-weight: bold;
    color: #000;
}

/* Auswahllisten */
div.dialogue select {
    font: 11px Arial, Helvetica, sans-serif;
    background: #FFF;
    border: 1px solid #BEC9D5;
    padding: 0;
    margin: 3px 0 0;
    color: #7D7D7D;
}

div.dialogue select.entire {
    width: 339px;
}

div.dialogue select.half {
    width: 103px;
}

div.dialogue select.half {
    width: 168px;
}

div.dialogue select.one-third {
    width: 71px;
}

div.dialogue select.two-thirds {
    width: 265px;
}

div.dialogue select.one-quarter {
    width: 46px;
}

div.dialogue select.three-quarters {
    width: 290px;
}

div.dialogue select.error {
    border: 1px solid #F33;
}

div.dialogue select:focus {
    border: 1px solid #3F3;
}

div.dialogue textarea {
    font: 11px Arial, Helvetica, sans-serif;
    border: 1px solid #BEC9D5;
    padding: 1px 2px;
    margin: 3px 0;
    color: #7D7D7D;
}

div.dialogue textarea.entire {
    width: 333px;
}

div.dialogue textarea.two-thirds {
    width: 259px;
}

div.dialogue textarea.error {
    border: 1px solid #F33;
}

div.dialogue textarea:focus {
    border: 1px solid #3F3;
}

div.dialogue span.value {
    font-size: 11px;
    line-height: 24px;
    font-weight: bold;
}

div.dialogue div.value {
    font-size: 11px;
    line-height: 18px;
    margin: 3px 0 0 105px;
    font-weight: bold;
}

/* Optionsliste */
div.dialogue dl.elements {
    background: #FFF;
    padding: 6px;
    border: 1px solid #BEC9D5;
    float: left;
    width: 304px;
    height: 155px;
    overflow: auto;
    margin: 3px 0;
}

div.dialogue dl.elements dt {
    padding: 2px 2px 2px 0;
    font-size: 11px;
    line-height: 18px;
    margin: 0;
}

div.dialogue dl.elements dt input {
    width: 230px;
    padding: 0 2px;
    margin: 0 0 1px;
}

div.dialogue dl.elements dt span {
    padding-left: 4px;
}

div.dialogue dl.elements dt a {
    height: 16px;
    width: 16px;
    display: none;
    float: right;
    margin: 1px 2px 0;
}

div.dialogue dl.elements dt a.apply {
    background: url(../_images/icon/editor/icon_check.png) no-repeat left top;
    display: block;
}

div.dialogue dl.elements dt a.apply:hover {
    background: url(../_images/icon/editor/icon_check_hover.png) no-repeat left top;
}

div.dialogue dl.elements dt a.abort {
    background: url(../_images/icon/editor/icon_cross.png) no-repeat left top;
    display: block;
}

div.dialogue dl.elements dt a.abort:hover {
    background: url(../_images/icon/editor/icon_cross_hover.png) no-repeat left top;
}

div.dialogue dl.elements dt:hover {
    background: #776;
    color: #FFF;
}

div.dialogue dl.elements dt:hover a {
    display: block;
}

div.dialogue dl.elements dt:hover a.edit {
    background: url(../_images/icon/editor/icon_editor.png) no-repeat left top;
}

div.dialogue dl.elements dt:hover a.remove {
    background: url(../_images/icon/editor/icon_minus.png) no-repeat left top;
}

div.dialogue dl.elements dt.active {
    background-color: inherit;
    cursor: default;
}

div.dialogue img.add {
    float: left;
    margin-top: 10px;
    margin-left: 4px;
}

div.dialogue div.error {
    padding: 4px 8px;
    background: #FDD;
    border: 1px solid #F33;
    margin-bottom: 10px;
}

div.dialogue div.error p {
    font-size: 11px;
    color: #000;
    margin: 0;
    padding: 0;
}

/* Spaltigkeit */
div.dialogue div.full {
    clear: both;
}

div.dialogue div.column {
    float: left;
    width: 205px;
    padding-bottom: 20px;
}

div.dialogue div.column + div.column {
    margin-left: 50px;
}

div.dialogue div.column label.left {
    width: 60px;
}

div.dialogue div.column input.entire {
    width: 133px;
}

div.dialogue div.column input.half {
    width: 62px;
}

div.dialogue div.column select.entire {
    width: 139px;
}

div.dialogue div.column select.half {
    width: 68px;
}

div.dialogue textarea.entire {
    width: 133px;
}

/*** 18. Datepicker ***/
div.datepicker {
    position: relative;
    border: 1px solid #000;
    cursor: default;
    z-index: 400;
    background: #FFF;
    padding: 6px 11px 11px;
}

div.datepicker a {
    text-decoration: none;
}

div.datepicker table {
    cursor: default;
    margin: 0;
    border: none;
    table-layout: fixed;
    padding: 0;
}

div.datepicker th {
    font-size: 11px;
    height: 16px;
    width: 16px;
    padding: 0 5px;
    line-height: 16px;
    margin: 0;
}

div.datepicker td {
    font-size: 11px;
    height: 16px;
    width: 16px;
    padding: 0;
    margin: 0;
}

/* Kopfbereich */
div.datepicker thead th {
    text-align: center;
    font-weight: bold;
    padding-bottom: 4px;
}

div.datepicker thead th.title {
    cursor: move;
}

div.datepicker th.close {
    background: url(../_images/icon/datepicker/icon_close.png) no-repeat center center;
}

div.datepicker thead td {
    text-align: center;
    font-weight: bold;
    padding-bottom: 4px;
}

div.datepicker thead td.today div {
    border: 1px solid #000;
    margin-right: 5px;
    margin-left: 5px;
}

div.datepicker thead td.previous-year {
    background: url(../_images/icon/datepicker/icon_previous-year.png) no-repeat center center;
}

div.datepicker thead td.previous {
    background: url(../_images/icon/datepicker/icon_previous.png) no-repeat center center;
}

div.datepicker thead td.next-year {
    background: url(../_images/icon/datepicker/icon_next-year.png) no-repeat center center;
}

div.datepicker thead td.next {
    background: url(../_images/icon/datepicker/icon_next.png) no-repeat center center;
}

/* Kalenderinhalt */
div.datepicker tbody th {
    font-size: 9px;
    font-weight: normal;
    border-right: 1px solid #D1D1CD;
    text-align: center;
}

div.datepicker tbody td {
    font-size: 11px;
    font-weight: bold;
    text-align: center;
}

div.datepicker tbody td a {
    color: #000 !important;
    line-height: 14px;
    display: block;
    padding: 1px 0;
}

div.datepicker tbody td a.today {
    border: 1px solid #C12;
    padding: 0;
}

div.datepicker tbody td a.selected {
    color: #FFF !important;
    background: #59D;
}

div.datepicker tbody td a:hover {
    border: 1px solid #000;
    padding: 0;
}

div.datepicker tbody td.off {
    color: #bfbebb;
}

div.datepicker tbody tr:hover td {
    background-color: #DDD;
}

div.datepicker tbody tr.weekday th {
    border-top: 1px solid #000;
    border-bottom: 1px solid #D1D1CD;
    border-right: none;
    text-align: center;
    padding-top: 4px;
}

div.datepicker tbody tr.weekday td {
    border-top: 1px solid #000;
    padding: 0;
}

div.datepicker tbody tr.weekday:hover td {
    background: #FFF;
}

#menu_common_service {
    cursor: pointer;
}