/*
 * Stellenanzeige "Stallhilfe gesucht" - The-Web-Designer.de, 30.09.2026
 * Eigene Datei, weil .htaccess CSS 2 Monate cachen laesst: Bei jeder Aenderung
 * die Versionskennung ?v=... hochzaehlen - Ablauf siehe Kopf von patch_seiten.py
 * (erst --entfernen, VERSION in beiden Skripten erhoehen, neu patchen + bauen).
 * Nur ASCII verwenden - die Seiten haben gemischte Zeichensaetze.
 */

/* ---------- Menuepunkt (linke Navigation, alle Seiten) ---------- */
td.twd-sh-menuzelle {
	padding: 4px 1px 4px 13px;
}
a.twd-sh-menue:link,
a.twd-sh-menue:visited,
a.twd-sh-menue:hover,
a.twd-sh-menue:active {
	display: block;
	padding: 4px 6px 4px 9px;
	background: #B60607;
	border: 1px solid #8A0405;
	border-radius: 3px;
	color: #FFFFFF;
	font-family: "Comic Sans MS", Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	line-height: 14px;
	letter-spacing: 0.3px;
	text-decoration: none;
	animation: twd-sh-puls 1.6s ease-out infinite;
}
a.twd-sh-menue:hover,
a.twd-sh-menue:focus {
	background: #D3120F;
	text-decoration: underline;
}
a.twd-sh-menue:focus {
	outline: 2px solid #436715;
	outline-offset: 2px;
}
a.twd-sh-menue.twd-sh-aktiv:link,
a.twd-sh-menue.twd-sh-aktiv:visited {
	background: #8A0405;
}

@keyframes twd-sh-puls {
	0%   { box-shadow: 0 0 0 0 rgba(182, 6, 7, 0.75); }
	70%  { box-shadow: 0 0 0 7px rgba(182, 6, 7, 0); }
	100% { box-shadow: 0 0 0 0 rgba(182, 6, 7, 0); }
}

/* ---------- Teaser-Kasten (Startseite) ---------- */
.twd-sh-teaser {
	/* 40px links/rechts = buendig mit dem Hinweis-blockquote darunter */
	margin: 0 40px 25px 40px;
	padding: 16px 20px 18px 20px;
	background: #FFFFFF;
	border: 3px solid #B60607;
	border-radius: 6px;
	text-align: center;
	font-family: "Comic Sans MS", Arial, Helvetica, sans-serif;
	color: #436715;
	animation: twd-sh-puls 1.6s ease-out infinite;
}
.twd-sh-teaser-titel {
	margin: 0 0 8px 0;
	color: #B60607;
	font-size: 20px;
	font-weight: bold;
}
.twd-sh-teaser-text {
	margin: 0 0 14px 0;
	font-size: 14px;
	line-height: 20px;
}

/* ---------- Knoepfe (Teaser, Anzeigenseite, Pop-up) ---------- */
a.twd-sh-knopf:link,
a.twd-sh-knopf:visited,
a.twd-sh-knopf:hover,
a.twd-sh-knopf:active,
button.twd-sh-knopf {
	display: inline-block;
	margin: 4px 4px;
	padding: 9px 18px;
	background: #B60607;
	border: 0;
	border-radius: 4px;
	color: #FFFFFF;
	font-family: "Comic Sans MS", Arial, Helvetica, sans-serif;
	font-size: 15px;
	font-weight: bold;
	line-height: 20px;
	text-decoration: none;
	cursor: pointer;
}
a.twd-sh-knopf:hover,
a.twd-sh-knopf:focus,
button.twd-sh-knopf:hover,
button.twd-sh-knopf:focus {
	background: #D3120F;
	text-decoration: underline;
}
a.twd-sh-knopf-gruen:link,
a.twd-sh-knopf-gruen:visited,
a.twd-sh-knopf-gruen:hover,
a.twd-sh-knopf-gruen:active {
	background: #436715;
}
a.twd-sh-knopf-gruen:hover,
a.twd-sh-knopf-gruen:focus {
	background: #56821D;
}
button.twd-sh-knopf-leise {
	background: #FFFFFF;
	border: 2px solid #436715;
	color: #436715;
	padding: 7px 16px;
}
button.twd-sh-knopf-leise:hover,
button.twd-sh-knopf-leise:focus {
	background: #F3F4EE;
}
a.twd-sh-knopf:focus,
button.twd-sh-knopf:focus {
	outline: 3px solid #F2B705;
	outline-offset: 2px;
}

/* ---------- Pop-up (wird von js/stallhilfe.js erzeugt) ---------- */
dialog.twd-sh-dialog {
	width: 92%;
	max-width: 480px;
	margin: auto;
	padding: 0;
	border: 3px solid #B60607;
	border-radius: 8px;
	background: #FFFFFF;
	color: #436715;
	font-family: "Comic Sans MS", Arial, Helvetica, sans-serif;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.45);
}
dialog.twd-sh-dialog::backdrop {
	background: rgba(30, 45, 10, 0.6);
}
.twd-sh-dialog-bild {
	display: block;
	width: 100%;
	height: 170px;
	object-fit: cover;
	object-position: center 40%;
}
.twd-sh-dialog-inhalt {
	padding: 16px 22px 20px 22px;
	text-align: center;
}
.twd-sh-dialog-marke {
	display: inline-block;
	margin: 0 0 8px 0;
	padding: 2px 10px;
	background: #B60607;
	border-radius: 10px;
	color: #FFFFFF;
	font-size: 12px;
	font-weight: bold;
	letter-spacing: 0.5px;
}
.twd-sh-dialog h2 {
	margin: 0 0 10px 0;
	color: #B60607;
	font-size: 22px;
	line-height: 27px;
}
.twd-sh-dialog p {
	margin: 0 0 12px 0;
	font-size: 14px;
	line-height: 20px;
}
.twd-sh-dialog-zu {
	position: absolute;
	top: 8px;
	right: 8px;
	width: 34px;
	height: 34px;
	padding: 0;
	border: 0;
	border-radius: 17px;
	background: rgba(255, 255, 255, 0.92);
	color: #333333;
	font-size: 24px;
	line-height: 34px;
	cursor: pointer;
}
.twd-sh-dialog-zu:hover,
.twd-sh-dialog-zu:focus {
	background: #FFFFFF;
	color: #B60607;
	outline: 2px solid #B60607;
}

/* ---------- Anzeigenseite stallhilfe.html ---------- */
.twd-sh-anzeige {
	margin: 0 0 30px 0;
	padding: 22px 26px 24px 26px;
	background: #FFFFFF;
	border: 3px solid #B60607;
	border-radius: 8px;
	font-family: "Comic Sans MS", Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 21px;
	color: #436715;
}
.twd-sh-anzeige h1 {
	margin: 6px 0 14px 0;
	color: #B60607;
	font-size: 22px;
	line-height: 28px;
}
.twd-sh-anzeige h2 {
	margin: 18px 0 6px 0;
	color: #436715;
	font-size: 16px;
}
.twd-sh-anzeige p {
	margin: 0 0 12px 0;
}
.twd-sh-anzeige ul {
	margin: 0 0 12px 0;
	padding: 0 0 0 22px;
}
.twd-sh-anzeige li {
	margin: 0 0 3px 0;
}
.twd-sh-anzeige-bild {
	display: block;
	width: 100%;
	height: auto;
	margin: 0 0 16px 0;
	border-radius: 5px;
}
.twd-sh-steckbrief {
	margin: 16px 0;
	padding: 12px 16px;
	background: #F3F4EE;
	border-left: 5px solid #436715;
	border-radius: 4px;
}
.twd-sh-steckbrief h2 {
	margin-top: 0;
}
.twd-sh-steckbrief ul {
	margin: 0;
}
.twd-sh-ort {
	font-weight: bold;
}
.twd-sh-kontakt {
	margin: 20px 0 0 0;
	padding: 16px 18px;
	background: #FFF4F4;
	border: 2px dashed #B60607;
	border-radius: 6px;
	text-align: center;
}
.twd-sh-kontakt p {
	margin: 0 0 10px 0;
}
.twd-sh-kontakt-klein {
	font-size: 13px;
}

/* Systemeinstellung "Bewegung reduzieren": kein Pulsieren.
   Muss am Dateiende stehen, sonst gewinnen die Regeln oben. */
@media (prefers-reduced-motion: reduce) {
	a.twd-sh-menue:link,
	a.twd-sh-menue:visited,
	a.twd-sh-menue:hover,
	a.twd-sh-menue:active,
	.twd-sh-teaser {
		animation: none;
	}
}