/*
 * VDA Online - Vereinssuche
 *
 * Aufbau nach vereine.html: Ergebnisse links als Zeilen mit Logo, Ort und
 * Angeboten, Filterleiste rechts mit 320px, darunter der Kartenbereich
 * auf Papierblau.
 */

.vda-finder__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: var(--wp--preset--spacing--90);
	align-items: start;
}

.vda-finder__ergebnisse {
	min-width: 0;
}

.vda-finder__status {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--30);
	padding-block: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--muted);
}

.vda-finder__status p {
	margin: 0;
}

.vda-finder__status strong {
	color: var(--wp--preset--color--ink);
}

.vda-club-results {
	border-block-end: 1px solid var(--wp--preset--color--line);
}

/* Die Ergebniszeile: Logo, Name mit Ort, Angebote, Weg zum Profil. */
/* Eine Zeile mass 149 Bildpunkte, zwanzig davon fast drei Meter
   Bildschirm. Kürzer wird sie über Logo und Abstände, nicht über die
   Schrift: die bleibt, wie sie ist. */
.vda-club-result {
	display: grid;
	grid-template-columns: 84px minmax(0, 1fr) minmax(160px, 0.5fr) 130px;
	gap: var(--wp--preset--spacing--30);
	align-items: center;
	padding-block: var(--wp--preset--spacing--20);
	border-block-start: 1px solid var(--wp--preset--color--line);
}

.vda-club-result__logo {
	width: 76px;
	aspect-ratio: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--wp--preset--color--line);
	background: var(--wp--preset--color--white);
	overflow: hidden;
}

.vda-club-result__logo img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: var(--wp--preset--spacing--10);
}

.vda-club-result__platzhalter {
	width: 40%;
	aspect-ratio: 1;
	border: 2px solid var(--wp--preset--color--line);
	border-radius: 50%;
}

.vda-club-result__main {
	min-width: 0;
}

/* Ohne diese Regel erben die Vereinsnamen die Displaygröße aus
   theme.json, das waren 56px je Zeile. */
.vda-club-result__main h2 {
	margin: 0;
	font-size: var(--wp--preset--font-size--lead);
	font-weight: 650;
	line-height: 1.25;
	letter-spacing: 0;
	overflow-wrap: anywhere;
	text-wrap: pretty;
	hyphens: auto;
}

.vda-club-result__main h2 a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

.vda-club-result__main h2 a:hover {
	color: var(--wp--preset--color--vda-blue);
}

.vda-club-result__ort {
	margin: var(--wp--preset--spacing--05) 0 0;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--muted);
}

.vda-club-result__angebote {
	min-width: 0;
	padding-inline-start: var(--wp--preset--spacing--30);
	border-inline-start: 1px solid var(--wp--preset--color--line);
}

.vda-club-result__angebote ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--05);
}

.vda-club-result__angebote li {
	font-size: var(--wp--preset--font-size--micro);
	color: var(--wp--preset--color--muted);
	padding: 2px 8px;
	background: var(--wp--preset--color--surface);
	border-radius: var(--wp--custom--radius-small);
}

.vda-club-result__aktion {
	text-align: end;
}

.vda-club-result__land {
	margin: 0 0 var(--wp--preset--spacing--05);
	font-size: var(--wp--preset--font-size--micro);
	color: var(--wp--preset--color--muted);
}

.vda-finder__leer {
	padding-block: var(--wp--preset--spacing--60);
	color: var(--wp--preset--color--muted);
}

/* ---------------------------------------------------------------
   Filterleiste rechts
   --------------------------------------------------------------- */

.vda-finder__rail {
	position: sticky;
	top: calc(var(--wp--custom--header-height) + var(--wp--preset--spacing--30));
	padding: var(--wp--preset--spacing--40);
	background: var(--wp--preset--color--paper-blue);
	border-radius: var(--wp--custom--radius);
}

.vda-finder__rail-abschnitt + .vda-finder__rail-abschnitt {
	margin-block-start: var(--wp--preset--spacing--50);
	padding-block-start: var(--wp--preset--spacing--40);
	border-block-start: 1px solid var(--wp--custom--periwinkle-line);
}

.vda-finder__rail h2 {
	margin: 0 0 var(--wp--preset--spacing--20);
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 750;
	letter-spacing: 0.11em;
	text-transform: uppercase;
	color: var(--wp--preset--color--vda-blue);
	line-height: 1.3;
}

.vda-finder__rail .vda-feld {
	margin-block-start: var(--wp--preset--spacing--20);
}

.vda-finder__rail select,
.vda-finder__rail input[type="search"] {
	min-height: 48px;
	width: 100%;
	padding-inline: var(--wp--preset--spacing--30);
	font: inherit;
	color: var(--wp--preset--color--ink);
	background-color: var(--wp--preset--color--white);
	border: 1px solid #aeb9c4;
	border-radius: var(--wp--custom--radius);
}

.vda-finder__angebote {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--10);
}

.vda-finder__angebote label {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--10);
	min-height: 32px;
	font-size: var(--wp--preset--font-size--small);
	cursor: pointer;
}

.vda-finder__reset {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--vda-blue-dark);
	white-space: nowrap;
}

/* ---------------------------------------------------------------
   Blättern
   --------------------------------------------------------------- */

.vda-finder__blaettern ul {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--10);
	margin: var(--wp--preset--spacing--50) 0 0;
	padding: 0;
}

.vda-finder__blaettern a,
.vda-finder__blaettern span {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	min-height: 40px;
	padding-inline: var(--wp--preset--spacing--20);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius);
	text-decoration: none;
	color: var(--wp--preset--color--ink);
	font-size: var(--wp--preset--font-size--small);
}

.vda-finder__blaettern .current {
	background: var(--wp--preset--color--vda-blue);
	border-color: var(--wp--preset--color--vda-blue);
	color: var(--wp--preset--color--white);
}

/* ---------------------------------------------------------------
   Kartenbereich
   --------------------------------------------------------------- */

/* Die Karte steht über der Liste. Wer wissen will, wo die Vereine
   sind, soll dafür nicht erst an zwanzig Ergebnissen vorbeiscrollen. */
.vda-club-region {
	margin-block-end: var(--wp--preset--spacing--50);
	padding: var(--wp--preset--spacing--40);
	background: var(--wp--preset--color--paper-blue);
	border-radius: var(--wp--custom--radius);
}

.vda-club-region__kopf {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--30);
	margin-block-end: var(--wp--preset--spacing--30);
}

.vda-club-region__kopf h2 {
	margin: 0;
	font-size: var(--wp--preset--font-size--display-6);
	line-height: 1.15;
}

.vda-club-region__schalter {
	flex: 0 0 auto;
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
	font-size: var(--wp--preset--font-size--small);
}

.vda-club-region__fuss {
	margin: var(--wp--preset--spacing--30) 0 0;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--muted);
}

/* Zugeklappt bleibt nur die Überschrift mit dem Schalter stehen. */
.vda-club-region.ist-zu .vda-karte,
.vda-club-region.ist-zu .vda-club-region__fuss {
	display: none;
}

.vda-karte {
	position: relative;
	min-height: 420px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius);
	overflow: hidden;
}

.vda-karte__hinweis {
	max-width: 40ch;
	padding: var(--wp--preset--spacing--50);
	text-align: center;
}

.vda-karte__hinweis p {
	margin: 0;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--muted);
}

.vda-karte__hinweis .vda-submit {
	width: auto;
	margin-block-start: var(--wp--preset--spacing--30);
	padding-inline: var(--wp--preset--spacing--40);
}

.vda-karte__feld {
	position: absolute;
	inset: 0;
}

@media (max-width: 1023px) {
	.vda-finder__layout {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--wp--preset--spacing--50);
	}

	.vda-finder__rail {
		position: static;
		order: -1;
	}
}

@media (max-width: 760px) {
	.vda-club-result {
		grid-template-columns: 72px minmax(0, 1fr);
		row-gap: var(--wp--preset--spacing--20);
	}

	.vda-club-result__logo {
		width: 72px;
	}

	.vda-club-result__angebote {
		grid-column: 1 / -1;
		padding-inline-start: 0;
		border-inline-start: 0;
	}

	.vda-club-result__aktion {
		grid-column: 1 / -1;
		text-align: start;
	}

	.vda-club-region {
		padding: var(--wp--preset--spacing--40);
	}

	.vda-karte {
		min-height: 320px;
	}
}

/* ---------------------------------------------------------------
   Vereinsprofil, öffentliche Ansicht
   Entspricht verein-nymphaea-siegburg.html.
   --------------------------------------------------------------- */

.vda-club {
	display: grid;
	gap: var(--wp--preset--spacing--80);
}

.vda-club__kopf {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--60);
	padding-block-end: var(--wp--preset--spacing--50);
	border-block-end: 1px solid var(--wp--preset--color--line);
}

.vda-club__web {
	margin: 0;
	font-size: var(--wp--preset--font-size--body);
}

.vda-club__web a {
	color: var(--wp--preset--color--vda-blue);
	font-weight: 600;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	min-height: 32px;
}

.vda-club__web a:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.vda-club__aktionen {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--30);
	margin-inline-start: auto;
}

.vda-club__aktionen .vda-submit {
	width: auto;
	min-width: 200px;
	margin-block-start: 0;
}

/* Der Knopf mit Rand, wie button--outline in der Vorlage. */
/* Zwei Knoepfe nebeneinander muessen aus einem Guss sein.

   Bis hierher trug "Kontakt aufnehmen" die Klasse `.vda-submit` - den
   Absendeknopf aus dem Mitgliederbereich, gebaut fuer Formulare: volle
   Breite, 56 Pixel Mindesthoehe, 17 Pixel Schrift, eigener Abstand nach
   oben. Daneben stand der Vereinsknopf mit 48 Pixel und 16. Dass beide
   gleich hoch aussahen, lag allein daran, dass der Flex-Behaelter den
   kleineren auf die Hoehe des groesseren streckte. Sichtbar blieb der
   Unterschied trotzdem an der Schrift, und sobald ein Text umbricht
   oder einer der Knoepfe ausserhalb dieses Behaelters steht, laufen
   sie auseinander.

   Jetzt teilen sich beide dieselbe Grundform. Unterschieden wird nur,
   was sich unterscheiden soll: die Farbe. */
.vda-knopf-rand,
.vda-knopf-voll {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding-inline: var(--wp--preset--spacing--40);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	border: 1.5px solid var(--wp--preset--color--vda-blue);
	border-radius: var(--wp--custom--radius);
	text-decoration: none;
	transition: background-color var(--wp--custom--transition),
		border-color var(--wp--custom--transition),
		color var(--wp--custom--transition);
}

.vda-knopf-rand {
	color: var(--wp--preset--color--vda-blue);
	background: transparent;
}

.vda-knopf-voll {
	color: var(--wp--preset--color--white);
	background: var(--wp--preset--color--vda-blue);
}

.vda-knopf-rand:hover,
.vda-knopf-rand:focus-visible {
	background: var(--wp--preset--color--vda-blue);
	color: var(--wp--preset--color--white);
}

.vda-knopf-voll:hover,
.vda-knopf-voll:focus-visible {
	background: var(--wp--preset--color--vda-blue-dark);
	border-color: var(--wp--preset--color--vda-blue-dark);
	color: var(--wp--preset--color--white);
}

.vda-club__abschnitt h2 {
	margin-block: 0 var(--wp--preset--spacing--40);
	font-size: var(--wp--preset--font-size--display-5);
	line-height: 1.2;
	letter-spacing: -0.01em;
}

.vda-club__abschnitt > p {
	margin-block: 0 var(--wp--preset--spacing--40);
	max-width: 62ch;
	line-height: 1.65;
}

.vda-club__angebote {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.vda-club__angebote li {
	padding: 7px 15px;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	color: var(--wp--preset--color--vda-blue-deep);
	background: var(--wp--preset--color--paper-blue);
	border-radius: 999px;
}

.vda-club__text {
	max-width: 68ch;
	line-height: 1.7;
}

.vda-club__text > :first-child {
	margin-block-start: 0;
}

.vda-club__termine {
	display: grid;
	gap: 0;
	border-block-start: 1px solid var(--wp--preset--color--line);
}

.vda-club-termin {
	display: grid;
	grid-template-columns: 200px minmax(0, 1fr);
	gap: var(--wp--preset--spacing--40);
	padding-block: var(--wp--preset--spacing--40);
	border-block-end: 1px solid var(--wp--preset--color--line);
}

.vda-club-termin__datum {
	margin: 0;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	color: var(--wp--preset--color--muted);
}

.vda-club-termin h3 {
	margin: 0;
	font-size: var(--wp--preset--font-size--body);
	font-weight: 650;
	line-height: 1.35;
}

.vda-club-termin h3 a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	display: inline-block;
	min-height: 24px;
}

.vda-club-termin h3 a:hover {
	color: var(--wp--preset--color--vda-blue);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.vda-club-termin__ort {
	grid-column: 2;
	margin: 4px 0 0;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--muted);
}

.vda-club__mehr {
	margin-block: var(--wp--preset--spacing--40) 0;
}

.vda-club__personen {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: var(--wp--preset--spacing--50);
}

.vda-club-person {
	padding: var(--wp--preset--spacing--40);
	background: var(--wp--preset--color--paper);
	border-radius: var(--wp--custom--radius-small);
}

.vda-club-person p {
	margin: 0 0 4px;
	font-size: var(--wp--preset--font-size--small);
}

.vda-club-person__name {
	font-size: var(--wp--preset--font-size--body) !important;
	font-weight: 700;
	margin-block-end: 8px !important;
}

.vda-club-person a {
	color: var(--wp--preset--color--vda-blue);
	display: inline-block;
	min-height: 24px;
}

.vda-club__daten {
	display: grid;
	gap: 0;
	margin: 0;
	border-block-start: 1px solid var(--wp--preset--color--line);
	max-width: 640px;
}

.vda-club__daten > div {
	display: grid;
	grid-template-columns: 160px minmax(0, 1fr);
	gap: var(--wp--preset--spacing--40);
	padding-block: 13px;
	border-block-end: 1px solid var(--wp--preset--color--line);
}

.vda-club__daten dt {
	margin: 0;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--wp--preset--color--muted);
}

.vda-club__daten dd {
	margin: 0;
	overflow-wrap: anywhere;
}

.vda-club__daten dd a {
	color: var(--wp--preset--color--vda-blue);
	display: inline-block;
	min-height: 24px;
}

/* Die Karte lädt erst nach Zustimmung. */
.vda-club__karte {
	margin-block-start: var(--wp--preset--spacing--50);
	padding: var(--wp--preset--spacing--50);
	background: var(--wp--preset--color--paper);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius-small);
	text-align: center;
}

.vda-club__karte p {
	margin-block: 0 var(--wp--preset--spacing--40);
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--muted);
	max-width: 52ch;
	margin-inline: auto;
}

.vda-club__karte .vda-submit {
	width: auto;
	min-width: 200px;
	margin-block-start: 0;
}

.vda-club__karte iframe {
	display: block;
	width: 100%;
	height: 380px;
	border: 0;
	border-radius: var(--wp--custom--radius-small);
}

@media (max-width: 782px) {
	.vda-club-termin {
		grid-template-columns: minmax(0, 1fr);
		gap: 6px;
	}

	.vda-club-termin__ort {
		grid-column: 1;
	}

	.vda-club__daten > div {
		grid-template-columns: minmax(0, 1fr);
		gap: 4px;
	}

	.vda-club__aktionen {
		margin-inline-start: 0;
		width: 100%;
	}

	.vda-club__aktionen .vda-submit,
	.vda-club__aktionen .vda-knopf-rand {
		flex: 1 1 200px;
	}
}

/* Ohne Website-Verweis stehen die Knöpfe links statt am rechten Rand. */
.vda-club__aktionen:only-child {
	margin-inline-start: 0;
}

/* ==========================================================================
   Ansprechpartner mit Bild, Fotoalbum
   21 Vereine haben ein Bild zum ersten Ansprechpartner hinterlegt,
   12 zum zweiten, 14 ein Fotoalbum. Bis zum 31.08.2026 wurde nichts
   davon ausgegeben.
   ========================================================================== */

.vda-club-person--mit-bild {
	display: grid;
	grid-template-columns: 72px minmax(0, 1fr);
	gap: var(--wp--preset--spacing--30);
	align-items: start;
}

.vda-club-person__bild img {
	width: 72px;
	height: 72px;
	object-fit: cover;
	border-radius: 50%;
	display: block;
}

.vda-club__album {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: var(--wp--preset--spacing--30);
	margin-block-start: var(--wp--preset--spacing--40);
}

.vda-club__albumbild {
	margin: 0;
}

.vda-club__albumbild img {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--wp--custom--radius);
	display: block;
}

.vda-club__albumbild figcaption {
	margin-block-start: 0.4rem;
	font-size: 0.8125rem;
	color: var(--wp--preset--color--muted);
}

/* Unterlagen zum Herunterladen: bisher nur beim AK-LAF gefüllt. */
.vda-club__dateien {
	list-style: none;
	margin: var(--wp--preset--spacing--40) 0 0;
	padding: 0;
	display: grid;
	gap: 0.5rem;
}

.vda-club__dateien li {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.5rem;
	padding-block: 0.5rem;
	border-block-end: 1px solid rgba(18, 105, 176, 0.14);
}

.vda-club__dateigroesse {
	font-size: 0.8125rem;
	color: var(--wp--preset--color--muted);
}

/* ==========================================================================
   Vereine in der Nähe
   Postleitzahl oder Standort, dazu ein Umkreis. Ist ein Bezugspunkt
   gesetzt, steht die Entfernung an der Stelle, wo sonst das Bundesland
   steht.
   ========================================================================== */

.vda-finder__naehe .vda-feld {
	margin-block-end: 0.75rem;
}

.vda-finder__standort {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	background: none;
	border: 0;
	padding: 0;
	font: inherit;
	cursor: pointer;
}

.vda-finder__standort::before {
	content: "";
	width: 0.85rem;
	height: 0.85rem;
	border: 2px solid currentColor;
	border-radius: 50%;
	position: relative;
	flex: none;
}

.vda-finder__standort[disabled] {
	opacity: 0.5;
	cursor: default;
}

.vda-finder__standort-hinweis {
	margin-block-start: 0.4rem;
}

.vda-club-result__km {
	font-weight: 700;
	color: var(--wp--preset--color--vda-blue);
	margin: 0 0 0.25rem;
	white-space: nowrap;
}

/* ==========================================================================
   Neuigkeiten und Termine eines Vereins
   Beide liegen jetzt unter der Adresse des Vereins, damit die
   Zugehörigkeit schon am Pfad ablesbar ist.
   ========================================================================== */

.vda-club__neuigkeiten {
	list-style: none;
	margin: var(--wp--preset--spacing--40) 0 0;
	padding: 0;
	display: grid;
	gap: 0;
}

.vda-club__neuigkeiten li {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: baseline;
	gap: 0.5rem 1rem;
	padding-block: 0.7rem;
	border-block-end: 1px solid rgba(18, 105, 176, 0.14);
}

.vda-club__neuigkeiten a {
	font-weight: 600;
	overflow-wrap: anywhere;
}

.vda-club__datum {
	font-size: 0.8125rem;
	color: var(--wp--preset--color--muted);
	white-space: nowrap;
}

.vda-club__mehr {
	display: flex;
	flex-wrap: wrap;
	gap: 1.25rem;
}

.vda-vereinsliste__kopf {
	margin-block-end: var(--wp--preset--spacing--60);
}

.vda-vereinsliste__kopf h1 {
	margin-block-start: 0.25rem;
}

.vda-vereinsliste__eintraege {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--wp--preset--spacing--50);
}

.vda-vereinsliste__eintrag {
	display: grid;
	gap: var(--wp--preset--spacing--40);
	padding-block-end: var(--wp--preset--spacing--50);
	border-block-end: 1px solid rgba(18, 105, 176, 0.14);
}

@media (min-width: 640px) {
	.vda-vereinsliste__eintrag:has(.vda-vereinsliste__bild) {
		grid-template-columns: minmax(0, 220px) minmax(0, 1fr);
		align-items: start;
	}
}

.vda-vereinsliste__bild img {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--wp--custom--radius);
	display: block;
}

.vda-vereinsliste__text h2 {
	margin: 0.2rem 0 0.5rem;
	font-size: clamp(1.125rem, 2vw, 1.375rem);
	line-height: 1.25;
}

.vda-vereinsliste__zurueck {
	margin-block-start: var(--wp--preset--spacing--60);
}

/* ==========================================================================
   Jobsuchende finden
   Profile lebender Personen. Ohne Anmeldung stehen nur Beruf, Ort und
   Fähigkeiten da, Name und Kontakt bleiben Mitgliedern vorbehalten.
   ========================================================================== */

.vda-jobliste {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--wp--preset--spacing--40);
}

.vda-jobkarte {
	padding: var(--wp--preset--spacing--50);
	background: #fff;
	border: 1px solid rgba(18, 105, 176, 0.18);
	border-radius: var(--wp--custom--radius);
}

.vda-jobkarte__kopf {
	display: flex;
	align-items: flex-start;
	gap: var(--wp--preset--spacing--30);
	margin-block-end: 0.6rem;
}

.vda-jobkarte__kopf h3 {
	margin: 0 0 0.2rem;
	font-size: clamp(1.0625rem, 1.8vw, 1.25rem);
	line-height: 1.25;
}

.vda-jobkarte__bild img,
.vda-jobkarte__platzhalter {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
	flex: none;
}

.vda-jobkarte__platzhalter {
	background: var(--wp--preset--color--paper-blue);
}

.vda-jobkarte__meta {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.3rem 0.75rem;
	font-size: 0.875rem;
	color: var(--wp--preset--color--muted);
}

.vda-jobkarte__sucht {
	margin: 0 0 0.5rem;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--wp--preset--color--vda-blue);
}

.vda-jobkarte__text {
	margin: 0 0 0.75rem;
	line-height: 1.6;
}

.vda-jobkarte__skills {
	list-style: none;
	margin: 0 0 0.75rem;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
}

.vda-jobkarte__skills li {
	padding: 0.2rem 0.5rem;
	background: var(--wp--preset--color--paper-blue);
	border-radius: 3px;
	font-size: 0.8125rem;
}

.vda-jobkarte__mehr > summary {
	cursor: pointer;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--wp--preset--color--vda-blue);
}

.vda-jobkarte__laufbahn {
	list-style: none;
	margin: 0.6rem 0 0;
	padding: 0;
	display: grid;
	gap: 0.4rem;
	font-size: 0.9375rem;
}

.vda-jobkarte__laufbahn li {
	padding-inline-start: 0.8rem;
	border-inline-start: 2px solid rgba(18, 105, 176, 0.25);
}

.vda-jobkarte__zeit {
	display: block;
	font-size: 0.8125rem;
	color: var(--wp--preset--color--muted);
}

.vda-jobkarte__kontakt,
.vda-jobkarte__hinweis {
	margin: 0.75rem 0 0;
	padding-block-start: 0.75rem;
	border-block-start: 1px solid rgba(18, 105, 176, 0.14);
	font-size: 0.875rem;
}

.vda-jobkarte__hinweis {
	color: var(--wp--preset--color--muted);
}

/* Jobsuche ohne Zugang
   Die Seite steht offen, die Profile nicht. Statt eines leeren Kastens
   der Weg zur Geschäftsstelle. */
.vda-finder--gesperrt {
	display: block;
}

.vda-hinweiskarte {
	max-width: 640px;
	margin-inline: auto;
	padding: var(--wp--preset--spacing--60);
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius);
	box-shadow: var(--wp--preset--shadow--soft);
	text-align: center;
}

.vda-hinweiskarte h2 {
	font-size: var(--wp--preset--font-size--display-4);
	margin-block: 0 var(--wp--preset--spacing--30);
}

.vda-hinweiskarte p {
	margin-block: 0 var(--wp--preset--spacing--30);
	color: var(--wp--preset--color--muted);
}

.vda-hinweiskarte__aktion {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--30);
	align-items: center;
	justify-content: center;
	margin-block-start: var(--wp--preset--spacing--40);
}

.vda-hinweiskarte__fuss {
	margin-block: var(--wp--preset--spacing--40) 0;
	padding-block-start: var(--wp--preset--spacing--30);
	border-block-start: 1px solid var(--wp--preset--color--line);
	font-size: var(--wp--preset--font-size--small);
}


/* ---------------------------------------------------------------
   Verzahnung von Karte und Liste
   --------------------------------------------------------------- */

.vda-karte__blase a {
	font-weight: 600;
}

.vda-karte__blase p {
	margin: 0.25rem 0 0;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--muted);
}

/* Der Eintrag, dessen Stecknadel gerade offen ist. */
.vda-club-result.ist-aktiv {
	outline: 2px solid var(--wp--preset--color--vda-blue);
	outline-offset: 2px;
}

.vda-club-result__karte {
	display: block;
	margin-block-start: 0.35rem;
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
	font-size: var(--wp--preset--font-size--small);
}

/* Vereine ohne Inhalt stehen weiter unten und sagen das auch. Ohne
   den Hinweis klickt man auf eine leere Seite und kommt nicht wieder. */
.vda-club-result__duenn {
	margin: 0.35rem 0 0;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--muted);
	font-style: italic;
}

.vda-club-result.ist-duenn .vda-club-result__logo {
	opacity: 0.7;
}

/* ---------------------------------------------------------------
   Kopfzeile der Ergebnisse: Anzahl links, Reihenfolge rechts
   --------------------------------------------------------------- */

.vda-finder__status {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--20);
}

.vda-finder__status-rechts {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--30);
}

.vda-finder__sortierung {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: var(--wp--preset--font-size--small);
}

.vda-finder__sortierung select {
	font-size: var(--wp--preset--font-size--small);
	padding: 0.35rem 0.6rem;
}

@media (max-width: 600px) {
	.vda-finder__status-rechts {
		width: 100%;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.vda-finder__sortierung span {
		display: none;
	}

	/* Das Auswahlfeld darf schrumpfen, sonst schiebt es „Auswahl
	   aufheben" bei 320 Bildpunkten über den Rand hinaus. */
	.vda-finder__sortierung {
		min-width: 0;
		flex: 1 1 12rem;
	}

	.vda-finder__sortierung select {
		width: 100%;
		min-width: 0;
	}
}


/* ---------------------------------------------------------------
   Der Weg zum eigenen Umkreis, direkt über der Karte
   --------------------------------------------------------------- */

.vda-club-region__standort {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.5rem;
	margin-block-end: var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--small);
}

.vda-club-region__standort p {
	margin: 0;
	color: var(--wp--preset--color--muted);
}

.vda-club-region__standort button {
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
	font-size: inherit;
}

.vda-club-region__oder {
	color: var(--wp--preset--color--muted);
}

@media (max-width: 760px) {
	/* Auf schmalen Schirmen zählt jeder Bildpunkt: die Karte reicht
	   bis an den Rand des Kastens, sonst bleiben von 375 Bildpunkten
	   nur 261 für die Karte übrig. */
	.vda-club-region {
		padding-inline: var(--wp--preset--spacing--20);
	}

	.vda-club-region__kopf,
	.vda-club-region__standort,
	.vda-club-region__fuss {
		padding-inline: var(--wp--preset--spacing--20);
	}

	.vda-karte {
		min-height: 340px;
	}

	.vda-club-region__oder {
		flex-basis: 100%;
	}

	/* Nebeneinander bricht die Überschrift auf zwei Zeilen um. */
	.vda-club-region__kopf {
		display: block;
	}

	.vda-club-region__schalter {
		margin-block-start: 0.35rem;
	}
}

/* ==========================================================================
   Vereinsprofil übernehmen

   Der Kasten steht ganz unten auf dem Profil und richtet sich an den
   Verein selbst - nicht an Interessenten. Deshalb sitzt er getrennt vom
   Abschnitt „So gelingt der erste Kontakt", der Besucher anspricht.
   ========================================================================== */

/* Text links, Knopf rechts - der Kasten nimmt die ganze Breite ein,
   statt den Knopf unter einem kurzen Absatz zu verstecken. */
.vda-uebernahme {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(240px, 20rem);
	align-items: center;
	gap: var(--wp--preset--spacing--40);
	margin-block-start: var(--wp--preset--spacing--50);
	padding: var(--wp--preset--spacing--40);
	border: 1px solid var(--wp--preset--color--line);
	border-inline-start: 6px solid var(--wp--preset--color--vda-blue);
	background: var(--wp--preset--color--surface);
}

.vda-uebernahme__text > :last-child {
	margin-block-end: 0;
}

@media (max-width: 782px) {

	.vda-uebernahme {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--wp--preset--spacing--30);
	}
}

/* Wer sein eigenes Profil ansieht, braucht keinen Werbekasten - nur den
   Weg zum Bearbeiten. */
.vda-uebernahme--eigen {
	border-inline-start-color: var(--wp--preset--color--success);
	background: var(--wp--preset--color--white);
}

.vda-uebernahme__titel {
	margin: 0 0 0.5rem;
	color: var(--wp--preset--color--vda-blue-dark);
	font-size: var(--wp--preset--font-size--display-6);
	font-weight: 700;
	line-height: 1.25;
}

.vda-uebernahme p {
	margin-block: 0 0.75rem;
	color: var(--wp--preset--color--muted);
	max-width: 62ch;
}

.vda-uebernahme__aktion {
	display: grid;
	justify-items: start;
	gap: var(--wp--preset--spacing--20);
	margin-block-end: 0;
}

.vda-uebernahme__aktion .wp-element-button {
	width: 100%;
	text-align: center;
}

.vda-uebernahme__hinweis {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.45;
}

/* Das Formular auf der Übernahmeseite: welcher Verein gemeint ist,
   steht oben, damit niemand das falsche Profil beansprucht. */
.vda-uebernahmeformular__verein {
	display: grid;
	gap: 2px;
	margin-block-end: var(--wp--preset--spacing--30);
	padding: var(--wp--preset--spacing--20);
	border: 1px solid var(--wp--preset--color--line);
	background: var(--wp--preset--color--paper-blue);
}

.vda-uebernahmeformular__verein strong {
	font-size: 1.125rem;
	line-height: 1.3;
}

.vda-uebernahmeformular__nummer {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
	font-variant-numeric: tabular-nums;
}

/* ==========================================================================
   Aus dem Vereinsleben: Bilder in groß

   Die Vorschau bleibt, wie sie war - dazu kommt die Großansicht. Ohne
   JavaScript öffnet der Verweis einfach die Bilddatei, dann fehlt nur
   das Blättern.
   ========================================================================== */

.vda-club__albumlink {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: var(--wp--custom--radius-small);
}

.vda-club__albumlink img {
	display: block;
	width: 100%;
	height: auto;
	transition: transform 240ms ease;
}

.vda-club__albumlink:hover img,
.vda-club__albumlink:focus-visible img {
	transform: scale(1.04);
}

/* Die Lupe sagt: hier gibt es mehr zu sehen. Sie erscheint erst beim
   Darüberfahren, damit die Bilder nicht zugepflastert wirken. */
.vda-club__lupe {
	position: absolute;
	inset-block-end: 8px;
	inset-inline-end: 8px;
	width: 34px;
	height: 34px;
	background: rgba(2, 30, 51, 0.72);
	border-radius: 50%;
	opacity: 0;
	transition: opacity 160ms ease;
}

.vda-club__lupe::before {
	content: "";
	position: absolute;
	inset: 0;
	background: #fff;
	mask: var(--vda-lupe-zeichen) center / 18px 18px no-repeat;
	-webkit-mask: var(--vda-lupe-zeichen) center / 18px 18px no-repeat;
}

.vda-club__album {
	--vda-lupe-zeichen: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M10 2a8 8 0 1 0 4.9 14.3l5.4 5.4 1.4-1.4-5.4-5.4A8 8 0 0 0 10 2zm0 2a6 6 0 1 1 0 12 6 6 0 0 1 0-12z'/%3E%3Cpath d='M9 6h2v3h3v2h-3v3H9v-3H6V9h3z'/%3E%3C/svg%3E");
}

.vda-club__albumlink:hover .vda-club__lupe,
.vda-club__albumlink:focus-visible .vda-club__lupe {
	opacity: 1;
}

/* --- Die Großansicht ---------------------------------------------------- */

.vda-lupe {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: var(--wp--preset--spacing--20);
	padding: var(--wp--preset--spacing--30);
	background: rgba(2, 22, 38, 0.97);
}

/* Solange die Großansicht offen ist, scrollt die Seite dahinter nicht. */
body.vda-lupe-offen {
	overflow: hidden;
}

.vda-lupe__rahmen {
	display: grid;
	gap: 0.75rem;
	justify-items: center;
	margin: 0;
	min-width: 0;
}

.vda-lupe__bild {
	max-width: 100%;
	max-height: 78vh;
	width: auto;
	height: auto;
	object-fit: contain;
	background: rgba(255, 255, 255, 0.04);
}

.vda-lupe__text {
	max-width: 70ch;
	color: rgba(255, 255, 255, 0.88);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.5;
	text-align: center;
}

.vda-lupe__stand {
	position: absolute;
	inset-block-start: var(--wp--preset--spacing--30);
	inset-inline-start: var(--wp--preset--spacing--30);
	margin: 0;
	color: rgba(255, 255, 255, 0.72);
	font-size: var(--wp--preset--font-size--small);
	font-variant-numeric: tabular-nums;
}

.vda-lupe__zu,
.vda-lupe__weiter {
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, 0.28);
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.08);
	color: #fff;
	cursor: pointer;
	transition: background-color 160ms ease, border-color 160ms ease;
}

.vda-lupe__zu:hover,
.vda-lupe__weiter:hover,
.vda-lupe__zu:focus-visible,
.vda-lupe__weiter:focus-visible {
	background: rgba(255, 255, 255, 0.2);
	border-color: rgba(255, 255, 255, 0.6);
}

.vda-lupe__zu {
	position: absolute;
	inset-block-start: var(--wp--preset--spacing--30);
	inset-inline-end: var(--wp--preset--spacing--30);
}

.vda-lupe__zu::before,
.vda-lupe__weiter::before {
	content: "";
	width: 20px;
	height: 20px;
	background: currentColor;
	mask-position: center;
	mask-repeat: no-repeat;
	mask-size: 20px 20px;
	-webkit-mask-position: center;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 20px 20px;
}

.vda-lupe__zu::before {
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M6.4 5 5 6.4l5.6 5.6L5 17.6 6.4 19l5.6-5.6 5.6 5.6 1.4-1.4-5.6-5.6L19 6.4 17.6 5 12 10.6z'/%3E%3C/svg%3E");
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M6.4 5 5 6.4l5.6 5.6L5 17.6 6.4 19l5.6-5.6 5.6 5.6 1.4-1.4-5.6-5.6L19 6.4 17.6 5 12 10.6z'/%3E%3C/svg%3E");
}

.vda-lupe__weiter--zurueck::before {
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M15.4 4.6 14 3.2 5.2 12l8.8 8.8 1.4-1.4L8 12z'/%3E%3C/svg%3E");
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M15.4 4.6 14 3.2 5.2 12l8.8 8.8 1.4-1.4L8 12z'/%3E%3C/svg%3E");
}

.vda-lupe__weiter--vor::before {
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M8.6 4.6 10 3.2 18.8 12 10 20.8l-1.4-1.4L16 12z'/%3E%3C/svg%3E");
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M8.6 4.6 10 3.2 18.8 12 10 20.8l-1.4-1.4L16 12z'/%3E%3C/svg%3E");
}

/* Auf schmalen Geräten sitzen die Pfeile unten, sonst nehmen sie dem
   Bild die halbe Breite weg. Gewischt wird dort ohnehin. */
@media (max-width: 640px) {

	.vda-lupe {
		grid-template-columns: minmax(0, 1fr);
		grid-template-rows: minmax(0, 1fr) auto;
	}

	.vda-lupe__weiter--zurueck { grid-column: 1; justify-self: start; }
	.vda-lupe__weiter--vor { grid-column: 1; justify-self: end; margin-block-start: -48px; }

	.vda-club__lupe { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {

	.vda-club__albumlink img {
		transition: none;
	}

	.vda-club__albumlink:hover img {
		transform: none;
	}
}

/* ------------------------------------------------------------------
   Zwei Spalten auf dem Vereinsprofil

   Vorher stand alles untereinander: Text, Termine, Neuigkeiten,
   Ansprechpartner, Kontakt. Der Text war auf 68 Zeichen begrenzt,
   rechts daneben blieb die halbe Seite leer, und die Kontaktdaten
   standen ganz unten, wo sie niemand sucht.

   Links stehen jetzt die Inhalte, rechts das Nachschlagbare:
   Termine, Ansprechpartner, Vereinskontakt mit Karte.
   ------------------------------------------------------------------ */

.vda-club__spalten {
	display: grid;
	gap: var(--wp--preset--spacing--80);
}

.vda-club__haupt,
.vda-club__rail {
	display: grid;
	gap: var(--wp--preset--spacing--80);
	align-content: start;
	min-width: 0;
}

@media (min-width: 900px) {

	.vda-club__spalten {
		grid-template-columns: minmax(0, 1fr) 25rem;
		gap: var(--wp--preset--spacing--80) var(--wp--preset--spacing--70);
		align-items: start;
	}

	/* Die Seitenspalte wird enger gesetzt: kleinere Ueberschriften,
	   weniger Abstand. Sie ist zum Nachschlagen da, nicht zum Lesen. */
	.vda-club__rail {
		gap: var(--wp--preset--spacing--40);
		font-size: var(--wp--preset--font-size--small);

		/* Die Spalte bleibt stehen, waehrend der Text daneben laeuft.
		   Kein eigener Balken: dafuer wurde die Spalte kurz gehalten.
		   Der Fliesstext "So gelingt der erste Kontakt" steht deshalb
		   wieder links, und die Karte ist niedriger. */
		position: sticky;
		top: var(--wp--preset--spacing--40);
		align-self: start;
	}

	.vda-club__rail .vda-club__abschnitt h2 {
		font-size: var(--wp--preset--font-size--display-6);
		margin-block-end: var(--wp--preset--spacing--30);
	}

	/* Jeder Kasten in der Spalte bekommt einen ruhigen Hintergrund,
	   damit die Spalte als Einheit zu erkennen ist. */
	.vda-club__rail > .vda-club__abschnitt {
		background: var(--wp--preset--color--surface);
		border: 1px solid var(--wp--preset--color--line);
		border-radius: var(--wp--custom--radius-small);
		padding: var(--wp--preset--spacing--50);
	}

	.vda-club__rail .vda-club__abschnitt > p {
		max-width: none;
	}

	/* Im Haupttext darf die Zeile etwas breiter laufen als vorher,
	   die Spalte ist schmaler als die ganze Seite. */
	.vda-club__haupt .vda-club__text {
		max-width: 72ch;
	}
}

/* ------------------------------------------------------------------
   Lesbarkeit des Vereinstextes
   Der Text kommt aus einem Eingabefeld und wird mit wpautop in
   Absaetze zerlegt. Zeilenumbrueche innerhalb eines Absatzes
   benutzen die Vereine haeufig als Zwischenueberschrift.
   ------------------------------------------------------------------ */

/* Die Absaetze standen mit 32 Pixeln sehr weit auseinander. Bei einem
   Text, der aus vielen kurzen Absaetzen besteht, zerfaellt er dadurch.
   Ein knappes Zeilenmass reicht. */
.vda-club__text p {
	margin-block: 0 0.7em;
}

.vda-club__text p:last-child {
	margin-block-end: 0;
}

/* Ein Absatz, der nur aus einer kurzen Zeile plus Umbruch beginnt,
   ist fast immer eine Zwischenueberschrift. Die erste Zeile bekommt
   deshalb etwas mehr Luft davor. */
.vda-club__text p + p {
	margin-block-start: 0;
}

.vda-club__text br + * {
	margin-block-start: 0;
}

/* ------------------------------------------------------------------
   Die Kaesten in der Seitenspalte sind nur rund 288 Pixel breit.
   Alles, was fuer die ganze Seitenbreite gebaut war, bricht dort
   auseinander: die Datenliste hatte 160 Pixel feste Beschriftung,
   fuer die Anschrift blieben keine 100 Pixel uebrig.
   In der Spalte steht deshalb alles untereinander.
   ------------------------------------------------------------------ */
@media (min-width: 900px) {

	.vda-club__rail .vda-club__daten {
		max-width: none;
	}

	.vda-club__rail .vda-club__daten > div {
		grid-template-columns: 1fr;
		gap: 2px;
		padding-block: 10px;
	}

	.vda-club__rail .vda-club__daten dt {
		font-size: 11.5px;
	}

	/* Ansprechpartner: Bild ueber den Text statt daneben. */
	.vda-club__rail .vda-club__personen {
		grid-template-columns: 1fr;
		gap: var(--wp--preset--spacing--40);
	}

	.vda-club__rail .vda-club-person {
		grid-template-columns: 1fr;
		text-align: left;
	}

	.vda-club__rail .vda-club-person__bild {
		width: 64px;
		height: 64px;
	}

	/* Die Knoepfe stehen jetzt in der Spalte und sollen sie fuellen,
	   statt nebeneinander zu quetschen. */
	.vda-club__rail .vda-club__kopf {
		display: block;
		border-block-end: 0;
		padding-block-end: var(--wp--preset--spacing--50);
	}

	.vda-club__rail .vda-club__aktionen {
		display: grid;
		gap: 10px;
	}

	.vda-club__rail .vda-club__aktionen > a {
		text-align: center;
	}

	.vda-club__rail .vda-club__web {
		margin-block: 0 var(--wp--preset--spacing--30);
		overflow-wrap: anywhere;
	}

	/* Die Karte darf in der schmalen Spalte nicht so hoch sein. */
	.vda-club__rail .vda-club__karte {
		min-height: 160px;
		height: 160px;
	}
}