.events {
    background: rgba(250, 200, 200, 0.1);
    bottom: 0;
    font-size: 0;
    left: 0;
    position: absolute;
    width: 200px;
}

.event-item {
    background: #777;
    border-color: #fff;
    border-radius: 0 16px 16px 0;
    border-style: solid;
    border-width: 1px 0;
    cursor: pointer;
    display: inline-block;
    filter: grayscale(100%);
    height: 24px;
    margin-bottom: 4px;
    opacity: 0.2;
    padding: 4px;
    position: relative;
    vertical-align: baseline;
    width: 50px;
}

.event-item.active,
.event-item.active:hover {
    background: #fdfdfd;
    border-color: #aaa;
    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;
}