.color-selector .grey, .row .grey, nav.vertical ul li a {
    overflow:hidden;
}

.backgroundOrangeTitle {
    background: #ff8500;
    color: #fff;
}

.backgroundBlueTitle {
    background: #4bafd5;
    color: #fff;
    padding: 10px;
}

.color-selector .green, .row .green, nav.vertical ul li a.green, .calendarTooltip>.green {
    background-color: #28c7a9 !important;
}
.color-selector .purple, .row .purple, nav.vertical ul li a.purple, .calendarTooltip>.purple {
    background-color: #ab6fc9 !important;
}
.color-selector .orange, .row .orange, nav.vertical ul li a.orange, .calendarTooltip>.orange {
    background-color: #f4ce01 !important;
}
.color-selector .pink, .row .pink, nav.vertical ul li a.pink, .calendarTooltip>.pink {
    background-color: #ec6045 !important;
}
.color-selector .cyan, .row .cyan , nav.vertical ul li a.cyan, .calendarTooltip>.cyan {
    background-color: $calendar-blue !important;
}
.color-selector .grey, .row .grey, nav.vertical ul li a.grey, .calendarTooltip>.grey {
    background-color: #b7b8ba !important;
}

.color-selector .yellow, .row .yellow, nav.vertical ul li a.yellow, .calendarTooltip>.yellow {
    background-color: #ecbe30 !important;
}

.color-selector .color {
    border:1px #CCCCCC solid;
    width:30px;
    height:30px;
    display:inline-block;
    margin-left:5px;
}

.color-selector .color.selected {
    border:2px black solid;
}


.patchwork .navigation .items > .row {
    height:auto !important;
}

.patchwork .navigation .items > .row h1 {
    color:black !important;
    font-weight: normal !important;
}

.patchwork .navigation .items > .row .buttons {
    z-index:1000 !important;
}

.colored li a {
    opacity:0.4;
    color:black;
}

.colored li a.selected {
    opacity:1;
}

nav.vertical ul {
    padding-left: 15px;
    border-left: none;
}

nav.vertical > ul > li:not(:first-child) {
    margin-top: 1rem;
}

nav.vertical ul li ul {
    padding-left: 0;
}

nav.vertical ul li ul > li {
    padding-left: 0;
}

nav.vertical ul li a input.calendar-checkbox {
  float:right;
}

.filters div.dates {
    position: absolute;
    right: 0px;
    top: 4px;
}

.filters div.dates div.cell {
    line-height: 40px;
    vertical-align: middle;
}

.toggle-buttons{
    z-index:1000 !important;
}

button#special {
    color: inherit;
    padding: inherit;
    background: inherit;
    cursor: pointer;
    padding: 0;
    -webkit-margin-end: 0px;
    text-transform: capitalize;
    font-weight: 400;
    line-height: 30px;
    display: block;
    width: 103%;
    font-family: Roboto;
    font-size: 20px;
    margin-left: -10px;
    margin-bottom: 3px;
    margin-right: 3px;
    margin-top: 3px;
    padding-left: 10px;

}

button.noTransition {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -o-transition: none !important;
    -ms-transition: none !important;
    transition: none !important;
}


calendar {
    .displayModeButtons {
        margin-top: 0;
    }

    i.calendar {
        padding: 18px 40px;
        background-image: none;

        &::before {
            content: '\e834';
            font-family: 'generic-icons';
            font-size: 3rem;
            display: block;
            color: #eac403;
        }
    }

    legend, .legend>.month-day, button.cyan {
        background: $calendar-blue !important;
    }

    button.previous-timeslots, button.next-timeslots {
        margin-right: 0px;
        margin-left: 0px;
    }

    .dates>i18n {
        margin-left: 20px;
    }

    .dates>.date-picker-icon a {
        width: 30px;
        margin-left: 20px;
    }

    span {
        overflow-wrap: break-word;
    }

    .calendar-current-week {
        max-height: unset;
    }
}

h1 a {
    color: $calendar-blue !important;
}

.top-spacing-four {
    margin-top: 0px !important;
}

.date-picker-icon>input[type=text] {
    padding-left: 29px;
}

.calendarTooltip {
    padding: 11px;
    text-align: center;
    background-color: $calendar-white !important;
    max-width: 300px;

    &-title{
        color: $calendar-white !important;
        border-radius: 9px;
        padding: 1px 6px;
    }

    &-blueText{
        color : $calendar-blue;
    }
}

.sidebar-calendar-choice-view-item {
    margin: .4rem 0;
    justify-content: center;
    align-items: center;
}

.show-calendar,
.show-list {
    height: 24px;
}

.schedule{
    .hidden-schedule-items{
        &.after{
            bottom:-16px;
        }
    }
    .days{
        height:538px;
    }
}

