﻿
.TimeTableGrid {
    border: 1px solid #ccc;
    background-color: white;
    position: relative;
    width: 100%;
    overflow-wrap: unset;
    display: flex;
    flex-direction: column;
}

    .TimeTableGrid #rowContent {
        flex: 1;
        display: flex;
    }

    .TimeTableGrid #GridContent {
        flex: 1;
        display: flex;
    }


    .TimeTableGrid #toolbarX {
        border-left: 1px solid #ccc;
        height: 59px;
        display: flex;
    }

        .TimeTableGrid #toolbarX .toolbarXCol1 {
            border-right: 3px solid #ccc;
            display: inline-block;
            float: left;
            min-width: 500px;
        }

        .TimeTableGrid #toolbarX .toolbarXCol2 {
            display: inline-block;
            float: left;
            min-width: 100px;
        }

        .TimeTableGrid #toolbarX .toolbarXCol3 {
            margin-left: auto;
            min-width: 368px;
        }

#tabs-Tasks .TimeTableGrid #toolbarX .toolbarXCol1 {
    min-width: 630px;
}

#tabs-Tasks .TimeTableGrid #toolbarX .toolbarXCol2 {
    min-width: 845px;
}

#tabs-Tasks .TimeTableGrid #toolbarX .toolbarXCol3 {
    min-width: 368px;
}

.TimeTableGrid #toolbarX .nav {
    height: 28px;
    padding: 0px;
    padding-top: 4px;
    display: inline-block;
    float: left;
}

    .TimeTableGrid #toolbarX .nav .right {
        float: right;
    }

    .TimeTableGrid #toolbarX .nav > li {
        float: left;
    }

        .TimeTableGrid #toolbarX .nav > li > a {
            display: inline-block;
            background-color: transparent;
        }

            .TimeTableGrid #toolbarX .nav > li > a span {
                display: none;
            }

        .TimeTableGrid #toolbarX .nav > li.floatLeft {
            float: none;
        }

}

.TimeTableGrid #toolbarX input[type=button] {
    height: 28px;
    padding: 0px;
    display: inline-block;
}


.TimeTableGrid #toolbarY {
    border: 1px solid #ccc;
    /*position: absolute;
    left: 0px;
    top: 30px;*/
    width: 30px;
    /*height: 90%;
    height: -moz-calc(100% - 30px);
    height: -webkit-calc(100% - 30px);
    height: calc(100% - 30px);*/
}


    .TimeTableGrid #toolbarY input[type=button] {
        width: 28px;
        padding: 0px;
    }


.TimeTableGrid #tt_busy {
    position: fixed;
    left: 50%;
    top: 50%;
    background-image: url("Images/loader.gif");
    z-index: 99999;
    height: 32px;
    width: 32px;
    display: none;
}

.TimeTableGrid #container {
    /*position: absolute;
        left: 30px;
        top: 30px;*/
    display: flex;
    border: 1px solid #ccc;
    /*width: -moz-calc(100% - 30px);
        width: -webkit-calc(100% - 30px);
        width: calc(100% - 30px);*/
    /*height: -moz-calc(100% - 30px);
        height: -webkit-calc(100% - 30px);
        height: calc(100% - 30px);*/
}

.TimeTableGrid .HeaderRow {
    background-color: #e8e8e8;
    border-collapse: collapse;
}

    .TimeTableGrid .HeaderRow .HeaderCell {
        border-bottom: 1px solid #ccc;
        border-left: 1px solid #ccc;
        border-collapse: collapse;
        padding: 2px;
        background-color: #e8e8e8;
        display: inline-block;
    }


.TimeTableGrid .HeaderPhaseRow {
    max-height: 25px;
    min-height: 25px;
    height: 25px;
    border-collapse: collapse;
    background-color: #e8e8e8;
    position: relative;
}

    .TimeTableGrid .HeaderPhaseRow .HeaderPhaseCell {
        border-bottom: 1px solid #ccc;
        border-left: 1px solid #ccc;
        border-collapse: collapse;
        padding: 0px;
        padding-left: 2px;
        background-color: #053f56;
        color: white;
        display: inline-block;
        max-height: 22px;
        min-height: 22px;
        height: 22px;
        position: absolute;
        left: 0px;
        top: 1px;
        margin: 0px;
    }


.TimeTableGrid .ContentDataRow {
    max-height: 25px;
    min-height: 25px;
    height: 25px;
    background-color: white;
}

    .TimeTableGrid .ContentDataRow .ContentDataCell {
        max-height: 25px;
        min-height: 25px;
        height: 25px;
        border-bottom: 1px solid #ccc;
        border-left: 1px solid #ccc;
        border-collapse: collapse;
        padding: 2px;
        display: inline-block;
        float: left;
        overflow: hidden;
    }

        .TimeTableGrid .ContentDataRow .ContentDataCell .NotClickCell {
            white-space: nowrap;
        }


.TimeTableGrid #DataListArea {
    border: 0px;
    padding: 0px;
    margin: 0px;
    float: left;
    overflow: hidden;
    height: 100%;
    /*height: -moz-calc(100%);
        height: -webkit-calc(100% );
        height: calc(100% );*/
    background-color: #edf9ff;
    border-right: 2px solid #ccc;
    display: flex;
    flex-direction: column;
}

    .TimeTableGrid #DataListArea #DataListHeader {
        overflow: hidden;
        height: 75px;
    }

        .TimeTableGrid #DataListArea #DataListHeader #DataListHeaderContainer {
            border: 0px;
            padding: 0px;
            margin: 0px;
            overflow: hidden;
        }

    .TimeTableGrid #DataListArea #DataListContent {
        overflow-x: hidden; /*overflow-x: scroll;*/
        overflow-y: scroll;
        /*height: -moz-calc(100% - 75px);
            height: -webkit-calc(100% - 75px);
            height: calc(100% - 75px);*/
        flex: 1;
    }

        .TimeTableGrid #DataListArea #DataListContent #DataListContentContainer {
            border: 0px;
            padding: 0px;
            margin: 0px;
            overflow: hidden;
        }

    /*.TimeTableGrid #DataListArea #DataListContent #DataListContentContainer .ContentDataRow[data-selected='1'] {
                    background-color: #053f56 !important;
                    color: white !important;
                    opacity: 1;
                }*/

    .TimeTableGrid #DataListArea #DataListScrollbarSpacer {
        width: 100%;
        background-color: #f9f9f9;
    }

.TimeTableGrid #TimeTableListArea {
    border: 0px;
    padding: 0px;
    margin: 0px;
    float: left;
    overflow: hidden;
    /*height: 100%;
        height: -moz-calc(100% );
        height: -webkit-calc(100% );
        height: calc(100%);*/
    display: flex;
    flex-direction: column;
}

    .TimeTableGrid #TimeTableListArea #TimeTableListHeader {
        overflow: hidden;
        height: 75px;
    }

        .TimeTableGrid #TimeTableListArea #TimeTableListHeader #TimeTableListHeaderContainer {
            border: 0px;
            padding: 0px;
            margin: 0px;
            overflow: hidden;
        }

    .TimeTableGrid #TimeTableListArea #TimeTableListContent {
        overflow-x: scroll;
        overflow-y: scroll;
        /*height: 90%;
            height: -moz-calc(100% - 75px);
            height: -webkit-calc(100% - 75px);
            height: calc(100% - 75px);*/
        flex: 1;
    }

        .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow {
            max-height: 25px;
            min-height: 25px;
            height: 25px;
            background-color: white;
            border-bottom: 1px solid #ccc;
            border-left: 1px solid #ccc;
            border-collapse: collapse;
            position: relative;
        }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow:hover {
                background-color: #d1d6d8;
                /*opacity: 0.7;*/
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .ContentDataCell {
                max-height: 25px;
                min-height: 25px;
                height: 25px;
                padding: 2px;
                display: inline-block;
                float: left;
                overflow: hidden;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .Bar {
                max-height: 22px;
                min-height: 22px;
                height: 22px;
                position: absolute;
                left: 0px;
                top: 1px;
                bottom: 0px;
                margin: 0px;
                overflow: hidden;
                display: flex;
                align-items: center;
            }





                .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .Bar .BarContentInfoContainer {
                    overflow: hidden;
                    text-align: center;
                    cursor: default;
                    display: flex;
                }

                .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .Bar .BarContentInfoContainerCenter {
                    text-align: center;
                }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarContentInfo {
                white-space: nowrap;
                padding-left: 5px;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarGroup {
                background-color: #053f56;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarGroupBorder {
                border-left: 1px solid black;
                border-right: 1px solid black;
            }


            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarInhouse {
                background-image: url('Images/Inhouse.png') !important;
                background-color: #16dbff;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarHoliday {
                background-color: #8c503c;
                min-height: 12px;
                height: 12px;
                font-size: 9px;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarSick {
                background-color: #000;
                color: white;
                min-height: 12px;
                height: 12px;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarFree {
                background-color: #ccf54e;
                min-height: 12px;
                height: 12px;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarFreeResponsibility {
                background-color: #79f54e;
                min-height: 12px;
                height: 12px;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarParentalLeave {
                background-color: #99cc99;
                min-height: 12px;
                height: 12px;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarUnpaidExemptionFromEmployment {
                background-color: #339966;
                min-height: 12px;
                height: 12px;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarBreak {
                background-color: #fff;
                color: #46626e;
                border: 1px solid #6D7683;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarUnavailibility {
                background-color: #4f3911;
                color: #fff;
                border: 1px solid #6D7683;
                min-height: 12px;
                height: 12px;
                font-size: 9px;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarSchool {
                background-color: #662D91;
                opacity: 1;
                color: #fff;
                border: 1px solid #6D7683;
                font-size: 9px;
                min-height: 13px !important;
                height: 13px !important;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarSchoolHoliday {
                background-color: white;
                opacity: 1;
                color: black;
                border: 1px solid #6D7683;
                font-size: 9px;
                min-height: 13px !important;
                height: 13px !important;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarCommonTaskItem {
                background-color: white;
                opacity: 1;
                color: black;
                font-size: 9px;
                border: 1px solid #6D7683;
                max-height: 12px;
                min-height: 12px;
            }


            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarInhouse,
            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarHoliday,
            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarSick,
            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarFree,
            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarFreeResponsibility {
                background-size: contain;
                color: #fff !important;
                background-repeat: repeat !important;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarWork {
                max-height: 22px;
                min-height: 22px;
                height: 22px;
                position: absolute;
                left: 0px;
                top: 1px;
                margin: 0px;
                border: 2px dashed #e8e8e8;
                background-color: transparent;
                display: inline-block;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarHeader {
                z-index: 99;
                max-height: 4px;
                min-height: 4px;
                height: 4px;
                position: absolute;
                left: 0px;
                top: 11px;
                margin: 0px;
                background-color: #053f56;
                display: inline-block;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarDashHeader {
                z-index: 9;
                max-height: 4px;
                min-height: 4px;
                height: 4px;
                position: absolute;
                left: 0px;
                top: 11px;
                margin: 0px;
                display: inline-block;
                opacity: 0.3;
                background-image: url('Images/Plan/Dash_Background_8x8px.png') !important;
                background-repeat: repeat !important;
            }

            .TimeTableGrid #TimeTableListArea #TimeTableListContent .ContentDataRow .BarProjektHeader {
                max-height: 4px;
                min-height: 4px;
                height: 4px;
                position: absolute;
                left: 0px;
                top: 5px;
                margin: 0px;
                background-color: none;
                border: dashed 2px #053f56;
                display: inline-block;
            }

.BarSelected {
    outline: 3px dotted #000;
}

.BarConflict {
    background-image: url("../Content/Staff/TaskBoard/Images/NormalConflict.png") !important;
    background-repeat: repeat !important;
    background-color:white !important;
    color:black !important;
    border: solid 1px black;
}

.BarConflictPossible {
    background-image: url("../Content/Staff/TaskBoard/Images/NormalConflict.png") !important;
    background-repeat: repeat !important;
    opacity: 0.4;
}

.BarInfo {
    display: none;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 9999;
    border: 1px solid #ccc;
    background-color: white;
    min-height: 200px;
    min-width: 200px;
}

.BarContent {
}

.ToolTipContainer {
    display: none;
    position: absolute !important;
    left: -2px;
    top: 20px;
    z-index: 9999;
    border: 1px solid #ccc;
    background-color: white;
    min-height: 200px;
    min-width: 200px;
    color: black;
}

.ToolTipDialog {
    display: none;
}

.ToolTipDialog .display-date{
    display: inline-block;
}

.TimeTableGrid #TimeTableListArea #TimeTableListContent #TimeTableListContentContainer {
    border: 0px;
    padding: 0px;
    margin: 0px;
    /*overflow: hidden;*/
}





.btnBarViewMode {
    background-image: url("Images/Plan/BarViewMode.png");
    background-size: 20px;
    background-position: center;
    background-repeat: no-repeat;
}

    .btnBarViewMode:hover {
        background-image: url("Images/Plan/BarViewMode_hover.png");
        background-size: 20px;
        background-position: center;
        background-repeat: no-repeat;
    }








.btnToday,
.btnProjectStart,
.btnProjectEnd,
.btnTotalStart,
.btnTotalEnd,
.btnLock,
.btnUnlock,
.btnTimeEdit,
.btnTimeDelete,
.btnCorePeriod,
.btnTotalPeriod,
.btnDeselectAll {
    background-repeat: no-repeat;
    cursor: pointer;
}


.ProjectDrillDown {
    display: inline-block;
    float: left;
    background-position-x: -45px;
    background-position-y: -15px;
}

    .ProjectDrillDown[data-drill='close'] {
        background-position-x: -30px;
        background-position-y: 0px;
    }

    .ProjectDrillDown[data-drill='open'] {
        background-position-x: -45px;
        background-position-y: -15px;
    }


.buttonDrillAll {
    display: inline-block;
    float: left;
    background-position-x: -30px;
    background-position-y: 0px;
}

    .buttonDrillAll[data-drill='close'] {
        background-position-x: -30px;
        background-position-y: 0px;
    }

    .buttonDrillAll[data-drill='open'] {
        background-position-x: -45px;
        background-position-y: -15px;
    }




#btnCompactDataList {
    width: 11px;
    height: 16px;
    display: inline-block;
    float: left;
    background-position-x: -15px;
    background-position-y: 0px;
}

    #btnCompactDataList.active {
        background-position-x: -30px;
        background-position-y: 0px;
    }

.GroupDrillDown {
    display: inline-block;
    float: left;
    background-position-x: -45px;
    background-position-y: -15px;
}

    .GroupDrillDown[data-drill='close'] {
        background-position-x: -30px;
        background-position-y: 0px;
    }

    .GroupDrillDown[data-drill='open'] {
        background-position-x: -45px;
        background-position-y: -15px;
    }


.ProjectHeader a {
    font-size: 16px;
    color: black;
}

.GroupBar {
    height: 25px;
    width: 5px;
    float: left;
}

/*****************************************************/
/* Neu */

.TimeTableGrid .ItemLevel {
}

    .TimeTableGrid .ItemLevel .Header {
    }

    .TimeTableGrid .ItemLevel .Content {
        display: none;
    }



    .TimeTableGrid .ItemLevel .Header .ContentDataRow .Loading {
        background-image: url("Images/loader.gif");
        background-repeat: no-repeat;
        background-size: 20px 17px;
        height: 20px;
        z-index: 99999;
        padding-left: 25px;
        opacity: 0.5;
    }

    .TimeTableGrid .ItemLevel .Content .ContentDataRow .Loading {
        background-image: url("Images/loader.gif");
        background-repeat: no-repeat;
        background-size: 20px 17px;
        height: 20px;
        z-index: 99999;
        padding-left: 25px;
        opacity: 0.5;
    }


.TimeTableGrid .DrillDown {
    display: inline-block;
    float: left;
    background-position-x: -45px;
    background-position-y: -15px;
}

    .TimeTableGrid .DrillDown[data-drill='close'] {
        background-position-x: -30px;
        background-position-y: 0px;
    }

    .TimeTableGrid .DrillDown[data-drill='open'] {
        background-position-x: -45px;
        background-position-y: -15px;
    }

.TimeTableGrid .Level1 {
    width: 20px !important;
    background-position: right;
}

.TimeTableGrid .Level2 {
    width: 35px !important;
    margin-right: 5px;
    background-position: right;
}

.glyphicon-tasks {
    top: 2px;
}


.btnMailTo:hover {
    color: #dddddd;
}

.glyphicon {
    padding-bottom: 0px !important;
    padding-top: 0px !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
}

.glyphicon-envelope {
    padding-bottom: 0px !important;
    padding-top: 0px !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
}


.legend-container .legend {
    text-align: left;
    color: #000;
    padding: 0px 15px;
    width: 460px;
    white-space: normal;
    font-size: 14px;
}

    .legend-container .legend.w500 {
        width: 520px;
    }


.BarGroup .legend-container .legend {
    width: 500px;
}

#commentToolTip {
    /*position: relative;*/
}

    #commentToolTip .info-container {
        position: absolute;
    }

        #commentToolTip .info-container .more-info {
            position: absolute;
            width: 400px;
            max-height: 400px;
            top: 88px;
            display: none;
            overflow-y: auto;
            z-index: 999;
            border: 1px solid black;
            background-color: white;
            padding: 5px;
        }

/*.commentHover:hover .more-info {
    display:block;
}*/


/*Neues Design*/
.btnContainer {
    display: flex;
    border: 1px solid lightgrey;
    padding: 8px 5px 3px 5px;
    border-radius: 5px;
    position: relative;
    margin: 15px 5px 7px 5px;
}

    .btnContainer.noborder {
        border: none;
    }

.btnContainerDivider {
    border-left: 3px solid #ccc;
    margin: 0 15px;
}

.toolbar-inner-container {
    display: flex;
}

.btnContainer > div {
    margin-right: 7px;
}

    .btnContainer > div:last-child {
        margin-right: 0;
    }

.btnContainer .container-headline {
    position: absolute;
    top: -14px;
    left: 0;
    background-color: #fff;
    padding: 0 4px;
    margin: 0 3px;
    font-size: 12px;
}


.myBtn {
    background-image: url("Images/Plan/Zeitansicht1.png");
    display: inline-block;
    width: 30px;
    height: 22px;
    background-color: transparent;
    cursor: pointer;
    margin: 0;
}

.btnTimeView1 {
    background-image: url("Images/Plan/Zeitansicht1.png");
}

    .btnTimeView1:hover {
        background-image: url("Images/Plan/Zeitansicht1_hover.png");
    }

    .btnTimeView1.active {
        background-image: url("Images/Plan/Zeitansicht1_active.png");
    }


.btnTimeView2 {
    background-image: url("Images/Plan/Zeitansicht2.png");
}

    .btnTimeView2:hover {
        background-image: url("Images/Plan/Zeitansicht2_hover.png");
    }

    .btnTimeView2.active {
        background-image: url("Images/Plan/Zeitansicht2_active.png");
    }


.btnTimeView3 {
    background-image: url("Images/Plan/Zeitansicht3.png");
}

    .btnTimeView3:hover {
        background-image: url("Images/Plan/Zeitansicht3_hover.png");
    }

    .btnTimeView3.active {
        background-image: url("Images/Plan/Zeitansicht3_active.png");
    }


.btnTimeView4 {
    background-image: url("Images/Plan/Zeitansicht4.png");
}

    .btnTimeView4:hover {
        background-image: url("Images/Plan/Zeitansicht4_hover.png");
    }

    .btnTimeView4.active {
        background-image: url("Images/Plan/Zeitansicht4_active.png");
    }


.btnTimeView5 {
    background-image: url("Images/Plan/Zeitansicht5.png");
}

    .btnTimeView5:hover {
        background-image: url("Images/Plan/Zeitansicht5_hover.png");
    }

    .btnTimeView5.active {
        background-image: url("Images/Plan/Zeitansicht5_active.png");
    }


.btnTimeView6 {
    background-image: url("Images/Plan/Zeitansicht6.png");
}

    .btnTimeView6:hover {
        background-image: url("Images/Plan/Zeitansicht6_hover.png");
    }

    .btnTimeView6.active {
        background-image: url("Images/Plan/Zeitansicht6_active.png");
    }


.btnTimeView7 {
    background-image: url("Images/Plan/Zeitansicht7.png");
}

    .btnTimeView7:hover {
        background-image: url("Images/Plan/Zeitansicht7_hover.png");
    }

    .btnTimeView7.active {
        background-image: url("Images/Plan/Zeitansicht7_active.png");
    }


.btnTimeView8 {
    background-image: url("Images/Plan/Zeitansicht8.png");
}

    .btnTimeView8:hover {
        background-image: url("Images/Plan/Zeitansicht8_hover.png");
    }

    .btnTimeView8.active {
        background-image: url("Images/Plan/Zeitansicht8_active.png");
    }


.btnDataView1 {
    background-image: url("Images/Plan/Mitarbeiterliste.png");
}

    .btnDataView1:hover {
        background-image: url("Images/Plan/Mitarbeiterliste_hover.png");
    }

    .btnDataView1.active {
        background-image: url("Images/Plan/Mitarbeiterliste_active.png");
    }

.btnDataView2 {
    background-image: url("Images/Plan/Projektliste.png");
}

    .btnDataView2:hover {
        background-image: url("Images/Plan/Projektliste_hover.png");
    }

    .btnDataView2.active {
        background-image: url("Images/Plan/Projektliste_active.png");
    }



.btnToday {
    background-position-x: -60px;
    background-position-y: -120px;
}

    .btnToday:hover {
        background-position-x: -80px;
        background-position-y: -120px;
    }

.btnProjectStart {
    background-image: url("Images/Plan/StartZeit.png");
}

    .btnProjectStart:hover {
        background-image: url("Images/Plan/StartZeit_hover.png");
    }

    .btnProjectStart.active {
        background-image: url("Images/Plan/StartZeit_active.png");
    }

.btnTodayPlusMinus {
    background-image: url("Images/Plan/button_today.png");
}

    .btnTodayPlusMinus:hover {
        background-image: url("Images/Plan/button_today.png");
        filter: invert(.5);
    }

    .btnTodayPlusMinus.active {
        background-image: url("Images/Plan/button_today.png");
    }

.btnProjectEnd {
    background-image: url("Images/Plan/EndZeit.png");
}

    .btnProjectEnd:hover {
        background-image: url("Images/Plan/EndZeit_hover.png");
    }

    .btnProjectEnd.active {
        background-image: url("Images/Plan/EndZeit_active.png");
    }

.btnTotalStart {
    background-image: url("Images/Plan/GeheStart.png");
}

    .btnTotalStart:hover {
        background-image: url("Images/Plan/GeheStart_hover.png");
    }

    .btnTotalStart.active {
        background-image: url("Images/Plan/GeheStart_active.png");
    }

.btnTotalEnd {
    background-image: url("Images/Plan/GeheEnde.png");
}

    .btnTotalEnd:hover {
        background-image: url("Images/Plan/GeheEnde_hover.png");
    }

    .btnTotalEnd.active {
        background-image: url("Images/Plan/GeheEnde_active.png");
    }

.btnCorePeriod {
    background-image: url("Images/Plan/KernZeit.png");
}

    .btnCorePeriod:hover {
        background-image: url("Images/Plan/KernZeit_hover.png");
    }

    .btnCorePeriod.active {
        background-image: url("Images/Plan/KernZeit_active.png");
    }

.btnTotalPeriod {
    background-image: url("Images/Plan/GesamtZeit.png");
}

    .btnTotalPeriod:hover {
        background-image: url("Images/Plan/GesamtZeit_hover.png");
    }

    .btnTotalPeriod.active {
        background-image: url("Images/Plan/GesamtZeit_active.png");
    }


.btnMailTo {
    background-image: url("Images/Plan/Mailing.png");
}

    .btnMailTo:hover {
        background-image: url("Images/Plan/Mailing_hover.png");
    }

    .btnMailTo.active {
        background-image: url("Images/Plan/Mailing_active.png");
    }

.btnContactFilterIcon {
    background-image: url("Images/Plan/Filter_Person_off.png");
}
    .btnContactFilterIcon.open {
        background-image: url("Images/Plan/Filter_Person_active__off.png");
    }
    .btnContactFilterIcon:hover {
        background-image: url("Images/Plan/Filter_Person_hover__off.png");
    }

    .btnContactFilterIcon.active {
        background-image: url("Images/Plan/Filter_Person.png");
    }
        .btnContactFilterIcon.active:hover {
            background-image: url("Images/Plan/Filter_Person_hover.png");
        }
        .btnContactFilterIcon.active.open {
            background-image: url("Images/Plan/Filter_Person_active.png");
        }

.btnProjectFilterIcon {
    background-image: url("Images/Plan/Filter_Projekt_off.png");
}

    .btnProjectFilterIcon.open {
        background-image: url("Images/Plan/Filter_Projekt_active_off.png");
    }

    .btnProjectFilterIcon:hover {
        background-image: url("Images/Plan/Filter_Projekt_hover_off.png");
    }

    .btnProjectFilterIcon.active {
        background-image: url("Images/Plan/Filter_Projekt.png");
    }

        .btnProjectFilterIcon.active:hover {
            background-image: url("Images/Plan/Filter_Projekt_hover.png");
        }

        .btnProjectFilterIcon.active.open {
            background-image: url("Images/Plan/Filter_Projekt_active.png");
        }


.btnTaskItemFilterIcon {
    background-image: url("Images/Plan/Filter_Aufgaben_off.png");
}

    .btnTaskItemFilterIcon.open {
        background-image: url("Images/Plan/Filter_Aufgaben_active_off.png");
    }

    .btnTaskItemFilterIcon:hover {
        background-image: url("Images/Plan/Filter_Aufgaben_hover_off.png");
    }

    .btnTaskItemFilterIcon.active {
        background-image: url("Images/Plan/Filter_Aufgaben.png");
    }

        .btnTaskItemFilterIcon.active:hover {
            background-image: url("Images/Plan/Filter_Aufgaben_hover.png");
        }

        .btnTaskItemFilterIcon.active.open {
            background-image: url("Images/Plan/Filter_Aufgaben_active.png");
        }

    .btnTaskItemFilterIcon.WithoutSchoolholidays {
        background-image: url("/Content/Images/Plan/Filter_Aufgaben.png");
    }

        .btnTaskItemFilterIcon.WithoutSchoolholidays:hover {
            background-image: url("/Content/Images/Plan/Filter_Aufgaben_hover.png");
        }

        .btnTaskItemFilterIcon.WithoutSchoolholidays.open {
            background-image: url("/Content/Images/Plan/Filter_Aufgaben_active.png");
        }


.btnContainer .date-control {
    max-width: 120px;
    height: 25px;
}

.toolbarXCol1 .btnContainer .ui-datepicker-trigger {
    margin-left: -25px;
    margin-top: -4px;
}


.btnLock {
    background-image: url("Images/Plan/SchlossZu.png");
}

    .btnLock:hover {
        background-image: url("Images/Plan/SchlossZu_hover.png");
    }

    .btnLock.active {
        background-image: url("Images/Plan/SchlossZu_active.png");
    }

.btnUnlock {
    background-image: url("Images/Plan/SchlossAuf.png");
}

    .btnUnlock:hover {
        background-image: url("Images/Plan/SchlossAuf_hover.png");
    }

    .btnUnlock.active {
        background-image: url("Images/Plan/SchlossAuf_active.png");
    }


.btnTimeDelete {
    background-image: url("Images/Plan/ZeitLöschen.png");
}


    .btnTimeDelete:hover {
        background-image: url("Images/Plan/ZeitLöschen_hover.png");
    }

    .btnTimeDelete.active {
        background-image: url("Images/Plan/ZeitLöschen_active.png");
    }

.btnTimeEdit {
    background-image: url("/Content/Images/Plan/ZeitEditieren.png");
}

    .btnTimeEdit:hover {
        background-image: url("Images/Plan/ZeitEditieren_hover.png");
    }

    .btnTimeEdit.active {
        background-image: url("/Content/Images/Plan/ZeitEditieren_active.png");
    }

    .btnTimeEdit.disabled {
        opacity: 0.5;
    }


.btnRaster {
    opacity: 0;
    width: 5px;
}

#btnRaster1 + label {
    background: url("Images/Plan/RasterVoll.png");
}

#btnRaster1:hover + label {
    background: url("Images/Plan/RasterVoll_hover.png");
}

#btnRaster1:checked + label {
    background: url("Images/Plan/RasterVoll_active.png");
}

#btnRaster2 + label {
    background: url("Images/Plan/RasterHalb.png");
}

#btnRaster2:hover + label {
    background: url("Images/Plan/RasterHalb_hover.png");
}

#btnRaster2:checked + label {
    background: url("Images/Plan/RasterHalb_active.png");
}

#btnRaster4 + label {
    background: url("Images/Plan/RasterViertel.png");
}

#btnRaster4:hover + label {
    background: url("Images/Plan/RasterViertel_hover.png");
}

#btnRaster4:checked + label {
    background: url("Images/Plan/RasterViertel_active.png");
}



.btnMultiSelekt {
    opacity: 0;
    width: 5px;
}




.Schicht {
    margin-right: 20px;
}

.SchichtInputZeit {
    width: 50px;
    margin-left: 5px;
    margin-right: 5px;
}

.SchichtInput {
    width: 29px;
}

.SchichtInput,
.SchichtInputZeit {
    height: 25px;
    padding: 6px 5px;
}

.navSchichtBreite > div {
    display: flex;
}






.btnResetConflicts {
    background-image: url("Images/Plan/Refresh.png");
}

    .btnResetConflicts:hover {
        background-image: url("Images/Plan/Refresh_hover.png");
    }

    .btnResetConflicts.active {
        background-image: url("Images/Plan/Refresh_active.png");
    }


.btnReduceProjectLines {
    background-image: url("Images/Plan/button_reducelines.png");
}

    .btnReduceProjectLines:hover {
        background-image: url("Images/Plan/button_reducelines.png");
        filter: invert(.5);
    }

    .btnReduceProjectLines.active {
        background-image: url("Images/Plan/button_reducelines_active.png");
    }

/*.btnResetSharedServices {
    background-image: url("Images/Plan/Refresh.png");
}*/