#calendarContainer * {
    box-sizing: border-box;
    user-select: none;
}

#calendarContainer {
    display: flex;
    flex-flow: column;
    position: relative;
}

#calendarContainer .calendarNav {
    display: flex;
}

#calendarContainer .calendarPrev,
#calendarContainer .calendarNext {
    flex-basis: 50%;
    cursor: pointer;
    transition: all ease-in-out;
}

#calendarContainer .calendarPrev:hover {
    color: #a12323;
}

#calendarContainer .calendarNext:hover {
    color: #a12323;
}


#calendarContainer .calendarPrev:before {
    font: 400 14px/38px "Linearicons";
    content: '\e943';
    padding-right: 8px;
}

#calendarContainer .calendarNext {
    text-align: right;
}

#calendarContainer .calendarNext:after {
    font: 400 14px/38px "Linearicons";
    content: '\e944';
    padding-left: 8px;
}


#calendarContainer .calendarDays {
    display: flex;
    justify-content: space-between;
}

#calendarContainer .calendarDays > div {
    display: flex;
    width: 3rem;
    height: 3rem;
    justify-content: center;
    align-items: center;
    position: relative;
}

#calendarContainer .placeholder {
    background-color: transparent !important;
    border: transparent;
}

#calendarContainer .calendarWeek {
    display: flex;
    justify-content: space-between;
}

#calendarContainer .calendarWeek > div {
    background-color: #f8f8f8;
    border-radius: 4px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3rem;
    height: 3rem;
    margin: .2rem;
    position: relative;
}

#calendarContainer .calendarWeek > div:before {
    content: attr(data-before);
    position: absolute;
    background-color: white;
    border: 1px solid grey;
    top: -3rem;
    left: calc(-50% - .25rem);
    justify-content: center;
    align-items: center;
    height: 2.5rem;
    padding: 0 1rem;
    display: none;
    border-radius: 2px;
}

#calendarContainer .calendarWeek > div.hasEvents:hover:before {
    display: flex;
    white-space: nowrap;
    color: grey;
}


#calendarContainer .calendarWeek > div.hasEvents {
    background-color: white;
    border: 1px solid #a12323;
    cursor: pointer;
}

#calendarContainer .calendarWeek > div.notInMonth {
    opacity: .3;
}

#calendarContainer .calendarWeek > div.currentDay {
    color: white;
    background-color: #a12323;
}