.event-dates .headline {
	grid-area: 1/4/1/span 8;
	margin-bottom: .77em;
}

.event-dates .sub-headline {
    grid-area: 2/4/2/span 8;
    margin-bottom: .65em;
}

.event-dates .sticker-container {
	grid-area: 1/11/span 2/span 2;
	justify-self: center;
}

.event-dates .events-container {
    grid-area: 3/4/3/span 8;
}

.event-dates .events-container .event-item {
    grid-template-columns: repeat(8, 1fr);
    grid-gap: var(--grid-gap);
    padding: max(6px, 0.46875vw) 0 max(6px, 0.46875vw) max(12px, 1.5625vw);
    border-radius: 100vmin;
    position: relative;
}

.event-dates .events-container .event-item:not(:last-child) {
    margin-bottom: max(12px, 0.78125vw);
}

.event-dates .events-container .event-item .event-date {
    grid-column: 1/span 2;
}

.event-dates .events-container .event-item .event-location {
    grid-column: 3/span 4;
}

.event-dates .events-container .event-item .event-country {
    grid-column: 7/span 2;
}

.event-dates .events-container .event-item .event-type {
    grid-column: 8/8;
    display: block;
    position: absolute;
    top: 5px;
    right: 5px;
    height: calc(100% - 10px);
    aspect-ratio: 1/1;
}

.event-dates .events-container .event-item .event-type.community {
    background: url(../../img/icon-calendar-community.svg) center/contain no-repeat;
}

.event-dates .events-container .event-item .event-type.race {
    background: url(../../img/icon-calendar-race.svg) center/contain no-repeat;
}

.event-dates .events-container .event-item .event-type.event {
    background: url(../../img/icon-calendar-event.svg) center/contain no-repeat;
}

.event-dates .load-more {
    grid-area: 4/2/4/span 12;
    margin-top: max(32px, 3.203125vw);
}

@media (max-width: 1499.98px) {
    .event-dates .events-container {
        grid-area: 3/3/3/span 10;
    }
}

@media (max-width: 1199.98px) {
    .event-dates .events-container {
        grid-area: 3/2/3/span 12;
    }
}

@media (max-width: 991.98px) {
    .event-dates .events-container {
        grid-area: 3/3/3/span 10;
    }

    .event-dates .events-container .event-item {
        grid-template-columns: max(48px, 2.5vw) auto max(48px, 2.5vw);
        text-align: center;
        grid-row-gap: 0;
        padding: 20px 10px;
    }
    
    .event-dates .events-container .event-item .event-date {
        grid-area: 1/2/1/2;
    }
    
    .event-dates .events-container .event-item .event-location {
        grid-area: 2/1/2/span 3;
        margin-top: max(16px, 0.9375vw);
    }
    
    .event-dates .events-container .event-item .event-country {
        grid-area: 3/1/3/span 3;
    }
    
    .event-dates .events-container .event-item .event-type {
        grid-area: 1/3/1/3;
        height: max(48px, 2.5vw);
        position: absolute;
        top: 50%;
        right: var(--grid-gap);
        transform: translateY(-50%);
    }
}

@media (max-width: 767.98px) {
    .event-dates .sticker-container {
        grid-area: 1/3/1/span 10;
        justify-self: flex-end;
        margin-bottom: var(--m-small);
    }
    
    .event-dates .headline {
        grid-area: 2/2/2/span 12;
    }
    
    .event-dates .sub-headline {
        grid-area: 3/2/3/span 12;
    }
    
    .event-dates .events-container {
        grid-area: 4/2/4/span 12;
    }

    .event-dates .load-more {
        grid-area: 5/2/5/span 12;
    }
}

@media (max-width: 575.98px) {
    .event-dates .events-container {
        grid-area: 4/1/4/span 14;
    }
    
    .event-dates .sticker-container {
        margin-top: calc(var(--m-small) * -1);
    }
}