.text-image {
	display: flow-root;
}
	/* nicht erster Text-Block und Meta-Headline -> Meta-Headline Abstand oben */
	.text-image.has-block-headline:not(.first-of-group) .block-headline {
		margin-top: 45px;
	}
	/* (nicht erster Text-Block und nicht Meta-Headline) und Bild oben -> Bild Abstand oben */
	.text-image:not(.first-of-group, .has-block-headline).image-top figure {
		margin-top: 1.500rem;
	}
	/* Bild unten -> Bild Abstand nach oben */
	.text-image.image-bottom figure {
		margin-top: 1.500rem;
	}
	.text-image figure {
		width: 300px;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto min-content;
		row-gap: 10px;
		padding: 0px;
		margin: 0px;
	}
	/* Bild oben oder unten */
	.text-image:is(.image-top, .image-bottom) figure {
		width: 1000px;
		grid-template-columns: 800px 1fr;
		grid-template-rows: auto;
		column-gap: 10px;
	}
		.text-image figure div { /* Bild zentrieren, falls kleiner als vorhandener Platz */
			display: flex;
			align-items: center;
			justify-content: center;
		}
		.text-image figure div.ratio-16-9 {
			aspect-ratio: 16 / 9;
		}
			.text-image figure div a:focus-visible { /* Lightbox-Link */
				outline-offset: 3px;
			}
			.text-image figure div a:hover { /* Lightbox-Link */
				outline: 1px solid var(--hover-color-dark);
				outline-offset: 3px;
			}
			.text-image img {
				max-width: 100%;
				display: block;
				margin: 0px auto;
			}
		/* Beschreibung/Urheber */
		.text-image figcaption {
			align-self: end;
			color: var(--copyright-color);
			font-variation-settings: var(--fsu-font-variation-text-condensed);
			font-size: 0.750rem;
			line-height: 1.000rem;
		}
			.text-image figcaption p {
				margin: 0px;
				color: inherit;
			}
				.text-image figcaption a {
					text-decoration: underline 1px;
					text-underline-offset: 3px;
					color: inherit;

					@media (forced-colors: active) {
						color: LinkText;
					}
				}
					.text-image figcaption a:hover {
						text-decoration-thickness: 2px;
					}
					.text-image figcaption a span.info i.icon {
						vertical-align: text-bottom;
					}
					.text-image figcaption a span.info i.icon.lock,
					.text-image figcaption a span.info i.icon.mail_space {
						vertical-align: middle;
					}
				.text-image figcaption em {
					font-variation-settings: var(--fsu-font-variation-text-condensed-italic);
				}
			.text-image figcaption small {
				font-size: inherit; /* von figcaption übernehmen, da per default sonst "small" genutzt wird */
			}
	/* Box */
	.text-image p.box {
		padding: 15px;
		clear: both;
	}
		.text-image p.box.border {
			border-width: 1px;
			border-style: solid;
		}
			.text-image p.box.border.jen {
				border-color: var(--text-color);
			}
			.text-image p.box.border.max {
				border-color: var(--skin-color, var(--fsu-gold));
			}
			.text-image p.box.border.ron {
				border-color: var(--block-background);
			}
		.text-image p.box.bg:not(.noa) { /* .noa ist Legacy */
			color: var(--white-100);
		}
			.text-image p.box.bg.ava {
				background-color: var(--fsu-blue);
			}
			.text-image p.box.bg.ida {
				background-color: var(--link-color);
			}
			.text-image p.box:is(.mia, .noa) {
				background-color: var(--block-background);
			}
			.text-image p.box.bg:not(.noa) a {
				color: var(--white-100);
			}
				.text-image p.box.bg:not(.noa) a:focus-visible {
					outline-color: var(--white-100);
				}
			.text-image p.box.bg:not(.noa) a.button {
				border-color: var(--white-100);
			}
				.text-image p.box.bg:not(.noa) a.button:hover {
					border-color: var(--white-100);
					color: var(--white-100);
					outline-color: var(--white-100);
				}
	/* Link als Button */
	.text-image p a.button {
		width: fit-content;
		display: block flow-root; /* damit korrekt gefloatet */
		margin: 1.500rem 0px;
		padding: calc(var(--link-block-padding) - 1px) 20px; /* border abziehen */
		border: 1px solid var(--fsu-blue);
		text-decoration: none;
		color: var(--fsu-blue);
		font-variation-settings: var(--fsu-font-variation-text-condensed);
		font-size: 1.125rem;
		line-height: 1.500rem;
	}
		.text-image p a.button.center {
			margin-right: auto;
			margin-left: auto;
		}
		.text-image p a.button:focus-visible {
			outline: 3px solid var(--hover-color-dark);
			outline-offset: -6px;
		}
		.text-image p a.button:hover {
			border-color: var(--hover-color-dark);
			color: var(--hover-color-dark);
			outline: 1px solid var(--hover-color-dark);
			outline-offset: -4px;
		}
/* Größer gleich 768px - Medium + Big */
@media (min-width: 48.0000em) {
	/* (erster Text-Block oder Meta-Headline) und (nicht Bild oben) -> erstes Element kein Abstand oben */
	.text-image:is(.first-of-group, .has-block-headline):not(.image-top) .rte_wrapper > div :is(blockquote, h2, h3, h4, p, ul, ol, .fsu-table-wrapper):first-child {
		margin-top: 0px;
	}
	/* (nicht erster Text-Block und nicht Meta-Headline) und (Bild rechts oder links) und erstes Element ist Überschrift -> Überschrift anderen Abstand oben */
	.text-image:not(.first-of-group, .has-block-headline):is(.image-right, .image-left) .rte_wrapper > div :is(h2, h3, h4):first-child {
		margin-top: 1.500rem;
	}
	/* (nicht erster Text-Block und nicht Meta-Headline) und (Bild rechts oder links) und erstes Element ist Box -> Bild Abstand oben */
	.text-image:not(.first-of-group, .has-block-headline):is(.image-right, .image-left):has(.rte_wrapper > div p.box:first-child) figure {
		margin-top: 1.500rem;
	}
	/* Bild rechts oder links -> Bild Abstand nach unten */
	.text-image:is(.image-right, .image-left) figure {
		margin-bottom: 50px;
	}
	/* Bild rechts */
	.text-image.image-right figure {
		margin-left: 50px;
		float: right;
	}
	/* Bild links */
	.text-image.image-left figure {
		margin-right: 50px;
		float: left;
	}
}
/* Größer gleich 768px, Kleiner gleich 1199px - Medium */
@media (min-width: 48.0000em) and (max-width: 74.9375em) {
	/* Bild rechts oder links */
	.text-image:is(.image-left, .image-right) figure {
		width: calc(50% - 25px); /* Wert wird auch bei Zitaten genutzt */
	}
}
/* Kleiner gleich 1199px - Small + Medium */
@media (max-width: 74.9375em) {
	/* Bild oben oder unten */
	.text-image:is(.image-top, .image-bottom) figure {
		width: 100%;
		grid-template-columns: 1fr;
		grid-template-rows: auto min-content;
	}
}
/* Kleiner gleich 767px - Small */
@media (max-width: 47.9375em) {
	/* (erster Text-Block oder Meta-Headline) und (nicht Bild oben, nicht Bild rechts, nicht Bild links) -> erstes Element kein Abstand oben */
	.text-image:is(.first-of-group, .has-block-headline):not(.image-top, .image-right, .image-left) .rte_wrapper > div :is(blockquote, h2, h3, h4, p, ul, ol, .fsu-table-wrapper):first-child {
		margin-top: 0px;
	}
	/* (nicht erster Text-Block und nicht Meta-Headline) und (Bild rechts oder links) -> Bild Abstand oben */
	.text-image:not(.first-of-group, .has-block-headline):is(.image-right, .image-left) figure {
		margin-top: 1.500rem;
	}
	/* Bild rechts oder links */
	.text-image:is(.image-right, .image-left) figure {
		width: 100%;
		grid-template-columns: 1fr;
		grid-template-rows: auto min-content;
	}
}