/*********** Table of Contents ***********
    1.0: Event Badge
*****************************************/
.events-header {
    color: #465762;
}

.events {
    height: auto;
    width: 100%;
}

.event-badge {
    background-color: #ffffffb8;
    border-radius: 10px;
    overflow: hidden;
    height: 100%;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
}
    .event-badge a {
        color: #1f1f1fed !important;
    }
        .event-badge .date-container {
            background-color: var(--button-accent-color);
            width: 100px;
            height: 100%;
            float: left;
            text-align: center;
            padding: 12px;
            color: white;
        }

.event-badge .text-container {
    width: calc(100% - 100px);
    height: 100%;
    float: right;
    padding: 10px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

.event-badge .text-container p {
    margin: 0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

.view-all {
    border: solid #E43D24 2px;
    background-color: transparent;
    border-radius: 4px;
    color: #E43D24;
    font-size: var(--font-size-body);
    padding: 5px;
    padding-left: 25px;
    padding-right: 25px;
    outline: none;
}

    .view-all .material-icons {
        font-size: var(--font-size-body);
        font-weight: bolder;
        outline: none;
    }