@charset "utf-8";
/* CSS Document
eCMS */

/* Standard-Klassen */
/*  *, html {     font-family:Arial,Helvetica,sans-serif; font-size:12px; }
body { background-color: #fff; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 80%; }*/

:root {
    --primary-color: #333e44;
    --primary-lighter-color: #646f75;
    --secondary-color: #c39555;
    --light-color: #fafafa;
    --white-color: #ffffff;
    --border-style-secondary: 5px solid var(--secondary-color);
}

input.full-width,
select.full-width {
    width: calc(100% - 1rem);
}

input[type='button'].small-height,
input[type='submit'].small-height {
    height: 31px !important;
    min-height: auto;
}

h1,
h1 a {
    font-weight: normal;
    font-size: 20px;
    margin-bottom: 8px;
    text-decoration: none;
}

h1 a {
    color: var(--secondary-color);
}

h1 a:hover {
    text-decoration: underline;
}

h2 {
    margin-bottom: 5px;
    margin-top: 15px;
    font-size: 13px;
    font-weight: normal;
}

hr {
    background-color: #ddd;
    color: #ddd;
    border: 0;
    height: 1px;
    margin: 15px 0;
}

hr.thin {
    margin: 0;
}

p {
    margin-bottom: 5px;
    line-height: 1.7;
}


ul {
    line-height: 1.7;
}

a .svg-inline--fa {
    margin-right: 5px;
}


#page {
    max-width: 1150px;
    margin: 0 auto;
}

#bewerber_page,
#umsatzmeldung_page {
    max-width: 900px;
    margin: 0 auto;
}

#bewerber_page .logo,
#umsatzmeldung_page .logo {
    max-width: 900px;
    width: 100%;
    margin-bottom: 13px;
}

img.uploader_umsatzmeldung,
div.kassenberichte img {
    max-width: 100%;
}

/* Google Maps */
.gm-style-mtc button {
    background-color: #646f75 !important;
}


/* Overlay */

.overlayBG {
    display: none;
    background-color: #000;
    -ms-filter: "Alpha(Opacity=75)";
    /* IE 8 */
    filter: alpha(opacity=75);
    /* IE5-7 */
    -moz-opacity: 0.75;
    /* Mozilla */
    opacity: 0.75;
}

#overlay_bestaetigung {
    position: fixed;
    z-index: 2001;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    font-size: 40px;
}

.ladebalken {
    display: none;
    padding: 20px;
    background-color: #fff;
    color: var(--secondary-color);
    position: absolute;
    box-shadow: 0px 0px 8px #666;
    top: 50%;
    margin-top: -75px;
    left: 50%;
    ;
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    font-size: 16px;
    width: 580px;
    text-align: center;
    z-index: 2200;
    font-weight: normal;
    border-radius: 2px;
}

html>body .ladebalken {
    /* Details "kleben" lassen */
    position: fixed;
}

/* CMS-Layout anpassen */
.btn {
    width: 110px;
    height: 30px;
    padding: 0 8px;
    line-height: 30px;
    position: absolute;
    bottom: 0;
    display: block;
    color: #fff;
    text-decoration: none;
    background-color: var(--secondary-color);
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
}

.makategorie {
    cursor: pointer;
}

.nobr {
    white-space: nowrap;
}

#page #top_info {
    min-width: 808px;
    min-height: 20px;
    border-bottom: var(--border-style-secondary);
    ;
    position: relative;
    background-color: lightgreen;
    border-radius: 0px;
}

#page #top_warning {
    min-width: 808px;
    padding-top: 5px;
    min-height: 25px;
    border-bottom: var(--border-style-secondary);
    ;
    position: relative;
    background-color: #FF2828;
    border-radius: 0px;
}

#page #top {
    min-width: 808px;
    min-height: 177px;
    border-bottom: var(--border-style-secondary);
    ;
    position: relative;
    border-radius: 0px;
}

#page #top {
    position: relative;
}

#page #top img {
    position: absolute;
    top: -21px;
    left: -20px;
}

/* .button, */
.login,
#page #top .btn_ausloggen,
#page #top .btn_internetseite {
    background-image: none !important;
    height: 38px;
    line-height: 38px;
    position: absolute;
    bottom: -2;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-size: 11px !important;
    padding: 0 10px;
}

#page #top .btn_ausloggen {
    background-color: #646f75;
}

.team412_button {
    padding: 5px 20px;
    background-color: var(--secondary-color);
    border: 1px solid #efefef;
    color: #fff;
}

/* Input buttons weiter unten */

#page #top .btn_ausloggen {
    background-image: linear-gradient(to bottom, #848d91 5%, #58646a 100%);
}

#page #left {
    padding-left: 0;
    width: 220px;
}


#page #left .user {
    border-radius: 0;
    width: 200px;
    height: 35px;
    line-height: 35px;
    font-size: 14px;
    color: #fff;
    padding-left: 12px;
    margin-bottom: 20px;
    background-color: var(--primary-color);
    position: relative;
}

#page #left .login {
    width: auto;
    height: 35px;
    line-height: 35px;
    font-size: 11px;
    color: #fff;
    padding: 5px 12px;
    margin-bottom: 15px;
    cursor: pointer;
    background-color: var(--secondary-color);
    position: relative;
    border-radius: 0px;
}

.login span,
.btn.btn_internetseite span,
.btn.btn_ausloggen span {
    font-size: 11px !important;
}

#page #left .menu {
    width: 220px;
    margin-bottom: 15px;
    border: none;
    border-radius: 0px;
    background-color: #fff;
}

#page #left .menu .menu_top {
    border-radius: 0;
    width: 100%;
    height: 38px;
    padding: 0;
    font-weight: normal;
    color: #fff;
    line-height: 38px;
    background-color: var(--primary-color);
    background-image: none;
    margin-bottom: 0;
}

#page #left .menu .menu_top {
    padding-left: 10px;
    border-bottom: 3px solid #c4954f;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    width: 210px;
    font-size: 11px;
}

#page #left .menu .menu_top .menu_group_icon {
    direction: block;
    float: left;
    margin: 5px 2px 0 0;
    height: 30px;
}

#page #left .menu .menu_middle {
    padding-top: 4px;
    width: 218px;
    border: none;
}

#page #left .menu .menu_middle li a {
    display: block;
    width: 200px;
    height: 28px;
    line-height: 28px;
    border: none;
    border-bottom: 1px solid #b6b6b652;
    padding: 2px 0;
    margin: 0px 12px;
    color: var(--primary-color);
    text-decoration: none;
}

#page #left .menu .menu_middle li ul li {
    list-style: url("../images/bg_menu.png");
    width: 100px;
}

#page #left .menu .menu_middle li ul {
    margin-left: 40px;
    width: 100px;
}

#page #left .menu .menu_middle li ul li a {
    background: none;
    padding-left: 0;
    margin-left: 0;

}

#page #left .menu .menu_middle li a:hover {
    background: none;
    color: #c49650;
}

#page #left .menu .menu_middle li a.active {
    background: none;
    color: #c49650;
}

#page #left .menu .menu_middle li ul li a:hover {
    background: none;
}

#page #left .menu .menu_middle li ul li a {
    width: 170px;
    background: none;
}

#page #left .menu .menu_bottom {
    display: none;
}

#page #left .menu .menu_middle li:last-child a {
    border-bottom: none;
}

#vollbild .content .content_top,
#page #right .content .content_top {
    height: 21px;
    padding: 4px 0px 0px 10px;
    font-weight: normal;
    background: #b6b6b6;
    line-height: 1.5;
}

#vollbild .content,
#page #right .content {
    min-width: 545px;
    margin-bottom: 15px;
    background-color: #fff;
}

#vollbild .content a,
#page #right .content a,
.popup2018 .header a,
#job-promotion a {
    color: #000;
    text-decoration: none;
    color: var(--secondary-color);
}

#vollbild .content .empty,
#page #right .content .empty {
    background-color: #FDCCCC;
}

.fancybox-skin input[type='submit'],
#page #right input[type='submit'],
#page #right .content input[type='submit'],
#page #right input.button,
#page #right .content input.button,

#vollbild input[type='submit'],
#vollbild .content input[type='submit'],
#vollbild input.button,
#vollbild .content input.button,

.button,
#vollbild input[type='button'],
#vollbild .content input[type='button'],
#vollbild .content button:not(.gm-ui-hover-effect),
#vollbild button:not(.gm-ui-hover-effect),

#page #right input[type='button'],
#page #right .content input[type='button'],
#page #right .content button:not(.gm-ui-hover-effect),
#page #right button:not(.gm-ui-hover-effect),
#div_datenschutz_bestaetigung_content .button,
.normal_button {
    /* display: inline-block; */
    cursor: pointer;
    text-decoration: none !important;
    background: #646f75;
    border: none;
    font-weight: normal;
    border-radius: 0;
    color: #fff !important;
    padding: 12px 25px;
    text-transform: uppercase;
    text-shadow: none;
    font-size: 11px;
    letter-spacing: 1.5px;
    font-family: "open-sans-regular";
    box-shadow: none;
    box-sizing: border-box;
    text-align: center;
    line-height: 1.6;
    position: relative !important;
}

input {
    height: 28px !important;
    background-color: var(--light-color);
    padding: 0 15px !important;
    border: none;
    font-family: "open-sans-regular";
    box-sizing: border-box;
    max-width: initial;
    border-radius: 0;
    /* -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none; */
}

input[type='button'],
input[type='submit'] {
    height: 39px !important;
}

div.loading-overlay {
    display: flex;
    justify-content: center;
    align-items: center;
}

div.loading-overlay>svg {
    color: #fff;
}

.form_image_preview {
    max-width: 175px;
    max-height: 175px;
}

.form_image_preview_big {
    max-width: 400px;
    max-height: 225px;
}

#vollbild .content input[type='submit']:active,
#vollbild .content input.button:active,
#page #right .content input[type='submit']:active,
#page #right .content input.button:active {
    position: relative;
    top: 1px;
}

#vollbild .content .btn_emotivocms_login,
#page #right .content .btn_emotivocms_login {
    width: 213px;
}

#vollbild .content input[type='submit'].small,
#vollbild .content input.button.small,
#vollbild .content input.small,
#page #right .content input[type='submit'].small,
#page #right .content input.button.small,
#page #right .content input.small,
.popup2018 .small {
    width: 75px;
    padding-left: 3px;
    padding-right: 3px;
}

#vollbild .content input[type='submit'].ultrasmall,
#vollbild .content input.button.ultrasmall,
#page #right .content input[type='submit'].ultrasmall,
#page #right .content input.button.ultrasmall,
.popup2018 .ultrasmall {
    width: 35px;
    padding-left: 3px;
    padding-right: 3px;
}

#vollbild .content table td,
#page #right .content table td,
.fancybox-inner table td {
    padding: 7px 4px 7px 4px;
}

#vollbild .content table th,
#vollbild .content table th a,
#page #right .content table th,
.fancybox-inner table th,
#page #right .content table th a {
    color: var(--primary-color);
    text-align: left;
    padding: 7px 4px 7px 4px;
    /* font-size: 14px; */
    /* font-family: "roboto-condensed-regular"; */
    /* font-weight: bold; */
}

#vollbild .erstkontakt img,
#page #right .erstkontakt img {
    float: right;
    max-width: 200px;
}

#vollbild .erstkontakt .left_container,
#page #right .erstkontakt .left_container {
    width: 30%;
    float: left;
}

#vollbild .erstkontakt textarea,
#page #right .erstkontakt textarea {
    height: 150px;
}

#vollbild .erstkontakt input[type=submit],
#page #right .erstkontakt input[type=submit] {
    margin-right: 20px;
}

span.anfrage_gestellt,
span.mein_angebot {
    padding: 8px 15px !important;
}

#vollbild .content table {
    width: 100%;
}

#vollbild .content table tr.anfrage_gestellt,
#vollbild .content table td.anfrage_gestellt,
#page #right .content table tr.anfrage_gestellt,
#page #right .content table td.anfrage_gestellt,
tr.anfrage_gestellt td,
.msg_notice .anfrage_gestellt {
    background-color: #FFC !important;
}

#page #right .content table tr.mein_angebot,
#page #right .content table td.mein_angebot,
#page #right .content table tr.mein_angebot td,
.msg_notice .mein_angebot {
    background-color: #6F9;
}

#page #right .content table tr.einsatz_hinweis,
#page #right .content table td.einsatz_hinweis {
    background-color: #DDDDDD;
}

#page #right .content table tr.einsatz_zugesagt,
#page #right .content table td.einsatz_zugesagt {
    background-color: #E5F1CB;
}

#page #right .content table tr.einsatz_abgesagt,
#page #right .content table td.einsatz_abgesagt {
    background-color: #FF9191;
}

#page #right .content table tr.einsatz_offen,
#page #right .content table td.einsatz_offen {
    background-color: #FFDD9D;
}

#page #right .content table.crewcontrol_import td.ok,
#page #right .content table.rv-versicherung-timeline td.ok {
    background-color: #E5F1CB;
}

#page #right .content table.crewcontrol_import td.warn {
    background-color: #FFDD9D;
}

#page #right .content table.crewcontrol_import td.fail,
#page #right .content table.rv-versicherung-timeline td.fail {
    background-color: #FF9191;
}

#page #right .content table.crewcontrol_import td.ignore {
    background-color: #ff95fb;
}

#page #right .content table.simplegrid {
    border-collapse: collapse;
}

#page #right .content table.simplegrid td {
    border: 1px solid var(--secondary-color);
}

#page #right .content table.links td {
    cursor: pointer;
}

#page #right .content table.simplegrid tr:nth-child(even) {
    background-color: var(--light-color);
}


#page #right .content table.crewcontrol_import td h3 {
    margin: 0;
}

#page #right .content table.crewcontrol_import td {
    padding: 10px;
}

#page #right .content,
#page #right .content .content_top {
    border: none;
    background: none;
}

#page #right .content ul.box {
    list-style-type: none;
    margin: 5px;
    padding: 5px;
    background-color: #fff;
}

#page #right .content ul.box#searchresults,
#page #right .content ul.box#searchresults_tresen {
    position: absolute;
}

table.absagen {
    width: 100%;
    border-collapse: collapse;
}

table.absagen tr th {
    text-align: left;
}

table.absagen tr td {
    vertical-align: top;
    border-top: 1px solid #ccc;
    padding-top: 2px;
    padding-bottom: 2px;
    ;
}

table.absagen tr td.aktionen a {
    display: block;
    background-color: #C9A26E;
    color: #fff;
    text-decoration: none;
    padding: 2px;
    margin-top: 2px;
    margin-bottom: 2px;
    padding-left: 7px;
}



.vis-item .ep-eintrag.has-img {
    position: unset !important;
    padding-left: 35px;
}

.vis-item .ep-eintrag.has-img img.profil_mini {
    position: absolute;
    top: 0;
    left: 0;
    max-height: 100% !important;
}


img.profil_mini {
    max-width: 40px;
    max-height: 40px;
    float: left;
    margin-right: 5px;
}

table tr td.bild {
    width: 92px;
    box-sizing: border-box;
}

/* Formulare: Label unter dem Eingabefeld */
div.kasten {
    padding: 30px 20px;
    margin-bottom: 0;
    background: #ffffff;
    border-top: 1px solid #eae9ea;
}

div.kasten a {
    color: var(--secondary-color);
}

.kasten hr {
    margin: 30px 0;
}

input:focus,
select:focus {
    outline: none;
}

button:not(.gm-ui-hover-effect),
form input[type='text'],
form select,
input,
select {
    padding: 0 15px;
    min-height: 28px;
    border-radius: 0;
    border: none;
    background-color: var(--light-color);
}

form label {
    font-size: 11px;
    padding: 0px 5px;
    display: block;
}

.text-small {
    font-size: 11px;
}

.input-style-new+label,
select+label {
    line-height: 1.5;
    padding: 5px;
}

form .input-style-new.input-button-height,
select.input-button-height {
    min-height: 41px;
}

form input[type='submit'],
form input.button {
    color: #333;
    padding: 8px 20px 8px 20px;
    cursor: pointer;
}

form input[type='checkbox'],
form input[type='radio'] {
    width: 15px;
}

form input.file {
    color: #333;
    padding: 8px 20px 8px 20px;
    cursor: pointer;
}

textarea,
form textarea {
    width: 99%;
    height: 80px;
    padding: 15px;
    box-sizing: border-box;
    border: none;
    background-color: var(--light-color);
}

textarea:focus,
form textarea:focus {
    outline: none;
}

/* old stuff is old
form div.error {
    border-radius: 3px;
    text-shadow: 1px 1px 0px #f3d6d4;
    padding: 4px 10px 4px 25px;
    font-size: 12px;
    background: url('../images/error.png') 3px no-repeat #f3cac7;
    border: 1px solid #fa8b83;
    max-width: 172px;
} */



form div.floater {
    float: left;
    min-width: 400px;
    width: 50%;
    margin-bottom: 10px;
}

form div.onethird-floater {
    min-width: 270px;
    width: 32%;
    margin-bottom: 30px;
    float: left;
}

form div.onethird-floater p {
    padding-bottom: 0 !important;
}

form div.twothird-floater {
    float: right;
    min-width: 540px;
    width: 65%;
    margin-bottom: 30px;
}

form div.onefourth-floater {
    float: left;
    min-width: 270px;
    min-height: 50px;
    width: 25%;
    margin-bottom: 10px;
}

form div.checkbox-floater {
    float: left;
    min-width: 400px;
    width: 48%;
}

form div.checkbox-onethird-floater {
    width: 33%;
}

form p.NonEditMode {
    padding: 5px;
}

form div.checkbox,
form div.radio {
    margin: 5px;
}

form div.onefourth-floater .Geburtstag {
    min-width: 65px;
    width: 25%;
}

div.live-mode {
    border-left: 5px solid #900;
}

i.live-mode {
    font-size: 1.2em;
    color: #900;
}

.anwesend {
    border-left: 5px solid green;
    float: left;
    height: 40px;
    max-height: 40px;
    margin: 0px;
}

.abgesagt {
    border-left: 5px solid black;
    float: left;
    height: 40px;
    max-height: 40px;
    margin: 0px;
}

.nicht_anwesend {
    border-left: 5px solid red;
    float: left;
    height: 40px;
    max-height: 40px;
    margin: 0px;
}

.formerror {
    background: #f3cac7;
    border: 1px solid #fa8b83;
}

.error {
    /* CSS 2016: border-radius: 3px;
    text-shadow: 1px 1px 0px #f3d6d4;
    padding: 4px 10px 4px 25px;
    font-size: 12px;
    background: url('../images/error.png') 3px no-repeat #f3cac7;
    border: 1px solid #fa8b83; */
    border: 1px solid #BB0000 !important;
}

.mandatory {
    border: 1px solid rgb(199, 144, 26) !important;
}

.clear {
    clear: both;
}

.clearfix:after {
    content: ".";
    clear: both;
    display: block;
    visibility: hidden;
    height: 0px;
}

.rounded {
    /* -webkit-border-radius: 10px 10px 10px 10px; border-radius: 10px 10px 10px 10px; */
}

.shaddow {
    /* -webkit-box-shadow: 2px 2px 2px 0 #A8A8A8;box-shadow: 2px 2px 2px 0 #A8A8A8; */
}


.statusbox {
    float: left;
    width: 28%;
    margin-right: 1%;
    padding: 20px;
    min-height: 160px;
    height: 193px;
    position: relative;
}

.statusbox a {
    display: block;
    position: absolute;
    bottom: 0;
    left: 75px;
    font-weight: normal;
    margin-top: 20px;
    text-transform: uppercase;
    color: #000;
    text-decoration: none;
    padding: 0;
    text-align: center;
    line-height: 25px;
    width: 208px;
    text-align: left;
}

.statusbox .ueberschrift {
    overflow: hidden;
    display: block;
    height: 1px;
    margin-bottom: 114px
}

.statusbox p {
    color: #fff;
    font-size: 17px;
    min-height: 45px;
}

.gastro_statusbox {
    float: left;
    width: 28%;
    margin-right: 1.1%;
    padding: 20px;
    min-height: 160px;
    height: 193px;
    position: relative;
    margin-top: -115px;
}

.gastro_statusbox span.link {
    display: block;
    position: absolute;
    bottom: 0;
    left: 75px;
    font-weight: normal;
    margin-top: 20px;
    padding: 0;
    text-align: center;
    line-height: 22px;
    width: 208px;
    text-align: left;
}

.gastro_statusbox span.link a {
    text-transform: uppercase;
    color: #000;
    text-decoration: none;
    font-size: 11px;
}

.gastro_statusbox .ueberschrift {
    overflow: hidden;
    display: block;
    height: 1px;
    margin-bottom: 153px
}

.gastro_statusbox p {
    color: #fff;
    font-size: 17px;
    min-height: 45px;
}

/* Merkmale */
.merkmal_select {
    width: 45px;
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
}

.merkmal_select::-ms-expand {
    display: none;
}

.interne-merkmale .merkmal_select {
    width: 66px;
    margin-right: 10px;
}

.nomargin {
    margin-right: 0;
}

.kasten.rot {
    background-color: #FFEAEB
}

.kasten.gelb {
    background-color: var(--light-color);
}

.gold {
    color: var(--secondary-color);
}

.gruen {
    color: #009900;
}

.gruen_fill {
    background-color: #009900;
}

.gruen_bg {
    background-color: #C1FFC1;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-family: "open-sans-regular" !important;
    padding: 12px 20px !important;
}

.orange {
    color: #FF9900;
}

.orange_fill {
    background-color: #FF9900;
}

.orange_bg {
    background-color: #FFEBD7;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-family: "open-sans-regular" !important;
    padding: 12px 20px !important;
    font-size: 15px;
}

.rot {
    color: #FF0000;
}

.schwarz {
    color: #000000;
}

.rot_fill {
    background-color: #FF0000;
}

.grey_bg,
.rot_bg {
    background-color: #FF9999;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-family: "open-sans-regular" !important;
    padding: 12px 20px !important;
}

.grey_bg {
    background-color: var(--light-color);
}

.grau {
    color: #666;
}

.black {
    color: black;
}

.black_fill {
    background-color: black;
}

.hellgrau {
    color: #AAA;
}

.hellgrau_max {
    color: #DDD;
}

.hellgrau_fill {
    background-color: #AAA;
}

.einsatzplan_button {
    cursor: pointer;
    font-size: 15px;
    margin: 2px;
}

.msg_warning {
    background-color: #FFDEB3;
    color: #C60;
    padding: 10px;
    margin-bottom: 10px;
}

.msg_success {
    background-color: #c2ffb3;
    color: rgb(0, 104, 0);
    padding: 10px;
    margin-bottom: 10px;
}

div.einsatzplan_eintrag {
    float: left;
    display: block;
}

div.einsatzplan_eintrag div {
    float: left;
    display: block;
    margin-right: 5px;
    height: 60px;
}

div.einsatzplan_eintrag div.nummer {
    font-weight: bold;
    height: 14px;
}

div.einsatzplan_eintrag div.ep_id {
    font-size: 7px !important;
    height: 14px;
    line-height: 10px;
}

p.NonEditMode {
    margin-bottom: -5px;
}

p.navigator {
    color: var(--secondary-color);
    cursor: pointer;
    font-size: 1.2em;
    margin: 10px;
}

.emotivotableliststyle tr:nth-child(odd) td,
#vollbild .content table.table_2018.second tr:nth-child(odd) td,
#vollbild .content table.simplegrid.second tr:nth-child(odd) td,
#page #right .content table.table_2018.second tr:nth-child(odd) td,
#page #right .content table.simplegrid.second tr:nth-child(odd) td,
.popup2018 .content table.table_2018.second tr:nth-child(odd) td,
table.table_2018.second tr:nth-child(odd) td,
.tr_second {
    background-color: var(--light-color);
    /* !important entfernt */
}

#page #right .content table.table_2018.second_white tr:nth-child(even) td {
    background-color: #fff;
}

#vollbild .content .erst-kontakt-review table.table_2018 tr:nth-child(4n) td,
#vollbild .content .erst-kontakt-review table.table_2018 tr:nth-child(4n)+tr td,
#page #right .content .erst-kontakt-review table.table_2018 tr:nth-child(4n) td,
#page #right .content .erst-kontakt-review table.table_2018 tr:nth-child(4n)+tr td {
    background-color: var(--light-color) !important;
}

.erst-kontakt-add .kommentar-autor,
.erst-kontakt-review .kommentar-autor {
    font-size: 11px;
}

.erst-kontakt-add .panel-grey {
    background: var(--light-color);
    height: 100%;
    padding: 15px;
}

.erst-kontakt-add ul {
    margin-left: 30px;
    list-style: none;
}

.erst-kontakt-add .kommentar-text,
.erst-kontakt-review .kommentar-text,
.erst-kontakt-add li {
    position: relative;
    line-height: 2;
}

.erst-kontakt-add .kommentar-text:before,
.erst-kontakt-review .kommentar-text:before,
.erst-kontakt-add li:before {
    content: "";
    position: absolute;
    width: 4px;
    border-radius: 10px;
    height: 4px;
    background-color: var(--primary-color);
    left: -14px;
    top: 11px;
}

.erst-kontakt-add .kommentar-text:before,
.erst-kontakt-review .kommentar-text:before {
    top: 8px;
}

.erst-kontakt-add .kommentar-text,
.erst-kontakt-review .kommentar-text {
    margin-left: 15px;
    line-height: 1.6;
}

.erst-kontakt-add .panel-grey h3 {
    margin-top: 0;
}

.erst-kontakt-add .interne-merkmale .panel-grey {
    background: var(--light-color);
    height: auto;
    width: 100%;
    padding: 5px 15px;
}

.erst-kontakt-add .merkmale-tooltip {
    top: calc(50% - 5px);
    right: 20px !important;
}

.erst-kontakt-add .kommentar-hr {
    margin: 15px 0;
}

.line-toggle {
    text-align: center;
    position: relative;
}

.line-toggle i {
    font-size: 20px;
    border: 2px solid #aeb2b8;
    border-radius: 30px;
    width: 20px;
    text-align: center;
    height: 20px;
    color: #aeb2b8;
    position: relative;
    background-color: #fff;
    z-index: 1;

}

.line-toggle:before {
    content: "";
    height: 1px;
    width: 100%;
    background: #ddd;
    position: absolute;
    left: 0;
    z-index: 1;
    top: 11px;
}


.tr_auswahl {
    background-color: #97FFA3;
}

.tr_nichtverfuegbar {
    background-color: #FFCCCC;
}

.td_offline {
    color: #A0A0A0;
}

.open_tooltip {
    margin-left: 5px;
    cursor: pointer;
    color: #090;
}

.open_tooltip2 {
    cursor: pointer;
}

.zeitimport_fault {
    cursor: pointer;
    color: #900;
}

.zeitabgleich_fault {
    cursor: pointer;
    color: rgb(148, 0, 153);
}

td input {
    border: 1px solid #ccc !important;
}

/* Styles für Tabelle Planungsansicht */
#planungsansicht-header {
    background-color: #fff;
    padding: 10px;
    width: 100%;
}

#planungsansicht-header a {
    color: var(--secondary-color);
    text-decoration: none;
}

#planungsansicht-header a:hover {
    text-decoration: underline;
}

.content {
    width: 100%;
    padding: 10px;
}

table.planungsansicht {
    border-top: 2px dotted var(--secondary-color);
    border-bottom: 2px dotted var(--secondary-color);
    margin-top: 10px;
    margin-bottom: 10px;
}

table.planungsansicht td,
table.planungsansicht th {
    padding: 5px;
}

table.planungsansicht a {
    color: var(--secondary-color);
    text-decoration: none;
}

table.planungsansicht a:hover {
    text-decoration: underline;
}

/* Styles für Checkin */
#checkin {
    max-width: 960px;
    margin: 0 auto;
}

#checkin #header {
    font-size: 1.2em;
    font-style: italic;
    color: #999;
}

#checkin #header .title {
    float: left;
}

#checkin #header .status {
    float: right;
}

#checkin form#barcode input {
    border: 0;
    background: none;
}

#checkin #contentleft {
    width: 30%;
    float: left;
    border-right: 2px solid var(--secondary-color);
    min-height: 400px;
}

#checkin #contentright {
    width: 68%;
    float: right;
}

/* Chosen Select */
.chosen-container a {
    color: #000 !important
}

/* ... Formatdefinitionen zum Drucken ... */
@media screen {
    .print {
        display: none;
    }
}

@media print {
    .print {
        display: block;
    }

    .noprint,
    #top,
    #logo,
    #left {
        display: none;
        padding: 0;
        margin: 0;
    }

    h1 {
        font-size: 15px;
        margin-bottom: 4px;
    }

    * {
        font-size: 0.95em;
        line-height: 1.3em;
    }

    #page #right {
        max-width: 90%;
    }

    #page #right .content {
        min-width: 10px;
    }

    #page {
        max-width: 90%;
    }

    body {
        background-color: #fff;
    }

    div.kasten {
        background-color: #fff;
        margin: 10px 0px 10px 0px;
        page-break-inside: avoid;
    }

    form div.floater {
        min-width: 200px;
    }
}

.themen {
    height: 50px;
    width: 250px;
    text-align: center;
    line-height: 50px;
    border: 1px solid var(--secondary-color);
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
}

.themen a {
    display: block;
    height: 50px;
    width: 250px;
}

.logo_wrap {
    max-width: 900px;
    min-height: 160px;
    text-align: center;
}

.logo_wrap img {
    /* margin: 20px; */
    margin-bottom: 0px;
    max-width: 870px;
    width: 100%;
}

/* #bewerber_page .logo_wrap img {
    width: 56%;
} */

.text_header {
    padding: 15px;
    padding-bottom: 5px;
    padding-top: 15px;
    text-align: justify;
}

.text_header p {
    margin-top: 0px;
    margin-bottom: 8px;
}

#page #right .content.ticketsystem .blink {
    color: #FF4300;
}

#page #right .content.ticketsystem input[type=radio],
.ticketsystem form label {
    display: inline-block;
}

#page #right .content.ticketsystem input[type=text],
#page #right .content.ticketsystem input[type=file],
#page #right .content.ticketsystem textarea {
    width: 89%;
    max-width: none;
}

#page #right .content.ticketsystem .frage {
    font-weight: bold;
    padding-bottom: 0;
}

#page #right .content.ticketsystem .hidden {
    display: none;
    padding: 10px;
}

#page #right .content.ticketsystem .ticket {
    margin-bottom: 3px;
    position: relative;
}

/* #page #right .content.ticketsystem .ticket.old{background-color: #FFD3D3; }
#page #right .content.ticketsystem .geschlossene .ticket.old{background-color: #efefef; } */

#page #right .content.ticketsystem .col {
    float: left;
    padding-top: 5px;
    padding-left: 1%;
    padding-bottom: 5px;
}

#page #right .content.ticketsystem .col.ersteller {
    width: 11%;
}

#page #right .content.ticketsystem .col img {
    max-width: 35px;
}

#page #right .content.ticketsystem .col.first {
    width: 3%;
}

#page #right .content.ticketsystem .col.second {
    width: 8%;
}

#page #right .content.ticketsystem .col.third {
    width: 30%;
}

#page #right .content.ticketsystem .col.fifth img {
    float: left;
    margin-right: 3px;
}

#page #right .content.ticketsystem .col.fifth {
    width: 26%;
}

#page #right .content.ticketsystem .col.sixth {
    width: 9%;
}

#page #right .content.ticketsystem .col.seventh {
    width: 8%;
    text-align: right;
}

#page #right .content.ticketsystem.mitarbeiter .col.third {
    width: 34%;
}

#page #right .content.ticketsystem.mitarbeiter .col.fifth {
    width: 30%;
}

#page #right .content.ticketsystem.mitarbeiter .col.sixth {
    width: 10%;
}

#page #right .content.ticketsystem.mitarbeiter .col.seventh {
    width: 10%;
    text-align: right;
}

#page #right .content.ticketsystem small {
    font-size: 11px;
}

#page #right .content.ticketsystem .post {
    width: 80%;
    padding: 5%;
    padding-top: 20px;
    padding-bottom: 20px;
    margin-left: 10%;
    background-color: var(--light-color);
    margin-bottom: 10px;
    position: relative;
}

#page #right .content.ticketsystem .post.mypost {
    background-color: var(--light-color);
    margin-left: 0;
}

#page #right .content.ticketsystem .post img {
    max-width: 50px;
}

#page #right .content.ticketsystem .post table {
    width: 100%;
}

#page #right .content.ticketsystem .post table td {
    width: 80%;
}

#page #right .content.ticketsystem .post table td.wer {
    width: 19%;
    border-left: 1px solid #B6B6B6;
    padding-left: 1%;
    width: 25% !important;
}

#page #right .content.ticketsystem .post.mypost td.wer {
    border-right: 1px solid #B6B6B6;
    padding-right: 1%;
    padding-left: 0;
    border-left: none;
}

#page #right .content.ticketsystem .post table td.notiz {
    font-style: italic;
}

#page #right .content.ticketsystem .post table td.notiz span {
    text-transform: uppercase;
    color: #985f0d
}

#page #right .content.ticketsystem h2 {
    font-size: 20px;
    font-weight: normal;
}

#page #right .content.ticketsystem section {
    padding: 10px;
    background-color: #fdfdfd;
}

#page #right .content.ticketsystem .lightgrey {
    background-color: #efefef;
}

#page #right .content.ticketsystem .antwortform {
    background-color: #fff;
    padding: 30px 20px;
    margin-bottom: 0;
    border-top: 1px solid #eae9ea;
}

#page #right .content.ticketsystem .bewertungsbox {
    text-align: center;
    background-color: #f6f6f6;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.75);
    margin: 30px 0px 30px 0px;
    padding: 20px;
}

#page #right .content.ticketsystem .bewertungsbox form {
    max-width: 530px;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}

#page #right .content.ticketsystem .bewertungsbox form input[type=submit] {
    margin-top: 20px;
}

#page #right .content.ticketsystem .bewertungsbox .stars {
    width: 70px;
    display: inline-block;
}

#page #right .content.ticketsystem .bearbeitungsdauer {
    font-style: normal;
}

#page #right .content.ticketsystem .fa-exclamation-circle {
    color: #FF4300;
}

#page #right .content.ticketsystem .bearbeitungsflag {
    position: absolute;
    right: -5px;
    /* top: -5px; */
    background-color: #1dc116;
    font-size: 10px;
}

#page #right .content.ticketsystem .bearbeitungshinweis {
    background-color: #1dc116;
    color: #fff;
    padding: 10px;
    margin-bottom: 10px;
}

#page #right .content.ticketsystem ul {
    padding-left: 0;
    margin-bottom: 20px;
}

#page #right .content.ticketsystem ul.text,
#page #right ul.text {
    padding-left: 15px;
}

#page #right .aktionslinks {
    border-bottom: none;
    padding-left: 0;
    padding-bottom: 0;
}

.st_preview {
    background-color: white;
    width: 742px;
    margin-top: 10px;
    border: 1px solid #C0C0C0;
    padding: 5px;
    border-radius: 3px;
    display: none
}

/* Overlay linker Rand */
.jobdirekt_overlay {
    box-sizing: border-box;
    display: none;
    width: 440px;
    height: 100%;
    top: 0px;
    left: 0px;
    position: fixed;
    background-color: #ffffff;
    z-index: 10;
    overflow: auto;
    box-shadow: 3px 0px 13px black;
}

.jobdirekt_overlay a {
    color: var(--primary-color);
}

.jobdirekt_overlay .header_loginfo {
    position: fixed;
    z-index: 11;
    background-color: #fff;
    width: 390px;
    margin: 0;
    padding: 25px 25px 0px 25px;
}

.jobdirekt_overlay #p_loginfo {
    margin-top: 70px;
    padding: 25px;
}

.jobdirekt_btn_parkplatz {
    max-width: 24%;
    margin-right: 3px;
}

/* Postit-Todos, angelehnt an Helpdesk */

#page #left .postit_todos {
    background-color: var(--primary-color);
    border-bottom: 3px solid #c4954f;
    padding: 10px;
}

#page #right .content.postit_todos .post {
    background: var(--light-color);
    padding: 15px 15px 45px 15px;
    height: 100%;
    width: 100%;
    line-height: 1.6;
    position: relative;
    box-sizing: border-box;
    color: var(--primary-color);
    margin-bottom: 12px;
}

#page #right .content.postit_todos .post a {
    color: var(--primary-color);
}

#page #right .content.postit_todos .post.postit-bearbeiten {
    background: #fff;
}

#page #right .content .postit-bearbeiten input,
#page #right .content .postit-bearbeiten select {
    width: 250px;
}

#page #right .content .postit-bearbeiten input[type='submit'] {
    width: auto;
    position: relative !important;
    bottom: 0 !important;
    right: 0 !important;
}

#page #right .content.postit_todos .post .wer img {
    margin-bottom: 10px;
    height: 65px;
}

#page #right .content.postit_todos .post input[type='submit'],
#page #right .content.postit_todos .post input[type='submit']:active {
    position: absolute;
    bottom: -45px;
    right: -15px;
    top: auto;
}

#page #right .content.postit_todos .post table {
    width: 100%;
}

#page #right .content.postit_todos .post table td {
    padding: 0;
    vertical-align: top;
    background: none;
}

#page #right .content.postit_todos .post table td.wer {
    padding-right: 1%;
    width: 20%;
}

#page #right .content.postit_todos .post table td.postit_abgehakt {
    width: 10%;
    padding-left: 15px;
}

#page #right .content.postit_todos .post table td.notiz span {
    text-transform: uppercase;
    color: #985f0d
}

#page #left .postit_todos .new,
#page #left .postit_todos span.new {
    color: #ff6380;
}

#page #left .postit_todos a {
    text-decoration: none;
    display: block;
    color: #eee;
}

#page #left .postit_todos .new_none,
#page #left .postit_todos span.new_none {
    color: #eeeeee;
}

#page #right span.kommentar_high_prio {
    color: #d20707;
}

#page #right .jobs-info-box {
    position: relative;
    height: 145px;
    background-image: linear-gradient(to bottom, #d9dcdf 0px, #F9F5F4 70%);
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    border-top: 1px solid #B6B6B6;
    padding-top: 20px;
    padding-left: 20px;
}

#page #right .jobs-info-box img {
    position: absolute;
    top: 15px;
    left: 20px;
}

#page #right .jobs-info-box span.bold-text {
    font-size: 30px
}

#page #right .jobs-info-box span.red {
    color: #C41824;
    font-size: 18px;
}

#page #right .jobs-info-box-text {
    padding-top: 8px;
    padding-left: 350px;
    padding-right: 20px;
    font-size: 18px;
    background: url("../images/pfeil-rot.png") top 8px left 310px no-repeat;
}

#page #right .gastro-info-box {
    position: relative;
    height: 283px;
    background: url("../images/gastro_top.png");
    padding-top: 20px;
    padding-left: 20px;
    background-repeat: no-repeat;
}

#page #right .gastro-info-box-text {
    padding-top: 80px;
    padding-left: 60px;
    padding-right: 400px;
    font-size: 18px;
    color: #fff;
}

.bewerbung_rot {
    background-image: url("../images/bewerbung_rot.png");
    background-repeat: no-repeat;
}

.bewerbung_orange {
    background-image: url("../images/bewerbung_orange.png");
    background-repeat: no-repeat;
}

.bewerbung_gruen {
    background-image: url("../images/bewerbung_gruen.png");
    background-repeat: no-repeat;
}

.pers_bogen_rot {
    background-image: url("../images/pers_bogen_rot.png");
    background-repeat: no-repeat;
}

.pers_bogen_gruen {
    background-image: url("../images/pers_bogen_gruen.png");
    background-repeat: no-repeat;
}

.pers_bogen_orange {
    background-image: url("../images/pers_bogen_orange.png");
    background-repeat: no-repeat;
}

.person_gruen {
    background-image: url("../images/person_gruen.png");
    background-repeat: no-repeat;
}

.person_orange {
    background-image: url("../images/person_orange.png");
    background-repeat: no-repeat;
}

.person_rot {
    background-image: url("../images/person_rot.png");
    background-repeat: no-repeat;
}

.dokumente_rot {
    background-image: url("../images/dokumente_rot.png");
    background-repeat: no-repeat;
}

.dokumente_orange {
    background-image: url("../images/dokumente_orange.png");
    background-repeat: no-repeat;
}

.dokumente_gruen {
    background-image: url("../images/dokumente_gruen.png");
    background-repeat: no-repeat;
}

.presse_rot {
    background-image: url("../images/presse_rot.png");
    background-repeat: no-repeat;
}

.presse_orange {
    background-image: url("../images/presse_orange.png");
    background-repeat: no-repeat;
}

.presse_gruen {
    background-image: url("../images/presse_gruen.png");
    background-repeat: no-repeat;
}

.stammdaten_rot {
    background-image: url("../images/stammdaten_rot.png");
    background-repeat: no-repeat;
}

.stammdaten_orange {
    background-image: url("../images/stammdaten_orange.png");
    background-repeat: no-repeat;
}

.stammdaten_gruen {
    background-image: url("../images/stammdaten_gruen.png");
    background-repeat: no-repeat;
}

/* from bootstrap */

.progress {
    height: 20px;
    margin-bottom: 20px;
    overflow: hidden;
    background-color: #f5f5f5;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
}

.progress-bar {
    float: left;
    width: 0;
    height: 100%;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    text-align: center;
    background-color: #337ab7;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
    -webkit-transition: width .6s ease;
    -o-transition: width .6s ease;
    transition: width .6s ease;
}

.progress-striped .progress-bar,
.progress-bar-striped {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    -webkit-background-size: 40px 40px;
    background-size: 40px 40px;
}

.progress.active .progress-bar,
.progress-bar.active {
    -webkit-animation: progress-bar-stripes 2s linear infinite;
    -o-animation: progress-bar-stripes 2s linear infinite;
    animation: progress-bar-stripes 2s linear infinite;
}

.progress-bar-success {
    /*background-color: #5a676d;*/
    background-image: linear-gradient(135deg, #5a676d 5%, #1e272c 100%);
}

.progress-striped .progress-bar-success {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}

.progress-bar-info {
    background-color: #5bc0de;
}

.progress-striped .progress-bar-info {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}

.progress-bar-warning {
    background-color: #f0ad4e;
}

.progress-striped .progress-bar-warning {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}

.progress-bar-danger {
    background-color: #d9534f;
}

.progress-striped .progress-bar-danger {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}

.overlay.statusmeldung .whitebox {
    width: 50%;
}

.td_center {
    text-align: center;
}

.untertitel {
    font-size: 10px;
    margin-top: -7px;
    display: block;
}

#absagenliste {
    width: 95%;
    margin-left: auto;
    margin-right: auto;
}

#absagenliste td.absagedetails {
    position: relative;
}

#absagenliste td .left,
#absagenliste td .right {
    float: left;
    padding-right: 20px;
}

#absagenliste td .breit {
    float: none;
    clear: both;
}

#absagenliste td a.left,
#absagenliste td a.right {
    color: #c9a26e
}

#absagenliste .button {
    border: 1px solid #ccc;
    background-color: #F0F0F0;
    border-radius: 5px;
    display: block;
    padding: 8px;
    color: #333
}

#absagenliste .button:hover {
    color: #fff;
    background-color: #c9a26e;
}

#absagenliste p.navigator {
    margin: 0;
}

#absagenliste .linie {
    border-bottom: 1px solid #ccc;
    clear: both;
    width: 95%;
    padding-top: 5px;
    margin-bottom: 5px;
}

/*#absagenliste .uhrzeit{position: absolute; left:50%;}*/
.merkmale .merkmalwrapper {
    position: relative;
    padding-left: 25px;
}

.merkmale .merkmal_titelbox {
    position: absolute;
    white-space: nowrap;
    line-height: 25px;
    padding-top: 1%;
    margin: 0;
    -ms-writing-mode: tb-rl;
    left: 0;
    top: 0;
    height: 98%;
    writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl;
    font-weight: bold
}

.merkmale .merkmal_titelbox.pos_right {
    right: 0;
    left: auto
}

.merkmale .merkmal_titelbox.gruppe_10,
.merkmale .merkmal_titelbox.gruppe_12 {
    background-color: #8ae285;
}

.merkmale .merkmal_titelbox.gruppe_11,
.merkmale .merkmal_titelbox.gruppe_13 {
    background-color: #f7c100;
}

.clear {
    clear: both
}

.merkmale input[type="radio"] {
    display: none;
}

.merkmale label {
    display: inline-block;
    background-color: #fff;
    text-align: center;
    border-radius: 4px;
}

.merkmale input[type="radio"]:checked+label {
    background-color: #8ae285;
}

.merkmale label {
    width: 10%;
    min-width: 100px
}

.merkmale .merkmal_row,
.merkmale .log_row {
    padding-top: 8px;
    padding-bottom: 8px;
    background-color: #efefef;
}

.merkmale .log_row {
    background-color: #fff;
}

.merkmale .merkmal_row.hell {
    background-color: #e6e6e6;
}

.merkmale .left_merkmal {
    position: relative;
    display: inline-block;
    min-width: 270px;
    padding-left: 30px;
}

.merkmale .left_merkmal img {
    position: absolute;
    max-width: 15px;
    margin-left: 5px;
    left: 0;
    margin-top: 8px;
}

.merkmale th,
.merkmale td {
    text-align: left;
    padding-left: 10px;
    padding-right: 10px;
}

/*  ------ fibeln ------- */

.fibeln-img {
    display: block;
    margin: 20px 50px 40px;
}

.fibeln-img-2 {
    display: block;
    margin: 40px 0 15px;
}

.fibeln-img-3 {
    display: block;
    margin: 15px 0 40px;
}

.warnung-icon {
    display: block;
    float: left;
    margin: 0 28px 0 0;
}

.warnung-text {
    color: #f9f5f4;
    background-color: #802516;
    padding: 30px 40px;
    min-height: 60px;
}

/*Mitarbeitersuche*/

.si_container {
    padding: 20px 10px 10px 20px;
    box-sizing: border-box;
}

.si_container .suchbox {
    background-color: var(--light-color);
    ;
    padding: 10px;
}

.si_table {
    padding: 10px 10px 30px 30px;
}

.si_container input,
.si_container select {
    color: #2a2929;
    font-size: 13px;
    height: 40px !important;
    min-width: 200px;
    background-color: #fff;
    border: 1px #f1f1f1 solid;
    padding: 7px 15px;
    border-radius: 0;
    margin: 0 10px 10px 0;
}

.si_container .inputSearch_buttons {
    float: left;
    margin-top: 10px;
}

.si_container .inputSearch_buttons svg {
    margin-left: 2px;
    cursor: pointer;
    font-size: 20px;
}

.si_button {
    margin-bottom: 5px;
}

.si_button button {
    background-color: grey;
    color: #fff;
    height: 40px;
    border: none;
    padding: 10px 17px;
    margin-bottom: 10px;
    margin-right: 5px;
    cursor: pointer;
    font-size: 12px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.si_button button:hover,
.si_button button:active,
.si_button button:focus {
    background-color: #505050;
}

.si_container button:focus,
.si_container input:focus,
.si_container select:focus {
    outline: none;
}

.si_container input:focus,
.si_container select:focus {
    border-color: grey;
}

.si_table tbody {
    width: auto;
}

.si_table.content div h1 {
    margin-bottom: 10px;
}

.si_table.content div table th {
    text-align: left;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.5px;
}

.si_table table>tr:nth-of-type(odd),
.si_table table tbody tr:nth-of-type(odd) {
    background: #fff;
}

.si_table div table th,
.si_table div table td {
    padding: 16px 16px;
    border: none;
}

.si_table div table {
    border-collapse: collapse;
}

.si_table {
    width: inherit;
}

.fa-arrows:before {
    content: "\f047";
    line-height: 40px;
    font-size: 16px;
    color: grey;
}

.si_container .fa {
    font: normal normal normal 14px/1 FontAwesome;
    cursor: move;
}

.si_aufklappen:hover svg,
.si_aufklappen:active svg {

    -ms-transform: rotate(180deg);
    /* IE 9 */
    -webkit-transform: rotate(180deg);
    /* Chrome, Safari, Opera */
    transform: rotate(180deg);
}

#page #right .content div.reiter {
    border-bottom: 1px solid #666;
}

#page #right .content ul.reiter {
    display: block;
}

#page #right .content ul.reiter li {
    float: left;
    padding: 0;
    list-style: none;
    border-top: 1px solid #666;
    border-right: 1px solid #666;
    border-radius: 5px 5px 0 0;
    background-color: #eeeeee;
}

#page #right .content ul.reiter li.active {
    background-color: #fff;
    padding-bottom: 3px;
    margin-top: -3px;
}

#page #right .content ul.reiter li.first {
    border-left: 1px solid #666;
}

#page #right .content ul.reiter a {
    padding: 10px 30px 10px 30px;
    display: block;
}

.hidden {
    display: none
}

#page #right .content div.reporting_tool_header div.data {
    float: left;
    padding: 5px 20px 5px 5px;
}

/* Uploader Status bar */
#uploader_upload_process {
    z-index: 10000;
    position: fixed;
    visibility: hidden;
    text-align: center;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    background-color: #fff;
    opacity: 0.9;
}

#uploader_upload_process div {
    position: absolute;
    top: 50%;
    left: 50%;
}

#page #right .content #uploader_upload_process div p {
    font-size: 18px;
    padding-bottom: 20px;
}

#page #right .content a:hover .fa-spinner {
    text-decoration: none;
}


/* Auf ein Bild gestacktes FA-Icon */
img.font-stacked-image {
    position: relative;
    display: block;
    z-index: 1;
    width: 200px;
    height: 200px;
}

svg.large {
    position: absolute;
    font-size: 95pt;
    color: #339933;
    text-align: center;
    top: 100px;
    left: 100px;
    transform: translate(-50%, -50%);
    z-index: 1;
}

/*Personal Header */

.personal-header {
    background-color: var(--primary-color);
    padding: 30px;
    padding-bottom: 40px;
    color: #fff;
    position: relative;
    font-size: 14px !important;
}

.personal-header>div:first-child {
    box-sizing: border-box;
    width: 33%;
    line-height: 0;
}

.personal-header>div img.profilbild {
    margin-top: -30px;
    margin-left: -30px;
    padding-right: 30px;
    margin-bottom: 10px;
}

.personal-header>div img.flag {
    width: 40px;
    position: absolute;
    right: 15px;
    bottom: 42px;
}

.personal-header .vcard-qrcode-container {
    /* padding-top: 50px;
  display: flex;
  justify-content: flex-end; */
    position: absolute;
    right: 15px;
    top: 40px;
}

.personal-header nobr span {
    font-size: 10px;
}

.personal-header>div:first-child i:before {
    font-size: 19px;
}

.personal-header>div:first-child div {
    position: absolute;
    bottom: 15px;
    left: 15px;
    opacity: 0.7;
}

.personal-header p {
    line-height: 1.9;
}

.personal-header .msg_notice,
.personal-header .msg_error,
.personal-header .msg_warning {
    position: absolute;
    bottom: -20px;
    height: 20px;
    left: 0;
    right: 0;
}

.flag-inline {
    width: 20px;
    vertical-align: -5%;
    padding: 0px 2px 0px 2px;
}

.docs {
    display: inline-block;
}

.docs-container {
    position: absolute;
    bottom: 15px;
    right: 15px;
}

.personal-einsatz {
    position: absolute;
    top: 5px;
    right: 0;
}

.personal-einsatz a:hover {
    background-color: #afbcc3;
    text-decoration: none !important;
}

.personal-einsatz a {
    top: 0;
    right: 0;
    color: #fff !important;
    text-transform: uppercase;
    font-size: 11px !important;
    letter-spacing: 1.5px;
    padding: 7px 17px;
    background: #646f75;
    font-size: 11px;
    color: #fff;
    transition: all 0.15s ease-out;
    box-sizing: border-box;
}

.personal-einsatz a:last-child {
    margin-left: -1px;
}

.personal-header div:first-child img {
    width: 100%;
    max-width: initial;
}

.personal-header h3 {
    font-family: "roboto-condensed-light";
    font-size: 50px;
    margin-bottom: 10px;
    margin-top: 0;
    text-transform: initial;
    line-height: 1.1;
}

.personal-header a {
    /*line-height: 1.7;*/
    text-decoration: none;
    color: #c49650;
    display: inline;
}

.personal-header a:hover {
    color: #fff;
}

.personal-header a+p {
    margin-top: 15px;
}

.personal-einsaetze {
    background-color: var(--primary-color);
    color: #fff;
    padding: 5px;
    text-align: center;
    border-left: 15px solid #c4954f;
    border-right: 15px solid #c4954f;
    border-top: 1px solid #c4954f;
}

.personal-einsaetze span {
    font-family: "open-sans-bold";
    font-weight: 500;
    font-size: 12px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: #afb2b4;
    margin-right: 5px;
}


#vollbild .content .content_top,
#page #right .content .content_top {
    background-color: var(--primary-color);
    border-radius: 0;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #fff;
    font-family: "open-sans-regular";
    padding: 12px 20px;
    font-size: 15px;
}

.content_top p {
    font-size: 15px;
    margin: 0;
}

#vollbild .content .content_top a:hover,
#page #right .content .content_top a:hover {
    color: #fff;
    text-decoration: none;
}

#page #right {
    width: 79%;
    box-sizing: border-box;
    padding: 20px 0;
    float: left;
}

.content {
    padding: 0;
}

/*Buttonlist*/
#vollbild .buttonlist,
#page #right .buttonlist {
    margin: 20px 0 30px 0;
}

#vollbild .buttonlist ul,
#page #right .buttonlist ul {
    list-style: none;
    margin-top: -7px;
    margin-left: -7px;
}

#vollbild .buttonlist ul li,
#page #right .buttonlist ul li {
    padding: 0;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-left: 7px;
    margin-top: 7px;
    background-color: #646f75;
    border-bottom: 3px solid #c4954f;
    min-width: -moz-max-content;
    min-width: -webkit-max-content;
    min-width: max-content;
    width: -webkit-fill-available;
    text-align: center;
    position: relative;
}


#vollbild .buttonlist ul li a,
#page #right .buttonlist ul li a {
    font-size: 11px;
    display: block;
    box-sizing: border-box;
    width: 100%;
    padding: 12px 15px;
    color: #fff;
    text-decoration: none;
    transition: all 0.15s ease-out;
    text-decoration: none !important;
}

#vollbild .buttonlist ul li:hover #export_list,
#page #right .buttonlist ul li:hover #export_list {
    width: 100%;
    background: #c4954f;
}

#vollbild .buttonlist ul li:hover,
#page #right .buttonlist ul li:hover {
    background-color: #c4954f;
    text-decoration: none !important;
}

#vollbild .buttonlist+.buttonlist,
#page #right .buttonlist+.buttonlist {
    margin-top: -30px;
}

#page #right .content .buttonlist+.content_middle {
    padding-top: 0;
}

.buttonlist .dropdown .button-new:hover {
    background: transparent;
}

.buttonlist.buttonlist-wrap li {
    width: calc(25% - 7px) !important;
}

#span_statusampel_1 svg,
#span_statusampel_2 svg,
#span_statusampel_3 svg,
#span_statusampel_4 svg,
#span_statusampel_5 svg,
#span_statusampel_6 svg,
#span_statusampel_7 svg,
#span_statusampel_8 svg,
#span_statusampel_9 svg,
#span_statusampel_10 svg,
#span_statusampel_11 svg,
#span_statusampel_12 svg,
#span_statusampel_13 svg,
#span_statusampel_14 svg,
#span_statusampel_15 svg,
#span_statusampel_16 svg {
    position: absolute;
    top: calc(50% - 6px);
    left: 7px;
}

#span_statusampel_1.grau,
#span_statusampel_2.grau,
#span_statusampel_3.grau,
#span_statusampel_4.grau,
#span_statusampel_5.grau,
#span_statusampel_6.grau,
#span_statusampel_7.grau,
#span_statusampel_8.grau,
#span_statusampel_9.grau,
#span_statusampel_10.grau,
#span_statusampel_11.grau,
#span_statusampel_12.grau,
#span_statusampel_13.grau,
#span_statusampel_14.grau,
#span_statusampel_15.grau,
#span_statusampel_16.grau {
    color: #bebebe;
}

#span_statusampel_1.grau+a,
#span_statusampel_2.grau+a,
#span_statusampel_3.grau+a,
#span_statusampel_4.grau+a,
#span_statusampel_5.grau+a,
#span_statusampel_6.grau+a,
#span_statusampel_7.grau+a,
#span_statusampel_8.grau+a,
#span_statusampel_9.grau+a,
#span_statusampel_10.grau+a,
#span_statusampel_11.grau+a,
#span_statusampel_12.grau+a,
#span_statusampel_13.grau+a,
#span_statusampel_14.grau+a,
#span_statusampel_15.grau+a,
#span_statusampel_16.grau+a {
    background: #bebebe;
}



#page #right .content .content_middle {
    background-color: #fff;
    padding: 20px 10px;
}

.content_middle>.buttonlist {
    margin-top: 10px;
}

.interne-quali form>div {
    width: 25%;
    padding-left: 12px;
    padding-top: 12px;
    box-sizing: border-box;
    line-height: 0;
}

.emotivotableliststyle .checkbox input[type=checkbox]+label,
.emotivotableliststyle .checkbox input[type=radio]+label,
.checkbox-02 input[type=checkbox]+label,
.checkbox-02 input[type=radio]+label {
    padding-left: 26px;
    display: inline-block;
    height: auto;
    min-height: 19px;
    background-repeat: no-repeat;
    vertical-align: middle;
    cursor: pointer;
    font-size: 13px;
    line-height: 1.5;
}

.eventsortiment .checkbox input[type=checkbox] {
    top: inherit;
}

.kasten .checkbox-02 {
    margin: 10px 0;
}

.emotivotableliststyle .checkbox input[type=checkbox]:checked+label,
.emotivotableliststyle .checkbox input[type=radio]:checked+label,
.checkbox-02 input[type=checkbox]:checked+label,
.checkbox-02 input[type=radio]:checked+label {
    background-image: url(../images/csscheckbox_checked.png);
}

.emotivotableliststyle .checkbox.checkbox-white input[type=checkbox]:checked+label,
.checkbox-02.checkbox-white input[type=checkbox]:checked+label,
.checkbox-02.checkbox-white input[type=radio]:checked+label {
    background-image: url(../images/csscheckbox-white_checked.png);
}

.emotivotableliststyle .checkbox input[type=checkbox]:disabled,
.emotivotableliststyle .checkbox input[type=radio]:disabled,
.checkbox-02 input[type=checkbox]:disabled {
    cursor: default;
}

.emotivotableliststyle .checkbox label,
.checkbox-02 label {
    line-height: 1.5;
    background-image: url(../images/csscheckbox.png);
}

.emotivotableliststyle .checkbox label p,
.checkbox-02 label p {
    line-height: 1.7;
}

.emotivotableliststyle .checkbox input[type=checkbox],
.emotivotableliststyle .checkbox input[type=radio],
.checkbox-02 input[type=checkbox],
.checkbox-02 input[type=radio],
.checkbox-button input[type=checkbox] {
    position: absolute;
    opacity: 0;
    z-index: 1000;
    /* Wurde mal auf 99999 eingestellt, aber damit überlagerten sie die Popups */
    margin-right: 10px;
    cursor: pointer;
    height: 23px;
    width: 20px;
    top: 0;
}

.emotivotableliststyle table td .checkbox,
table td .checkbox-02,
.kasten table td .checkbox-02 {
    min-height: 20px;
    margin: 0;
}


.checkbox-button input[type=checkbox]:checked+label {
    background-color: #c4954f;
}

.checkbox-button input[type=checkbox] {
    width: 100%;
    height: 100% !important;
}

.emotivotableliststyle .checkbox,
.checkbox-02 {
    position: relative;
}

.reporting .checkbox-02 {
    width: 100%;
    display: block;
    background: transparent;
}

.checkbox-button {
    position: relative;
    background-image: none;
    background: #646f75;
    color: #fff;
    height: 100%;
    border-bottom: 3px solid #c4954f;
    box-sizing: border-box;
}

.checkbox-button label {
    font-size: 11px;
    padding: 15px 30px;
    height: 100%;
    display: block;
    box-sizing: border-box;
    line-height: 1.5;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.grid-50.checkbox {
    margin: 0;
}

form div.checkbox-onethird-floater {
    background: var(--primary-color);
    padding: 10px;
    width: auto;
    right: 27px;
    top: 31px;
    box-sizing: border-box;
    bottom: inherit;
}

#vollbild .content table td,
#page #right .content table td,
.fancybox-inner table td {
    padding: 15px;
    background-color: #fff;
}

.content table td.small {
    padding: 5px;
}

.ticket a,
.content .einsatz a,
.content .helpdesk a {
    display: block;
    width: 40px;
    height: 21px;
    left: calc(50% - 21px);
    position: relative;
    background-image: url(../images/button-arrow-dark-grey.png);
    background-repeat: no-repeat;
    background-position: center;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    -o-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}

.content .ticket a:hover,
.content .einsatz a:hover,
.content .helpdesk a:hover {
    transform: scale(0.8, 0.8);
}

.button-download {
    display: block;
    width: 40px;
    height: 24px;
    padding: 0 !important;
    margin: 0 auto;
    position: relative;
    background-image: url(../images/button-download.png);
    background-repeat: no-repeat;
    background-position: center;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    -o-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}

.button-download:hover,
.button-delete:hover {
    transform: scale(0.8, 0.8);
}

.button-delete {
    display: block;
    width: 40px;
    height: 24px;
    padding: 0 !important;
    margin: 0 auto;
    position: relative;
    background-image: url(../images/button-delete.png);
    background-repeat: no-repeat;
    background-position: center;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    -o-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}

.button-unterschrift {
    display: block;
    width: 40px;
    height: 24px;
    padding: 0 !important;
    margin: 0 auto;
    position: relative;
    background-image: url(../images/bereitgestellte-vertraege-zuruecksetzen-icon.png);
    background-repeat: no-repeat;
    background-position: center;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    -o-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}

.button-unterschrift:hover {
    transform: rotate(-180deg);
}

#page #right .content .th-download,
#page #right .content .th-link {
    color: var(--secondary-color);
    text-align: center;
}

#page #right .content .th-delete,
#page #right .content .th-unterschrift {
    color: #802516;
    text-align: center;
}

.log-zeit {
    font-size: 14px;
    color: #fff;
    line-height: 23px;
    text-align: center;
    background-color: #afbcc3 !important;
}

.msg_error {
    border: none;
    background-color: #c13333;
    padding: 15px !important;
    color: #fff;
    text-align: center;
    font-size: 15px;
}

.msg_notice {
    padding: 15px;
    padding-left: 65px;
    margin: 0 0 20px 0;
    border: none;
    color: var(--primary-color);
    background-color: var(--light-color);
    position: relative;
}

.msg_infotext {
    padding: 15px;
    padding-left: 125px;
    margin: 0 0 20px 0;
    border: none;
    color: var(--primary-color);
    background-color: var(--light-color);
    position: relative;
}

.msg_infotext:before {
    content: url(../images/transferoptionen_icon.png);
    position: absolute;
    left: 15px;
    padding: 3px 12px;
    color: #bababa;
    width: 5px;
    /* cursor: pointer; */
}

div.msg_infotext:before {
    padding: 5px 12px;
}

/* Die Warn-Box in rot */
.msg_notice.rot {
    color: #ad2323 !important;
}

.msg_notice.rot:before {
    content: url(../images/info-solid-rot.svg) !important;
    border: 2px solid #ad2323;
}

.background_gruen {
    background-color: #e5f6e6 !important;
}

#page #right .content p.msg_notice {
    padding-bottom: 15px;
}

#vollbild .content p {
    padding-bottom: 10px;
}

.msg_notice:before {
    content: url(../images/info-solid.svg);
    position: absolute;
    left: 15px;
    font-size: 14px;
    top: calc(50% - 16px);
    border-radius: 100px;
    border: 2px solid #bababa;
    padding: 3px 12px;
    color: #bababa;
    width: 5px;
    /* cursor: pointer; */
}

div.msg_notice:before {
    padding: 5px 12px;
}


.hinweis {
    color: #c4954f;
    font-size: 15px;
}

.content_middle h2 {
    margin-bottom: 15px;
    margin-top: 15px;
    font-size: 18px;
}

#tab-1,
#tab-2,
#tab-arbeitszeit-1,
#tab-arbeitszeit-2,
#tab-arbeitszeit-3,
#tab-dokumente-1,
#tab-dokumente-2,
#tab-kommentare-1,
#tab-kommentare-2,
#tab-quali-1,
#tab-quali-2,
#tab-quali-3,
#tab-formular-einblenden {
    width: 0;
    margin: 0;
    visibility: hidden;
    box-sizing: border-box;
    text-shadow: none;
    display: none;
    position: absolute;
}

#page #right .content label.button {
    width: 50%;
    box-sizing: border-box;
    text-shadow: none;
    height: auto !important;
    margin: 0 -4px 0 0;
    background-color: #afbcc3;
    color: #fff;
}

#page #right .content #tab-formular-einblenden+label.button {
    display: block;
    width: 284px;
    margin-left: auto;
}

input#tab-1:checked+label.button,
input#tab-2:checked+label.button,
input#tab-arbeitszeit-1:checked+label.button,
input#tab-arbeitszeit-2:checked+label.button,
input#tab-arbeitszeit-3:checked+label.button,
input#tab-dokumente-1:checked+label.button,
input#tab-dokumente-2:checked+label.button,
input#tab-kommentare-1:checked+label.button,
input#tab-kommentare-2:checked+label.button,
input#tab-quali-1:checked+label.button,
input#tab-quali-2:checked+label.button,
input#tab-quali-3:checked~.kennzeichen {
    background-color: var(--primary-color) !important;
    color: #fff !important;
}

.kommentare-wrap {
    display: flex;
    background-color: var(--light-color) !important;
    min-height: 50px;
    margin-bottom: 30px;
}

.kommentare label.content_top {
    position: relative;
    z-index: 2;
}

/* .kommentare-wrap .interne-kommentare, .kommentare-wrap .planungsrelevant{
    max-width: 50%;
    flex: 0 0 50%;
} */

.kommentare-wrap .kommentar-single {
    margin-bottom: 15px;
}

.kommentare-wrap .kommentare-prio {
    padding: 5px 0;
}

.kommentare-wrap .kommentare-prio span {
    margin-right: 10px;
    padding: 2px;
}


input#tab-1:checked~.einsatz.planung,
input#tab-2:checked~.einsatz-review,
input#tab-arbeitszeit-1:checked~.arbeitszeiten-festlegen,
input#tab-arbeitszeit-2:checked~.arbeitszeiten-sperren,
input#tab-arbeitszeit-3:checked~.arbeitszeiten-rvbefreiung,
input#tab-dokumente-1:checked~.vertraege,
input#tab-dokumente-2:checked~.dokumente,
input#tab-kommentare-1:checked~.kommentare-wrap .interne-kommentare,
input#tab-kommentare-2:checked~.kommentare-wrap .planungsrelevant,
input#tab-quali-1:checked~.interne-quali,
input#tab-quali-2:checked~.merkmale,
input#tab-quali-3:checked~.kennzeichen,
input#tab-formular-einblenden:checked~.formular-max-arbeitszeit {
    opacity: 1;
    display: block;
    z-index: 1;
    height: auto;
    padding-top: 50px;
}

.einsatz.planung,
.einsatz-review,
.arbeitszeiten-festlegen,
.arbeitszeiten-sperren,
.vertraege,
.dokumente,
.interne-kommentare,
.planungsrelevant,
.interne-quali,
.merkmale,
.kennzeichen,
.formular-max-arbeitszeit {
    width: 100%;
    display: none;
    box-sizing: border-box;
    z-index: -100;
}

.event-bestaetigung .status,
.event-bestaetigung.event-bestaetigt .status,
.unterschrift-bestaetigt,
.event-bestaetigung.event-geplant .status {
    color: #06aa13;
    position: relative;
    padding-left: 34px !important;
}

.event-bestaetigung .status:before,
.event-bestaetigung.event-bestaetigt .status:before,
.unterschrift-bestaetigt:before,
.event-bestaetigung.event-geplant .status:before {
    content: "";
    background: #06aa13;
    width: 10px;
    height: 10px;
    left: 16px;
    margin-top: 3px;
    border-radius: 20px;
    position: absolute;
}

.arbeitszeiten-festlegen .hinweis {
    padding-top: 20px;
}

.event-bestaetigung .status:before {
    background-color: #933223;
}

.event-bestaetigung .status {
    color: #933223;
}

.event-bestaetigung.event-geplant .status:before {
    background-color: #ecb460;
}

.event-bestaetigung.event-geplant .status {
    color: #ecb460;
}

.unterschrift-unbestaetigt {
    color: #933223;
    position: relative;
    padding-left: 34px !important;
}

.unterschrift-unbestaetigt:before {
    content: "";
    background: #933223;
    width: 10px;
    height: 10px;
    top: 43%;
    left: 16px;
    border-radius: 20px;
    position: absolute;
}

.kommentare .content_middle {
    background-color: var(--light-color) !important;
    padding: 20px !important;
}

.event-bestaetigung .event {
    text-align: center;
    background-color: #933223 !important;
    color: #fff;
}

.event-bestaetigung.event-bestaetigt .event {
    text-align: center;
    background-color: #06aa13 !important;
    color: #fff;
}

.event-bestaetigung.event-geplant .event {
    text-align: center;
    background-color: #ecb460 !important;
    color: #fff;
}

#page #right input[type='file'] {
    width: auto;
    background: none !important;
    padding: 0 !important;
    max-width: initial;
    color: grey;
}

#page #right .content input#tab-formular-einblenden+label.button,
#page #right .arbeitszeiten-form input[type='submit'],
#page #right input[type='submit'],
#page #right input[type='button'],
.button-new {
    background: #646f75;
    border: none !important;
    font-weight: normal;
    border-radius: 0;
    color: #fff !important;
    padding: 12px 25px;
    text-transform: uppercase;
    text-shadow: none;
    font-size: 11px;
    letter-spacing: 1.5px;
    font-family: "open-sans-regular";
    box-shadow: none;
    text-decoration: none;
    line-height: 1.5;
}

.button-new.active,
.fancybox-skin input[type="submit"]:hover,
#page #right .content input#tab-formular-einblenden+label.button:hover,
#page #right .arbeitszeiten-form input[type='submit']:hover,
#page #right input[type='submit']:hover,
#page #right input[type='button']:hover,
#vollbild .content input#tab-formular-einblenden+label.button:hover,
#vollbild .arbeitszeiten-form input[type='submit']:hover,
#vollbild input[type='submit']:hover,
#vollbild input[type='button']:hover,
.button-new:hover,
.dropdown .button-new:hover,
.button:hover,
#vollbild button:hover,
#page #right button:hover {
    border: none;
    text-decoration: none !important;
    background: #afbcc3 !important;
}

#vollbild .content form .arbeitszeiten-form input:focus,
#page #right .content form .arbeitszeiten-form input:focus,
form .arbeitszeiten-form select:focus {
    outline: none;
    border: 0;
    background: #e7e6e8;
}

.panel-personal {
    padding: 20px;
    background-color: var(--primary-color);
    line-height: 1.3;
    color: #fff;
}

.panel-personal .gridcontainer {
    border-bottom: 2px solid #a3b2b43b;
    padding-bottom: 10px;
}

.panel-personal p {
    line-height: 1.5;
}


.mitarbeiter-panel>img.flag {
    width: 40px;
    position: absolute;
    right: 5px;
    top: 5px;
}


#vollbild .content .mitarbeiter-panel a:not(.button a),
#page #right .content .mitarbeiter-panel a:not(.button a) {
    color: var(--primary-color) !important;
}

.mitarbeiter-panel-stars {
    height: auto;
    width: 75px;
    position: absolute;
    top: 10px;
    right: 10px;
}

.panel-personal p span,
.personal-header span,
.mitarbeiter-panel span,
.jobbewerbungen-header span {
    font-family: "open-sans-bold";
    font-weight: 500;
    font-size: 12px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: #afb2b4;
    margin-right: 10px;
}

.jobbewerbung-panel span.heading {
    font-family: "open-sans-bold";
    font-weight: 500;
    font-size: 12px;
    letter-spacing: 1.25px;
    text-transform: uppercase;
    color: #afb2b4;
    margin-right: 2px !important;
}


.jobbewerbungen-header p {
    line-height: 1.7;
}

.jobbewerbungen-header span {
    margin-top: 12px;
    display: inline-block;
}

.mitarbeiter-panel span {
    min-width: 70px;
    display: inline-block;
}

.mitarbeiter-panel .personendaten span {
    min-width: auto;
}

.personal-header .grid-50:first-child span {
    min-width: 65px;
    display: inline-block;
}

.personal-header .grid-50 .second span,
.personal-header .grid-66.second span {
    min-width: 125px;
    display: inline-block;
}

.beschaeftigungsverhaeltnisse {
    padding-top: 10px;
}

h2 {
    font-family: "roboto-condensed-regular";
    font-size: 20px;
    color: var(--primary-color);
    margin-top: 0;
    margin-bottom: 15px;
}

#mitarbeiter_startseite h2,
#jobpromotion_content h2 {
    color: var(--primary-color);
    display: inline-block;
    font-size: 17px;
    margin: 0;
    line-height: 1.2;
}

#mitarbeiter_startseite #last-minute-jobs h2 {
    color: #fff;
    font-family: "roboto-condensed-regular";
    font-size: 17px;
    width: 97%;
}

#page #right #mitarbeiter_startseite #last-minute-jobs a li .last-minute-jobs-datum {
    font-size: 11px !important;
    color: #d0a25d;
    margin-top: 7px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

#last-minute-jobs p {
    margin: 0;
    padding: 0;
    font-size: 13px !important;
    opacity: 0.6;
}

#last-minute-jobs p+h2 {
    padding: 0 8px 0 0;
    margin-top: 3px;
    font-size: 16px;
}

form .sperre label {
    font-size: 16px;
    font-family: "roboto-condensed-regular";
    color: var(--primary-color);
    padding: 0px 5px;
    margin-bottom: 10px;
    display: block;
}

#vollbild input.input-style-new,
#vollbild select.input-style-new,
#page #right input.input-style-new,
#page #right select.input-style-new {
    height: 28px;
    background-color: var(--light-color);
    padding: 0 15px;
    border: none;
    font-size: 13px;
    font-family: "open-sans-regular";
    box-sizing: border-box;
    max-width: initial;
    border-radius: 0;
}

#page #right .content .verwalten .input-style-new {
    width: 100%;
}

#vollbild .content input.input-style-new:hover,
#page #right .content input.input-style-new:hover {
    background: var(--light-color);
}

#vollbild .content input.input-style-new:focus,
#page #right .content input.input-style-new:focus {
    outline: none;
    background: #e7e6e8;
}

.menu_middle p {
    font-size: 13px;
}

th {
    font-weight: normal;
}

.verwalten .button.suche,
#page #right .content .eventsortiment+input[type='submit'] {
    margin-left: auto;
    display: block !important;
    margin-top: 20px;
}

/* Mitarbeiter Startseite */

#mitarbeiter_startseite li,
#jobpromotion_content li {
    list-style: none;
}

#mitarbeiter_startseite,
#mitarbeiter_startseite p,
#mitarbeiter_startseite a #mitarbeiter_startseite span {
    font-size: 14px !important;
}

#mitarbeiter_startseite #last-minute-jobs p {
    padding-bottom: 0 !important;
}

#page #right #mitarbeiter_startseite #jobs-info-box {
    display: block;
    position: relative;
    height: 284px;
    width: 909px;
    /* background-image: url(../images/jobs-info-box-bg-a.jpg); Jetzt inline, da Unterschied fkp / 412 */
    background-repeat: no-repeat;
    background-size: contain;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-top: none;
    margin-bottom: 20px;
}

#page #right #mitarbeiter_startseite #statusbox {
    float: left;
    width: 100%;
    position: relative;
    background-color: var(--light-color);
    padding: 0;
    margin-bottom: 20px;
}

#page #right #mitarbeiter_startseite #statusbox_title {
    color: #f9f5f4;
    background-color: #802516;
    background-image: none;
}

#page #right #mitarbeiter_startseite #statusbox_title h1 img {
    vertical-align: text-bottom;
    padding-right: 11px;
}

#page #right #mitarbeiter_startseite #statusbox_todo {
    padding: 20px;
}

/* Ab Hier alles unter ID content_v2 */
#page #right #mitarbeiter_startseite ul,
#page #right #mitarbeiter_startseite ol {
    padding-left: 0;
}

#page #right #mitarbeiter_startseite .todo {
    color: #802516;
    font-size: 16px !important;
    line-height: 33px;
    height: 36px;
}

#page #right #mitarbeiter_startseite .todo:before {
    content: url(../images/todo-x.png);
    padding-right: 10px;
    vertical-align: text-top;
}

#page #right #mitarbeiter_startseite .todo-button {
    line-height: 1.5;
    width: 25%;
    background-color: #802516;
    float: right;
    background-image: url(../images/button-arrow-light-grey.png);
    background-repeat: no-repeat;
    background-position: 93% center;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    -o-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
    padding-right: 50px;
}

#page #right #mitarbeiter_startseite .todo-fertig a.todo-button {
    background-color: #06aa13;
}

#page #right #mitarbeiter_startseite .todo-button:hover {
    background-position: 96% center;
}

#page #right #mitarbeiter_startseite .todo-fertig {
    color: #06aa13;
    font-size: 16px !important;
    line-height: 33px;
}

#page #right #mitarbeiter_startseite .todo-fertig:before {
    content: url(../images/todo-check.png);
    padding-right: 10px;
    vertical-align: sub;
}

#page #right #mitarbeiter_startseite #neue-jobs,
#page #right #mitarbeiter_startseite #job-promotion {
    margin-right: 20px;
    margin-bottom: 20px;
}

#page #right #jobpromotion_content #job-promotion {
    margin-bottom: 20px;
}

#page #right #mitarbeiter_startseite #neue-jobs_title,
#page #right #mitarbeiter_startseite #job-promotion_title,
#page #right #jobpromotion_content #job-promotion_title {
    background-image: none;
}

.last-minute-jobs-datum,
.neue-jobs-datum,
.news-item-datum {
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-size: 12px !important;
}

.last-minute-jobs-datum {
    font-family: "roboto-condensed-regular";
}

.neue-jobs-datum {
    margin-left: 5px;
}

#page #right #mitarbeiter_startseite #neue-jobs a li,
#page #right #mitarbeiter_startseite #job-promotion a li,
#job-promotion a li {
    background-color: var(--light-color);
    height: auto;
    padding: 18px 20px 18px 20px;
    margin-bottom: 2px;
    line-height: 14px;
    color: #1e2c2f;
    text-decoration: none;
    background-image: url(../images/button-arrow-grey.png);
    background-repeat: no-repeat;
    background-position: 96% center;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    -o-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}

#page #right #mitarbeiter_startseite #neue-jobs a li:hover,
#page #right #mitarbeiter_startseite #job-promotion a li:hover,
#job-promotion a li:hover {
    background-color: #afbcc3;
    color: #fff;
    text-decoration: none;
    background-image: url(../images/button-arrow-dark-grey.png);
    background-repeat: no-repeat;
    background-position: 97% center;
}

#mitarbeiter_startseite a:hover,
#jobpromotion_content a:hover {
    text-decoration: none !important;
}

#page #right #mitarbeiter_startseite #right-right {
    float: right;
    width: 315px;
}

#page #right #mitarbeiter_startseite #last-minute-jobs {
    margin-bottom: 20px;
}

#page #right #mitarbeiter_startseite #last-minute-jobs a li {
    display: block;
    background-color: #646f75;
    padding: 8px 0 40px 12px;
    margin-top: 3px;
    line-height: 14px;
    color: #fff;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    -o-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
    position: relative;
}

#page #right #mitarbeiter_startseite #last-minute-jobs a li:hover {
    background-color: #404c53;
}

#page #right #mitarbeiter_startseite #last-minute-jobs a:hover {
    text-decoration: none !important;
    color: #1e2c2f;
}

#page #right #mitarbeiter_startseite #last-minute-jobs a li .last-minute-jobs-datum {
    line-height: 17px;
    display: block;
    margin-bottom: 5px;
    font-family: "open-sans-regular";
}

#page #right #mitarbeiter_startseite #last-minute-jobs a:hover li .last-minute-jobs-datum {
    text-decoration: none !important;
}

#page #right #mitarbeiter_startseite .last-minute-jobs-button,
#page #right .jobbewerbungen-button,
#page #right input.button.jobbewerbungen-button {
    padding-right: 54px;
    float: right;
    line-height: 1.5;
    text-align: right;
    color: var(--light-color);
    background-image: url(../images/button-arrow-grey.png);
    background-color: var(--primary-color);
    background-repeat: no-repeat;
    background-position: 88% center;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    -o-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}

#page #right .jobbewerbung-panel .jobbewerbungen-button {
    position: absolute !important;
    bottom: 0;
    right: 0;
}

#page #right #mitarbeiter_startseite .last-minute-jobs-button {
    color: #788389 !important;
    font-weight: 600;
    margin-top: -15px;
    position: absolute;
    bottom: 0;
    right: 0;
}

#page #right input.button.jobbewerbungen-button {
    padding-right: 60px !important;

}

#page #right .jobbewerbungen-button,
#page #right input.button.jobbewerbungen-button {
    background-image: url(../images/button-arrow-gold.png);
    background-color: #646f75;
    padding-left: 19px !important;
}

#page #right #mitarbeiter_startseite .last-minute-jobs-button:hover,
#page #right input.button.jobbewerbungen-button:hover {
    background-position: 91% center;
    background-color: var(--primary-color);
}

#page #right .jobbewerbungen-button:hover,
#page #right input.button.jobbewerbungen-button:hover {
    background-position: 91% center;
    background-color: var(--primary-color);
}

#page #right #mitarbeiter_startseite #last-minute-jobs a:hover .last-minute-jobs-button #page #right #last-minute-jobs .jobbewerbungen-button:hover {
    background-position: 90% center;
}

#page #right #mitarbeiter_startseite a.more-last-minute-button {
    display: block;
    text-align: center;
    height: auto;
    padding: 12px 12px 12px 0;
    margin-bottom: 2px;
    line-height: 14px;
    text-decoration: none;
    border-left: 5px solid #c4954f;
    font-weight: 600;
    color: var(--primary-color) !important;
    font-family: "roboto-condensed-regular";
    text-transform: none;
    font-size: 17px;
    background-color: #646f75;
    background-image: url(../images/button-arrow-dark-grey.png);
    background-repeat: no-repeat;
    background-position: 81% center;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    -o-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}

#page #right #mitarbeiter_startseite a.more-last-minute-button:hover {
    background-position: 83% center;
}

#page #right #mitarbeiter_startseite #last-minute-jobs li {
    border-left: 5px solid #c4954f;
    margin-bottom: 3px;
}

#last-minute-jobs .content_top {
    margin-bottom: 20px;
}

#page #right #mitarbeiter_startseite #wir-warten {
    width: 315px;
    float: right;
    margin-bottom: 20px;
}

#page #right #mitarbeiter_startseite #wir-warten-title h1 {
    color: #343e44;
    vertical-align: bottom;
    padding: 17px 20px;
    font-size: 26px;
    line-height: 22px;
    margin: 0 0 20px 0;
    background-color: #aeb2b4 !important;
}

#page #right #mitarbeiter_startseite #wir-warten a,
#wir-warten a:hover {
    text-decoration: none !important;
    background-color: #afbcc3 !important;
}

#page #right #mitarbeiter_startseite #wir-warten a:hover li {
    background-color: #afbcc3 !important;
}

#page #right #mitarbeiter_startseite #wir-warten a li {
    font-size: 16px;
    line-height: 0px;
    background-color: var(--light-color);
    height: auto;
    padding: 12px 20px;
    margin-bottom: 2px;
    text-decoration: none;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    -o-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}

#page #right #mitarbeiter_startseite #wir-warten a li img {
    vertical-align: text-bottom;
    padding-right: 10px;
}

#page #right #mitarbeiter_startseite #wir-warten a li:hover {
    /*background-color: #aeb2b4;*/
    padding: 12px 20px 12px 25px;
}

#wir-warten .gruen {
    color: var(--primary-color);
    background-image: url(../images/smile.png);
    background-repeat: no-repeat;
    background-position: right center;
}

#page #right #mitarbeiter_startseite #wir-warten .rot {
    color: #802516;
}

#page #right #mitarbeiter_startseite #app-ad {
    margin-bottom: 20px;
}

#page #right #mitarbeiter_startseite #news_title h1 img {
    padding: 0 0 0 16px;
    vertical-align: middle;
}

.news-img {
    height: 200px;
    background-position: center center;
    background-size: cover;
}

#page #right #mitarbeiter_startseite .news-archiv-link {
    color: #eae7e6;
    float: right;
    clear: none;
    padding: 0 30px 0 0;
    margin-top: -45px;
    font-size: 16px;
    line-height: 18px;
    background-image: url(../images/button-arrow-news-archiv.png);
    background-repeat: no-repeat;
    background-position: 92% 97%;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    -o-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}

#page #right #mitarbeiter_startseite .news-archiv-link:hover {
    background-position: 95% 97%;
}

#page #right #mitarbeiter_startseite #news ul li:nth-child(3),
#news ul li:nth-child(6),
#news ul li:nth-child(9) {
    margin-right: 0 !important;
}

#page #right #mitarbeiter_startseite .news-item-headline {
    line-height: 1.5;
    margin-bottom: 15px;
    margin-top: 10px;
}

#page #right #mitarbeiter_startseite .news-item-datum {
    font-size: 12px;
    line-height: 12px;
    margin-top: -10px;
}

#page #right #mitarbeiter_startseite .news-item-snippet {
    font-size: 14px;
    line-height: 1.7;
    margin-top: -3px;
}

#page #right #mitarbeiter_startseite #foto-galerien {
    float: left;
    width: 100%;
    position: relative;
    padding: 0;
    margin-bottom: 350px;
}

#page #right #mitarbeiter_startseite #foto-galerien-title h1 {
    color: #343e44;
    vertical-align: bottom;
    padding: 14px 20px;
    font-size: 36px;
    line-height: 23px;
    margin: 0 0 20px 0;
    background-color: #aeb2b4;
    border-bottom: 5px solid #c4954f;
    background-image: url(../images/foto.png);
    background-repeat: no-repeat;
    background-position: 29.3% center;
}

#page #right #mitarbeiter_startseite #news_title h1 img {
    padding: 0 0 0 16px;
    vertical-align: middle;
}

#page #right #mitarbeiter_startseite .foto-galerien-archiv-link {
    color: #343e44;
    float: right;
    clear: none;
    padding: 0 30px 0 0;
    margin-top: -50px;
    font-size: 16px;
    line-height: 18px;
    background-image: url(../images/button-arrow-foto-galerien-archiv.png);
    background-repeat: no-repeat;
    background-position: 92% 97%;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    -o-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}

#page #right #mitarbeiter_startseite .foto-galerien-archiv-link:hover {
    background-position: 95% 97%;
}

#page #right #mitarbeiter_startseite #foto-galerien img {
    width: 302px;
    margin-bottom: 10px;
}

#page #right #mitarbeiter_startseite a li.galerie-item {
    width: 302px;
    height: 200px;
    float: left;
    clear: none;
    background-color: #000000;
    margin: 0 1px 1px 0;
    cursor: pointer;
}

#page #right #mitarbeiter_startseite a li.galerie-item img {
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    -o-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}

#page #right #mitarbeiter_startseite a li.galerie-item:hover img {
    opacity: 0.5;
    transform: scale(0.98);
}

#page #right #mitarbeiter_startseite a li.galerie-item p {
    display: none;
}

#page #right #mitarbeiter_startseite a li.coming-soon {
    text-align: center;
}

#page #right #mitarbeiter_startseite a li.coming-soon img {
    opacity: 0.3;
}

#page #right #mitarbeiter_startseite a li.coming-soon:hover img {
    opacity: 0.3;
    transform: scale(0.98);
}

#page #right #mitarbeiter_startseite a li.coming-soon p {
    display: block;
    font-size: 18px;
    padding: 0;
    margin-top: -225px;
    opacity: 0;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    -o-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}

#page #right #mitarbeiter_startseite a li.coming-soon:hover p {
    opacity: 1;
    margin-top: -200px;
}

#page #right #mitarbeiter_startseite a li.galerie-item:nth-child(3),
a li.galerie-item:nth-child(6),
a li.galerie-item:nth-child(9) {
    margin-right: 0 !important;
}

#news-content {
    margin-top: 20px;
}

.news-item-snippet {
    color: var(--primary-color);
}

.mitarbeiter-panel {
    background: var(--light-color);
    padding: 30px 30px 45px 30px;
    height: 100%;
    line-height: 1.6;
    position: relative;
    box-sizing: border-box;
    color: var(--primary-color);
}

.mitarbeiter-panel h2 {
    margin-top: 0;
    font-size: 23px;
    line-height: 1.3;
    font-family: 'roboto-condensed-regular';
    color: #646f75;
    margin-bottom: 10px;
}

#page #right .content .mitarbeiter-panel p {
    font-size: 13px;
    line-height: 1.7;
    padding-bottom: 0;
}

#page #right .content .mitarbeiter-panel p.button-new {
    font-size: 11px;
    margin: 0;
}

.mitarbeiter-panel-img {
    margin-left: -30px;
    margin-top: -30px;
    margin-right: 30px;
    height: 180px;
}

.jobbewerbung-panel-img {
    margin: 0 15px 0 0;
}

#page #right .content td.table-bewerbung-checkboxen {
    vertical-align: top;
    padding-right: 0;
}

#page #right .content td.table-bewerbung-checkboxen .checkbox {
    margin-bottom: 10px;
}

#page #right .content td.table-bewerbung-checkboxen .checkbox:last-child {
    margin-bottom: 0;
}

#page #right .content td.table-bewerbung-checkboxen>div {
    background: var(--light-color);
    padding: 15px;
    padding-bottom: 5px;
}

.jobbewerbungen-header img {
    margin: 0 15px 0 0;
}

.jobbewerbung-panel h1 {
    margin: 0;
}

.jobbewerbung-panel .headline-panel {
    margin: 0;
    padding: 10px;
    background-color: #e4e4e4;
    margin-bottom: 15px;
}

.mitarbeiter-panel .flex {
    margin-bottom: 20px;
}

.jobbewerbung-panel {
    background: var(--light-color);
    padding: 15px;
    line-height: 1.6;
    position: relative;
    box-sizing: border-box;
    color: var(--primary-color);
    line-height: 0;
}

.jobbewerbung-panel .button {
    position: absolute;
    bottom: 15px;
    right: 0px;
}

.dropdown {
    position: relative;
}

.dropdown-elements {
    display: none;
    z-index: 1500;
    position: absolute;
    background: var(--light-color);
    padding: 10px 15px;
    list-style: none;
    margin-top: 10px;
    box-shadow: rgba(0, 0, 0, 0.33) -1px 1px 61px 0px;
    bottom: 43px;
    left: 0;
}

.dropdown-elements.beneath {
    bottom: auto;
    margin-top: 24px;
}

.dropdown-elements.left {
    left: auto;
    right: 0;
}

.dropdown-elements.context-menu {
    padding: 10px 0;
}

.dropdown-elements.context-menu>li {
    padding: 0;
}

.dropdown-elements.context-menu>li>a.option-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    padding: 5px 15px;
}

.dropdown-elements.context-menu>li>a.option-item>div>svg {
    margin-right: 1rem;
}

.dropdown-elements.context-menu>li>a.option-item>span.shortcut {
    background-color: gray;
    border-radius: 2px;
    padding: 2px 4px;
    color: white;
    margin-left: 2rem;
    min-width: 15px;
    display: flex;
    justify-content: center;
}

.dropdown-elements.context-menu>li>a.option-item:hover {
    background-color: lightgray;
}

.mitarbeiter-panel .dropdown-elements {
    right: 0;
    left: auto;
}

.personal-einsatz .dropdown-elements,
.si_button .dropdown-elements {
    bottom: auto;
}

.si_button .dropdown-elements {
    top: 20px;
}


.personal-einsatz .dropdown-elements a {
    background: none;
    color: inherit;
    text-align: left;
    text-transform: none;
    letter-spacing: 0;
    padding: 0;
    color: var(--primary-color) !important;
    font-size: 13px !important;
}

.personal-einsatz .dropdown-elements a:hover {
    text-decoration: underline !important;
}

#vollbild .content .dropdown-elements li,
#page #right .content .dropdown-elements li {
    background: none;
    border: none;
    padding: 5px 0;
    font-size: 13px;
    text-align: left;
    color: var(--primary-color);
    min-width: auto;
    margin: 0;
}

.buttonlist .dropdown-elements {
    top: 48px;
    bottom: initial;
}

#vollbild .buttonlist .dropdown,
#page #right .buttonlist .dropdown {
    padding: 0;
}

#vollbild .content .dropdown-elements li:hover,
#page #right .content .dropdown-elements li:hover {
    background: none;
}

#vollbild .content .dropdown-elements li:hover a,
#page #right .content .dropdown-elements li:hover a {
    text-decoration: underline !important;
}

#vollbild .content .dropdown-elements a,
#page #right .content .dropdown-elements a {
    text-transform: initial;
    color: var(--primary-color);
    letter-spacing: 0;
    text-align: left;
    font-size: 13px;
    padding: 0;
}

#vollbild .content .dropdown-elements a:hover,
#page #right .content .dropdown-elements a:hover {
    color: var(--primary-color);
    text-decoration: underline;
}

.dropdown p {
    display: inline-block;
    cursor: pointer;
}

.dropdown.button-new,
.dropdown.button {
    cursor: pointer;
}

.dropdown .button-new {
    background-color: #646f75;
    cursor: pointer;
    text-align: center;
}

.button-rating {
    cursor: pointer;
}

.button-rating i {
    position: relative;
    font-size: 30px;
}

.rating-num {
    position: absolute;
    color: #fff;
    top: 30%;
    left: 36%;
}

i.rating {
    color: var(--secondary-color);
}

.rating-container {
    background: var(--light-color);
    box-sizing: border-box;
    padding: 15px;
    height: 100%;
}

.dropdown:hover p {
    background: #afbcc3;
}

.dropdown-elements li {
    padding: 5px 0;
}

.dropdown:hover .dropdown-elements {
    transition: visibility 0.5s ease-in-out, opacity 0.5s ease-in-out;
}

.dropdown {
    display: inline;
}

.mitarbeiter-panel .dropdown,
.mitarbeiter-panel .button,
.jobberbung-panel .button {
    position: absolute;
    right: 0;
    bottom: 0;
}

.dropdown-rating {
    display: inline;
}

.mitarbeiter-panel .personendaten {
    position: absolute;
    left: 0;
    bottom: 0;
}

.personendaten span,
.docs-container span,
.telefonliste-container-buttons span,
.mitarbeiter-badge-container span,
span.mitarbeiter-badge {
    margin-right: 0;
    padding: 2px 4px;
    color: #fff;
    font-size: 10px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    font-family: "open-sans-regular";
}

.mitarbeiter-badge-container span,
span.mitarbeiter-badge {
    min-width: inherit;
    display: inline;
    background-color: rgb(30, 148, 84);
}

.mitarbeiter-badge-container {
    margin-bottom: 5px;
}

/*Statistik*/

.statistik-panel-daten {
    padding: 15px 30px;
    background-color: var(--light-color);
    margin-bottom: 12px;
    height: calc(100% - 85px);
}

.statistik-panel-daten p {
    padding-bottom: 0;
    line-height: 2;
}

.statistik-panel-daten p:first-child {
    width: 75%;
}

.statistik-panel-daten p:last-child {
    text-align: right;
    width: 5%;
}

.daten {
    width: 20%;
    box-sizing: border-box;
    padding-right: 15px;
    text-align: right;
}

.statistik-panel .content_top {
    line-height: 1;
}

.statistik-panel .statistik-panel-daten p:last-child {
    color: #c4954f;
    font-family: 'open-sans-bold';
    font-weight: 500;
}

.statistik {
    padding-top: 30px;
}

/*News*/

#page #right #mitarbeiter_startseite .news-item img {
    width: initial;
    margin-bottom: 10px;
    height: 200px;
}

.news-item:hover img {
    opacity: 0.7;
}

.news img {
    width: 100%;
}

.news h2 {
    font-family: "roboto-condensed-light";
    font-size: 60px;
    color: var(--primary-color);
    margin-bottom: 0;
    text-align: center;
    margin-top: 50px;
}

.news h3 {
    font-family: "roboto-condensed-light";
    font-size: 40px;
    margin-bottom: 0;
    text-align: center;
    margin-top: 30px;
}

#page #right .content .content_middle.news {
    padding-top: 0;
}

.news-item {
    overflow: hidden;
}

#page #right #mitarbeiter_startseite .news-item-datum {
    padding-bottom: 20px;
    font-size: 11px !important;
}

.news .news-item-datum {
    text-align: center;
    margin-bottom: 30px;
    margin-top: 10px;
}

.anhaenge a {
    text-align: center;
    display: block;
}

.anhaenge h3 {
    margin-bottom: 30px;
}

.news-inhalt {
    max-width: 80%;
    margin: auto;
}

.news-image-container {
    max-height: 400px;
    overflow: hidden;
    margin-top: 20px;
}

.news-admin-bildupload {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 15px;
    padding-right: 12px;
}

/*Helperclass*/
.margin-remove {
    margin: 0;
}

/*Helperclass*/
.padding-remove {
    padding: 0 !important;
}

/*Helperclass*/
.margin-top-remove {
    margin-top: 0 !important;
}

.margin-bottom-remove {
    margin-bottom: 0 !important;
}

/*Helperclass margin-top-small*/
.margin-top-small {
    margin-top: 15px;
}

/*Helperclass margin-bottom-small*/
.margin-bottom-small {
    margin-bottom: 15px;
}

/*Helperclass margin-bottom-extra-small*/
.margin-bottom-extra-small {
    margin-bottom: 5px;
}

/*Helperclass margin-top*/
.margin-top {
    margin-top: 30px !important;
}

/*Helperclass margin-bottom*/
.margin-bottom {
    margin-bottom: 30px;
}

/*Helperclass margin-left*/
.margin-left {
    margin-left: 30px;
}

/*Helperclass margin-left*/
.margin-right {
    margin-right: 30px;
}

/*Helperclass margin-left-small */
.margin-left-small {
    margin-left: .5rem;
}

/*Helperclass padding-top-remove */
.padding-top-remove {
    padding-top: 0 !important;
}


.fancybox-skin input[type="submit"].margin-left-small {
    margin-left: 10px !important;
}

.fancybox-skin input[type="submit"].margin-left-none {
    margin-left: 0 !important;
}

/*Helperclass margin-right-small */
.margin-right-small {
    margin-right: 10px;
}

.fancybox-skin input[type="submit"].margin-right-small {
    margin-right: 10px !important;
}

/*Helperclass*/

#vollbild .content .input-style-new.w-100,
#page #right .content .input-style-new.w-100,
.w-100 {
    width: 100%;
}

.reporting select {
    margin-right: 10px;
}

.button-headline-margin-minus {
    margin-top: -5px;
}

#vollbild .btn.user,
#page #left .btn.user {
    height: auto;
    padding: 10px;
    line-height: 0;
}

#vollbild .btn.user p,
#page #left .btn.user p {
    line-height: 1.6;
    font-size: 13px;
    padding-left: 10px;
}

#vollbild .btn.user img,
#page #left .btn.user img {
    width: 100%;
}

#vollbild .content table .tr_second td,
#page #right .content table .tr_second td {
    background-color: var(--light-color);
}

.merkmale .checkbox-02 {
    width: 100%;
    padding: 20px;
    margin-bottom: 12px !important;
    background: var(--light-color);
    box-sizing: border-box;
}

.merkmale .checkbox-02 input {
    top: 18px;
}

.merkmale label {
    width: 100%;
    background-color: transparent;
    text-align: left;
}

.interne-quali .checkbox-02 {
    background: var(--light-color);
    margin: 0 0 5px 0 !important;
}

.interne-quali .checkbox-02 input {
    top: 3px;
}

#vollbild .content .interne-quali .checkbox-02 p,
#page #right .content .interne-quali .checkbox-02 p {
    padding-bottom: 0;
}

h3 {
    font-family: "open-sans-bold";
    font-weight: 500;
    font-size: 12px;
    letter-spacing: 1.5px;
    line-height: 1.5;
    text-transform: uppercase;
    color: #afb2b4;
    margin: 15px 0;
}

.merkmale-tooltip {
    right: 12px;
    font-size: 10px;
    top: 36%;
    border-radius: 100px;
    border: 2px solid #c4954f;
    padding: 1px 7px;
    color: #c4954f;
    line-height: 1.5;
    cursor: pointer;
}

.portal-tooltip-fa5 {
    font-size: 15px;
    cursor: pointer;
}

.statistik-panel-daten .merkmale-tooltip {
    padding: 1px 6px;
}

.reporting-table .merkmale-tooltip {
    padding: 0 5px;
    font-size: 9px;
    margin-left: 3px;
}

.interne-merkmale .merkmale-tooltip {
    right: 35px;
    padding: 1px 6px;
    position: absolute;
    font-size: 10px;
}

.merkmale .merkmale-tooltip {
    position: absolute;
}

.merkmale_zaehler>div {
    background-color: var(--light-color);
    padding: 15px;
    margin-bottom: 12px;
    box-sizing: border-box;
    height: 58px;
}

.number .minus,
.number .plus {
    width: 14px;
    padding: 15px 5px;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    vertical-align: middle;
}

.merkmale_zaehler select {
    width: 32px;
    text-indent: 1px;
    text-overflow: '';
    border: none;
    border-radius: 0;
    padding: 8px;
}

.number {
    position: relative;
}

.number div:first-child {
    line-height: 1.5;
}

.merkmal_janein label i,
.number div:first-child i,
.interne-merkmale i {
    padding-right: 15px;
    font-size: 20px;
}

.interne-merkmale i.fa-plus,
.interne-merkmale i.fa-info {
    padding-right: 1px;
    font-size: 10px;
}

.number div:last-child {
    padding-right: 35px;
}

input[name='login'] td {
    background-color: #fff !important;
}

form[name='login'] input.textfield {
    width: 213px !important;
}

#vollbild .content input.textfield,
#page #right .content input.textfield {
    width: inherit;
    height: inherit;
    border: inherit;
    font-family: inherit;
}

.login-form td {
    background-color: #fff !important;
}

.login-form td input[type="text"],
td input[type="password"] {
    background-color: var(--light-color) !important;
}

.content_top img {
    /* height: 100%; */
    padding-right: 5px;
}

#vollbild input.noprint,
#page #right input.noprint {
    display: block;
    margin-left: auto;
}

/* mg: Erweitert auf Kasten ohne page und content, von min-width auf width geändert und verkleiner, da Fehlermeldung nicht passte */
.kasten .input-style-new,
#page #right .content .input-style-new {
    width: 250px;
}

#vollbild .kasten .input-style-new.geb-tag,
#page #right .kasten .input-style-new.geb-tag {
    min-width: initial;
}

#page #right .kasten .grid-20 .input-style-new,
#page #right .kasten .grid-25 .input-style-new,
#page #right .kasten .grid-33 .input-style-new,
#page #right .kasten .grid-66 .input-style-new,
#page #right .kasten .grid-37 .input-style-new {
    min-width: 100%;
    margin-bottom: 10px;
}

.msg_warning-bewerbung,
.box_background_highlight {
    background-color: var(--light-color);
    padding: 20px;
    margin-bottom: 20px;
}

.content_top {
    background-color: var(--primary-color);
    border-radius: 0;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #fff;
    font-family: "open-sans-regular";
    padding: 12px 14px;
    font-size: 15px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.anfrage_gestellt,
.mein_angebot {
    padding: 0 10px !important;
    border-radius: 0;
}

#page #right .content.ticketsystem table td {
    background-color: var(--light-color);
}

.kasten .interne-quali-container {
    margin-left: -12px;
    margin-top: -12px;
}

#page #right .content.ticketsystem .col {
    float: left;
    padding-top: 10px;
    padding-left: 10px;
    box-sizing: border-box;
    padding-bottom: 10px;
}

.interne-merkmale {
    position: relative;
}

#vollbild .buttonlist li.active,
#page #right .buttonlist li.active {
    background-color: #c4954f;
}

.gastro_statusbox span.link a {
    letter-spacing: 1.5px;
    padding-left: 10px;
}

.ticket_header {
    border-bottom: 1px solid black;
}

#page #right .content.ticketsystem .ticket:nth-child(even) {
    background-color: var(--light-color);
}

#page #right .content.ticketsystem .col {
    color: var(--primary-color);
    text-align: left;
    padding: 7px 4px 7px 4px;
    font-size: 14px;
    font-family: "roboto-condensed-regular";
}

.ticket_header .ticket_header .col.sixth {
    text-align: center;
}

#vollbild .content td input,
#vollbild .content td select,
#page #right .content td input,
#page #right .content td select {
    border: 1px solid #ccc;
    background: #fff;
}

.kontrolllisten td {
    position: relative;
}

/*jobbewerb. direkt zuordnen*/

.kontroll_listen_detail td span,
.kontroll_listen_detail td a,
.jobbewerb_direkt_zuordnen td span,
.jobbewerb_direkt_zuordnen td a {
    line-height: 1.7;
}

.kontroll_listen_detail td span,
.jobbewerb_direkt_zuordnen td span {
    margin-right: 15px;
}

.kontroll_listen_detail td .mitarbeiter-badge-container span,
.kontroll_listen_detail td .mitarbeiter-badge-container,
.jobbewerb_direkt_zuordnen td .mitarbeiter-badge-container,
.jobbewerb_direkt_zuordnen td .mitarbeiter-badge-container span {
    margin: 0;
}

.kontroll_listen_detail td,
.jobbewerb_direkt_zuordnen td {
    vertical-align: top;
}

.jdz-person {
    line-height: 1.7;
    position: relative;
    width: 124px;
}

.kontroll_listen_detail input[type='button'],
.jobbewerb_direkt_zuordnen input[type='button'] {
    width: 100%;
}

#page #right .content .jdz-name {
    font-size: 17px;
    line-height: 1.3;
    color: #646f75;
    font-family: initial;
    font-family: "roboto-condensed-regular";
}

#page #right .content .kontroll_listen_detail td i,
#page #right .content .jobbewerb_direkt_zuordnen td i {
    color: #646f75;
}

.bewerber-zuordnen th:last-child {
    width: 220px;
}

.background-box-grey {
    background: var(--light-color);
    padding: 10px 20px;
}

.reporting-table {
    overflow: hidden;
    margin-top: 2.5rem;
}

.reporting-table th,
.module-definieren-table th {
    position: relative;
    vertical-align: bottom;
    white-space: nowrap;
}

.reporting-table>tbody>tr>th:first-of-type {
    width: 330px;
}

.reporting-table>tbody>tr:first-of-type>th,
.module-definieren-table>tbody>tr:first-of-type>th {
    border-bottom: 1px solid #ccc !important;
}

.reporting-table>tbody>tr:first-of-type>th,
.reporting-table>tbody>tr:first-of-type>th>p,
.module-definieren-table>tbody>tr:first-of-type>th,
.module-definieren-table>tbody>tr:first-of-type>th>p {
    font-weight: bold;
    padding-bottom: 1rem !important;
}


.reporting-table th p,
.module-definieren-table th p {
    position: absolute;
    right: 57%;
    text-align: right;
    bottom: 0;
    width: 173px;
    transform: rotate(35deg);
    transform-origin: bottom right;
}

.reporting-table tr:first-of-type>th,
.module-definieren-table tr:first-of-type>th {
    position: relative;
    width: 104.96px;
    height: 115.43px;
    padding: 0 !important;
}

.reporting-table th>svg,
.module-definieren-table th>svg {
    position: absolute;
    bottom: -27px;
    height: 116px;
    left: -65.5px;
}

#page #right .content .reporting-table td {
    width: 100px;
    padding: 10px;
}



.color-red {
    color: #933223;
}

.sortiment-input {
    position: absolute;
    max-width: 45px;
    padding: 0 .25rem !important;
    left: 0;
    right: 0;
    top: 2px;
}

#page #right .content .kontroll_listen_detail td:not(.geparkt),
#page #right .content .jobbewerb_direkt_zuordnen td:not(.geparkt),
#page #right .content .job-direkt-daten td,
#page #right .content .job-direkt-daten th {
    background-color: var(--light-color);
}

#page #right .content .kontroll_listen_detail a:hover,
#page #right .content .jobbewerb_direkt_zuordnen a:hover {
    color: var(--primary-color);
    text-decoration: none;
}

#page #right .content .kontroll_listen_detail i,
#page #right .content .jobbewerb_direkt_zuordnen i {
    font-size: 13px;
}

#page #right .content .kontroll_listen_detail .mitarbeiter-badge-container span,
#page #right .content .jobbewerb_direkt_zuordnen .mitarbeiter-badge-container span {
    padding: 2px 3px;
}

.jobbewerb_direkt_zuordnen .jdz-bewerbung span,
.jobbewerb_direkt_zuordnen .jdz-bewerbung p {
    margin: 0 !important;
    padding: 0 !important;
}

.jdz-bewerbung h2 {
    font-size: 17px;
    color: #646f75;
}

.reporting-table td:first-child nobr {
    color: var(--primary-color);
    text-align: left;
    padding: 7px 4px 7px 4px;
    font-size: 17px;
    font-family: "roboto-condensed-regular";
}

.reporting_tool_header {
    background-color: var(--light-color);
    padding: 20px;
}

#page #right .content div.reporting_tool_header div.data {
    padding-left: 0;
}

#page #right .content .reporting-table td i {
    margin-left: 5px;
}

#vollbild .content.reporting .content_top,
#page #right .content.reporting .content_top {
    font-size: 12px;
    line-height: 1.9;
    letter-spacing: 1.5px;
}

#page #right .content .statistik .link-button {
    margin-left: -30px;
    margin-top: -12px;
    margin-bottom: 15px;
    margin-right: -42px;
}

#page #right .content .statistik .link-button a {
    line-height: 1.5;
    color: #fff;
    padding: 12px 0;
    height: 41px;
    box-sizing: border-box;

    width: 19%;
    justify-content: center;
    align-items: center;
    font-size: 9px;
}

.text-align-right {
    text-align: right;
}

table {
    position: relative;
}

#vollbild .content .table_2018 td,
#vollbild .content .table_2018 li,
.emotivotableliststyle td,
#page #right .content .emotivotableliststyle li,
#page #right .content .table_2018 td,
#page #right .content .table_2018 li,
.table_2018 li,
.table_2018 td {
    line-height: 20px;
}

#vollbild .content .emotivotableliststyle .header th,
#vollbild .content .table_2018 .header th,
#page #right .content .emotivotableliststyle .header th,
#page #right .content .table_2018 .header th,
.table_2018 .header th {
    padding-bottom: 15px;
}


/* NEUER Strich unter dem th */
.emotivotableliststyle,
.table_2018 {
    border-collapse: collapse;
}

.emotivotableliststyle tr:first-child th,
.table_2018 tr:first-child th {
    border-bottom: 1px solid var(--primary-color);
}

/* AlT:
#vollbild .content .emotivotableliststyle tr:first-child th:first-child:before,
#vollbild .content .table_2018 tr:first-child th:first-child:before,
#page #right .content .emotivotableliststyle tr:first-child th:first-child:before,
#page #right .content .table_2018 tr:first-child th:first-child:before,
.table_2018 tr:first-child th:first-child:before {
    content: "";
    position: absolute;
    background: var(--primary-color);
    height: 1px;
    right: 0px;
    left: 0;
    top: 34px;
} */

#vollbild .content .table_2018 td.last-nomargin-right,
#page #right .content .table_2018 td.last-nomargin-right {
    padding-right: 0px;
    text-align: right;
}

#vollbild .content .emotivotableliststyle a,
#vollbild .content .table_2018 a,
#page #right .content .emotivotableliststyle a,
#page #right .content .table_2018 a,
.table_2018 a {
    color: var(--primary-color);
}

#vollbild .content .emotivotableliststyle th a:hover,
#vollbild .content .table_2018 th a:hover,
#page #right .content .emotivotableliststyle th a:hover,
#page #right .content .table_2018 th a:hover,
.table_2018 th a:hover {
    text-decoration: none;
    opacity: 0.7;
}

#vollbild .content .emotivotableliststyle ul,
#vollbild .content .table_2018 ul,
#page #right .content .emotivotableliststyle ul,
#page #right .content .table_2018 ul,
.table_2018 ul {
    list-style-type: none;
}

#vollbild .content .emotivotableliststyle.center td,
#vollbild .content .table_2018.center td,
#page #right .content .emotivotableliststyle.center td,
#page #right .content .table_2018.center td {
    text-align: center;
}

#vollbild .content table.slim td,
#page #right .content table.slim td {
    padding: 7px 4px 7px 4px;
}

#vollbild .content table.ultraslim td,
#page #right .content table.ultraslim td {
    padding: 2px 1px 2px 1px;
}

table.slimandlow td {
    padding: 2px 4px 2px 4px !important;
}

#vollbild .content table.slim td input,
#vollbild .content table.slim td select,
#page #right .content table.slim td input,
#page #right .content table.slim td select {
    padding: 5px;
}

/*Reporting Tool*/

.reporting-table td:not(:first-child) {
    text-align: center;
}

.reporting_tool_header {
    background-color: #fff;
    padding: 0;
}

.reporting_tool_header div {
    box-sizing: border-box;
    margin: 0 !important;
    position: relative;
    padding: 2px 0 0 2px !important;
}

.reporting_tool_header p {
    background: var(--light-color);
    margin: 0;
    padding: 15px;
}

#page #right .content.reporting .content_middle {
    padding: 0;
}

.reporting_tool_header .merkmale-tooltip {
    padding: 0 5px;
    font-size: 9px;
    position: absolute;
    top: calc(50% - 8px);
    margin-left: 5px;
}

.reporting_tool_header .grid-100 {
    width: 100%;
}

.reporting_tool_header p.grid-100 {
    margin-top: 2px;
    position: relative;
    padding: 15px 45px 15px 15px;
}

.red-icon {
    margin-right: 10px;
    display: flex;
    align-items: center;
}

.reporting_tool_header h3 {
    margin-left: 20px;
}

.reporting-table tr td:first-child,
.reporting-table tr td:first-child nobr {
    font-size: 13px;
    font-family: "open sans";
}

#page #right .content .reporting-table td,
#page #right .content .reporting-table td nobr {
    font-size: 12px;
    padding: 10px 5px;
}

/* Bewerber Page*/

form[name="bewerbung"] .input-style-new,
form[name="umsatzmeldung"] .input-style-new,
#umsatzmeldung_page .input-style-new,
#bewerber_page .input-style-new,
#page #right .content .grid-50 .input-style-new {
    width: 100%;
}

form[name="bewerbung"] .error,
#bewerber_page .error {
    border-radius: 0;
    text-shadow: none;
    padding: 0;
    font-size: 13px;
    background-image: none;
    background-color: var(--light-color);
    border: none;
}

form[name="bewerbung"] .kasten,
#bewerber_page .kasten {
    position: relative;
}

form[name="bewerbung"] .kasten.hide_jobdetail p,
#bewerber_page .kasten.hide_jobdetail p {
    margin-bottom: 20px;
    margin-top: 0;
}

label.label-input,
form[name="bewerbung"] label.label-input,
#bewerber_page form label.label-input {
    line-height: 1.5;
    padding: 5px;
}

form[name="bewerbung"] select,
#bewerber_page select {
    padding: 0 15px !important;
}

form[name="bewerbung"] .error-badge,
#bewerber_page .error-badge,
.error-badge {
    line-height: 1.5;
    position: absolute;
    top: 0px;
    font-size: 11px;
    right: 0;
    padding: 3px 10px;
    background: red;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

#bewerber_page .bewerbung-flag {
    max-width: 80px;
    float: right;
    margin-left: 30px;
    -webkit-box-shadow: 3px 3px 28px -9px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 3px 3px 28px -9px rgba(0, 0, 0, 0.75);
    box-shadow: 3px 3px 28px -9px rgba(0, 0, 0, 0.75);
}


/* Umsatzmeldung-Einzelseite */
#umsatzmeldung_page .content_inside {
    max-width: 900px;
    margin: 10px;
}

.icon-input {
    position: relative;
}

.icon-input svg {
    position: absolute;
    right: 20px;
    width: 15px !important;
}

/****************************
* Fancybox-Styling
*/

.fancybox-skin {
    background-color: #fff !important;
    border-radius: 0 !important;
    font-size: 13px !important;
}

.fancybox-skin input[type="submit"] {
    display: block !important;
    margin-left: auto !important;
    font-size: 11px !important;
    width: auto !important;
}

/*.fancybox-skin input,
.fancybox-skin select {
    font-size: 13px !important;
}*/

.fancybox-skin .content {
    width: 100%;
    box-sizing: border-box;
}

/*Fancybox */

/* Goldener Rahmen */
.popup2018_promotion {
    border: 5px solid #c4954f !important;
}

.popup2018 .fb-savebutton {
    margin-top: 15px;
    text-align: right;
}

button:not(.gm-ui-hover-effect),
.fancybox-skin form input[type='text'],
.fancybox-skin form select,
.fancybox-skin input,
.fancybox-skin select {
    padding: 0 15px !important;
    min-height: 41px;
}

.fancybox-skin input.small {
    min-height: 0px !important;
}

.canvasjs-chart-container button {
    min-height: 28px !important;
    height: 28px !important;
    padding: 5px 12px !important;
    border-color: rgb(51, 62, 68) !important;
}

.canvasjs-chart-toolbar {
    border: 1px solid rgb(51, 62, 68) !important;
}

.canvasjs-chart-toolbar img {
    height: 18px !important;
}

/* Spez. Layout 2018-Klasse NEUE DEFAULT-BOX!*/

.popup2018 .fancybox-skin {
    padding: 0 !important;
}

.popup2018 .fancybox-inner {
    min-width: 400px !important;
    overflow-y: auto;
    /*overflow: visible !important;*/
}

.popup2018 .fancybox-inner div.header,
.popup2018 div.header {
    letter-spacing: 2px;
    padding: 12px;
    background-color: var(--primary-color);
    color: #fff;
    text-transform: uppercase;
}

.popup2018 .fancybox-inner div.content,
.popup2018 div.contentpopup,
.popup2018 div.content {
    padding: 12px;
    -webkit-box-sizing: border-box;
    /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;
    /* Firefox, other Gecko */
    box-sizing: border-box;
    /* Opera/IE 8+ */
}

.popup2018 table {
    width: 100%;
}

.popup2018 table th {
    padding: 3px 4px 3px 4px;
    font-size: 13px;
}

.popup2018 table td {
    padding: 7px 4px 7px 4px;
}

.popup2018 h2,
.popup2018 table th {
    font-family: "roboto-condensed-regular";
    color: var(--primary-color);
    font-size: 15px;
    margin-top: 0;
    margin-bottom: 8px;
    position: relative;
}

.popup2018 table.table_2018 th {
    position: unset;
}

.popup2018 h2.underline:after {
    border-top: 1px solid #dfdfdf;
    content: "";
    margin: 0 auto;
    /* this centers the line to the full width specified */
    position: absolute;
    /* positioning must be absolute here, and relative positioning must be applied to the parent */
    top: 20px;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
}

/* .popup2018 form div {
    margin-bottom:10px;
} */

.popup2018 form#form_antwortform div {
    margin-bottom: 0;
}




/*Nachbereitung*/

.nachbereitung .dropdown-elements {
    bottom: auto;
    top: 20px;
    width: 115px;
}

.nachbereitung .personal-einsatz .dropdown-elements a {
    font-size: 13px !important;
    color: var(--primary-color) !important;
    background: none !important;
}

.nachbereitung .personal-header>div:first-child {
    width: 18%;
}

.nachbereitung .personal-header .vertrag {
    margin-left: 0;
    position: absolute;
    bottom: 15px;
    right: 15px;
}

.nachbereitung .personal-header .grid-50:first-child span {
    min-width: 40px;
}

.nachbereitung .personal-header {
    padding-bottom: 60px;
}

#page #right .content .nachbereitung .personal-header p {
    padding: 0;
    margin: 0;
}

.nachbereitung .personal-header+.gridcontainer {
    margin-top: 15px !important;
}

.nachbereitung .personal-header p span {
    font-size: 11px !important;
}

.nachbereitung .personal-header p {
    line-height: 1.7;
}

.nachbereitung>div+div {
    margin-top: 15px !important;
}

.nachbereitung .personal-header h3 {
    line-height: 1.3;
    font-size: 43px;
    margin-bottom: 0;
    margin-top: 0;
}

.nachbereitung .kommentar {
    display: block;
    margin-top: 32px;
    color: #afb2b4;
}

.nachbereitung .personal-merkmal-bar {
    position: absolute;
    top: 0;
    left: 163px !important;
    width: 165px;
    height: 29px;
    padding: 5px 0;
    box-sizing: border-box;
}

.kommentar i {
    color: #8a8f92;
    font-size: 25px;
    margin-right: 15px;
}

#page #right .content .nachbereitung .flex-table p {
    margin: 0;
    padding: 0;
}

.nachbereitung .flex-table .grid-25:first-child p b {
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 1px;
}

/* flex-table */

.flex-table .grid {
    padding-top: 0 !important;
}

.flex-table.gridcontainer,
.flex-table .gridcontainer {
    margin-top: 0;
}

.flex-table .grid>div {
    background: var(--light-color);
    height: 100%;
    box-sizing: border-box;
    padding: 15px;
}

.flex-table:nth-child(odd) .grid div {
    background: #fff;
}

.flex-table td {
    line-height: 1.7;
    padding: 0 !important;
}

.flex-table i {
    margin-right: 10px;
    font-size: 20px;
}

#vollbild .content .flex-table table td,
#page #right .content .flex-table table td {
    background: none;
}


#div_datenschutz_bestaetigung_bg,
#div_popup2018_1_bg {
    position: fixed;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
    background-color: rgba(0, 0, 0, 0.6);
    opacity: 1;
}

#div_datenschutz_bestaetigung_content,
#div_popup2018_1 {
    width: 450px;
    z-index: 20000;
    background-color: #fff;
    padding: 0;
    overflow-y: auto;
    max-height: 90vh;
    height: auto !important;
    position: relative;
    top: 0 !important;
    margin-left: 42px;
    left: 0;
    -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 10px 25px rgba(0, 0, 0, 0.5);
}

#div_datenschutz_bestaetigung_content .inside {
    padding: 15px !important;
}

#div_datenschutz_bestaetigung_content .inside th {
    font-weight: bold;
    text-align: left;
}

#div_datenschutz_bestaetigung_content .inside table {
    width: 100%;
}

#div_popup2018_1_bg>div {
    display: flex;
}

#div_popup2018_1_bg>div>.close-wrapper {
    display: flex;
    position: relative;
    width: 42px;
    height: 42px;
    background: var(--primary-color);
    border-radius: 50%;
    border: 3px solid #fff;
    top: -21px;
    left: -21px;
    z-index: 30000;
}

#div_popup2018_1_bg>div>.close-wrapper>.closebutton {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    cursor: pointer;
    width: 100%;
    height: 100%;
    font-size: 24px;
}

/* Kalender unter Startseite */
#div_kalender_popup {
    display: none;
    z-index: 1000;
    position: absolute;
    width: 350px;
    min-height: 190px;
    overflow: auto;
    background-color: #fff;
    -webkit-box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.75);
    box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.75);
}

#div_kalender_hoverpopup {
    display: none;
    z-index: 500;
    position: absolute;
    min-width: 350px;
    min-height: 10px;
    overflow: auto;
}

#div_kalender_popup .header,
#div_kalender_hoverpopup .header {
    margin: 0px 0px 0px 0px;
    height: 20px;
    color: #fff;
    padding-left: 3px;
    padding-right: 3px;
    line-height: 20px;
}

#div_kalender_popup .popup_content {
    padding: 15px;
    text-transform: uppercase;
}


.checkbox-button.kalender_button label {
    padding: 15px 10px 15px 24px;
}

.checkbox-button.kalender_button label+div {
    position: absolute;
    top: 5px;
    left: 5px;
    z-index: 1;
    height: 20px;
    width: 20px;
    margin: 0;
    font-size: 11px;
    line-height: 19px;
    color: #fff;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    cursor: pointer;
    z-index: 30;
    text-align: center;
}

.loading {
    text-align: center;
    padding-top: 125px;
}

#div_kalender_content .fixed_top,
.module-definieren-table .fixed_top {
    position: fixed;
    top: 0;
    z-index: 1000;
}

#div_kalender_content .header,
.module-definieren-table .fixed_top {
    display: block;
}

#div_kalender_content .header_inside {
    float: left;
    width: 24px;
    height: 24px;
    background-color: #f0f0ef;
    font-size: 10px;
    font-weight: bold;
    text-align: center;
    line-height: 23px;
}

#div_kalender_content .days {
    position: relative;
    display: flex;
    display: -ms-flexbox;
    border-bottom: 1px solid #d6d6d5;
}

#div_kalender_content .days:after,
#div_kalender_content .header:after {
    content: '';
    display: block;
    clear: both;
}

#div_kalender_content .days_inside,
#div_kalender_content .days_nothing {
    float: left;
    width: 24px;
    min-height: 140px;
    background-color: #fff;
    text-align: center;
}

#div_kalender_content .days_inside {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    border-right: 1px solid #d6d6d5;
}

#div_kalender_content .days_nothing {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='22'><line x1='0' y1='22' x2='24' y2='0' style='stroke:rgb(230,230,230);stroke-width:1' /><line x1='0' y1='11' x2='12' y2='0' style='stroke:rgb(230,230,230);stroke-width:1' /><line x1='12' y1='22' x2='24' y2='11' style='stroke:rgb(230,230,230);stroke-width:1' /></svg>");
}

#div_kalender_content .days_inside.satsun {
    background-color: #dddedd;
}

#div_kalender_content .days_inside.second {
    background-color: #f0f0ef;
}

#div_kalender_content .days_inside .dayOfMonth {
    font-size: 10px;
}

#div_kalender_content .days_inside.first {
    border-left: 1px solid #d6d6d5;
}

#div_kalender_content .days_inside .dummy {
    width: 24px;
    height: 21px;
    position: relative;
}

#div_kalender_content .days_inside .eintrag {
    position: absolute;
    z-index: 1;
    height: 20px;
    width: 20px;
    margin: 0px 2px 0px 2px;
    font-size: 11px;
    line-height: 19px;
    color: #fff;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    cursor: pointer;
    z-index: 30;
}

#div_kalender_content .days_inside .eintrag_balken {
    position: absolute;
    z-index: 1;
    height: 20px;
    font-size: 11px;
    line-height: 19px;
    color: #fff;
    cursor: pointer;
    text-align: left;
    z-index: 30;
}

#div_kalender_content .days_inside .eintrag_balken.border-left {
    -webkit-border-top-left-radius: 10px;
    -moz-border-top-left-radius: 10px;
    border-top-left-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -moz-border-bottom-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

#div_kalender_content .days_inside .eintrag_balken.border-right {
    -webkit-border-top-right-radius: 10px;
    -moz-border-top-right-radius: 10px;
    border-top-right-radius: 10px;
    -webkit-border-bottom-right-radius: 10px;
    -moz-border-bottom-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

#div_kalender_content .days_inside .eintrag_balken.planung {
    opacity: 0.66;
    filter: alpha(opacity=66);
    /* For IE8 and earlier */
    z-index: 20;
}

#div_kalender_content .days_inside .eintrag_balken.aufabbau {
    opacity: 0.33;
    filter: alpha(opacity=33);
    /* For IE8 and earlier */
    z-index: 10;
}


#div_kalender_content .days_inside .eintrag_meilenstein span {
    height: 19px;
    width: 20px;
    line-height: 1;
    font-size: 8px;
}

#div_kalender_content .days_inside .eintrag_meilenstein {
    position: absolute;
    z-index: 1;
    height: 20px;
    width: 20px;
    line-height: 1.5;
    border-radius: 30px;
    font-size: 6.5px;
    cursor: pointer;
    margin-left: 1px;
}

#div_kalender_content .days_month {
    float: left;
    width: 20px;
    min-height: 140px;
    font-size: 11px;
    font-weight: bold;
    background-color: #fff;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    border-right: 1px solid #d6d6d5;
    display: flex;
    align-items: center
}

.vertical-divider {
    font-size: 20px;
    color: #ccc;
    margin: 0 10px;
}


.msg_error-text {
    padding: 15px;
    padding-left: 65px;
    margin: 0 0 20px 0;
    background-color: #c13333;
    color: #fff;
    border: none;
    position: relative;
}

.msg_error-text:before {
    position: absolute;
    font: normal normal normal 14px/1 FontAwesome;
    left: 15px;
    font-size: 14px;
    top: 15px;
    border-radius: 100px;
    border: 2px solid #ffffff;
    padding: 8px 13px;
    color: #ffffff;
    cursor: pointer;
    content: "\f12a";
}

.msg_error-text span.kommentar_high_prio {
    color: #c13333;
    font-family: "roboto-condensed-light";
    margin: 20px 0;
    padding: 0 13px;
    display: inline-block;
    background: #fff;
    font-size: 23px;
}

.msg_error-text span {
    padding: 3px 7px;
}

.msg_error_inline {
    color: #c13333;
}

.msg_notice_inline {
    color: #FFC !important;
}


/* Tiny MCE */

.mce-txt,
.mce-ico {
    color: #fff !important;
}

/*Designanpassungen 09/2018*/

#vollbild .buttonlist ul .deaktiviert:hover,
#page #right .buttonlist ul .deaktiviert:hover {
    background-color: #646f75;
    cursor: default;
}

.kasten .grid-50 textarea {
    resize: vertical;
}

.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
    padding: 0;
}

.ui-widget-content .ui-datepicker-prev.ui-state-hover,
.ui-widget-header .ui-datepicker-next.ui-state-hover {
    border: 0 !important;
    background: none !important;
    top: 10px;
}

.ui-widget-header .ui-datepicker-next.ui-state-hover .ui-icon,
.ui-widget-header .ui-datepicker-prev.ui-state-hover .ui-icon {
    background-image: url(images/ui-icons_ffffff_256x240.png) !important;
    background-color: #fff;
    border-radius: 10px;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    top: 10px !important;
}

.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
    background: #c4954f url(images/ui-bg_highlight-soft_75_ffe45c_1x100.png) 50% top repeat-x !important;
    color: #ffffff !important;
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
    border: none !important;
    color: #646f75 !important;
    font-weight: normal !important;
}

.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight,
.ui-widget-content .ui-state-hover {
    background: #c4954f url(images/ui-bg_highlight-soft_75_ffe45c_1x100.png) 50% top repeat-x !important;
    color: #ffffff !important;
}

.ui-datepicker table {
    color: #fff !important;
    font-weight: 100 !important;
}

.ui-datepicker .ui-datepicker-header {
    border: 1px solid #646f75;
    border-radius: 0 !important;
    background-color: var(--light-color);
    margin-top: -10px !important;
    margin-left: -10px !important;
    margin-right: -10px !important;
    padding: 7px !important;
}

.ui-datepicker th {
    font-weight: normal !important;
}

#ui-datepicker-div {
    border: 0;
    border-radius: 0;
    background: #646f75;
    padding: 10px;
}

.text-overflow {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

table.slotchecker--table a.flex {
    display: flex;
}

table.slotchecker--table>tbody>tr:nth-of-type(odd)>td {
    border: none !important;
}

.slotchecker--header a {
    text-decoration: none !important;
}

.slotchecker--header a:hover h2 {
    color: var(--secondary-color);
}

.action-set-list input {
    background: #c4954f !important;
}

#vollbild .content table.simplegrid tr,
#vollbild .content table.simplegrid td,
#vollbild .content table.simplegrid th,
#page #right .content table.simplegrid tr,
#page #right .content table.simplegrid td,
#page #right .content table.simplegrid th {
    padding: 2px 3px;
}

#vollbild .content table.simplegrid td,
#vollbild .content table.simplegrid th,
#page #right .content table.simplegrid td,
#page #right .content table.simplegrid th {
    border-right: 0px;
    border-left: 0px;
    border-bottom: 1px solid black;
}


.icon-picker .remove-icon {
    background-color: #646f75;
    color: #ffffff !important;
    border-radius: 0;
    transition: background .2s ease-out;
    position: absolute;
    top: -12px;
    left: 22px;
    font-size: 18px !important;
    width: 18px !important;
    height: 18px !important;
}

.accordion_button {
    float: right;
    padding: 5px;
}

.accordion_button a {
    background: #646f75;
    display: inline-block;
    margin-bottom: 10px;
    color: #fff !important;
    padding: 12px 20px 12px 20px;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 1.5px;
    font-family: "open-sans-regular";
    text-decoration: none;
    text-align: center;
    line-height: 1.6;
}

.accordion_button i {
    font-size: 16px;
    margin-right: 5px;
}

.accordion_button a:hover {
    background-color: #afbcc3;
    text-decoration: none !important;
}

.kassenschulung iframe {
    width: 100%;
}

#vollbild td form input[type='button'],
#page #right td form input[type='button'] {
    width: 100%;
}

#vollbild .content #searchresults li a,
#vollbild .content #searchresults_tresen li a,
#page #right .content #searchresults li a,
#page #right .content #searchresults_tresen li a {
    text-decoration: none;
    color: var(--primary-color);
}

.form-meldelisten span select {
    width: auto;
}

.meldelisten-personzahl #personenzahl {
    min-height: 41px;
}

/*Lexware Export*/

.lexware table td:last-child {
    min-width: 150px;
}


/*Table Iconpicker*/

#vollbild table .em_iconpicker button,
#page #right table .em_iconpicker button {
    background: transparent;
    padding: 11px 15px;
    width: 100%;
    color: var(--primary-color) !important;
    font-size: 13px;
    border: 1px solid #ccc;
}

#vollbild table .em_iconpicker button:hover,
#page #right table .em_iconpicker button:hover {
    background: #e2e1e1;
}

#vollbild table .em_iconpicker button:focus,
#page #right table .em_iconpicker button:focus {
    outline: none;
}

.em_iconpicker>div:first-of-type {
    box-shadow: none;
}

@media only screen and (max-width: 925px) {

    #bewerber_page .logo_wrap img {
        width: 100%;
    }

}

@media only screen and (max-width: 500px) {

    #bewerber_page .logo_wrap img {
        width: 100%;
    }

    .flex {

        display: block;
    }

    #umsatzmeldung_page .flex .grid-50,
    #umsatzmeldung_page .flex .grid-50 input,
    #bewerber_page .flex .grid-50,
    #bewerber_page .flex .grid-50 input {
        width: 100% !important;
    }

    div.kasten {
        padding: 30px 10px;
    }

}



/*

    .table-fixed{
        width: 100%;
        background-color: #f3f3f3;
    }

    .table-fixed tbody {
        height:200px;
        overflow-y:auto;
        width: 100%;
        }

    thead,tbody,tr,td,th {
      display:block;
    }

    tbody td{

        float:left;
      }

    thead tr th{

          float:left;
         background-color: #f39c12;
         border-color:#e67e22;
        }
*/


/*emotivo table style*/

.emotivotableliststyle i:before {
    font-size: 15px;
}

.emotivotableliststyle th {
    font-size: 14px !important;
}


/*personal mekrmale*/

#vollbild .content .personal-merkmale td,
#page #right .content .personal-merkmale td {
    padding: 10px;
}

#vollbild .content .personal-merkmale tr:nth-child(odd) td:not(:last-child),
#page #right .content .personal-merkmale tr:nth-child(odd) td:not(:last-child) {
    padding: 10px 2px;
}

#vollbild .content .personal-merkmale tr:nth-child(4n) td,
#page #right .content .personal-merkmale tr:nth-child(4n) td {
    background-color: var(--light-color);
}

/* Table Padding small */
#vollbild .content .table-padding-small td,
#page #right .content .table-padding-small td {
    padding: 15px 3px 15px 3px;
}

#vollbild .content .input-padding-small input,
#vollbild .content .input-padding-small select,
#vollbild .content .input-padding-small input,
#vollbild .content .input-padding-small select {
    padding-left: 7px !important;
    padding-right: 7px !important;
}


/* va-planung module verwalten */
div.modules {
    display: flex;
    flex-wrap: wrap;
    margin: 1rem 0;
}

div.modules>div {
    margin-right: .5rem;
    margin-bottom: .5rem;
    padding: .4rem .5rem;
    border: 1px solid rgba(0, 0, 0, .1);
    border-radius: 6px;
    cursor: pointer;
}

/* va-planung module images */
.va-img-small {
    max-width: 115px;
    max-height: 80px;
}

.va-img-medium {
    max-width: 160px;
    max-height: 120px;
}

.va-img-large {
    max-height: 254px;
    max-width: 360px;
}

div.image-hover-container {
    position: relative;
}

.image-hover-activate:hover>div.image-hover {
    display: flex;
}

div.image-hover {
    display: none;
    flex-direction: column;
    top: calc(100% + 1.5rem);
    position: absolute;
    box-shadow: 0px 0px 8px #666;
    padding: .5rem;
    background-color: white;
    z-index: 1;
}

div.image-hover>span {
    font-size: 10px;
    color: black;
    text-transform: none;
}

div.image-hover>img {
    left: 0;
    right: 0;
    width: auto;
    height: auto;
    max-width: 100%;
    background-color: rgba(255, 255, 255, 1);
    border: 1px solid rgba(0, 0, 0, .25);
    padding: 0;
}

#vollbild .content .reporting-table td.small-column,
#page #right .content .reporting-table td.small-column {
    width: 50px;
}

/*Button outlined*/

.button.button-outlined,
.button-new.button-outlined {
    background: transparent;
    border: 1px solid #9ba5ab;
    color: var(--primary-color) !important;
}

.button.button-outlined:hover,
.button-new.button-outlined:hover,
.button.button-outlined:focus,
.button-new.button-outlined:focus,
.button.button-outlined:active,
.button-new.button-outlined:active,
.button.button-outlined.active,
.button-new.button-outlined.active {
    border: 1px solid #c4954f;
    color: #c4954f !important;
    background: transparent !important;
}

/*Tiny MCE*/

.mce-tinymce .mce-menubar {
    border: none;
}

.mce-colorbutton .mce-preview {
    display: none !important;
}

.mce-menubtn button,
.mce-tinymce button {
    min-height: 25px !important;
}

#vollbild .mce-tinymce button:hover,
#page #right .mce-tinymce button:hover {
    background: #d9dadb !important
}

#vollbild .mce-tinymce button,
#page #right .mce-tinymce button {
    background: var(--light-color) !important;
    border: 1px solid #d9dadb !important;
}


.mce-tinymce .mce-btn-group {
    border: none !important;
}

#vollbild .mce-txt,
.mce-ico,
#page #right .mce-txt,
.mce-ico {
    color: #646f75 !important;
}

#vollbild i.mce-i-backcolor,
#page #right i.mce-i-backcolor {
    background: #dfdfdf;
}

#vollbild .mce-caret,
#page #right .mce-caret {
    border-top: 4px solid #646f75 !important;
}

#vollbild .mce-toolbar .mce-btn-group,
#page #right .mce-toolbar .mce-btn-group {
    padding: 2px 0;
    padding-top: 0px;
}


/*****************************

Einsatzplan V2 (Slotty)

******************************/

div.row-EPv2-center {
    margin: 0px 260px 0px 260px;
    padding: 15px;
}

div.row-EPv2-center .content_middle {
    background-color: #fff;
    padding: 20px 10px;
}

div.row-EPv2-center .content_middle h2 {
    margin-bottom: 15px;
    margin-top: 15px;
    font-size: 18px;
    height: 100%;
}

/* Overlay linker und rechter Rand */
div.overlay-EPv2,
div.overlay-Workbench {
    width: 260px;
    height: 100%;
    background-color: #fff;
    top: 0px;
    padding: 0px;
    position: fixed;
    z-index: 1;
    box-shadow: -5px 0 10px 0 rgba(0, 0, 0, 0.09);
}

div.overlay-EPv2 {
    overflow-y: scroll;
}


div.overlay-EPv2.left,
div.overlay-Workbench.left {
    left: 0px;
}

div.overlay-EPv2.right,
div.overlay-Workbench.right {
    right: 0px;
}

div.overlay-EPv2 .header,
div.overlay-Workbench .header {
    letter-spacing: 2px;
    padding: 12px;
    background-color: var(--primary-color);
    color: #fff;
    text-transform: uppercase;
    border-bottom: 1px solid var(--light-color)2b;
}

div.overlay-EPv2 .content,
div.overlay-Workbench .content {
    min-width: 0px !important;
    margin: 12px;
}

div.overlay-EPv2 .content input[type=text],
div.overlay-Workbench .content input[type=text] {
    width: 215px;
    border: 1px solid #BBB;
}

.button-EPV2 {
    background-repeat: no-repeat;
    cursor: pointer;
    font-size: 13px;
    margin: 0px 3px 0px 0px !important;
}

div.qualiselect {
    margin: 10px;
    flex-wrap: wrap;
}

div.overlay-EPv2 .mitarbeiterContainer {
    cursor: pointer;
    background-color: #fff;
    width: 100%;
    min-height: 40px;
    padding: 10px;
    box-sizing: border-box;
}

div.overlay-EPv2 .mitarbeiterContainerDisabled {
    cursor: auto !important;
    background-color: #e0a4ac;
}

div.EPv2-anwesend {
    background-color: green !important;
}

div.EPv2-abwesend {
    background-color: red !important;
}

div.EPv2-abgereist {
    background-color: LightSalmon !important;
}

.EPv2-stats-item {
    border: none !important;
    background-color: transparent !important;
    margin-top: -3px !important;
}

.epv2-btn-heading {
    font-size: 12px !important;
}

#EPv2 .loading {
    text-align: center;
    padding-top: 40px;
}

#EPv2 #tbl_timeline td,
#EPv2 #tbl_timeline th {
    text-align: center;
    padding: 5px !important;
    margin: 0;
}

#EPv2 #tbl_timeline .hour {
    background-color: #efefef !important;
}

#EPv2 #tbl_timeline tr.border-bottom td {
    border-bottom: 1px solid var(--primary-color);
    font-weight: bold;
    font-family: "open-sans-bold";
    font-weight: 500;
}

#EPv2 #tbl_timeline tr.border-top td {
    border-top: 1px solid var(--primary-color);
}

#EPv2 #tbl_timeline .fixedcol {
    position: absolute;
    width: 40px;
    left: 0;
    top: auto;
    border-top-width: 1px;
    /*only relevant for first row*/
    /* margin-top: -1px; */
    /*compensate for top border*/
}

#EPv2 #tbl_timeline {
    display: table;
    border-collapse: separate;
    position: static !important;
}

#EPv2 #tbl_timeline td.small {
    font-size: 9px;
}

#EPv2 .epv2_name {
    padding: 0px 3px 0px 0px;
}

/* alternating backgrounds */
.vis-time-axis .vis-grid.vis-h1,
.vis-time-axis .vis-grid.vis-h3,
.vis-time-axis .vis-grid.vis-h5,
.vis-time-axis .vis-grid.vis-h7,
.vis-time-axis .vis-grid.vis-h9,
.vis-time-axis .vis-grid.vis-h11,
.vis-time-axis .vis-grid.vis-h13,
.vis-time-axis .vis-grid.vis-h15,
.vis-time-axis .vis-grid.vis-h17,
.vis-time-axis .vis-grid.vis-h19,
.vis-time-axis .vis-grid.vis-h21,
.vis-time-axis .vis-grid.vis-h23 {
    background: #f5f5f5;
}

/* Margin oben, um Summen anzuzeigen
.vis-group, .vis-label {
    margin-top:20px;
} */

/* Einträge Hintergrundfarben der verschiedenen Qualifikationen */
.vis-group.default .vis-item {
    background-color: #CCCCCC;
}

.vis-group.barchef .vis-item {
    background-color: rgba(103, 202, 136, 0.6);
}

.vis-group.co-barchef .vis-item {
    background-color: rgba(149, 202, 103, 0.6);
}

.vis-group.zapfer .vis-item {
    background-color: rgba(210, 205, 1, 0.6);
}

.vis-group.verkaeufer .vis-item {
    background-color: rgba(64, 200, 202, 0.6);
}

.vis-group.vorbereiter .vis-item {
    background-color: rgba(115, 103, 202, 0.6);
}

.vis-group.kassierer .vis-item {
    background-color: rgba(201, 202, 103, 0.6);
}

.vis-group.cocktail .vis-item {
    background-color: rgba(158, 158, 79, 0.6);
}

.vis-group.auf-abbauer .vis-item {
    background-color: rgba(37, 241, 243, 0.6);
}

.vis-group.lkw-fahrer .vis-item {
    background-color: rgba(141, 239, 217, 0.6);
}

.vis-group.staplerfahrer .vis-item {
    background-color: rgba(5, 204, 206, 0.6);
}

.vis-group.telestaplerfahrer .vis-item {
    background-color: rgba(0, 171, 173, 0.6);
}

.vis-group.techniker .vis-item {
    background-color: rgba(27, 133, 212, 0.6);
}

.vis-group.logistiker .vis-item {
    background-color: rgba(103, 201, 202, 0.6);
}

.vis-group.getraenke-rucksack .vis-item {
    background-color: rgba(202, 103, 103, 0.6);
}

.vis-group.barista .vis-item {
    background-color: rgba(165, 48, 48, 0.6);
}

.vis-group.check-in-tresen .vis-item {
    background-color: rgba(202, 168, 103, 0.6);
}

.vis-group.tresenkraft .vis-item {
    background-color: rgba(127, 68, 171, 0.6);
}

.vis-group.servicekraft .vis-item {
    background-color: rgba(45, 27, 175, 0.6);
}

.vis-group.hostess .vis-item {
    background-color: rgba(197, 103, 202, 0.6);
}

.vis-group.garderobe .vis-item {
    background-color: rgba(162, 2, 171, 0.6);
}


/* Einträge innerhalb */
.vis-item-content .ep-eintrag {
    display: flex;
    align-items: center;
    background-color: #f8f8f8;
    border-radius: 10px;
    padding: 1px 3px 1px 5px;
    margin-left: 4px;
    position: relative;
    overflow: hidden;
    min-width: 150px;
    /* width: -webkit-calc(100% - 14px) !important;
    width:    -moz-calc(100% - 14px) !important;
    width:         calc(100% - 14px) !important; */
}

.vis-item-content {
    width: 100%;
}

.vis-item-content .pause-EPv2 {
    position: absolute;
    background-color: rgb(250, 107, 107);
    height: 4px;
    top: 0px;
    z-index: 10;
}

.vis-timeline {
    background: var(--light-color);
}

.vis-item.vis-background .vis-item-content {
    font-size: 11px;
    color: #838383;
}

/* Lösung für Border von Slots und Stats in der ERinsatzplan Tabelle

.gruppe-stats,
.vis-foreground .vis-group {
    border: none !important;
}


.vis-labelset .vis-label {
    border-bottom: none !important;
}

.gruppe-slots {
    border-top: 1px solid #bfbfbf !important;
}

.vis-time-axis .vis-text {
    font-size: 11px;
    text-align: center;
}

.vis-labelset .vis-label {
    font-weight: bold;
}

.vis-time-axis .vis-text div:first-child {
    font-size: 12px;
    padding: 0px 5px;
    text-transform: uppercase;
    font-weight: bold;
}*/

.vis-time-axis .vis-text {
    font-size: 11px;
    text-align: center;
}

.vis-labelset .vis-label {
    font-weight: bold;
}

.vis-time-axis .vis-text div:first-child {
    font-size: 12px;
    padding: 0px 5px;
    text-transform: uppercase;
    font-weight: bold;
}

.kuenstler_kreis,
.bedarfzeit_kreis {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    margin: 0 auto;
}

.kuenstler_kreis {
    background-color: rgb(216, 153, 143);
}

.kuenstler_kreis>svg {
    padding: 0 2px 2px 0;
}

.bedarfzeit_kreis {
    background-color: rgb(143, 144, 216) !important;
}

.bedarfzeit_kreis>svg {
    padding: 0 2px 2px 0;
}

.vis-item.vis-line.bedarfzeit-line {
    height: 100%;
    bottom: 0px;
    border: 0;
    width: 1px;
    top: 0 !important;
    box-shadow: 0px 0px 0px 1px rgb(143, 144, 216) !important;
    background-color: rgb(143, 144, 216) !important;
}


div.vis-panel.vis-center>div.vis-content>div>div.vis-background>div.vis-group.default.kuenstler>div {
    height: 100%;
    bottom: 0px;
    border: 0;
    width: 1px;
    top: 0 !important;
    box-shadow: 0px 0px 0px 1px #d8998f;
    background-color: #d8998f;
}

#epContainer_469>div>div.vis-panel.vis-background.vis-vertical>div.vis-axis>div.vis-group.default.kuenstler {
    display: none;
}

/* Testweise */
/* BÖSE! Wofür ist / war das?
.vis-item-overflow {
    display: flex;
    justify-content: center;
} */

/*Einsatzplan V2 */

.div_einsatzplan_content .action-buttons {
    float: right;
    margin: 15px 0px 0px 0px;
}

.div_einsatzplan_content .action-buttons a {
    padding: 3px 10px 3px 10px;
    font-size: 22px;
    color: #434e54 !important;
    border: 3px solid #d1d1d1;
}

#div_pseudoItemAdd:hover {
    cursor: grab;
}

.vis-item-content:hover {
    cursor: pointer;
}

.vis-item {
    border-color: #a5dfb9 !important;
    border-radius: 0 !important;
}

.vis-dot {
    border: 0 !important;
}

/* .vis-group.default .vis-item {
    border-color: #CCCCCC !important;
} */

.vis-item.vis-selected {
    border: 1px dashed var(--primary-color) !important;
    box-shadow: 2px 3px 25px rgba(0, 0, 0, 0.15);
}

.vis-item .vis-item-content {
    padding: 8px !important;
}

#divDirektbelegung input,
#divDirektbelegung select,
#divPool input,
#divPool select {
    background: var(--light-color);
    width: 100%;
}

#divPool input[type="button"] {
    background: #646f75;
}

#divPool .dropdown-elements.left {
    left: -54px;
}

#divDirektbelegung .content,
#divPool .content {
    margin-bottom: 0 !important;
}

#divDirektbelegung .content+.content,
#divPool .content+.content {
    padding-top: 0;
}

#divDirektbelegung .dropdown-elements.left {
    right: -103px;
}

#divDirektbelegung .grid {
    padding-left: 7px !important;
    padding-top: 7px !important;
}

#divDirektbelegung .grid p {
    padding-bottom: 5px !important;
}

#divDirektbelegung .gridcontainer {
    margin-left: -7px;
    margin-top: -7px;
}

#divDirektbelegung .element-plan {
    padding: 10px;
    background: #d9dadb;
    margin-right: -12px;
    margin-left: -12px;
}

#divDirektbelegung input[type='submit'] {
    height: 28px !important;
}

#divPool .msg_notice {
    background: #fff;
}

#div_zwischenspeicherSlot img.profil_mini,
#div_poolContent img.profil_mini,
#div_infoSlot img.profil_mini,
#div_direktbelegungSearchresult img.profil_mini {
    max-width: 70px;
    max-height: 70px;
}

#div_newSlot .gridcontainer .grid:first-child,
#form_editSlot .gridcontainer .grid:first-child {
    border-right: 1px solid #d9dadb;
}

#div_zwischenspeicherSlot .mitarbeiterContainer,
#div_poolContent .mitarbeiterContainer,
#div_infoSlot .mitarbeiterContainer {
    color: var(--primary-color);
}

#div_direktbelegungSearchresult {
    font-size: 10px;
}

.link-container+div {
    border-top: 1px solid #ddd;
    margin-top: 15px;
    padding-top: 15px;
}

div.overlay-EPv2 .content,
div.overlay-Workbench .content {
    box-sizing: border-box;
    padding: 12px;
    margin: 0;
}

#div_zwischenspeicherSlot .kein-eintrag,
#div_infoSlot .kein-eintrag {
    background-color: #d9dadb !important;
    border-radius: 0 !important;
    font-size: 11px;
    margin: -12px -12px -12px -12px;
    padding: 12px;
}

#div_zwischenspeicherSlot+.header+div .checkbox {
    margin: 0;
}

#div_poolContent .link-container a {
    color: var(--primary-color) !important;
    text-transform: uppercase;
    text-decoration: underline !important;
    font-size: 11px;
}

.vis-item .vis-delete-rtl:after,
.vis-item .vis-delete:after {
    color: #c13333 !important;
}


.vis-item .vis-delete-rtl:hover,
.vis-item .vis-delete:hover {
    background: #c13333 !important;
    padding: 4px !important;
    height: 23px !important;
    width: 23px !important;
    line-height: 1 !important;
}

.vis-item .vis-delete-rtl:hover:after,
.vis-item .vis-delete:hover:after {
    color: #fff !important;
}


.ep-eintrag svg {
    padding: 0 3px 0 0;
    /* padding-right: 6px;  */
}

div.overlay-EPv2.right,
div.overlay-Workbench.right {
    z-index: 2;
}

/*.ep-eintrag {
    position: relative;
}

.ep-eintrag:after {

    content: "\f7a5";
    font-family: FontAwesome;
}*/
#div_vertragslog_maincontent .personal-header {
    padding: 15px !important;
}

#div_vertragslog_maincontent .personal-header>div {
    width: 12%;
}

#div_vertragslog_maincontent .personal-header .grid-80 {
    height: 115px;
}

#div_vertragslog_maincontent .personal-header>div img {
    margin: 0;
    box-sizing: border-box;
    padding: 0 20px 0 0;
    width: 100% !important;
}

#div_vertragslog_maincontent .personal-header h3 {
    font-size: 25px;
}

#div_vertragslog_maincontent .personal-einsatz {
    position: absolute;
    right: 15px;
    top: 15px;
    width: initial !important;
}

#page #right #EPv2 .content .content_top:not(:first-child),
#EPv2 .content .content_top:not(:first-child),
#page #right .content_top.hellgrau {
    background-color: #d9dadb;
    font-size: 12px;
    font-family: "open-sans-bold" !important;
    font-weight: 500;
    color: var(--primary-color);
}

b {
    font-family: "open-sans-bold";
    font-weight: 500;
}

#EPv2 .content .content_top p,
#EPv2 .content .content_top span,
#EPv2 .content .content_top small {
    font-family: "open-sans-bold" !important;
    font-weight: 500;
    padding: 0 !important;
}

#EPv2 .content .content_top img {
    padding: 0;
}

div[id^='epContainer_'].qualistatistik_active>div>div.vis-panel.vis-left>div.vis-content>div>div:nth-of-type(odd):not(:nth-last-child(3)):not(:nth-last-child(1)),
div[id^='epContainer_'].qualistatistik_active>div>div.vis-panel.vis-center>div.vis-content>div>div.vis-foreground>div:nth-of-type(odd):not(:nth-last-child(3)):not(:nth-last-child(1)) {
    border-bottom: 0 !important;
}

#div_container_statistik_werte th,
#div_container_statistik_werte tr td:first-child {
    font-family: "open-sans-bold";
    font-weight: 500;
}


.popup2018 #div_vertragslog_maincontent table td {
    padding: 5px 3px 5px 3px;
}

.popup2018 #div_vertragslog_maincontent table th {
    position: unset;
    line-height: 1.5;
    text-align: left;
}

.popup2018 #div_vertragslog_maincontent .grid {
    border-right: 1px solid #e8e8e8;
    padding-right: 12px;
}

.popup2018 #div_vertragslog_maincontent .grid:last-child {
    border-right: none;
    padding-right: 0;
}

.popup2018 a {
    color: var(--primary-color);
    text-decoration: none;
}

.popup2018 a:hover {
    text-decoration: underline;

}

.checkbox-buttonlist {
    position: relative;
    margin: 0 !important;
}

.checkbox-buttonlist input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    width: 100%;
    height: 100% !important;
}

.checkbox-buttonlist label {
    background-color: whitesmoke;
    padding: 5px 10px;
    border: 1px solid #e7e7e7;
    border-radius: 9px;
    color: #a7a7a7;
    display: block;
    line-height: 1.5;
    font-size: 12px;
}

.checkbox-buttonlist input[type=checkbox]:hover+label,
.checkbox-buttonlist input[type=checkbox]:checked+label {
    color: var(--primary-color);
    border: 1px solid #bfbfbf;
    display: block;
}


/* Gesamtsortiment vollbild */
div.ware-sortiment-vollbild {
    padding: 15px;
}

div.ware-generator-vollbild,
div.ware-sortiment-vollbild .content_middle {
    background-color: #fff;
    padding: 20px 10px;
}

tr.ware_generator_tr.alt td {
    background-color: #f0b9b9 !important;
}

tr.ware_generator_tr.neu td {
    background-color: #FFDEB3 !important;
}

tr.urlaubsplaner_tr.alert td {
    background-color: #f0b9b9 !important;
}

div.ware-sortiment-vollbild .content_middle h2 {
    margin-bottom: 15px;
    margin-top: 15px;
    font-size: 18px;
}


div.becher-gruppe-preview-color {
    height: 15px;
    width: 100px;
    border: 1px solid #000;
}


#page #right tr.personalgetraenk-selected td {
    background-color: #FFC !important;
}


.infohover {
    cursor: help;
}


/* Slider */
.slidecontainer {
    width: 100%;
    /* Width of the outside container */
}

/* The slider itself */
.slider {
    -webkit-appearance: none;
    /* Override default CSS styles */
    appearance: none;
    width: 100%;
    /* Full-width */
    height: 25px;
    /* Specified height */
    background: #d3d3d3;
    /* Grey background */
    outline: none;
    /* Remove outline */
    opacity: 0.7;
    /* Set transparency (for mouse-over effects on hover) */
    -webkit-transition: .2s;
    /* 0.2 seconds transition on hover */
    transition: opacity .2s;
}

/* Mouse-over effects */
.slider:hover {
    opacity: 1;
    /* Fully shown on mouse-over */
}

/* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
.slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    /* Override default look */
    appearance: none;
    width: 25px;
    /* Set a specific slider handle width */
    height: 25px;
    /* Slider handle height */
    background: #04AA6D;
    /* Green background */
    cursor: pointer;
    /* Cursor on hover */
}

.slider::-moz-range-thumb {
    width: 25px;
    /* Set a specific slider handle width */
    height: 25px;
    /* Slider handle height */
    background: #04AA6D;
    /* Green background */
    cursor: pointer;
    /* Cursor on hover */
}

.ware-generator-vollbild .input_artikel_L,
.ware-generator-vollbild .input_artikel_anz {
    width: 75px;
}


/* Telefonlisten */
.div-button-telefonliste {
    margin: 2px;
    padding: 8px 12px 8px 12px;
    color: #fff;
    font-size: 10px;
    text-transform: uppercase;
    cursor: pointer;
    border: 3px solid #d1d1d1;
}

.div-button-telefonliste.active {
    border: 3px solid #dda65a;
}

.td-v-top {
    vertical-align: top;
}

.div-button-telefonliste.wiedervorlage {
    background-color: #a96100;
}

.div-button-telefonliste.kontakt-erfolgreich {
    background-color: #067813;
}

.div-button-telefonliste.kontakt-nicht-erfolgreich {
    background-color: rgb(121, 0, 0);
}

.div-button-telefonliste.neu {
    background-color: #6d6d6d;
}


/* Eventkonfiguration */

ul.ablaufplan-uebersicht {
    list-style: none;
}

.ablaufplan-uebersicht li {
    padding: 10px;
    margin: 8px;
    /* background-color:#d9dadb; */
    border: 1px solid #a7a7a7;
    cursor: grabbing;
}

.ablaufplan-uebersicht li .contentTime {
    float: right;
    margin-right: 20px;
}

.ablaufplan-uebersicht li .contentText {
    float: right;
}



/*Resonsive Header*/

.bewerbung_foodie#page {
    min-width: auto;
}

#page #top {
    min-width: auto;
    min-height: auto;
    line-height: 0;
}

#page #top img {
    position: relative;
    width: 100%;
    top: 0;
    left: 0;
}

#page #top #logo {
    width: auto;
    height: auto;
    position: relative;
    top: 0;
    left: 0;
    margin-bottom: 0 !important;
}

@media (max-width: 576px) {

    #page.bewerbung_foodie #right .content {
        min-width: initial;
    }

    #page.bewerbung_foodie #right .grid-50 {
        width: 100% !important;
    }

}

.border-top {
    border-top: #b4bfc6 solid 1px;
}

.button-light {
    border: #b4bfc6 solid 1px;
    color: #646f75 !important;
    background: none;
    padding: 12px 1px !important;
}

.button-light:active {
    text-decoration: none !important;
    background: #afbcc3 !important;
}

.button-light:hover {
    text-decoration: none !important;
    background: #afbcc3 !important;
    border: #b4bfc6 solid 1px;
}

.justify-between {
    justify-content: space-between;
}

.grid_btn_wrapper {
    display: grid;
    grid-auto-flow: column;
    grid-gap: 3px;
    width: 100%
}

.button-height {
    height: 100% !important;
    ;
}

.grid-78 {
    width: 78%;
}

.unterweisungSlideImage {
    height: 100%;
    width: auto;
    max-width: 100%;
    object-fit: contain;
}

@media only screen and (min-width: 768px) {
    .unterweisungSlideImage {
        max-height: 600px;
    }
}

.fs-base {
    font-size: 15px;
}

.unterweisungHeader {
    position: sticky;
    top: -1px;
    left: 0;
    right: 0;
    padding: 20px 20px 30px 20px;
    background-color: var(--primary-color);
    color: white;
    z-index: 999;
    text-transform: uppercase;
    border-bottom: var(--border-style-secondary);
}

@media only screen and (max-height: 863px) {
    .unterweisungHeader {
        padding: 15px 20px 15px 20px;
    }
    
    .unterweisungButtons {
        padding: 1rem !important;
    }

    .unterweisungContent {
        margin: 20px auto 100px auto !important;
    }
}

.unterweisungQuestion {
    color: var(--primary-color);
    font-size: 17px;
    font-family: "roboto-condensed-regular";
    line-height: 1.3;
}

.unterweisungHeader h1 {
    margin-bottom: 0;
}

.unterweisungContent {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 50px 0 150px 0;
}

.unterweisungButtons {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    padding: 1.5rem;
    background-color: var(--primary-color);
    box-shadow: 0 0 20px #00000026;
}

.unterweisungCounterWrapper {
    display: flex;
    align-items: center;
    gap: 10px;
}

.unterweisungCounterNumber {
    font-size: 20px;
    width: 30px;
    height: 30px;
    background: #c39555;
    color: #ffffff;
    display: grid;
    justify-content: center;
    align-items: center;
    font-family: "open-sans-bold"

}

.unterweisung-text-versuche {
    color: #85e339;
}

.card-primary {
    border-radius: 0;
    border: none !important;
}

.card-primary .card-header {
    background-color: var(--primary-color);
    border-radius: 0 !important;
    padding: 12px 20px;
}

.card-primary .card-title {
    color: var(--white-color);
    border-radius: 0;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 15px !important;
    margin: 0;
    font-family: "open-sans-regular";
}

.card-primary .card-body {
    background-color: var(--light-color);
    padding: 12px 20px;
}

.btn-style-primary {
    background-color: var(--primary-lighter-color) !important;
    color: var(--white-color) !important;
    text-transform: uppercase;
    text-align: center;
    line-height: 1.6;
    font-size: 15px;
    letter-spacing: 1.5px;
}

.btn-style-primary:hover {
    background-color: #afbcc3 !important;
}

.progress-bar-secondary {
    background-color: var(--secondary-color) !important;
}

.color-primary {
    color: var(--primary-color);
}