.events {
    display: table;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 200px;
}

.event-item {
    background: yellow;
    border-radius: 0 16px 16px 0;
    cursor: pointer;
    filter: grayscale(100%);
    height: 24px;
    margin-bottom: 4px;
    opacity: 0.2;
    padding: 4px 4px 4px 44px;
    position: relative;
}

.event-item.active,
.event-item.active:hover {
    filter: grayscale(0%);
    opacity: 1;
}

.event-item:hover {
    filter: grayscale(0%);
    opacity: 0.8;
}

.event-flag {
    font-size: 0;
    left: 4px;
    position: absolute;
    top: 4px;
}

.event-flag .flag-icon {
    font-size: 24px;
}

.event-location {
    font-size: 10px;
    line-height: 10px;
}

.event-year {
    font-size: 13px;
    line-height: 14px;
}