/* ==========================================================
   Design tokens -- colors & sizes centralised as CSS variables
   ========================================================== */
:root {
	color-scheme: light dark;
	/* colors */
	--color-white: #ffffff;
	--color-black: #000000;
	--color-dark: #313131;
	--color-text: #333;
	--color-text-strong: #444;
	--color-text-muted: #555;
	--color-text-light: #777;
	--color-border: #999;
	--color-border-light: #999;
	--color-bg-light: #eee;
	--color-bg-lightest: #fefefe;
	--color-purple: #8b63ff;
	--color-hover-gray: #7d7e7d;
	--color-danger: #ff0000;
	--color-hover-accent: #e86256;
	--overlay-white-90: rgba(255, 255, 255, .9);
	--overlay-white-100: rgba(255, 255, 255, 1);
	--overlay-gray-80: rgba(100, 100, 100, 0.8);
	--shadow-soft: rgba(0, 0, 0, 0.05);

	/* semantic surface/text tokens – heller Modus (Standard);
	   der dunkle Modus folgt unten per prefers-color-scheme. */
	--surface-page: #f6f4f1;
	--surface-card: #ffffff;
	--surface-muted: #ebe7e2;
	--text-body: #2a2826;
	--text-strong: #1b1918;
	--text-muted: #3b3835;
	--text-light: #5c5853;
	--border-default: #bdb6ae;
	--border-light: #d9d3cc;
	--overlay-card: rgba(255, 255, 255, 0.9);
	--overlay-card-solid: rgba(255, 255, 255, 1);

	/* sizes */
	--font-size-h1-lg: 3em;
	--font-size-h2: 2.3em;
	--font-size-h2-h1: 2.5em;
	--font-size-md: 1.5em;
	--font-size-h1h2-vb: 1.8em;
	--space-lg: 40px;
}

@media (prefers-color-scheme: dark) {
	:root {
		--surface-page: #161515;
		--surface-card: #1e1d1c;
		--surface-muted: #2a2827;
		--text-body: #e2ded9;
		--text-strong: #f5f2ee;
		--text-muted: #cfcac4;
		--text-light: #a9a5a0;
		--border-default: #4a4744;
		--border-light: #3a3835;
		--overlay-card: rgba(22, 21, 21, 0.9);
		--overlay-card-solid: rgba(22, 21, 21, 1);
	}
}


/* ==========================================================
   Überschriftenfarbe abhängig vom Hintergrund
   ==========================================================
   1) Bekannte dunkle Bereiche im Template bekommen automatisch
      weiße Überschriften (kein zusätzliches HTML/Klasse nötig).
   2) .on-dark / .on-light: manuell setzbare Utility-Klassen für
      Inhaltsbereiche im Redaktionssystem, falls dort mal eine
      Überschrift auf dunklem/hellem Grund landet.
   3) .auto-contrast: für frei wählbare Hintergrundfarben (z. B.
      ein Farbfeld im CMS-Modul). Setzt per inline style
      "--bg:#123456" die tatsächliche Hintergrundfarbe; moderne
      Browser (contrast-color(), seit 2026 breit unterstützt)
      wählen automatisch Schwarz/Weiß, ältere Browser bekommen
      den statischen Fallback aus --color-text.
   ========================================================== */

.footer h1, .footer h2, .footer h3, .untenOuter h1, .untenOuter h2, .untenOuter h3, #inhalt1999 h1, #inhalt1999 h2, #inhalt1999 h3 {
	color: var(--color-white);
}

.on-dark h1, .on-dark h2, .on-dark h3, .on-dark {
	color: var(--color-white);
}
.on-light h1, .on-light h2, .on-light h3, .on-light {
	color: var(--color-text);
}

.auto-contrast {
	--bg: var(--color-white);
	background-color: var(--bg);
	color: var(--color-text);
}
.auto-contrast h1, .auto-contrast h2, .auto-contrast h3 {
	color: inherit;
}
@supports (color: contrast-color(white)) {
	.auto-contrast {
		color: contrast-color(var(--bg));
	}
}

body {
margin:0;
padding:0 0 0 0;
position:relative;
font-family:roboto, sans-serif;
background-color:var(--surface-page);
color:var(--text-body);
font-size:12pt;
letter-spacing:0.05em;
font-weight:400;
}

h1 {
hyphens:auto;
-webkit-hyphens:auto;
hyphenate-limit-chars:8 4 4;
-webkit-hyphenate-limit-before:4;
-webkit-hyphenate-limit-after:4;
overflow-wrap:break-word;
word-break:normal;

text-transform:none;
font-weight:400;
font-size:var(--font-size-h2);
margin-top:10px;
margin-bottom:10px;

}

h2.h1 {
hyphens:auto;
-webkit-hyphens:auto;
hyphenate-limit-chars:8 4 4;
-webkit-hyphenate-limit-before:4;
-webkit-hyphenate-limit-after:4;
overflow-wrap:break-word;
word-break:normal;

text-transform:none;
font-weight:400;
font-size:var(--font-size-h2-h1);
margin-top:10px;
margin-bottom:10px;
}

h2 {
hyphens:auto;
-webkit-hyphens:auto;
hyphenate-limit-chars:8 4 4;
-webkit-hyphenate-limit-before:4;
-webkit-hyphenate-limit-after:4;
overflow-wrap:break-word;
word-break:normal;

text-transform:none;
font-weight:400;
color:var(--text-strong);
font-size:var(--font-size-h2);
margin-top:10px;
margin-bottom:10px;

}

h3 {
hyphens:auto;
-webkit-hyphens:auto;
hyphenate-limit-chars:8 4 4;
-webkit-hyphenate-limit-before:4;
-webkit-hyphenate-limit-after:4;
overflow-wrap:break-word;
word-break:normal;

font-weight:400;
}


img.rsMainSlideImage {
visibility: hidden;
}

.rsSlide div {
background-size:cover;
background-position:center;
background-repeat: no-repeat;
}
.rsSlide div a {
display:block;
}


a {
text-decoration: none;
color:var(--text-strong);
}
#inhalt1999 {
background-color:var(--color-purple);
color:var(--color-white);
padding:20px 0;
font-size:1.5em;
}
#inhalt1999 p {
color:var(--color-white);
}
#inhalt1999 p a {
color:var(--color-white);
}

.mainInner p, .mainInner ul, .mainInner table {
font-family:roboto;
margin:var(--space-lg) 0;
color:var(--text-body);
font-weight:400;
line-height:1.4em;
}

.mainInner p strong {
font-family:roboto;
margin:var(--space-lg) 0;
color:var(--text-strong);
font-weight:700;
}

.mainInner {
padding-top:50px;
}

#body1 .mainInner {
padding-top:0px;
}


.clr {
clear:both;

}


.bild, #social {
display:none;

}

.slideshow-outer {
width:100%;
height:auto;
position:relative;
left:0;
margin:0;
padding:0 0 50px 0;
border-bottom:0px solid var(--color-border);
z-index:1;
}

#full-width-slider {
  width: 100%;
  color: var(--text-strong);
  top:-20px;
}
.royalSlider > .rsContent {
  visibility:hidden;
}

.mainnormal {
width:80%;
height:auto;
position:relative;
margin:0 auto;
}


.tinymcewysiwyg {
margin:var(--space-lg) 0;

}


@media screen and (min-width:1000px) {
.textRahmenVB3sp {
margin:var(--space-lg) 0;
position:relative;
display:flex;
justify-content:space-between;
vertical-align: top;
align-items:top;
}
.textRahmenVB3sp p {
font-family:roboto;
}
.textRahmenVB3sp div {
width:30%;
height:auto;
float:none;
position:relative;
text-align:center;
display:inline-block;
vertical-align: top;
}
.textRahmenVB3sp div.clr {
display:none;
}
}
.csslider1 {
top:-20px;
position:relative;
z-index:1;
margin:0 auto !important;
}

.textRahmenVB {
width:100%;
height:auto;
position:relative;
clear:both;
margin-bottom:20px;
display:block;
vertical-align: top;
}

#body458 .textRahmenVB img {
width:90%;
height:auto;
position:relative;
}

.textRahmenVB .textSpalteLinksVB {
vertical-align: top;
width:45%;
height:auto;
position:relative;
display:inline-block;
}

.textRahmenVB .textSpalteRechtsVB {
vertical-align: top;
width:45%;
height:auto;
position:relative;
display:inline-block;

}

@media screen and (min-width:1000px) {
.textRahmenVB .textSpalteRechtsVB {
margin-left:10%;
}
}

.zweiterInner {
margin:0 auto;
width:1100px;
height:auto;
position:relative;
}

.dritterInner {
margin:0 auto;
width:1100px;
height:auto;
position:relative;
}

.refi
{
	width:100%;
	height:auto;
	position:relative;
	color:var(--text-strong);
	left:0;
	display:flex;
	justify-content:space-between;

	margin:40px 0
}
.refLeft
{
	width:45%;
	height:auto;
	float:none;
	margin:0 0 40px
}
.refRight
{
	width:45%;
	height:auto;
	float:right
}
.refRight img
{
	border:2px solid var(--color-border-light);
	padding:0;
	max-width:100%;
	height:auto;
}
.refRight .galerieBilderKlein img
{
	border:1px solid var(--color-border-light);
	width:120px;
	height:auto;
	padding:0
}
	#textSpalteRechts448
{
	left:-120px;
	top:18px
}
@media screen and (min-width:1000px) {
.teaserStart
{
	width:100%;
	height:auto;
	position:relative;
	margin:25px 0;
	padding:25px 0;
	display:flex;
	flex-wrap: wrap;
	justify-content:space-between;
}

.teaserflaeche
{
	list-style:none;
	width:31.33%;
	height:300px;
	position:relative;

	margin:0 0% 20px 0;
	padding:0;
	display:inline-block;
	text-align:center;
}
.teaserflaeche:nth-of-type(3n)
{
	list-style:none;
	width:31.33%;
	height:300px;
	position:relative;
	display:inline-block;
	margin:0 0 20px 0;
	padding:0;
}

.teaserflaeche a
{


	border:0px solid var(--color-border-light);
	text-decoration:none;
	display:block;
	color:var(--color-white);
	text-transform:uppercase;
	font-size:1em;
	position:relative;
	height:380px !important;
	width:100%;
	transition:1s all linear;
	margin:0;
	background-size:100%;
	background-position:center;
	background-repeat:no-repeat;
}


.teaserflaeche a img {
width:90%;
height:auto;
box-shadow:0px 0px 5px var(--color-black);
border-radius:5px;
}
.teaserflaeche a:hover img {
width:90%;
height:auto;
box-shadow:0px 0px 5px var(--color-text-muted);
border-radius:5px;
}

body.cat359 .teaserflaeche a img {
width:90%;
height:auto;
box-shadow:0px 0px 0px var(--color-text-muted);
border-radius:5px;
}
.teaserflaeche a:hover
{

	
	border:0px solid var(--color-border-light);
	text-decoration:none;
	display:block;
	color:var(--color-white);
	text-transform:uppercase;
	font-size:1em;
	position:relative;
	height:380px;
	width:100%;
	margin:0;
	background-size:100%;
	background-position:center;
	background-repeat:no-repeat;
	-webkit-user-select: none; 
-webkit-touch-callout: none;
}


.teaserflaeche:hover a strong
{

}

}

.teaserflaeche a strong
{
	text-decoration:none;
	display:inline-block;
	background:var(--overlay-card);
	color:var(--text-body);
	text-transform:uppercase;
	font-size:1em;
	position:relative;
	bottom:0px;
	left:0;
	height:65px;
	width:92%;
	margin:0;
	font-weight:400;
	padding:10px 4% 5px 4%;
	-webkit-user-select: none; 
-webkit-touch-callout: none;
text-align:center;
}
#xform-formular-Dauer {
display:none;

}
.footer {
background-color:var(--color-dark);
width:100%;
height:auto;
padding:30px 30px;
text-align:center;
position:relative;
}
.footer p {
color:var(--color-white);
text-align:center;
position:relative;
}

.footer a {
color:var(--color-white);
}

.untenOuter {
background-color:var(--color-dark);
position:relative;
width:100%;
height:auto;
position:relative;
bottom:0;
left:0;
padding:40px 0% 50px 0%;
}

.untenInner {
width:80%;
height:auto;
font-size:1.0em;
padding:0px 0;
position:relative;
margin:0 auto 0 auto;
color:var(--color-border-light);
line-height:1.5em;
}
.untenInner a {
color:var(--color-white);
}
.untenInner .tinymcewysiwyg {
margin:0px;
}
.youtubeLink
{
	display:block;
	width:200px;
	height:auto;
	position:relative;
	float:none;
	min-height:200px
}


.galerie {
display:flex;
justify-content:start;
flex-flow: row wrap;
align-content:center;
justify-content:space-between;
flex-wrap : wrap;
position:relative;
}
.galerie .clr {
display:none;
}
.galerie a.galerieBilder {
	width:32%;
	height:auto;
	text-decoration:none;
	margin-right:0%;
	margin-bottom:2%;
	position:relative;
	display:inline-block;
	background-size:cover;
	background-repeat: no-repeat;
}
.galerie a.galerieBilder:hover {
	width:32%;
	height:auto;
	text-decoration:none;
	margin-right:0%;
	margin-bottom:2%;
	position:relative;
	display:inline-block;
	background-size:cover;
	background-repeat: no-repeat;
}
.galerie a.galerieBilder img {
width:100%;
height:auto;
position:relative;
visibility:hidden;
}

.xform {
width:90%;
height:auto;
padding:7px 15px 15px 15px;
margin:10px 0px 10px 0px;
display:block;

background-color:var(--surface-card);
min-height:370px;
right:0px;
position:relative;
z-index:10;
font-size:14px;
}

.formcheckbox input {
width:30px !important;
display:inline-block;
float:none;

}


.formcheckbox label {
height:auto;
position:relative;


}
.xform .form_warning {
color:var(--color-danger);

}
.formcaptcha img {
width:200px !important;
height:auto !important;
position:relative;
}

.formation label,
.xform label {
width:80%;
display:block;
height:auto;

}

form.nl-form label {
width:15%;
display:inline-block;
height:20px;

}
.xform .text {


}

.formation p,
.xform p {
padding:0px 0 5px 0;

}

.formation input,
.xform input {
width:80%;
border:1px solid var(--border-default);
height:20px;
font-size:14px;
padding:5px;

background-position:20px 0px;
font-weight:normal;

}

.nl-form .formation input {
width:60%;
border:1px solid var(--border-default);
height:20px;
font-size:14px;
padding:5px;
display:inline-block;
background-position:20px 0px;
font-weight:normal;

}
.nl-form .formation .submit,
.xform .submit,
.xform input.formsubmit {
width:60%;
height:auto;
color:var(--color-white);
background-color:var(--color-black);
display:block;
font-weight: 400;
border:1px solid var(--border-default);
padding:10px 5% 10px 5%;

font-size: 18px;
font-weight: bold;
text-decoration: none;
font-weight:400;
letter-spacing: 0.1em;
}

.xform textarea {
border:1px solid var(--border-default);
width:80%;
font-size:14px;
padding:5px;

background-position:20px 50px;
height:100px;
}

.xform .formtextarea label.textarea {
width:auto;
display:block;

}

iframe {
width:100%;
height:500px;
position:relative;
margin:0 auto;
display:block;
}

ul.pagination {
list-style:none;
list-style-type: none;
margin-left:0;
padding-left:0;
margin-top:50px;
margin-bottom:100px;
width:100%;
font-size:0.8em;
text-align:center;
}
ul.pagination  li {
list-style:none;
display:inline-block;
}
.pagination a {
width: 20px;
height: 18px;
font-weight: bold;
background-color: var(--color-border-light);
display: inline-block;
margin: 5px 3px 5px 0;
padding: 5px 2px 3px 2px;
color: var(--color-white);
text-decoration: none;
text-align: center;
display:inline-block;
}

.pagination a.active {
width: 20px;
height: 18px;
font-weight: bold;
background-color: var(--color-black);
display: inline-block;
margin: 5px 3px 5px 0;
padding: 5px 2px 3px 2px;
color: var(--color-white);
text-decoration: none;
text-align: center;
}

.buttonnews a {
border: none;
background-color: var(--color-black);
color: white;
padding: 20px 30px;
text-align: right;
text-decoration: none;
display: inline-block;
margin-bottom: 4%;
}

@media only screen and (min-width: 1500px) {
.teaserStart, .textRahmenVB3sp
{
	width:100%;
	height:auto;
	position:relative;

	padding:25px 0;
	margin:25px auto;
	display:block;
	text-align:center;
}

.teaserflaeche
{
	list-style:none;
	width:31.33%;
	height:400px;
	position:relative;
	display:inline-block;
	margin:0 3% 15px 0;
	padding:0;
	max-width:490px;
	text-align:center;
}
.teaserflaeche:nth-of-type(3n)
{
	list-style:none;
	width:31.33%;
	height:400px;
	position:relative;
	display:inline-block;
	margin:0 0 15px 0%;
	padding:0
}

.teaserflaeche a
{


	border:0px solid var(--color-border-light);
	text-decoration:none;
	display:block;
	color:var(--color-white);
	text-transform:uppercase;
	font-size:1em;
	position:relative;
	height:370px !important;
	width:100%;
	transition:1s all linear;
	margin:0;
	background-size:101%;
	background-position:center;
	background-repeat:no-repeat;
}

.teaserflaeche a:hover
{


	border:0px solid var(--color-border-light);
	text-decoration:none;
	display:block;
	color:var(--color-white);
	text-transform:uppercase;
	font-size:1em;
	position:relative;
	height:370px;
	width:100%;
	margin:0;
	background-size:101%;
	background-position:center;
	background-repeat:no-repeat;
	-webkit-user-select: none; 
-webkit-touch-callout: none;
}
.teaserflaeche a strong
{
	text-decoration:none;
	display:inline-block;
	background:var(--overlay-card);
	color:var(--text-body);
	text-transform:uppercase;
	font-size:1em;
	position:relative;
	bottom:0px;
	height:50px;
	width:92%;
	margin:0;
	padding:10px 4% 5px 4%;
	-webkit-user-select: none; 
-webkit-touch-callout: none;
}

.teaserflaeche:hover a strong
{

}

}
@media only screen and (max-width: 1100px) {
body {
margin:0;
padding:0 0 0 0;
position:relative;
font-family:roboto, sans-serif;
background-color:var(--surface-page);
color:var(--text-body);
font-size:12pt;
letter-spacing:0.05em;
}
#full-width-slider {
  width: 100%;
  color: var(--text-strong);
  top:0;
}
.royalSlider > .rsContent {
  visibility:hidden;
}
h1 {
font-size:var(--font-size-md);


margin:var(--space-lg) 0;

}


iframe {
width:100%;
height:300px;
position:relative;
margin:0 0;
display:block;
}

h2 {
font-size:var(--font-size-md);

margin:var(--space-lg) 0;
}

a {
text-decoration: none;
color:var(--text-strong);
}

.mainInner p, .mainInner ul, .mainInner table {
font-family:roboto;
margin:var(--space-lg) 0;
color:var(--text-muted);
font-weight:400;
line-height:1.4em;
}

.mainInner p strong {
font-family:roboto;
margin:var(--space-lg) 0;
color:var(--text-light);
font-weight:700;
}
.mainInner {
padding-top:90px;
}


.clr {
clear:both;

}
.bild, #social {
display:none;

}


.mainnormal {
width:100%;
height:auto;
position:relative;
margin:0 auto;
}
.mainInner {
padding:40px 5%;
width:90%;
height:auto;
position:relative;
}

.tinymcewysiwyg {
margin:var(--space-lg) 0;

}


.textRahmenVB3sp {
margin:var(--space-lg) 0;
position:relative;

}
.textRahmenVB3sp p {
font-family:roboto;
}
.textRahmenVB3sp div {
width:33%;
height:auto;
float:none;
position:relative;
text-align:center;
}
.csslider1 {
top:-20px;
position:relative;
z-index:1;
margin:0 auto !important;
}

.textRahmenVB {
width:100%;
height:auto;
position:relative;

}

.textRahmenVB .textSpalteLinksVB {
float:none;
width:45%;
height:auto;
position:relative;
}

.textRahmenVB .textSpalteRechtsVB {
float:right;
width:45%;
height:auto;
position:relative;
}

.zweiterInner {
margin:0 auto;
width:100%;
height:auto;
position:relative;
}

.dritterInner {
margin:0 auto;
width:100%;
height:auto;
position:relative;
}

.refi
{
	width:100%;
	height:auto;
	position:relative;
	color:var(--text-strong);
	left:0;
	display:flex;
	justify-content:space-between;
	margin:40px 0
}
.refLeft
{
	width:45%;
	height:auto;
	float:none;
	margin:0 0 40px
}
.refRight
{
	width:45%;
	height:auto;
	float:right
}
.refRight img
{
	border:0px solid var(--color-border-light);
	padding:0
}
.refRight .galerieBilderKlein img
{
	border:0px solid var(--color-border-light);
	width:120px;
	height:auto;
	padding:0
}


.untenOuter {
background-color:var(--color-dark);
position:relative;
width:100%;
height:auto;
position:relative;
bottom:0;
left:0;
padding:50px 0%;
}

.untenInner {
width:90%;
height:auto;
font-size:1.0em;
padding:0px 0;
position:relative;
margin:0px auto 0 auto;
color:var(--color-border-light);
line-height:1.5em;
}
.untenInner a {
color:var(--color-white);
}

.youtubeLink
{
	display:block;
	width:200px;
	height:auto;
	position:relative;
	float:none;
	min-height:200px
}

.galerie {
display:flex;
justify-content:space-between;
flex-flow: row wrap;
}

.galerie a.galerieBilder {
	width:32%;
	height:auto;
	text-decoration:none;
	margin-right:0%;
	margin-bottom:2%;
	position:relative;
	display:inline-block;
	background-size:cover;
	background-repeat: no-repeat;
}
.galerie a.galerieBilder:hover {
	width:32%;
	height:auto;
	text-decoration:none;
	margin-right:0%;
	margin-bottom:2%;
	position:relative;
	display:inline-block;
	background-size:cover;
	background-repeat: no-repeat;
}
.galerie a.galerieBilder img {
width:100%;
height:auto;
position:relative;
visibility:hidden;
}


}


@media (max-width: 1000px) {
body {
margin:0;
padding:0 0 0 0;
position:relative;
font-family:roboto, sans-serif;
background-color:var(--surface-page);
color:var(--text-body);
font-size:12pt;
letter-spacing:0.05em;
}

h1 {
font-size:var(--font-size-md);

font-weight:400;
margin:var(--space-lg) 0;
color: var(--text-strong);
}
.mainInner {
padding-top:0px;
}


.mainInner img {
max-width:100%;
height:auto;

}

h2 {
font-size:var(--font-size-md);
max-width:100%;
margin:var(--space-lg) 0;
}

a {
text-decoration: none;
color:var(--text-strong);
}
#inhalt1999 {
background-color:var(--color-purple);
color:var(--color-white);
padding:20px 0;
font-size:1.2em;
}
.mainInner p, .mainInner ul, .mainInner table {
font-family:roboto;
margin:var(--space-lg) 0;
color:var(--text-muted);
font-weight:400;
line-height:1.4em;
}
.mainInner p {
hyphens: auto;
-webkit-hyphens: auto;
hyphenate-limit-chars: 8 4 4;
-webkit-hyphenate-limit-before: 4;
-webkit-hyphenate-limit-after: 4;
hyphenate-limit-lines: 4;
-webkit-hyphenate-limit-lines: 4;
}

.mainInner p strong {
font-family:roboto;
margin:var(--space-lg) 0;
color:var(--text-light);
font-weight:700;
}
.mainInner {
padding-top:50px;
}


.clr {
clear:both;

}
.bild, #social {
display:none;

}


.mainnormal {
width:100%;
height:auto;
position:relative;
margin:0 auto;
}
.mainInner {
padding:40px 5%;
width:90%;
height:auto;
position:relative;
}


.tinymcewysiwyg {
margin:var(--space-lg) 0;

}


.textRahmenVB3sp {
margin:var(--space-lg) 0;
position:relative;

}
.textRahmenVB3sp p {
font-family:roboto;
}
.textRahmenVB3sp div {
width:100%;
height:auto;

position:relative;
text-align:center;
margin-bottom:50px;
}
.csslider1 {
top:-20px;
position:relative;
z-index:1;
margin:0 auto !important;
}

.textRahmenVB {
width:100%;
height:auto;
position:relative;

}

.textRahmenVB .textSpalteLinksVB {

width:100%;
height:auto;
position:relative;
}

.textRahmenVB .textSpalteRechtsVB {

width:100%;
height:auto;
position:relative;
}

.zweiterInner {
margin:0;
width:100%;
height:auto;
position:relative;
}

.dritterInner {
margin:0;
width:100%;
height:auto;
position:relative;
}

.refi
{
	width:100%;
	height:auto;
	position:relative;
	color:var(--text-strong);
	left:0;
	display:block;
	margin:0px 0
}
.refLeft
{
	width:100%;
	height:auto;
	float:none;
	margin:0 0 40px 0
}

.refLeft h1 {
margin-top:0;
}

.refRight
{
	width:100%;
	height:auto;
	float:right
}
.refRight img
{
	border:0px solid var(--color-border-light);
	padding:0
}
.refRight .galerieBilderKlein img
{
	border:0px solid var(--color-border-light);
	width:120px;
	height:auto;
	padding:0
}
	#textSpalteRechts448
{
	left:-120px;
	top:18px
}

.teaserStart
{
	width:100%;
	height:auto;
	position:relative;
	margin:25px 0;
	padding:25px 0;
	display:block;
	justify-content:space-between;
}

.teaserflaeche
{
	list-style:none;
	width:100%;
	height:auto;
	min-height:250px;
	position:relative;
	
	margin:0 0% 20px 0;
	padding:0;

}

.teaserflaeche:nth-child(2n)
{
	list-style:none;
	width:100%;
	height:auto;
	min-height:250px;
	position:relative;
	
	margin:0 0% 20px 0;
	padding:0;

}
.teaserflaeche:nth-child(3n)
{
	list-style:none;

	position:relative;
	float:none;
	margin:0 0% 20px 0;
	padding:0;
	width:100%;
	height:auto;
	min-height:250px;
}

.teaserflaeche:nth-of-type(3n)
{
	list-style:none;
	width:100%;

	position:relative;
	display:inline-block;
	margin:0 0 20px 0;
	padding:0;
	height:auto;
	min-height:250px;
}

.teaserflaeche a
{
	
	overflow:visible;
	border:0px solid var(--color-border-light);
	text-decoration:none;
	display:block;
	color:var(--color-white);
	text-transform:uppercase;
	font-size:1em;
	position:relative;
	height:auto;
		min-height:280px;
	width:100%;
	transition:1s all linear;
	margin:0 0 0px 0;
	background-size:101%;
	background-position:center;
	background-repeat:no-repeat;
}

.teaserflaeche a:hover
{
	
	overflow:visible;
	border:0px solid var(--color-border-light);
	text-decoration:none;
	display:block;
	color:var(--color-white);
	text-transform:uppercase;
	font-size:1em;
	position:relative;
	height:auto;
		min-height:290px;
	width:100%;
	transition:1s all linear;
	margin:0 0 0px 0;
	background-size:101%;
	background-position:center;
	background-repeat:no-repeat;
}
.teaserflaeche a strong
{
	text-decoration:none;
	display:inline-block;
	background:var(--overlay-card-solid);
	color:var(--text-body);
	text-transform:uppercase;
	font-size:1em;
	position:relative;
	bottom:0px;
	height:65px;
	width:92%;
	margin:0;
	padding:10px 4% 5px 4%;
}


.untenOuter {
background-color:var(--color-dark);
position:relative;
width:90%;
height:auto;
bottom:0;
left:0;
margin:0;
padding:30px 5%;
color:var(--color-border-light);

}

.untenInner {
width:90%;
height:auto;
font-size:0.8em;
padding:0 5%;
position:relative;
margin:20px 0 0 0;
line-height:1.7em;
}

.untenInner .tinymcewysiwyg {
margin:20px 0 0 0;
text-align:center;
margin:0;

}
.youtubeLink
{
	display:block;
	width:200px;
	height:auto;
	position:relative;
	float:none;
	min-height:200px
}
.galerie {
display:flex;
justify-content:space-between;
flex-flow: row wrap;
width:100%;
height:auto;

}

.galerie a.galerieBilder {
	width:48%;
	height:auto;
	text-decoration:none;
	margin-right:0%;
	margin-bottom:2%;
	position:relative;
	display:inline-block;
	background-size:cover;
	background-repeat: no-repeat;
	aspect-ratio: 3 /2;
}
.galerie a.galerieBilder:hover {
	width:47%;
	height:auto;
	text-decoration:none;
	margin-right:0%;
	margin-bottom:3%;
	position:relative;
	display:inline-block;
	background-size:cover;
	background-repeat: no-repeat;
}
.galerie a.galerieBilder img {
width:100%;
height:auto;
position:relative;
visibility:hidden;
}

.rsArrow {
width:15px;
height:15px;
}
.rsArrowIcn {
width:15px;
height:15px;
background-size:15px 15px;
}

}


.cd-top {
  display: inline-block;
  height: 40px;
  width: 40px;
  position: fixed;
  bottom: 40px;
  right: 30px;
  box-shadow: 0 0 10px var(--shadow-soft);
  /* image replacement properties */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background: var(--overlay-gray-80) url(../back-to-top/img/cd-top-arrow.svg) no-repeat center 50%;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
  -moz-transition: opacity .3s 0s, visibility 0s .3s;
  transition: opacity .3s 0s, visibility 0s .3s;
  z-index:1000;
}
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
  -moz-transition: opacity .3s 0s, visibility 0s 0s;
  transition: opacity .3s 0s, visibility 0s 0s;
}
.cd-top.cd-is-visible {
  /* the button becomes visible */
  visibility: visible;
  opacity: 1;
}
.cd-top.cd-fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  opacity: .5;
}
.no-touch .cd-top:hover {
  background-color: var(--color-hover-accent);
  opacity: 1;
}
@media only screen and (min-width: 768px) {
  .cd-top {
    right: 40px;
    bottom: 40px;
  }
}
@media only screen and (min-width: 1024px) {
  .cd-top {
    height: 60px;
    width: 60px;
    right: 40px;
    bottom: 40px;
  }
}


#popup {
visibility:hidden;
}
#inhalt2207 {
display:none;
background-color:var(--surface-card);
}

#inhalt2207 button, input.btn-primary {
width: 100%;
height: auto;
color: var(--color-white);
background-color: var(--color-black);
display: block;
border: 0px solid var(--color-black);
padding: 14px 5% 10px 5%;
border-radius: 0px;
font-size: 18px;
font-weight: bold;
text-decoration: none;
letter-spacing: 0.1em;
margin-top: 22px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
position: relative;
}


a {
color:var(--text-strong);
text-decoration:none;
}
a.abtn {
width:auto;
padding:13px 30px 5px 30px;
height:33px;
background-color:var(--color-black);
color:var(--color-white);
vertical-align:middle;
display:inline-block;

text-align:center;
}

.untenInner a {
color: var(--color-white);
}


.mainnormal {
width:90%;
height: auto;
position: relative;
margin: 0 auto;
}
.textRahmenVB h1 {
text-transform:none;
font-weight:400;
font-size:var(--font-size-h1h2-vb);
margin-top:20px;
margin-bottom:15px;
}
.textRahmenVB h2 {
text-transform:none;
font-weight:400;
color:var(--text-strong);
font-size:var(--font-size-h1h2-vb);
margin-top:20px;
margin-bottom:15px;

}


.ag-102{background:#333333;font-family:Roboto,'Helvetica Neue',Helvetica,Arial,sans-serif;letter-spacing:.01em}
.ag-103{max-width:1100px;margin:0 auto;box-sizing:border-box;padding:96px 5% 112px;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:48px;font-size:17px;line-height:1.6;color:#b3afaa}
.ag-104{margin:0;font-weight:700;color:#c9c6c2}
.ag-105{margin:0}
.ag-106{display:flex;flex-direction:column;gap:16px}
.ag-107{color:#ffffff;text-decoration:none}
.ag-107:hover{color:#cbb8ff;text-decoration:underline}
.ag-108{display:flex;flex-direction:column;gap:4px}

/* ==========================================================
   Dark Mode: Restfarben aus dem hellen Layout
   ========================================================== */
.no-touch .cd-top:hover { background-color:var(--color-purple); }
a.abtn, .buttonnews a, .nl-form .formation .submit, .xform .submit, .xform input.formsubmit, #inhalt2207 button {
	background-color:#5b3fc4;
	border-color:#5b3fc4;
	color:var(--color-white);
}


/* ==========================================================
   Ersatz für die entfernten <div class="clr"></div> im Template
   (Floats werden jetzt in den Containern selbst aufgefangen)
   ========================================================== */
header, .mainnormal, .mainInner, .untenOuter, .untenInner { display:flow-root; }

/* ==========================================================
   Footer (ag-103) – kompakte Textabstände
   Der Footer steckt im Template innerhalb von .mainInner, dadurch
   bekam jeder Absatz über ".mainInner p" 40px Abstand oben/unten.
   ========================================================== */
.untenOuter:has(.ag-103) { padding:0; width:100%; }
.untenOuter:has(.ag-103) .untenInner { width:100%; padding:0; margin:0; font-size:inherit; line-height:inherit; }
.mainInner .ag-103 p, .untenInner .ag-103 p { margin:0; font-size:inherit; line-height:1.6; color:inherit; }
.mainInner .ag-103 .ag-104, .untenInner .ag-103 .ag-104 { font-weight:700; color:#c9c6c2; }
.untenInner .ag-103 { padding:64px 5% 72px; gap:40px; }
@media (max-width:767px) {
.untenInner .ag-103 { padding:48px 20px 56px; gap:28px; font-size:16px; }
}

/* ==========================================================
   Silbentrennung: nur Wörter ab 8 Zeichen, mindestens 4 Zeichen
   vor und nach dem Trennstrich (gilt auch für alle Sonderseiten,
   da "hyphens" vererbt wird)
   ========================================================== */
body {
hyphenate-limit-chars: 8 4 4;
-webkit-hyphenate-limit-before: 4;
-webkit-hyphenate-limit-after: 4;
}


/* ==========================================================
   Header / Hauptmenü (neu), Stand 08.10.2026
   Markup: <header class="tg-head"> im Template.
   Die alten Regeln für .menuOuter/.menu/.logo/.menuButton/ul.rex-navi1 wurden entfernt.
   Der Header bleibt in Hell- und Dunkelmodus dunkel (Markenfarbe, passt zu theme-color #313131).
   ========================================================== */

.tg-head {
	--hd-bg:#313131;
	--hd-bg-scrolled:rgba(43,42,41,.9);
	--hd-panel:#1f1e1d;
	--hd-line:rgba(255,255,255,.08);
	--hd-link:#d4d0cb;
	--hd-link-hover:#ffffff;
	--hd-acc:#8b63ff;
	--hd-acc-2:#cbb8ff;
	--hd-btn:#5b3fc4;
	--hd-btn-h:#6d52d6;
	--hd-h:76px;
	--hd-h-scrolled:64px;

	position:sticky; top:0; z-index:1100;
	background:var(--hd-bg);
	border-bottom:1px solid var(--hd-line);
	font-family:Roboto, sans-serif;
	-webkit-font-smoothing:antialiased;
	transition:background-color .25s ease, box-shadow .25s ease;
}
.tg-head * { box-sizing:border-box; }
.tg-head.is-scrolled {
	background:var(--hd-bg-scrolled);
	-webkit-backdrop-filter:saturate(140%) blur(12px);
	backdrop-filter:saturate(140%) blur(12px);
	box-shadow:0 8px 28px rgba(0,0,0,.28);
}

/* ---------- Desktop: Menü links | Logo Mitte | Menü rechts ---------- */
.tg-bar {
	max-width:1320px; height:var(--hd-h); margin:0 auto; padding:0 32px;
	display:grid; grid-template-columns:1fr auto 1fr; align-items:center; column-gap:28px;
	transition:height .25s ease;
}
.tg-head.is-scrolled .tg-bar { height:var(--hd-h-scrolled); }

.tg-nav { display:contents; }
.tg-list { list-style:none; margin:0; padding:0; display:flex; align-items:center; gap:2px; grid-row:1; }
.tg-list li { margin:0; padding:0; list-style:none; }
.tg-list-l { grid-column:1; justify-content:flex-end; }
.tg-list-r { grid-column:3; justify-content:flex-start; }

.tg-logo { grid-column:2; grid-row:1; display:block; width:136px; line-height:0; transition:width .25s ease, opacity .15s; }
.tg-logo img { display:block; width:100%; height:auto; max-width:none; visibility:visible; }
.tg-logo:hover { opacity:.85; }
.tg-head.is-scrolled .tg-logo { width:118px; }

.tg-link {
	position:relative; display:block; padding:12px 12px;
	font-size:14px; font-weight:500; line-height:1; letter-spacing:.12em; text-transform:uppercase;
	color:var(--hd-link); text-decoration:none; white-space:nowrap;
	transition:color .15s ease;
}
.tg-link::after {
	content:""; position:absolute; left:12px; right:12px; bottom:3px; height:2px; border-radius:2px;
	background:var(--hd-acc); transform:scaleX(0); transform-origin:center; transition:transform .22s ease;
}
.tg-link:hover, .tg-link:focus-visible { color:var(--hd-link-hover); }
.tg-link:hover::after, .tg-link[aria-current]::after { transform:scaleX(1); }
.tg-link[aria-current] { color:var(--hd-acc-2); }
.tg-head a:focus-visible, .tg-head button:focus-visible { outline:2px solid var(--hd-acc-2); outline-offset:2px; border-radius:6px; }

/* Kontakt als Button */
.tg-cta .tg-link { margin-left:10px; padding:12px 20px; border-radius:999px; background:var(--hd-btn); color:#fff; transition:background-color .15s ease, transform .15s ease; }
.tg-cta .tg-link::after { display:none; }
.tg-cta .tg-link:hover, .tg-cta .tg-link:focus-visible, .tg-cta .tg-link[aria-current] { background:var(--hd-btn-h); color:#fff; }
.tg-cta .tg-link:hover { transform:translateY(-1px); }

/* nur mobil */
.tg-call, .tg-burger, .tg-quick { display:none; }

/* schmalere Desktops */
@media (min-width:1081px) and (max-width:1240px) {
	.tg-bar { padding:0 20px; column-gap:16px; }
	.tg-link { padding:12px 8px; font-size:13px; letter-spacing:.08em; }
	.tg-link::after { left:8px; right:8px; }
	.tg-cta .tg-link { margin-left:6px; padding:11px 16px; }
	.tg-logo { width:120px; }
}

/* ---------- Mobil & Tablet (bis 1080px): Logo links, Anrufen + Menü rechts ---------- */
@media (max-width:1080px) {
	.tg-head.is-scrolled { -webkit-backdrop-filter:none; backdrop-filter:none; background:var(--hd-bg); }   /* sonst wird das Vollbild-Menü abgeschnitten */
	.tg-bar, .tg-head.is-scrolled .tg-bar { height:64px; padding:0 12px 0 20px; grid-template-columns:auto 1fr auto auto; column-gap:4px; }
	.tg-logo, .tg-head.is-scrolled .tg-logo { grid-column:1; width:112px; }

	.tg-call, .tg-burger {
		grid-row:1; display:inline-flex; align-items:center; justify-content:center;
		width:44px; height:44px; margin:0; padding:0; border:0; border-radius:10px;
		background:transparent; color:#fff; cursor:pointer; -webkit-tap-highlight-color:transparent;
		box-shadow:none; -webkit-appearance:none; appearance:none; font:inherit;   /* gegen Button-Stile aus library.css */
		transition:background-color .15s ease;
	}
	.tg-call { grid-column:3; }
	.tg-burger { grid-column:4; }
	.tg-call:hover, .tg-burger:hover, .tg-burger:focus { background:rgba(255,255,255,.08); box-shadow:none; color:#fff; }
	.tg-call svg { width:22px; height:22px; fill:currentColor; }

	/* Burger → X */
	.tg-burger { flex-direction:column; gap:5px; }
	.tg-burger span { display:block; width:22px; height:2px; border-radius:2px; background:currentColor; transition:transform .25s ease, opacity .2s ease; }
	.tg-head.is-open .tg-burger span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
	.tg-head.is-open .tg-burger span:nth-child(2) { opacity:0; }
	.tg-head.is-open .tg-burger span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

	/* Vollbild-Menü unter der Leiste */
	.tg-nav {
		display:flex; flex-direction:column;
		position:fixed; left:0; right:0; top:64px; bottom:0;
		padding:12px 24px calc(28px + env(safe-area-inset-bottom));
		background:var(--hd-panel); overflow-y:auto; overscroll-behavior:contain;
		opacity:0; visibility:hidden; transform:translateY(-10px);
		transition:opacity .22s ease, transform .22s ease, visibility 0s linear .22s;
	}
	.tg-head.is-open .tg-nav { opacity:1; visibility:visible; transform:none; transition:opacity .22s ease, transform .22s ease; }

	.tg-list, .tg-list-l, .tg-list-r { display:block; grid-column:auto; grid-row:auto; }
	.tg-list li { border-bottom:1px solid var(--hd-line); }
	.tg-link, .tg-cta .tg-link {
		margin:0; padding:17px 4px; border-radius:0; background:none;
		font-size:24px; font-weight:500; letter-spacing:.01em; text-transform:none; line-height:1.15;
		color:#f1ede8;
	}
	.tg-cta .tg-link:hover { transform:none; background:none; }
	.tg-link::after, .tg-cta .tg-link::after {
		display:block; left:auto; right:6px; top:50%; bottom:auto; width:8px; height:8px; border-radius:50%;
		transform:translateY(-50%) scale(0);
	}
	.tg-link:hover::after { transform:translateY(-50%) scale(0); }
	.tg-link[aria-current], .tg-cta .tg-link[aria-current] { color:var(--hd-acc-2); background:none; }
	.tg-link[aria-current]::after { transform:translateY(-50%) scale(1); }

	/* Einträge erscheinen nacheinander */
	.tg-head.is-open .tg-list li { animation:tgIn .32s ease both; animation-delay:calc(var(--i, 0) * 35ms + 40ms); }

	/* Schnellkontakt unten */
	.tg-quick { display:grid; grid-template-columns:repeat(3, 1fr); gap:10px; margin-top:28px; }
	.tg-quick a {
		display:flex; flex-direction:column; align-items:center; gap:8px; padding:14px 6px;
		border-radius:12px; background:#2c2b2a; color:#fff; text-decoration:none;
		font-size:14px; font-weight:500; letter-spacing:.02em; text-align:center;
	}
	.tg-quick a:hover { background:#383634; }
	.tg-quick svg { width:22px; height:22px; fill:currentColor; }
	.tg-quick .tg-quick-wa { background:#1f9d55; }
	.tg-quick .tg-quick-wa:hover { background:#25b764; }
	.tg-quick-note span { white-space:nowrap; }
	.tg-quick-note { grid-column:1 / -1; margin:6px 0 0; text-align:center; font-size:14px; line-height:1.5; color:#a9a5a0; }

	html.tg-lock, html.tg-lock body { overflow:hidden; }
}
@keyframes tgIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }

@media (prefers-reduced-motion: reduce) {
	.tg-head, .tg-bar, .tg-logo, .tg-link, .tg-link::after, .tg-nav, .tg-burger span { transition:none !important; }
	.tg-head.is-open .tg-list li { animation:none; }
}


@media print {
	.tg-head { position:static; box-shadow:none; }
	.tg-call, .tg-burger, .tg-quick { display:none !important; }
}