/* ==========================================================
   Design tokens -- colors & sizes centralised as CSS variables
   ========================================================== */
:root {
	/* 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: #888;
	--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 -- these are what actually flip in dark mode.
	   --color-white/--color-black/--color-dark/--color-purple stay literal:
	   they're also used for self-contained dark chips/buttons (pagination,
	   .abtn, .buttonnews) that must not change between schemes. */
	--surface-page: var(--color-white);
	--surface-card: var(--color-bg-lightest);
	--surface-muted: var(--color-bg-light);
	--text-body: var(--color-text);
	--text-strong: var(--color-text-strong);
	--text-muted: var(--color-text-muted);
	--text-light: var(--color-text-light);
	--border-default: var(--color-border);
	--border-light: var(--color-border-light);
	--overlay-card: var(--overlay-white-90);
	--overlay-card-solid: var(--overlay-white-100);

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

@media (prefers-color-scheme: dark) {
	:root {
		--surface-page: #181614;
		--surface-card: #221f1c;
		--surface-muted: #2a2723;
		--text-body: #d9d2c8;
		--text-strong: #f5f0e9;
		--text-muted: #b6ad9f;
		--text-light: #8d8577;
		--border-default: #4a453d;
		--border-light: #3a352f;
		--overlay-card: rgba(24, 22, 20, 0.9);
		--overlay-card-solid: rgba(24, 22, 20, 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.
   ========================================================== */

.menuOuter h1, .menuOuter h2, .menuOuter h3,
.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;
-ms-hyphens:auto;
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;
-ms-hyphens:auto;
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;
-ms-hyphens:auto;
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;
-ms-hyphens:auto;
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;
}




li.rex-article-1 {
display:none;
}
li.rex-article-56 {
display:none;
}

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;
}


.logo {
width:180px;
height:100px;
position:relative;
padding:0 0 0 0;
}

.logo img {
border:0;
width:100%;
height:auto;
visibility:hidden;
}

.logoLink {
margin:0;
width:100%;
height:auto;
display:block;
padding:0px 0 0px 0;
margin-top:0px;
position:relative;
cursor:pointer;
width:180px;
height:96px;
background-image:url(../../media/werbeagentur-logo-neu.svg);
background-size:90%;
background-repeat:no-repeat;
background-position:center;
}



.menuOuter {
background-color:var(--color-dark);
width:100%;
height:auto;
position:relative;
height:115px;


z-index:100;

}

.menu {
width:90%;
height:auto;
margin:0 auto;
position:relative;
padding:10px 0;
font-family:roboto;
min-height:70px;

}

ul.rex-navi1
{
	width:100%;
	z-index:10;
	height:50px;
	list-style:none;
	position:relative;
	top:0px;
	margin:0;
	padding:0;
	display:flex;
	justify-content:space-between;
}
ul.rex-navi1 li
{
	width:auto;
	height:auto;
	float:none;
	font-size:12px;
	margin:0;
	padding:0
}
ul.rex-navi1 li a,
ul.rex-navi1 li a:link
{
	list-style:none;
	list-style-type:none;
	float:none;
	width:auto;
	height:60px;
	text-decoration:none;
	font-weight:400;
	font-size:var(--font-size-md);
	text-align:center;
	display:block;
	color:var(--color-border-light);
	text-shadow:none;
	margin:0 0 0 0;
	padding:40px 10px 5px 10px;
	text-transform: uppercase;
	text-align:center;

	background-position:center 25px;
	background-repeat: no-repeat;
	overflow:hidden;

	cursor:pointer;
	-webkit-transition:background-position .1s ease;  
    -moz-transition:background-position .1s ease;  
    -o-transition:background-position .1s ease;
}


ul.rex-navi1 li:hover a,ul.rex-navi1 li a:hover,ul.rex-navi1 li a.rex-active,ul.rex-navi1 li.rex-current a
{
	list-style:none;
	list-style-type:none;
	float:none;
	width:auto;
	height:60px;
	text-decoration:none;
	font-weight:400;
	font-size:var(--font-size-md);
	text-align:center;
	display:block;
	color:var(--color-purple)!important;
	text-shadow:none;
	margin:0 0 0 0;
	padding:40px 10px 5px 10px;
	text-transform: uppercase;
	text-align:center;

	background-position:center 12px;
	background-repeat: no-repeat;
	background-color:transparent;
	-webkit-transition:background-position .1s;  
    -moz-transition:background-position .1s;  
    -o-transition:background-position .1s;
-webkit-user-select: none; 
-webkit-touch-callout: none;
}

ul.rex-navi1 li ul
{
	list-style:none;
	list-style-type:none;
	max-width:200px;
	display:none;
	position:absolute;
	margin:0;
	padding:3px 0 3px 0;
}
	ul.rex-navi1 li:hover ul
{
	list-style:none;
	list-style-type:none;
	display:block;
	position:absolute;
	top:50px;
	z-index:4000;
	margin:6px 0 0;
	padding:0;
	-webkit-user-select: none; 
-webkit-touch-callout: none;
}
	ul.rex-navi1 li:hover ul li
{
	list-style:none;
	list-style-type:none;
	width:240px;
	display:block;
	position:relative;
	margin:0;
	padding:0;
	-webkit-user-select: none; 
-webkit-touch-callout: none;
}
	ul.rex-navi1 li ul.rex-navi2 li a,ul.rex-navi1 li ul.rex-navi2 li.rex-current a
{
	list-style:none;
	list-style-type:none;
	display:block;
	position:relative;
	background:var(--surface-muted);
	width:200px;
	text-align:left;
	font-size:1.3em;
	color:var(--text-strong);
	text-shadow:none;
	margin:0;
	padding:24px 22px
}
	ul.rex-navi1 li ul.rex-navi2 li a:hover, ul.rex-navi1 li ul.rex-navi2 li.rex-current a
{
	list-style:none;
	list-style-type:none;
	display:block;
	position:relative;
	background:var(--color-hover-gray);
	width:200px;
	text-align:left;
	font-size:1.3em;
	color:var(--color-white);
	text-shadow:none;
	margin:0;
	padding:24px 22px;
	-webkit-user-select: none; 
-webkit-touch-callout: none;
}

.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;

}

.rex-article-469 {
display: none;
}

@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
}

.menuButton {
display:none;

}

.galerie {
display:flex;
justify-content:space-between;
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;
}


.logo {
width:18%;
height:100px;
position:relative;
float:none;
padding:0 0 0 0%;
}

.logo img {
border:0;
width:100%;
height:auto;
position:relative;
}

.logoLink {
margin:0;
width:160px;
height:auto;
display:block;
padding:0px 0 0px 0;
margin-top:20px;
position:relative;
cursor:pointer;
width:160px;
height:96px;
background-image:url(../../media/werbeagentur-logo-neu.svg);
background-size:100%;
background-repeat:no-repeat;
}



.menuOuter {

width:100%;
height:auto;
position:relative;
height:115px;
background-image:none;
background-position:center 0;
background-repeat:no-repeat;
z-index:100;
}

.menu {
width:95%;
height:auto;
margin:0 auto;
position:relative;
padding:10px 0;
font-family:roboto;
min-height:70px;

}

ul.rex-navi1
{

	width:100%;
	z-index:10;
	height:50px;
	list-style:none;
	position:relative;
	top:0px;
	margin:0;
	padding:0;
	float:right;
}
ul.rex-navi1 li
{
	width:auto;
	min-width:11%;
	height:auto;
	float:none;
	font-size:12px;
	margin:0;
	padding:0
}
ul.rex-navi1 li a,
ul.rex-navi1 li a:link
{
	list-style:none;
	list-style-type:none;
	float:none;
	width:100%;
	height:60px;
	text-decoration:none;
	font-weight:600;
	font-size:1.5em;
	text-align:center;
	display:block;
	color:var(--color-border-light);
	text-shadow:none;
	margin:0 0px 0 0;
	padding:40px 10px 5px 10px;
	text-transform: uppercase;
	text-align:center;
	background-image:none;
	background-position:center 25px;
	background-repeat: no-repeat;
	overflow:hidden;

	cursor:pointer;
	-webkit-transition:background-position .1s ease;  
    -moz-transition:background-position .1s ease;  
    -o-transition:background-position .1s ease;
}

.rex-article-56 {
display:none;
}

ul.rex-navi1 li:hover a,ul.rex-navi1 li a:hover,ul.rex-navi1 li a.rex-active,ul.rex-navi1 li.rex-current a
{
	list-style:none;
	list-style-type:none;
	float:none;
	width:auto;
	height:60px;
	text-decoration:none;
	font-weight:600;
	font-size:1.5em;
	text-align:center;
	display:block;
	color:var(--color-purple);
	text-shadow:none;
	margin:0 0px 0 0;
	padding:40px 10px 5px 10px;
	text-transform: uppercase;
	text-align:center;
	background-image:none;
	background-position:center 9px;
	background-repeat: no-repeat;
	background-color:transparent;
	-webkit-transition:background-position .1s;  
    -moz-transition:background-position .1s;  
    -o-transition:background-position .1s;
    -webkit-user-select: none; 
-webkit-touch-callout: none;

}
	ul.rex-navi1 li ul
{
	list-style:none;
	list-style-type:none;
	max-width:200px;
	display:none;
	position:absolute;
	margin:0;
	padding:3px 0 3px 0;
}
	ul.rex-navi1 li:hover ul
{
	list-style:none;
	list-style-type:none;
	display:block;
	position:absolute;
	top:50px;
	z-index:4000;
	margin:6px 0 0;
	padding:0;
	-webkit-user-select: none; 
-webkit-touch-callout: none;
}
	ul.rex-navi1 li:hover ul li
{
	list-style:none;
	list-style-type:none;
	width:240px;
	display:block;
	position:relative;
	margin:0;
	padding:0
}
	ul.rex-navi1 li ul.rex-navi2 li a,ul.rex-navi1 li ul.rex-navi2 li.rex-current a
{
	list-style:none;
	list-style-type:none;
	display:block;
	position:relative;
	background:var(--surface-muted);
	width:200px;
	text-align:left;
	font-size:1.3em;
	color:var(--text-strong);
	text-shadow:none;
	margin:0;
	padding:24px 22px
}
	ul.rex-navi1 li ul.rex-navi2 li a:hover,ul.rex-navi1 li ul.rex-navi2 li.rex-current a
{
	list-style:none;
	list-style-type:none;
	display:block;
	position:relative;
	background:var(--color-hover-gray);
	width:200px;
	text-align:left;
	font-size:1.3em;
	color:var(--color-white);
	text-shadow:none;
	margin:0;
	padding:24px 22px;
	-webkit-user-select: none; 
-webkit-touch-callout: none;
}

.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 screen and (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;
hyphenate-limit-chars: auto 3;
hyphenate-limit-lines: 4;
-webkit-hyphens: auto;
-webkit-hyphenate-limit-chars: auto 3;
-webkit-hyphenate-limit-lines: 4;
-ms-hyphens: auto;
-ms-hyphenate-limit-chars: auto 3;
-ms-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;
}


.logo {
width:200px;
height:auto;
position:relative;
text-align: center;
padding:0 0 0 0%;
margin:0 auto;
display:block;
}




.logo img {
border:0;
width:100%;
height:auto;
position:relative;
}

.logoLink {
width:100%;
height:80px;
display:block;
padding:20px 0 0px 0;
margin:15px 0 7px 0;
position:relative;
text-align: center;
display:inline-block;
}



.menuOuter {

width:100%;
height:auto;
position:relative;
background-color: var(--color-text);
background-image:none;
background-position:center 0;
background-repeat:no-repeat;
z-index:100;
}

.menuButton {
width:100%;
height:auto;
position:relative;
display:block;

}
.menuButton button {
position:relative;
background-image:url(../../media/menuebutton.png);
width:40px;
height:30px;
border:0;
background-color:transparent;
position:relative;
margin:10px auto 10px auto;
display:block;
background-position:center;
outline:0;
border:none;
background-repeat:no-repeat;
padding:0;
}

.menuButton button.active {
position:relative;
background-image:url(../../media/menuebutton.png);
width:40px;
height:30px;
border:0;
background-color:transparent;
position:relative;
margin:10px auto 10px auto;
display:block;
background-repeat:no-repeat;

}
.menu {
width:100%;
height:auto;
margin:0 auto;
position:relative;
padding:10px 0;
font-family:roboto;
min-height:70px;
display:block;
}

ul.rex-navi1
{
width:100%;
height:auto;
z-index:10;
list-style:none;
position:relative;
top:0px;
margin:0;
padding:10px 0;

clear:both;
display:block;
height:0;
overflow:hidden;
opacity:0;
-webkit-transition: height 1s ease;
-moz-transition: height 1s ease;
-o-transition: height 1s ease;
transition: height 1s ease;
background-color: var(--color-text);

}

ul.open {
width:100%;
height:auto;
margin:0 auto;
position:relative;
padding:10px 0;
font-family:roboto;
display:block;

opacity:1.0;
height:450px;
-webkit-transition: height 1s ease;
-moz-transition: height 1s ease;
-o-transition: height 1s ease;
transition: height 1s ease;
}

ul.rex-navi1 li
{
	width:100%;
	min-width:11%;
	height:auto;

	font-size:12px;
	margin:0;
	padding:0;
	
	position:relative;
	display:block;
}
ul.rex-navi1 li a,
ul.rex-navi1 li a:link
{
	list-style:none;
	list-style-type:none;
	float:none;
	width:100%;
	height:30px;
	text-decoration:none;
	font-weight:400;
	font-size:1.5em;
	text-align:center;
	display:block;
	color:var(--color-white);
	text-shadow:none;
	margin:0 0px 0 0;
	padding:18px 0 9px 0;
	text-transform: uppercase;
	text-align:center;
	background-image:none;
	background-position:center 25px;
	background-repeat: no-repeat;
	overflow:hidden;

	cursor:pointer;
	-webkit-transition:background-position .1s ease;  
    -moz-transition:background-position .1s ease;  
    -o-transition:background-position .1s ease;
    	position:relative;
    	border-bottom:.5px solid var(--color-border);
}

.rex-article-56 {
display:none;
}

ul.rex-navi1 li:hover a,ul.rex-navi1 li a:hover,ul.rex-navi1 li a.rex-active,ul.rex-navi1 li.rex-current a
{


	color:var(--color-purple);

}
	ul.rex-navi1 li ul
{
	list-style:none;
	list-style-type:none;
	max-width:200px;
	display:none;
	position:absolute;
	margin:0;
	padding:3px 0 3px 0;
}
	ul.rex-navi1 li:hover ul
{
	list-style:none;
	list-style-type:none;
	display:block;
	position:absolute;
	top:50px;
	z-index:4000;
	margin:6px 0 0;
	padding:0;
	-webkit-user-select: none; 
-webkit-touch-callout: none;
}
	ul.rex-navi1 li:hover ul li
{
	list-style:none;
	list-style-type:none;
	width:240px;
	display:block;
	position:relative;
	margin:0;
	padding:0;
	-webkit-user-select: none; 
-webkit-touch-callout: none;
}
	ul.rex-navi1 li ul.rex-navi2 li a,ul.rex-navi1 li ul.rex-navi2 li.rex-current a
{
	list-style:none;
	list-style-type:none;
	display:block;
	position:relative;
	background:var(--surface-muted);
	width:200px;
	text-align:left;
	font-size:1.3em;
	color:var(--text-strong);
	text-shadow:none;
	margin:0;
	padding:24px 22px
}
	ul.rex-navi1 li ul.rex-navi2 li a:hover,ul.rex-navi1 li ul.rex-navi2 li.rex-current a
{
	list-style:none;
	list-style-type:none;
	display:block;
	position:relative;
	background:var(--color-hover-gray);
	width:200px;
	text-align:left;
	font-size:1.3em;
	color:var(--color-white);
	text-shadow:none;
	margin:0;
	padding:24px 22px;
	-webkit-user-select: none; 
-webkit-touch-callout: none;
}





.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;
}

.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;
}
.galerie a.galerieBilder:hover {
	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;
}
.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;
  }
}


@media screen and (min-width:600px) and (max-width:1000px) and (orientation: landscape) {

.logo {
width:30%;
height:auto;
position:relative;

padding:0 0 0 0%;
margin:0 auto;
display:block;
}

.menuButton button {
margin: 10px 0;
position: relative;
background-image: url(../../media/menuebutton.png);
width: 40px;
height: 30px;
border: 0;
background-color: transparent;
position: relative;
margin: 20px auto 20px auto;
display: block;
padding:10px;
background-position:center;
background-repeat:no-repeat;
}



}

#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;
}

body#body526 .logo {
display:inline;
text-align: center;
position:relative;
margin:10px auto;
padding:20px 0;
}
body#body526 .logo .logoLink {
display:inline-block;
position:relative;
}

body#body526 .menu {
text-align: center;
position:relative;
}
body#body526 .menu ul {
text-align: center;
}
body#body526 .menuButton {
display:none;
}
}

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);
}

ul.rex-navi1 li.rex-current 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-h1-lg);
margin-top:10px;
margin-bottom:10px;
}
.textRahmenVB h2 {
text-transform:none;
font-weight:400;
color:var(--text-strong);
font-size:var(--font-size-h2);
margin-top:10px;
margin-bottom:10px;

}