@charset "UTF-8";

@media all {
	.event-teaser__wrapper .event-teaser__event {
		display: flex;
		flex-direction: column;
	}

	.event-teaser__wrapper .event-teaser__event-wrapper {
		display: flex;
		column-gap: 15px;
		flex-grow: 1;
	}

	.event-teaser__wrapper .event-teaser__date {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		min-width: 75px;
		min-height: 75px;
		height: 75px;
		background-color: var(--primary-color);
		color: var(--secondary-color);
	}

	.event-teaser__wrapper .event-teaser__date .event-teaser__date--day,
	.event-teaser__wrapper .event-teaser__date .event-teaser__date--month {
		font-family: "DIN-2014", sans-serif;
		font-weight: var(--font-weight--bold);
		line-height: 1;
	}

	.event-teaser__wrapper .event-teaser__date .event-teaser__date--day {
		font-size: 34px;
	}

	.event-teaser__wrapper .event-teaser__date .event-teaser__date--month {
		line-height: 1.1;
	}

	.event-teaser__event-wrapper .event-teaser__data h3 {
		margin: 0 0 10px;
		font-weight: var(--font-weight--regular);
	}

	.event-teaser__event-wrapper .event-teaser__data h3 svg.triangle {
		display: none;
	}

	#main .event-teaser__event-wrapper .event-teaser__data a {
		display: inline-block;
		color: var(--font-color);
		text-decoration: none;
	}

	#main .event-teaser__event-wrapper .event-teaser__data a:hover {
		text-decoration: underline;
	}

	.event-teaser__wrapper .event-teaser__data p {
		display: flex;
		flex-direction: column;
		row-gap: 10px;
	}

	.event-teaser__wrapper .event-teaser__data > p > span:first-of-type {
		margin-right: 0;
	}

	.event-teaser__wrapper .event-teaser__data > p > span > i {
		margin-right: 10px;
	}

	.event-teaser__wrapper hr {
		margin: 15px 0 10px;
		border: none;
		border-top: 1px dashed var(--font-color);
	}

	.event-teaser__wrapper hr {
		margin: 10px 0;
		border: none;
		border-top: 1px dashed var(--font-color);
	}

	.event-teaser__wrapper a.btn {
		margin-top: 10px;
	}

	#sidebar .event-teaser__event {
		width: 100%;
	}
}

@media (min-width: 1200px) {
	.event-teaser__event-wrapper .event-teaser__data h3 {
		margin: 10px 0;
	}

	.event-teaser__event-wrapper .event-teaser__data h3 svg.triangle {
		display: inline-block;
		margin-left: 10px;
	}

	.event-teaser__wrapper .event-teaser__date .event-teaser__date--day {
		font-size: 37px;
	}

	.event-teaser__wrapper .event-teaser__data p {
		display: block;
	}

	.event-teaser__wrapper .event-teaser__data > p > span:first-of-type {
		margin-right: 30px;
	}
}