/*
 Theme Name:   Zentralbüro Theme
 Description:  Zentralbüro WordPress Theme
 Author:	   Vanderlicht
 Author URI:   https://vanderlicht.de
 Version:      1.0.0
 Text Domain:  zentralbüro

*/
/**	____________________________________________________________
 *
 *	INHALTE
 *
 *
 *	01 — BASICS
 *	02 — TYPO
 *	03 — GRID
 *	04 — HEADER, FOOTER & MENÜS
 *	05 — UX ELEMENTE
 *	06 — SEITEN
 *	07 — BLÖCKE
 *	08 — RESPONSIVE
 *
 *	____________________________________________________________
*/



/**
 *	01 — BASICS
 *	Basiselemente
 *	____________________________________________________________
*/

*, :before, :after {
    box-sizing: border-box;
}
html {
    font-family: sans-serif;
    line-height: 1;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
	scroll-snap-type: y mandatory;
	scroll-behavior: smooth;
}
body {
    position: relative;
    margin: 0;
    line-height: 1;
    -webkit-text-size-adjust: 100%;
	overflow-x: hidden;
	color: var(--cd-black-01);
	background-color: var(--cd-lightgray-01);
}
a {
    color: inherit;
    text-decoration: none;
    background-color: transparent;
    -webkit-text-decoration-skip: objects;
}
a, a:active, a:hover {
    text-decoration: none;
    outline: 0;
    outline-width: 0;
}
p a {
	text-decoration: underline;
}
:focus {
    outline: none;
}
svg {
    transform: translate(0,0);
    line-height: 1em;
}
img,svg,video {
    display: block;
    border: 0 none;
    max-width: 100%;
	height: auto;
}
/* Safari Fix */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
	_::-webkit-full-page-media, _:future, :root, img {
		align-self: center;
	}
}
::-moz-selection {
    color: var(--cl-white-01);
    background: var(--cl-green-01);
}
::selection {
    color: var(--cl-white-01);
    background: var(--cl-green-01);
}



/**
 *	02 — TYPO, COLORS & ICONS
 *	Schrift- und Farbsettings
 *	____________________________________________________________
*/


/*--- FARBEN ---*/

/* CD Farben */

:root {
	--cl-black-01: rgb(0,0,0);
	--cl-white-01: rgb(255,255,255);
	--cl-green-01: rgb(222,252,81);
	--cl-green-02: rgb(200,227,73);
}

.f-c-white {
	color: var(--ux-white-01);
}
.f-c-black {
	color: var(--cd-black-01);
}

/*  SVG */

/* SVG Farben */

svg.stroke.opt-color-black {
	stroke: var(--cl-black-01);
}
svg.stroke.opt-color-white {
	stroke: var(--cl-white-01);
}
svg.stroke.opt-color-green {
	stroke: var(--cl-green-01);
}
svg.fill.opt-color-black {
	fill: var(--cl-black-01);
}
svg.fill.opt-color-white {
	fill: var(--cl-white01);
}
svg.fill.opt-color-green {
	fill: var(--cl-green-01);
}

/* SVG Formen */

.stroke {
	fill: none;
	stroke-miterlimit: 0;
	stroke-width: 1.5px;
}


/* SCHRIFT */

@font-face {
    font-family:	"Abril Display";
    src:			url("fonts/abril-display-regular.otf") format("opentype");
    font-weight:	400;
}
@font-face {
    font-family:	"Abril Display";
    src:			url("fonts/abril-display-bold-italic.otf") format("opentype");
    font-weight:	700;
	font-style:		italic;
}
@font-face {
    font-family:	"Tusker 3600 Semibold";
    src:			url("fonts/tusker-3600.woff2") format("woff2"),
    				url("fonts/tusker-3600.woff") format("woff");
    font-weight:	600;
}
@font-face {
    font-family:	"Tusker 4600 Semibold";
    src:			url("fonts/tusker-4600.woff2") format("woff2"),
    				url("fonts/tusker-4600.woff") format("woff");
    font-weight:	600;
}
/*@font-face {
    font-family:	"Abril Display";
    src:			url("fonts/abril-display-regular.woff2") format("woff2"),
    				url("fonts/abril-display-regular.woff") format("woff");
    font-weight:	400;
}
@font-face {
    font-family:	"Tusker 3600 Semibold";
    src:			url("fonts/tusker-3600-semibold.woff2") format("woff2"),
    				url("fonts/tusker-3600-semibold.woff") format("woff");
    font-weight:	600;
}*/

body {
    font-family: "Abril Display";
	font-weight: 400;
	line-height: 1.4em;
}

/* Headings */

/* Global Settings */

h1, h2, h3, h4, h5,
.p-h1, .p-h2, .p-h3, .p-h4, .p-h5,
.p-h-b1, .p-h-b2, .p-h-b3 {
	margin: 1.5em 0em 1em 0em;
	font-weight: 600;
	line-height: 1.05em;
	/*transform: translateY(-0.13em);*/
}
h1, h2, h3, h4,
.p-h1, .p-h2, .p-h3, .p-h4,
.p-h-b1, .p-h-b2, .p-h-b3 {
    font-family: "Tusker 3600 Semibold";
	text-transform: uppercase;
}
h3,
.p-h3 {
    font-family: "Tusker 4600 Semibold";
	letter-spacing: -0.01em;
	line-height: 1.125em;
}
h5,
.p-h5 {
    font-family: "Abril Display";
    font-weight: 700;
	font-style: italic;
}
h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child,
.p-h1:first-child, .p-h2:first-child, .p-h3:first-child, .p-h4:first-child, .p-h5:first-child,
.p-h-b1:first-child, .p-h-b2:first-child, .p-h-b3:first-child {
    margin-top: 0;
}
h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child,
.p-h1:last-child, .p-h2:last-child, .p-h3:last-child, .p-h4:last-child, .p-h5:last-child,
.p-h-b1:last-child, .p-h-b2:last-child, .p-h-b3:last-child {
    margin-bottom: 0;
}

/* Size Settings */

:root {

	--body-l:	16;		/* px */
	--body-s:	12;

	--h1-l:		7;	/* em */
	--h1-s:		3.5;

	--h1:		7;
	--h2:		4.667;
	--h3:		1.667;
	--h4:		1.111;
	--h5:		1.333;

	--h-b1:		38.7;

	--rate:		calc( (var(--h1-l) - 1) / (var(--h1-s) - 1) );	/* Vorgegeben durch H1-Verhältnis: Desktop (H1l) 6em, Mobile (H1s) 3em -> Bei H1l wird der Bodytext um 5em vergrößert, Mobile um 2em -> Daraus Verhältnis 5/2 */

}

body {
	font-size: calc(1px * var(--body-s) + (var(--body-l) - var(--body-s)) * ((100vw - 320px) / 1120));
}
:root {
	--v-h1: calc(((1 + ((var(--h1) - 1) / var(--rate))) * var(--body-s) * 1px) + (var(--h1) * var(--body-l) - ((1 + ((var(--h1) - 1) / var(--rate))) * var(--body-s))) * ((100vw - 320px) / 1120));
	--v-h2: calc(((1 + ((var(--h2) - 1) / var(--rate))) * var(--body-s) * 1px) + (var(--h2) * var(--body-l) - ((1 + ((var(--h2) - 1) / var(--rate))) * var(--body-s))) * ((100vw - 320px) / 1120));
	--v-h3: calc(((1 + ((var(--h3) - 1) / var(--rate))) * var(--body-s) * 1px) + (var(--h3) * var(--body-l) - ((1 + ((var(--h3) - 1) / var(--rate))) * var(--body-s))) * ((100vw - 320px) / 1120));
	--v-h4: calc(((1 + ((var(--h4) - 1) / var(--rate))) * var(--body-s) * 1px) + (var(--h4) * var(--body-l) - ((1 + ((var(--h4) - 1) / var(--rate))) * var(--body-s))) * ((100vw - 320px) / 1120));
	--v-h5: calc(((1 + ((var(--h5) - 1) / var(--rate))) * var(--body-s) * 1px) + (var(--h5) * var(--body-l) - ((1 + ((var(--h5) - 1) / var(--rate))) * var(--body-s))) * ((100vw - 320px) / 1120));
	--v-h-b1: calc(((1 + ((var(--h-b1) - 1) / var(--rate))) * var(--body-s) * 1px) + (var(--h-b1) * var(--body-l) - ((1 + ((var(--h-b1) - 1) / var(--rate))) * var(--body-s))) * ((100vw - 320px) / 1120));
}

@media screen and (min-width: 1440px) {

body {
	font-size: calc(var(--body-l) * 1px);
}
:root {
	--v-h1: calc(var(--h1) * 1em);
	--v-h2: calc(var(--h2) * 1em);
	--v-h3: calc(var(--h3) * 1em);
	--v-h4: calc(var(--h4) * 1em);
	--v-h5: calc(var(--h5) * 1em);
	--v-h-b1: calc(var(--h-b1) * 1em);
}

}

h1, .p-h1 { font-size: var(--v-h1); }
h2, .p-h2 { font-size: var(--v-h2); }
h3, .p-h3 { font-size: var(--v-h3); }
h4, .p-h4 { font-size: var(--v-h4); }
h5, .p-h5 { font-size: var(--v-h5); }
.p-h-b1 { font-size: var(--v-h-b1); }

/* Stylings */

p {
    margin: 0 0 1.4em;
}

.p-s1,.p-s2,.p-s3 {
	line-height: 1.25em;
}
.p-s1 {
	font-size: 1em;
}
.p-s2 {
	font-size: 0.75em;
	font-style: italic;
	font-weight: 600;
}
.p-s3 {
	font-size: 3em;
}
.p-ol {
	-webkit-text-stroke: 1.75px var(--cl-black-01);
	color: transparent;
}
@-moz-document url-prefix() {
	.p-ol {
		-webkit-text-stroke: 1px var(--cl-black-01);
	}
}

.p-ul {
	text-decoration: underline;
}
.p-mb-n {
	margin-bottom: 0em;
}
.p-mb-s {
	margin-bottom: 0.25em;
}

.p-center {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.p-c-black {
	color: var(--cl-black-01);
}
.p-c-white {
	color: var(--cl-white-01);
}
.p-c-green {
	color: var(--cl-green-01);
}

p:last-child,
ul:last-child,
li:last-child,
ol:last-child {
    margin-bottom: 0;
}

b, strong {
    font-weight: 300;
}
ul, ol {
    margin: 0 0 2.1em;
    padding: 0;
    list-style: none;
}
ul:not(.list-clear):not(.list) li:not(.menu-item) {
    position: relative;
	margin-bottom: 0.7em;
    padding: 0px 0px 0px 15px;
}
ul:not(.list-clear):not(.list) li:not(.menu-item):not(ul .list-clear):after {
	content: '•';
    position: absolute;
	left: 0px;
	top: 0px;
	font-size: 0.5em;
}


/* BUTTONS & LINKS */

/*-- Browser Fix --*/

a, .button:focus, button:focus, input[type="button"]:focus, input[type="reset"]:focus, input[type="submit"]:focus {
    outline: none;
}
button {
	border: none;
	font-size: inherit;
	font-weight: 300;
	cursor: pointer;
}
button::-moz-focus-inner {
    border: 0;
    outline: none;
}

/*-- Std. --*/

.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: var(--4em);
	padding: var(--0-5em) calc(var(--1em) * 1.5);
	font-weight: 400;
	font-size: var(--v-h4);
	text-transform: uppercase;
	transition: color 0.2s, background-color 0.2s;
}
.btn:not(.round) {
	min-width: calc(var(--6em) * 2);
}

/*-- Colors --*/

.btn.full.black {
	color: var(--cl-white-01);
	background-color: var(--cl-black-01);
}
.btn.full.black:hover {
	background-color: var(--cl-black-01-b);
}

.btn.full.white {
	background-color: var(--cl-white-01);
	color: var(--cl-black-01);
}
.btn.full.white:hover {
	background-color: var(--cl-white-01-b);
}

.btn.outline.black {
	border: 2px solid var(--cd-black-01);
	color: var(--cd-black-01);
}
.btn.outline.black:hover {
	background-color: var(--cd-black-01);
	color: var(--ux-white-01);
}

.btn.outline.white {
	border: 1.5px solid var(--ux-white-01);
	color: var(--ux-white-01);
}
.btn.outline.white:hover {
	background-color: var(--ux-white-01);
	color: var(--cd-black-01);
}

/*-- Icon --*/

.btn.icon {
	justify-content: space-between;
}
.btn.icon svg {
	fill: none;
	stroke-width: 1.5px;
	margin-left: var(--2em);
}
.btn.full.black.icon svg,
.btn.outline.white.icon svg {
	stroke: var(--cl-white-01);
}
.btn.full.white.icon svg,
.btn.outline.black.icon svg,
.btn.full.green-01.icon svg,
.btn.outline.green-01.icon svg {
	stroke: var(--cl-black-01);
}

.btn.outline.white.icon:hover svg {
	stroke: var(--cl-black-01);
}
.btn.outline.black.icon:hover svg {
	stroke: var(--cl-white-01);
}

/*-- Shape --*/

/*-- Std. Link --*/

.icon-link,
.icon-link .icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.icon-link.spaced {
	margin-top: var(--3em);
}
.icon-link .icon {
	margin-right: var(--1em);
}
.icon-link span {
	margin: 0px;
}


/* ICONS */

/*-- Circle Icon --*/

.circle-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--3em);
	height: var(--3em);
	border-radius: 50%;
}

.circle-icon.big {
	width: var(--12em);
	height: var(--12em);
	border-width: 4px !important;
}

.circle-icon.full.opt-color-green {
	background-color: var(--cl-green-01);
}
.circle-icon.full.opt-color-black {
	background-color: var(--cl-black-01);
}
.circle-icon.outline.opt-color-green {
	border: 2px solid var(--cl-green-01);
}
.circle-icon.outline.opt-color-black {
	border: 2px solid var(--cl-black-01);
}

.circle-icon svg {
	transform: translateX(0px) translateY(0px);
	transition: transform 0.2s;
}
.circle-icon.hov-down:hover svg {
	transform: translateX(0px) translateY(var(--1-2em));
}
.circle-icon.hov-right:hover svg {
	transform: translateX(var(--1-2em)) translateY(0px);
}
.circle-icon.hov-left:hover svg {
	transform: translateX(calc(var(--1-2em)) * -1) translateY(0px);
}

/*-- Plus Icon --*/

.icon-plus {
	position: relative;
	display: flex;
	align-items: center;
	width: var(--2em);
	height: var(--2em);
}
.icon-plus div {
	position: absolute;
	width: 100%;
	height: 0%;
}
.icon-plus div {
	border-top: 1px solid var(--cl-black-01);
	border-bottom: 1px solid var(--cl-black-01);
}
.icon-plus div:nth-child(2) {
	transform: rotate(90deg);
}



/**
 *	03 — GRID
 *	Flexbox, Abstände
 *	____________________________________________________________
*/

/*-- Units --*/

:root {
	/* Std. Einheit */
	--1em: 10px;
	--1-4em: calc(var(--1em) * 0.25);
	--1-2em: calc(var(--1em) * 0.5);
	--3-4em: calc(var(--1em) * 0.75);
	--2em: calc(var(--1em) * 2);
	--3em: calc(var(--1em) * 3);
	--4em: calc(var(--1em) * 4);
	--5em: calc(var(--1em) * 5);
	--6em: calc(var(--1em) * 6);
	--9em: calc(var(--1em) * 9);
	--12em: calc(var(--1em) * 12);
	--18em: calc(var(--1em) * 18);
}

@media screen and (min-width: 960px) {
	:root {
		/* Std. Einheit */
		--1em: 1.042vw;
	}
}
@media screen and (min-width: 1440px) {
	:root {
		/* Std. Einheit */
		--1em: 15px;
	}
}

/*-- Gaps --*/

body {
	padding-left: var(--1em);
	padding-right: var(--1em);
}

.block {
	padding-top: var(--6em);
	padding-bottom: var(--6em);
}

.opt-gap-top-00 {
	padding-top: 0px;
}
.opt-gap-top-01 {
	padding-top: var(--6em);
}
.opt-gap-top-02 {
	padding-top: var(--12em);
}
.opt-gap-bottom-00 {
	padding-bottom: 0px;
}
.opt-gap-bottom-01 {
	padding-bottom: var(--6em);
}
.opt-gap-bottom-02 {
	padding-bottom: var(--12em);
}

/* Wrapper */

.wrapper {
	width: 100%;
	margin: 0 auto;
}

.wrapper-2048 { max-width: 2048px; }
.wrapper-1920 { max-width: 1920px; }
.wrapper-1680 { max-width: 1680px; }
.wrapper-1440 { max-width: 1440px; }
.wrapper-1200 { max-width: 1200px; }
.wrapper-1080 { max-width: 1080px; }
.wrapper-960  { max-width: 960px; }
.wrapper-720  { max-width: 720px; }
.wrapper-480  { max-width: 480px; }

.wrapper-full {
	position: relative;
	width: calc(100% + var(--2em));
	left: calc(var(--1em) * -1);
}
.wrapper-p50 {
	max-width: 50%;
	margin: 0 auto;
}

.wrapper-left {
	margin-left: 0;
}
.wrapper-right {
	margin-right: 0;
}

.mw-480 {
	max-width: calc(var(--1em) * 32);
}
.mw-600 {
	max-width: calc(var(--1em) * 40);
}
.mw-720 {
	max-width: calc(var(--1em) * 48);
}
.mw-840 {
	max-width: calc(var(--1em) * 56);
}
.mw-p50 {
	max-width: 50%;
}

/* Image Crop */

.img-crop img {
	object-fit: cover;
	width: 100%;
}
.img-crop-2-3 img	{ aspect-ratio: 2 / 3; }
.img-crop-3-4 img	{ aspect-ratio: 3 / 4; }
.img-crop-1-1 img	{ aspect-ratio: 1 / 1; }
.img-crop-4-3 img	{ aspect-ratio: 4 / 3; }
.img-crop-3-2 img	{ aspect-ratio: 3 / 2; }
.img-crop-16-9 img	{ aspect-ratio: 16 / 9; }
.img-crop-2-1 img	{ aspect-ratio: 2 / 1; }
.img-crop-3-1 img	{ aspect-ratio: 3 / 1; }

/* Image Hov */

.img-hov-e {
	overflow: hidden;
}
.img-hov-e img	{
	transform: scale(1);
	transform-origin: center;
	transition: transform 0.3s;
}
.img-hov:hover .img-hov-e img	{
	transform: scale(1.025);
}




/**
 *	04 — HEADER, FOOTER & NAVI
 *	Header, Footer, Layer, Meüs, etc.
 *	____________________________________________________________
*/


/* HEADER */

.main-logo {
	position: absolute;
	top: 0px;
	z-index: 2;
	right: calc(50% - var(--6em));
	width: var(--12em);
}
.main-nav-controls {
	position: fixed;
	top: 0px;
	right: 0px;
	z-index: 4;
	display: flex;
}

.opener {
	cursor: pointer;
}
.opener-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--6em);
	height: var(--6em);
	cursor: pointer;
	background-color: var(--cl-green-01);
}

.burger-icon {
	position: relative;
	width: var(--3em);
	height: var(--3em);
}
.burger-icon > div {
	position: absolute;
	height: 0px;
	border-top: 1px solid var(--cl-black-01);
	border-bottom: 1px solid var(--cl-black-01);
	left: 0px;
	top: 50%;
	width: 100%;
	transition: transform 0.3s;
}
.burger-icon > div:nth-child(1) {
	transform: rotate(0deg) translateY(-4px);
}
.burger-icon > div:nth-child(2) {
	transform: rotate(0deg) translateY(4px);
}

.opener.active .burger-icon > div:nth-child(1) {
	transform: rotate(-45deg) translateY(0px);
}
.opener.active .burger-icon > div:nth-child(2) {
	transform: rotate(45deg) translateY(0px);
}


/* STÖRER */

.stoerer {
	position: fixed;
	bottom: 0px;
	right: 0px;
	z-index: 4;
	display: flex;
	cursor: pointer;
	background-color: var(--cl-green-01);
	transition: transform 0.3s;
}
.stoerer-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--6em);
	height: var(--6em);
	background-color: var(--cl-green-02);
}
.stoerer-text {
	display: flex;
	align-items: center;
	padding: 0px var(--1em);
}
.stoerer.scrolling {
	transform: translateX(calc(100% - var(--6em)));
}


/* LAYER */

.moving-layer {
	position: fixed;
	top: 0px;
	right: 0px;
	z-index: 3;
	display: flex;
	flex-direction: column;
	transform: translateX(100%);
	width: 25%;
	height: 100vh;
	background-color: var(--cl-green-01);
	transition: transform 0.3s;
}
.moving-layer.active {
	transform: translateX(0%);
}
.ml-row {
	text-align: center;
}
.moving-layer-header,
.moving-layer-footer {
	flex: 1 1 auto;
	display: flex;
	justify-content: center;
	padding: var(--1em);
}
.moving-layer-content {
	flex: 1 1 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: var(--1em);
}

.ml-menu {
	margin-bottom: calc(var(--1em) * 6);
}

/* Hauptmenü */

.menu-item > a:hover {
	opacity: 0.667;
}

/* Footermenü */

#footermenue {
	display: flex;
	flex-wrap: wrap;
}
#footermenue li {
	padding: 0px var(--1em);
}

/* Menü Overlay */

.menu-overlay {
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: 3;
	width: 100%;
	height: 100vh;
	background-color: rgba(0,0,0,0.333);
	opacity: 0;
	transform: translateY(-100%);
	transition: transform 0s 0.3s, opacity 0.3s;
}
.menu-overlay.active {
	opacity: 1;
	transform: translateY(0%);
	transition: transform 0s, opacity 0.3s;
}

/* FOOTER */

.main-footer {
	margin-top: var(--1em);
}
.footer-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: var(--6em);
	padding: var(--1em) 0px;
}



/**
 *	05 — UX ELEMENTE
 *	Layer, Popups und weitere UX Elemente
 *	____________________________________________________________
*/

/* LOGO */

.zb-logo {
}


/* LIST */

/* Style 01: Std. */

.list.st-01 li {
	display: flex;
	align-items: center;
	min-height: var(--3em);
	padding: calc(var(--1em) * 0.5) 0px;
	border-top: 1px solid var(--cd-black-01);
}
.list.st-01 li:last-child {
	border-bottom: 1px solid var(--cd-black-01);
}
.list.st-01 li > span:first-child {
	text-align: left;
	margin-right: auto;
}
.list.st-01 li > span:last-child {
	text-align: right;
}
.list.st-01 li > span span {
	display: block;
}

/* Style 02: Erweitert (2 Spalten) */

.list.st-02 li {
	display: flex;
	padding: 10px 0px;
	border-top: 1px solid var(--ux-gray-02);
}
.list.st-02 li span {
	flex: 0 0 50%;
}


/* POPUP */

.popup-spacer {
	position: relative;
}
.popup {
	position: fixed;
	left: 0px;
	top: 0px;
	z-index: 3;
	width: 100%;
	height: 100vh;
	background-color: rgba(0,0,0,0.9);
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s;
}
.popup.active {
	opacity: 1;
	pointer-events: all;
}
.popup-wrapper {
	width: 100%;
	height: 100%;
	padding: var(--1em);
}
.popup-wrapper.center {
	display: flex;
	align-items: center;
	justify-content: center;
}
.popup-wrapper.center img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.popup-section {
	padding: var(--2em) 0px;
}
.popup-trigger {
	cursor: pointer;
}
.popup-closer {
	position: absolute;
	right: var(--1em);
	top: var(--1em);
	cursor: pointer;
}


/* TAB */

.tabs-trigger {
	display: flex;
}
.tab-trigger {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	flex: 1 1 100%;
	min-height: var(--6em);
	padding: var(--1em) 0px;
	text-align: center;
	border-bottom: 5px solid var(--cl-black-01);
	opacity: 0.5;
	cursor: pointer;
}
.tab-trigger.active {
	opacity: 1;
}
.tabs-content {
	padding: 0px var(--5em);
}
.tab-content {
	display: none;
	padding-top: var(--6em);
}
.tab-content.active {
	display: block;
}


/* BORLABS & GOOGLE MAPS */

.map-platzhalter {
	background: rgba(0,0,0,0.1) url("img/maps-platzhalter.jpg");
	width: 100%;
	position: relative;
	background-size: cover;
	background-position: center;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: var(--2em);
}
.map-platzhalter-hinweis {
	background: #ffffff;
	padding: var(--2em);
	text-align: center;
}
.map-entsperren-trigger {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 50px;
	margin: auto;
	color: var(--cl-black-01);
	background: var(--cl-green-01);
	cursor: pointer;
}
#BorlabsCookieBox ._brlbs-bar-wrap._brlbs-position-fixed {
	left: 0px;
}




/**
 *	06 — SECTIONS & SEITEN
 *	Startseite, Unterseiten, Blog, Singles
 *	____________________________________________________________
*/

/* HOME */

/* BLOG */


/**
 *	07 — BLÖCKE
 *	Module, bzw. WordPress Blöcke
 *	____________________________________________________________
*/


/* ALLG. */

/* Block Wrapper */

.block {
	width: 100%;
}


/* INTRO */

.block-intro {
	padding-top: 0px;
	padding-bottom: 0px;
	margin-bottom: var(--12em);
}

/* Std. */

.block-intro-01 {
	margin-bottom: var(--6em);
}
.intro-01-wrapper {
	padding-top: var(--18em);
	padding-bottom: var(--3em);
	border-bottom: 1px solid var(--cl-black-01);
}

/* Main */

.block-intro-02 {
	margin-bottom: var(--12em);
}
.intro-02-wrapper {
	position: relative;
	width: 100%;
	padding: var(--1em);
}
.intro-02-rows {
	font-family: "Tusker 3600 Semibold";
	text-transform: uppercase;
	font-size: 14vw;
	line-height: 1.05em;
	padding-top: var(--1em);
}
/*.intro-02-rows p {
	transform: translateY(-0.15em);
}*/
.intro-02-row-01 {
	position: relative;
	z-index: 1;
}
.intro-02-row-03 p {
	display: flex;
	width: 100%;
	justify-content: center;
}
.intro-02-row-03 span {
	display: block;
	margin: 0px 0.2em;
}
.intro-02-img {
	position: absolute;
	top: 0px;
	right: 0px;
	z-index: 1;
	width: calc(50% + var(--6em));
}
.intro-02-img img {
	aspect-ratio: 16 / 8.667;
}
.intro-02-scroller {
	position: absolute;
	left: 50%;
	transform: translateX(-50%) translateY(calc(-50% + var(--1em)));
}

/* KAPITEL */

.block-kapitel {
	margin-bottom: var(--1em);
}
.kapitel-wrapper {
	display: flex;
	padding-bottom: var(--1em);
	border-bottom: 1px solid var(--cl-black-01);
}
.kapitel-wrapper .txt-01 {
	flex: 0 0 50%;
}
.kapitel-wrapper .txt-02 {
	flex: 0 0 50%;
	padding-left: var(--6em);
}

/* TEXT 01 (STD.) */

.text-01-wrapper {
	margin: 0px auto;
}

/* TEXT 02 (TEASER) */

.text-02-wrapper {
	display: flex;
	padding: 0px var(--5em);
}
.text-02-wrapper .text-02-content-01 {
	flex: 0 0 50%;
	padding-left: var(--6em);
}
.text-02-wrapper .text-02-content-02 {
	flex: 0 0 50%;
	padding: 0px var(--6em);
}


/* BILD (BANNER) */

.block-bild-01 {
	width: calc(100% + var(--12em));
	margin-left: calc(var(--6em) * -1);
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
	height: calc(var(--1em) * 40);
}


/* BILD & TEXT 01 (STD.) */

.bt-01-wrapper {
	display: flex;
	padding: 0px var(--5em);
}
.bt-01-wrapper .bt-01-img {
	flex: 0 0 50%;
	padding-left: var(--6em);
}
.bt-01-wrapper .bt-01-content {
	flex: 0 0 50%;
	padding: 0px var(--6em);
}


/* BILD & TEXT 02 (FACTS) */

.bt-02-wrapper {
	display: flex;
}
.bt-02-wrapper .bt-media {
	flex: 1 1 auto;
}
.bt-02-wrapper .bt-title,
.bt-02-wrapper .bt-content {
	padding-top: var(--3em);
}
.bt-02-wrapper .bt-title {
	flex: 0 0 calc(var(--6em) * 4);
	padding-left: var(--3em);
	padding-right: var(--3em);
}
.bt-02-wrapper .bt-content {
	flex: 0 0 calc(50% - var(--6em));
}
.facts-wrapper {
	display: flex;
	flex-wrap: wrap;
}
.fact {
	flex: 0 0 calc(50% - var(--1em));
	margin-bottom: var(--3em);
}
.fact:nth-child(2n-1) {
	margin-right: var(--2em);
}
.fact h3 {
	max-width: calc(var(--6em) * 2.5);
}


/* AKKORDEON */

/* Allgemein */

.akk-trigger {
	cursor: pointer;
}

/* Style 01 - Rows */

.akk-wrapper.st-01 {
	width: 100%;
	border-top: 1px solid var(--cl-black-01);
}
.akk-wrapper.st-01 .akk {
	border-bottom: 1px solid var(--cl-black-01);
}
.akk-wrapper.st-01 .akk-trigger {
	display: flex;
	align-items: center;
	min-height: var(--6em);
	padding: var(--1em) 0px var(--1em) calc(50% + var(--6em) * 1);
	cursor: pointer;
}
.akk-wrapper.st-01 .akk-trigger h3 {
	flex: 0 0 50%;
	margin: 0px var(--1em) 0px 0px;
}
.akk-wrapper.st-01 .akk-arrow .icon-plus {
	transform: rotate(0deg);
	transition: transform 0.4s;
}
.akk-wrapper.st-01 .akk-trigger.active .akk-arrow .icon-plus {
	transform: rotate(135deg);
}
.akk-wrapper.st-01 .akk-content {
	padding: var(--2em) 0px var(--2em) calc(50% + var(--6em) * 1);
}


/* FLÄCHEN */

.tab-sp-wrapper {
	display: flex;var(--1-4em);
}
.tab-sp-content {
	flex: 1 1 100%;
	padding: var(--6em) var(--3em) 0px 0px;
}
.tab-sp-img {
	flex: 0 0 50%;
}
.tab-sp-legende {
	padding: var(--6em) 0px 0px var(--3em);
	flex: 0 0 calc(var(--6em) * 3);
}
.tab-sp-legende .legende-entries:first-child {
	margin-top: 0px;
}



/* GRUNDRISSE */

.grundriss-wrapper {
	display: flex;
	align-items: flex-start;
}
.grundriss-img {
	flex: 1 1 100%;
}
.grundriss-info {
	flex: 0 0 calc(var(--6em) * 4);
	padding-left: var(--6em);
	padding-top: var(--1em);
}

.legende-entries {
	margin: var(--3em) 0px;
}
.legende-entry {
	display: flex;
	align-items: center;
	margin-bottom: var(--1-4em);
}
.legende-entry span:nth-child(1) {
	flex: 0 0 var(--1em);
	width: var(--1em);
	height: var(--1em);
	margin-right: var(--1-4em);
}

/* MAP */

.map-wrapper {
	padding: var(--3-4em);
	border: var(--1-4em) solid var(--cl-green-01);
}
.maps-controls {
	margin-top: 0px;
	margin-left: calc(50% + var(--6em));
}
.maps-controls a {
	padding: var(--1em) 0px;
	border-bottom: 3px solid var(--cl-green-01);
	display: block;
	text-decoration: underline;
}
.acf-map {
	height: calc(var(--6em) * 5);
}


/* SWIPER */

.sw-container {
	position: relative;
}
.sw-fixer {
	overflow: hidden;
}

/* For Parallax */

.swiper-slide {
	overflow: hidden;
}

/* St. 01 */

.swiper-01-wrapper {
	display: flex;
	align-items: flex-end;
}

.sw-01-content {
	flex: 0 0 calc(100% - calc(var(--6em) * 3));
}

.sw-01-pagination {
	position: relative;
	z-index: 2;
	display: flex;
	justify-content: flex-end;
	flex: 0 0 var(--12em);
	max-width: var(--12em);
    font-family: "Tusker 3600 Semibold";
	font-weight: 600;
	font-size: calc(var(--1em) * 31.75);
	line-height: 0.75em;
	transform: translateY(0.006em) translateX(calc(var(--1em) * 4.5));
	white-space: nowrap;
}
.sw-01-pagination .number {
	display: inline-block;
	font-size: 0.0667em;
	line-height: 1em;
	transform: translateY(calc(var(--1em) * -1));
}

.sw-01-preview {
	flex: 0 0 var(--6em);
	height: calc(var(--6em) * 5);
}
.sw-01-preview .swiper {
	height: 100%;
}
.sw-01-preview .swiper img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* St. 02 */

.swiper-02-wrapper {
	padding: 0px var(--6em);
}
.sw-02-controls {
	position: absolute;
	top: calc(50% - var(--1em));
	z-index: 1;
	left: 0px;
	width: 100%;
	pointer-events: none;
}


/* SWIPER NAV */

.swiper-prev,
.swiper-next {
	cursor: pointer;
	pointer-events: all;
}

/* Style 01 */

.sw-01-controls {
	position: absolute;
	bottom: var(--3em);
	left: var(--3em);
	z-index: 1;
}
.swiper-01-wrapper.reached-start .swiper-prev,
.swiper-01-wrapper.reached-end .swiper-next {
	display: none;
}

/* Style 02 */

.swiper-02-wrapper .swiper-nav {
	display: flex;
	justify-content: space-between;
}
.swiper-02-wrapper .swiper-nav .swiper-prev {
	margin-right: var(--1-2em);
}
.sw-02-controls .swiper-prev,
.sw-02-controls .swiper-next {
	opacity: 1;
	transition: opacity 0.4s;
}
.sw-02-controls .swiper-nav-element svg {
	width: 20px;
	height: 20px;
}
.swiper-02-wrapper.reached-start .swiper-prev,
.swiper-02-wrapper.reached-end .swiper-next {
	opacity: 0.25;
	cursor: default;
}


/* KONTAKT */

.kontakt-wrapper {
	width: 100%;
	max-width: 100%;
}
.kontakt-wrapper {
	display: flex;
}
.kontakt-col {
	padding: var(--2em) 0px;
}
.kontakt-col:nth-child(1),
.kontakt-col:nth-child(3) {
	display: flex;
	white-space: nowrap;
	overflow: hidden;
}
.kontakt-col:nth-child(1) {
	flex: 0 0 calc(50% - calc(var(--6em) * 4.5));
	justify-content: flex-end;
	text-align: right;
}
.kontakt-col:nth-child(2) {
	flex: 0 0 calc(var(--6em) * 4.5);
	padding: var(--2em) var(--3em);
}
.kontakt-col:nth-child(3) {
	flex: 1 1 auto;
}
.kontakt-col:nth-child(1) span + span, .kontakt-col:nth-child(3) span + span {
	margin-left: var(--6em);
}


/* RINDGANG - VIDEO VERSION */

.video-wrapper {
	width: 100%;
	aspect-ratio: 2.5/1;
	overflow: hidden;
	position: relative;
	padding: 0px calc(var(--1em) * 11);
}
.video-wrapper video {
	object-fit: cover;
	height: 100%;
	width: 101%;
	object-position: center;
	margin-left: -1px;
	position: relative;
    z-index: 0;
}
.rundgang-buttons {
	display: flex;
	position: absolute;
	bottom: var(--1em);
	right: calc(var(--1em) * 11 + 20px);
}
.rundgang-button {
	height: var(--4em);
	background: var(--cl-green-01);
	display: flex;
	justify-content: center;
	align-items: center;
	text-transform: uppercase;
	cursor: pointer;
	padding: var(--1-4em) var(--1em);
	text-align: center;
	z-index: 1;
	font-size: var(--v-h5);
}
.rundgang-button span {
	display: block;
	margin-top: 0.1em;
}
.rundgang-button:not(:last-child) {
	margin-right: 10px;
}
.rundgang-download {
	text-align: center;
	margin-top: 10px;
}



/**
 *	08 — RESPONSIVE
 *	Anpassung des Layouts für mobile Geräte
 *	____________________________________________________________
*/

@media screen and (min-width: 2048px) {

/* Units */

.intro-02-rows {
	font-size: 286px;
}

}

@media screen and (max-width: 1440px) {

.tab2-content {
	padding: 0px;
}

}

@media screen and (max-width: 1320px) {

}

@media screen and (max-width: 1200px) {

.tab-sp-wrapper {
	flex-wrap: wrap;
}
.tab-sp-content {
	padding: 0px var(--6em) var(--6em);
}
.tab-content {
	padding: var(--6em) 0px 0px;
}
.tab-sp-img {
	flex: 0 0 66.667%;
}
.grundriss-info {
	padding-left: var(--3em);
}

.text-02-wrapper .text-02-content-01,
.bt-01-wrapper .bt-01-img {
	padding-left: 0px;
}
.text-02-wrapper .text-02-content-02,
.bt-01-wrapper .bt-01-content {
	padding-right: 0px;
}
.video-wrapper {
	aspect-ratio: 16/9;
	padding: 0px calc(var(--1em) * 5);
}
.rundgang-buttons {
	right: calc(var(--1em) * 5 + var(--1em));
}

}

@media screen and (max-width: 1080px) {

.wrapper-p50,
.mw-p50 {
	max-width: 100%;
}
.moving-layer {
	width: 50%;
}

}

@media screen and (max-width: 960px) {

.kapitel-wrapper .txt-02,
.text-02-wrapper,
.text-02-wrapper .text-02-content-02,
.bt-01-wrapper,
.bt-01-wrapper .bt-01-content,
.tabs-content {
	padding: 0px;
}
.bt-01-wrapper .bt-01-img {
	padding-right: var(--1em);
}
.maps-controls {
	margin-left: 0px;
}
.video-wrapper {
	padding: 0px;
}
.rundgang-buttons {
	right: var(--1em);
	width: calc(100% - var(--2em));
}
.rundgang-button {
	flex: 1 1 50%;
}

}

@media screen and (max-width: 840px) {

.circle-icon {
	width: var(--4em);
	height: var(--4em);
}
.bt-02-wrapper {
	flex-wrap: wrap;
}
.bt-02-wrapper .bt-media {
	flex: 0 0 50%;
	padding-right: var(--1em);
}
.bt-02-wrapper .bt-title {
	flex: 0 0 50%;
	padding: 0px;
}
.bt-02-wrapper .bt-content {
	flex: 0 0 100%;
}
.fact:nth-child(2n-1) {
	margin-right: var(--1em);
}
.fact {
  flex: 0 0 calc(50% - var(--1-2em));
}
.akk-wrapper.st-01 {
	width: 100%;
}
.akk-wrapper.st-01 .akk-trigger,
.akk-wrapper.st-01 .akk-content {
	padding: var(--1em) 0px;
}
.swiper-01-wrapper {
	align-items: unset;
}
.sw-01-content {
	flex: 0 0 calc(100% - calc(var(--6em) * 2));
}
.sw-01-pagination {
	align-items: flex-end;
	flex: 0 0 var(--6em);
	max-width: var(--6em);
	font-size: calc(var(--1em) * 18);
	pointer-events: none;
}
.sw-01-preview {
	height: unset;
}
.sw-01-controls {
	bottom: var(--1em);
	left: var(--1em);
}
.sw-01-controls .circle-icon.big {
	width: var(--6em);
	height: var(--6em);
	border-width: 2px !important;
}
.swiper-02-wrapper {
	padding: var(--6em) 0px 0px;
}
.sw-02-controls {
	top: calc(var(--1em) * -1.5);
}
.swiper-02-wrapper .swiper-nav {
	justify-content: center;
}
.grundriss-wrapper {
	display: block;
}
.grundriss-info {
	padding-left: 0px;
	margin-bottom: var(--3em);
}

}

@media screen and (max-width: 600px) {

.intro-02-img {
	position: relative;
	width: 100%;
	margin-bottom: var(--1em);
}
.intro-02-img img {
	aspect-ratio: unset;
}
.intro-02-row-02 .mover {
	transform: none !important;
}
.main-logo {
	right: var(--6em);
	width: var(--6em);
}
.block-bild-01 {
	background-attachment: scroll;
	aspect-ratio: 2/1;
	height: unset
}
.moving-layer {
	width: 100%;
}
.text-02-wrapper {
	display: block;
}
.text-02-wrapper .text-02-content-01 {
	margin-bottom: var(--4em);
}
.text-02-wrapper .text-02-content-02 {
	padding-left: 0px;
}
.bt-01-wrapper {
	display: block;
}
.bt-01-wrapper .bt-01-img {
	padding-right: 0px;
	margin-bottom: var(--3em);
}
.sw-01-content {
	flex: 0 0 100%;
}
.sw-01-pagination {
	flex: 0 0 0%;
	max-width: 0px;
	transform: translateY(-0.0075em) translateX(calc(var(--1em) * -1));
	font-size: calc(var(--1em) * 12);
}
.sw-01-preview {
	display: none;
}
.sw-01-pagination .number {
	font-size: 0.15em;
	line-height: 1em;
	transform: translateY(0px);
}
.tab-sp-wrapper {
	flex-wrap: wrap;
}
.tab-sp-content {
	padding: 0px;
	margin-bottom: var(--3em);
}
.tab-sp-img {
	flex: 0 0 100%;
}
.tab-sp-legende {
	flex: 1 1 100%;
	padding: var(--3em) 0px 0px 0px;
}
.tab-sp-legende .legende-entries {
	margin: var(--1em) 0px;
	padding-top: var(--1em);
	border-top: 1px solid var(--cl-black-01);
}
.akk-wrapper.st-01 .akk-trigger {
	justify-content: space-between;
}
.kontakt-wrapper {
	display: block;
}
.kontakt-col:nth-child(1) {
	padding: var(--1em);
}
.kontakt-col:nth-child(1) span:not(:nth-child(1)) {
	display: none;
}
.kontakt-col:nth-child(2) {
	padding: var(--1em);
}
.kontakt-col:nth-child(3) {
	display: none;
}
.p-h-b1 {
	font-size: calc(45vw - var(--2em));
}
.footer-wrapper {
	justify-content: flex-start;
}
#footermenue li {
	padding: 0px var(--1em) 0px 0px;
}

}

@media screen and (max-width: 480px) {

}

/** IE FIXES **/
@media screen\0, @media screen\9 {
    h1, h2, h3, p {
        width: 100%;
    }
    img {
        flex-shrink: 0;
    }
}