/*Version 2026-01-27*/
:root
{	--logo-hell: #EBDD18; --logo-dunkel: #B4AA12;
	--shift: 3px; --shift-down: -3px; --radius: 3px;
	--hell-grau: rgba(255, 255, 255, 0.8);
	--dunkel-grau: rgba(0, 0, 0, 0.5);
	--trans-shift: 2px;;
}
@keyframes blinken { 0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; } }
@keyframes blickfang
{ 0% { opacity: 0; color: var(--logo-hell); background-color: var(--logo-dunkel); } 
 45% { opacity: 1; color: var(--logo-hell); background-color: var(--logo-dunkel); }
 55% { opacity: 1; color: var(--logo-hell); background-color: var(--logo-dunkel); }
100% { opacity: 0; color: var(--logo-hell); background-color: var(--logo-dunkel); }
}
@keyframes schweben
{  0%	{	margin-bottom: 310px; transform: scale(2);		}
/*  80%	{	margin-bottom:  20px; transform: scale(1);		}
  85%	{	margin-bottom:  15px; /*transform: scale(1.1);	}*/
  90%	{	margin-bottom:  10px; transform: scale(1);	}
 100%	{	margin-bottom:  10px; 	}
}
@keyframes gleiten
{  0%	{	left:  50% ;	}
/*  80%	{	left: 3.33% ;	}
  85%	{	left: 1.67% ;  	}*/
  90%	{	left:   0  ; 	}
 100%	{	left:   0  ; 	}
}
@keyframes klick
{ 0%	{	box-shadow:	var(--shift) var(--shift) var(--radius) var(--dunkel-grau) inset,
							var(--shift-down) var(--shift-down) var(--radius) var(--hell-grau) inset;
			transform: translateY(var(--trans-shift));
		}
 50%	{	box-shadow:	none;
			transform: none;
		}
100%	{	box-shadow:	var(--shift) var(--shift) var(--radius) var(--dunkel-grau) inset,
							var(--shift-down) var(--shift-down) var(--radius) var(--hell-grau) inset;
			transform: translateY(var(--trans-shift));
}		}
@font-face {
  font-family: "din-light";
  src: url("/site/templates/fonts/treff/DIN-Light.ttf") format("truetype");
}
.treff-doku, .treff-doku-inhalt, .treff-doku-seq
{	font-family: Arial;
	font-weight: normal;
	text-transform: none;
}
.treff-doku-inhalt * + p
{	margin-top: 6pt;
}
div.treff-doku-box
{	display: flex;
	max-width: 540pt;
	margin: 0 auto;
	align-items: flex-start; /* verhindert vertikales Verrutschen */
	background-color: #dfd;
	border: 5px solid gray;
}
div.treff-doku-baum
{	flex: 0 0 auto; /* nimmt nur so viel Platz wie nötig */
	margin-bottom: 8pt;
	padding-top: 8pt;
	padding-right: 8pt;
}
div.treff-doku-inhalt
{	flex: 1; /* füllt den restlichen Platz */
	min-width: 0; /* verhindert, dass sie zu breit wird */
	margin: 5pt 5pt 5pt 0;
	padding: 5pt;
	background-color: #ffd;
}
div.treff-doku-inhalt p.treff-doku-title
{	margin-top: 2pt;
}
div.treff-doku-lvl-box
{	margin-left: 8pt;
}
div.treff-doku p, div.treff-doku-inhalt p, div.treff-doku-inhalt ul, div.treff-doku-seq
{	margin-bottom: 6pt;
	font-size: 10pt;
	line-height: 12pt;
}
div.treff-doku-inhalt ul
{	margin-top: 6pt;
}
h1.treff-doku, h2.treff-doku, h3.treff-doku, h4.treff-doku, h5.treff-doku, h6.treff-doku, div.treff-doku-inhalt h6
{	margin-top: 1px;
	margin-bottom: 0;
	border: solid 1px gray;
	padding-left: 2pt;
	padding-right: 2pt;
	font-size: 12pt;
	text-decoration: none;
}
div.treff-doku-inhalt h6
{	border: none;
	font-family: Arial;
	font-size: 10pt;
	font-weight: bold;
}
table.treff-doku-felder
{	margin: 6pt auto;
}
table.treff-doku-felder th
{	text-transform: none;
	font-weight: bold;
	background-color: transparent;
	padding: 1pt 2pt;
}
table.treff-doku-felder th, table.treff-doku-felder td
{	font-family: Arial;
}
table.treff-doku-felder td
{ 	padding: 0 2pt;
}
p.treff-doku-title
{	margin-top: 24pt;
	font-size: 24pt;
	font-weight: bold;
	text-align: center;
}
p.treff-doku-title span
{	position: relative;
	bottom: 2pt;
	border: dotted .5pt gray;
	border-radius: 5pt;
	padding: 3pt;
	font-weight: normal;
	font-size: 12pt;
	background-color: #ffd;
}
a.treff-doku-sel
{	background-color: #FE2;
	color: #962;
}
a.treff-doku-baum
{	text-decoration: none;
}
p.treff-error
{	background-color: darkred;
	color: yellow;
}
/* treff-doku-seq für sequentielle Darstellung zwecks Ausdruck oder Kopie in ein Dokument */
div.treff-doku-seq
{	max-width: 540pt;
	margin: 0 auto;
	padding: 6pt;
	background-color: #ffd;
	border: 2pt solid gray;
}
h1.treff-doku-seq, h2.treff-doku-seq, h3.treff-doku-seq, h4.treff-doku-seq, h5.treff-doku-seq, h6.treff-doku-seq
{	margin-top: 2pt;
	margin-bottom: 0;
	padding-left: 2pt;
	padding-right: 2pt;
	font-size: 18pt;
	font-weight: bold;
	text-decoration: none;
}
h2.treff-doku-seq
{	font-size: 16pt;
}
h3.treff-doku-seq
{	font-size: 14pt;
}
h4.treff-doku-seq
{	font-size: 12pt;
}
h5.treff-doku-seq
{	font-size: 10pt;
}
h6.treff-doku-seq
{	font-size: 10pt;
	font-weight: normal;
}
div.treff-doku-seq h6
{	margin-top: 6pt;
	margin-bottom: 0;
}
div.treff-doku-seq * + p, div.treff-doku-seq * + ul, div.treff-doku-seq * + ol
{	margin-top: 6pt;
	margin-bottom: 0;
}
div#p6108 div.uk-overlay.uk-position-bottom-left
{	animation: gleiten 3s;
}
div.jubel-40
{	animation: schweben 3s;
	margin-bottom: 10px;
/*	margin-left: 70%;*/
	padding: 0px;
}
div.jubel-40 h1
{	animation: klick 1.5s;
	animation-iteration-count: 2.5;
	border-radius: 10px;
	margin: 0;
	border: 1px gray solid;
	padding: 0 3px;
	background-color: #FE2;
	white-space: nowrap;
	font-family: din-light;
/*	font-size: 41px;
	font-weight: bold;
	font-style: italic;*/
}
div.jubel-40 h1:hover	/* Ähnlich wie die Animation klick */
{	box-shadow:	var(--shift) var(--shift) var(--radius) var(--dunkel-grau) inset,
				var(--shift-down) var(--shift-down) var(--radius) var(--hell-grau) inset;
	transform: translateY(var(--trans-shift));
}
div.jubel-40 h1 a
{	padding: 0 12px;
	color: #962;
	text-decoration: none;
}
div.jubel-40 h1 a:hover
{	border: dotted gray 1px;
	border-radius: 8px;
}
div.jubel-40 h3
{	padding: 0 12px;
	color: #962;
	background-color: #FE2;
}
/*div#main
{	
}*/
div.treff-bausteine div.treff-baustein
{	margin: 11px 11px 0 0;
	background-color: #eee;
	padding: 0 5px 3px 5px;
}
div.baustein-body
{/*	border: solid 1px gray;*/
	background-color: white;
}
div.treff-bausteine div.treff-baustein h3
{	margin: 6px;
}
div.angebote div.uk-margin-large-bottom
{	margin-bottom: 0 !important;
}
div.treff-anbegote-infotext h2
{	text-transform: none;
}
div.anchor-offset
{ position: relative; top: -120px; /* Offset von 80 Pixeln nach oben */
}
div.treff-angebote-wt, div.treff-bausteine
{	padding-top: 10px;
	clear: both;
	float: none;
	display: flex;
	flex-wrap: wrap;
}
div.treff-angebote-wt.weekend
{/*	clear: none;
	float: left;*/
	box-sizing: content-box;
/*	display: flex;
	flex-wrap: wrap;*/
}
div.treff-angebote-wt.erster
{	padding-top: 0;
}
div.treff-angebote-wt.folgender
{	border-top: solid black 1px;
}
div.treff-angebote-wt h2, div.treff-bausteine h2
{	margin-top: 0;
	margin-bottom: 0;
	width: 100%;
}
div.treff-bausteine h3
{	margin-top: 20px;
}
div.treff-angebote-wt h3
{	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: 1px;
}
div.treff-angebote-wt h3 a
{	text-decoration: none;
}
div.treff-angebote-wt div.treff-angebot
{/*	max-height: 5cm; */
	overflow: visible;
	margin: 0 14px 0 0;
/*	float: left;
/*	clear: left; */
}
div.treff-angebote-wt div.treff-angebot.sonder/*, div.treff-bausteine div.treff-baustein*/
{	max-width: 378px;
	flex: 1 1 378px;
}
div.treff-angebote-wt div.treff-angebot.sonder:last-child
{	padding-bottom: 40px;
}
div.treff-angebote-wt div.treff-angebot.standard
{	max-width: 280px;
	flex: 1 1 280px;
}
div.anchor-offset:target + h3 span.target, div.anchor-offset:target + div + h3 span.target
{	animation: blickfang 1.5s;
/*	animation: blinken 1.5s;*/
	animation-iteration-count: 3;
}
div.ferienanzeige
{	animation: blinken .5s;
	animation-iteration-count: 5;
	border:solid 5px #b4aa12;
	color:black;
	font-weight:bold;
	hyphens:none;
	padding:10px;
	text-align:center
}
p.treff-angebot.bild img
{	max-width: 274px;
/*	margin: 0 20px 0 0;*/
}
div.treff-angebote-wt div.treff-angebot p
{	margin: 3px;
	line-height: normal;
}
div.treff-angebote-wt div.treff-angebot-infotext
{	border-top: solid 1px gray;
	font-style: italic;
	padding-bottom: 10px;
}
div.treff-angebote-wt div.treff-anbegote-infotext p
{	margin: 0;
}
div.treff.angebot.einzeln div.treff.angebot.logo
{	float: right;
}
div.treff.angebot.einzeln
{	border: solid 3px green;
	margin-top: 30px;
}
div.treff.angebot.einzeln div.treff.angebot
{	float: left;
	margin: 20px;
	max-width: 400px;
}
div.treff.angebot.einzeln p.treff-angebot.bild img
{	max-width: 400px;
}
div.treff.angebot.einzeln p.treff-angebot.bild
{	margin-top: 75px;
	text-align: center;
}
div.treff-angebot
{	overflow: visible;
}
p.title span.treff-normal
{	font-family: Arial;
	font-weight: normal;
	font-size: 12px;
}
p.title.treff
{	line-height: 1;
}
span.treff-modus
{	color: blue;
}
div.treff-neu, div.treff-sopro
{	float: right;
	position: relative;
	top: -13px;
	height: 26pt;
	border-radius: 13pt;
	background-color: black;
	color: var(--logo-hell);
	font-weight: bold;
	margin-left: 2px;
	/* text-align: center;*/
	display: flex; /* Voraussetzung dass die beiden folgenden funktionieren */
	align-items: center; /* Vertikale Zentrierung */ 
	justify-content: center; /* Horizontale Zentrierung */
}	
div.treff-neu
{	width: 35pt;
}
div.treff-sopro
{	width: 45pt;
}
p.treff-angebot.ausfaelle
{	color: red;
}
span.treff-obacht
{	font-weight: bold;
/*	text-decoration: underline;*/
}
span.treff-ort
{	color: #E70;
	font-weight: bold;
}
span.treff.abgelaufen
{	/*text-decoration: line-through;*/
	color: lightgray;
}
span.wochentag-falsch
{	animation: blinken .5s infinite;
}
div.treff-aktion
{	background-color: yellow;
	padding: 3px;
	float: left;
}
div.treff-aktion div.treff-float-links
{	float: left;
	margin-right: 20px;
}
div.treff-aktion div.treff-float-links ul
{	margin-top: 0;
	margin-bottom: 4px;
}
div.treff-aktion div.treff-float-links p, div.treff-aktion div.treff-float-links li
{	line-height: normal; 
}
div.treff-aktion table td
{	padding: 2px;
}
div.treff-aktion h4
{	margin-top: 6px;
	margin-bottom: 0;
}
div.treff-aktion h3
{	margin-bottom: 0;
}
div.treff-aktion p
{	margin-top: 0;
	margin-bottom: 0;
}
div.stellen
{	background-color: lightgray;
}
div.treff-jobs
{	background-image: url(/site/assets/files/5935/web_hg-2.1200x0.jpg);
	border-width: 5px;
	border-style: solid;
	border-color: var(--logo-dunkel);
	padding: 20px;
	line-height: normal;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
div.treff-jobs h2, div.treff-jobs h3, div.treff-jobs p, div.treff-jobs ul
{	margin: 0;
	text-transform: none;
}
div.treff-jobs p, div.treff-jobs ul
{	margin-top: .6em;
}
div.treff-job
{	margin: 10px;
	border: 2px solid var(--logo-hell);
	padding: 10px;
	max-width: 551px;
	flex: 1 1 551px;
}
h2.treff-job-prefix + div.treff-job
{	clear: both;
}
h2.treff-job-prefix
{	width: 100%;
	text-align: center;
}
div#p6233, div#p6235
{	background-color: yellow;
}
@media print
{	div.treff.angebot.einzeln
	{	margin-top: 1cm;
	}
	div.treff.angebot.einzeln div.treff.angebot
	{	margin: 5mm;
		max-width: 8cm;
	}
	div.treff-doku-seq
	{	max-width: auto;
		margin: 0;
		padding: 0;
		background-color: transparent;
		border: none;
	}
	div.nav-spacer,
	div#top-logo,
	div.logo-wrap,
	footer, 
	footer div.uk-text-left,
	footer div.footermenu, 
	footer div.row.partner-logos,
	footer div.row.payment-methods
	{	display: none;
		height: 0;
		line-height: 0;
		font-size: 0;
}	}