.teaser-event {
	overflow-wrap: anywhere;
	hyphens: auto;
}
	.teaser-event :is(ol, ul) {
		padding: 0px;
		margin: 0px;
		list-style-type: none;
	}
	.teaser-event ol {
		display: grid;
		grid-template-columns: repeat(3, minmax(0px, 1fr));
		column-gap: 50px;
		row-gap: 50px;
	}
		.teaser-event ol > li {
			display: flex;
			flex-direction: column;
			position: relative;
			background-color: var(--white-100);
			box-shadow: 0px 0px 4px var(--box-shadow-color), 0px 0px 8px var(--box-shadow-color), 0px 0px 16px var(--box-shadow-color);
			--color: var(--skin-color, var(--fsu-gold));
		}
		.teaser-event ol > li.gold { /* damit in Mandant mit Fak-Farbe goldene Markierung erscheint */
			--color: var(--fsu-gold);
		}
		.teaser-event ol > li.biopha {
			--color: var(--color-biopha);
		}
		.teaser-event ol > li.chege {
			--color: var(--color-chege);
		}
		.teaser-event ol > li.fsv {
			--color: var(--color-fsv);
		}
		.teaser-event ol > li.m_ehealth {
			--color: var(--color-m_ehealth);
		}
		.teaser-event ol > li.mirz {
			--color: var(--color-mirz);
		}
		.teaser-event ol > li.paf {
			--color: var(--color-paf);
		}
		.teaser-event ol > li.phifak {
			--color: var(--color-phifak);
		}
		.teaser-event ol > li.rewi {
			--color: var(--color-rewi);
		}
		.teaser-event ol > li.thefak_fe {
			--color: var(--color-thefak_fe);
		}
		.teaser-event ol > li.wiwi {
			--color: var(--color-wiwi);
		}
			.teaser-event picture::before,
			.teaser-event .title::before,
			.teaser-event picture::after,
			.teaser-event .title::after {
				content: "";
				width: 30px;
				position: absolute;
				right: 0px;
			}
			.teaser-event picture::before,
			.teaser-event .title::before {
				height: 30px; /* Safari Dinge */
			}
			.teaser-event picture::after,
			.teaser-event .title::after {
				height: 31px; /* Safari Dinge */
			}
			.teaser-event picture::before,
			.teaser-event picture::after {
				bottom: 0px;
			}
			.teaser-event .title::before,
			.teaser-event .title::after {
				top: 0px;
			}
			.teaser-event picture::before,
			.teaser-event .title::before {
				background-color: var(--color);
				z-index: -2;
			}
			.teaser-event picture::after,
			.teaser-event .title::after {
				background-color: var(--white-100);
				z-index: -1;
			}
			.teaser-event picture::after {
				border-bottom-right-radius: 30px;
			}
			.teaser-event .title::after {
				border-top-right-radius: 30px;
			}
			.teaser-event picture {
				position: relative;
				z-index: 0;
			}
				.teaser-event picture img {
					width: 100%;
					display: block;
					aspect-ratio: 16 / 9;
					border-bottom-right-radius: 27px; /* Webkit Dinge */
				}
			.teaser-event .author {
				padding: 0px 2px;
				position: absolute;
				top: 0px;
				left: 100%;
				transform: rotate(180deg);
				writing-mode: vertical-rl;
				color: var(--copyright-color);
				font-variation-settings: var(--fsu-font-variation-text-condensed);
				font-size: 0.750rem;
				line-height: 1.000rem;
			}
			.teaser-event li a {
				display: block;
				outline: none;
				text-decoration: none;
			}
				.teaser-event .title {
					display: block;
					padding: 20px 15px 0px 15px;
					margin-bottom: 10px;
					position: relative;
					z-index: 0;
					border-top: 3px solid var(--color);
					text-wrap: balance;
					color: var(--fsu-blue);
					font-weight: 500;
					font-variation-settings: var(--fsu-font-variation-headline-block);
					font-size: 1.375rem;
					line-height: 1.813rem;
				}
				.teaser-event li a::after {
					content: "";
					width: 100%;
					height: 100%;
					top: 0px;
					left: 0px;
					position: absolute;
				}
				.teaser-event li a:focus-visible::after {
					outline: 3px solid var(--hover-color-dark);
					outline-offset: 0px;
				}
				.teaser-event li a:hover::after {
					outline: 1px solid var(--hover-color-dark);
					outline-offset: 0px;
				}
			.teaser-event .date-time-categories {
				padding: 0px 15px;
				margin-bottom: 5px;
				text-transform: uppercase;
				color: var(--fsu-blue);
				font-size: 0.750rem;
				line-height: 1.000rem;
			}
				.teaser-event .academic-timing {
					text-transform: none;
				}
				.teaser-event .date-time-categories :is(li, ul) {
					display: inline;
				}
					.teaser-event .date-time-categories li:not(:first-child):before {
						content: "\2006\00B7\2006"; /* Leerzeichen · Leerzeichen */
					}
			.teaser-event .short {
				padding: 0px 15px;
				margin: 0px 0px 15px 0px;
				color: var(--text-color);
			}
			.teaser-event li > ul {
				flex: 1 0 auto;
				display: flex;
				align-content: flex-end;
				flex-wrap: wrap;
				gap: 10px;
				padding: 0px 15px 15px 15px;
				text-transform: uppercase;
				font-variation-settings: var(--fsu-font-variation-text-condensed);
				font-size: 0.750rem;
				line-height: 1.000rem;
			}
				.teaser-event li > ul > li {
					height: 20px;
					display: flex;
					align-items: center;
					padding: 0px 5px;
					box-sizing: border-box;
					border: 1px solid var(--text-color);
					color: var(--text-color);
				}
	.teaser-event ol + a {
		width: fit-content;
		display: block;
		padding: var(--link-block-padding) 0px var(--link-block-padding) 0px;
		margin: 0px 0px 0px auto;
		text-decoration: underline 1px;
		text-underline-offset: 3px;
		color: var(--text-color);
	}
		.teaser-event ol + a:focus-visible {
			outline: 3px solid var(--hover-color-dark);
			outline-offset: 0px;
		}
		.teaser-event ol + a:hover {
			text-decoration-thickness: 2px;
		}
/* Größer gleich 768px, Kleiner gleich 1199px - Medium */
@media (min-width: 48.0000em) and (max-width: 74.9375em) {
	.teaser-event ol {
		grid-template-columns: repeat(2, minmax(0px, 1fr));
	}
}
/* Kleiner gleich 1199px - Small + Medium */
@media (max-width: 74.9375em) {
	.teaser-event .title {
		font-size: clamp(var(--fsu-block-font-size-scale-min), var(--fsu-block-font-size-scale), var(--fsu-block-font-size-scale-max));
		line-height: clamp(var(--fsu-block-line-height-scale-min), var(--fsu-block-line-height-scale), var(--fsu-block-line-height-scale-max));
	}
}
/* Kleiner gleich 767px - Small */
@media (max-width: 47.9375em) {
	.teaser-event ol {
		grid-template-columns: minmax(0px, 1fr);
		row-gap: 35px;
	}
		.teaser-event .author {
			padding: 0px;
		}
}