/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Mar 11 2024 | 14:23:52 */
/* outfit-100 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 100;
  src: url('https://nmk.hhvision.de/fonts/outfit-v11-latin/outfit-v11-latin-100.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* outfit-200 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 200;
  src: url('https://nmk.hhvision.de/fonts/outfit-v11-latin/outfit-v11-latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* outfit-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 300;
  src: url('https://nmk.hhvision.de/fonts/outfit-v11-latin/outfit-v11-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* outfit-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400;
  src: url('https://nmk.hhvision.de/fonts/outfit-v11-latin/outfit-v11-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* outfit-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 500;
  src: url('https://nmk.hhvision.de/fonts/outfit-v11-latin/outfit-v11-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* outfit-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 600;
  src: url('https://nmk.hhvision.de/fonts/outfit-v11-latin/outfit-v11-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* outfit-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 700;
  src: url('https://nmk.hhvision.de/fonts/outfit-v11-latin/outfit-v11-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* outfit-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 800;
  src: url('https://nmk.hhvision.de/fonts/outfit-v11-latin/outfit-v11-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* outfit-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 900;
  src: url('https://nmk.hhvision.de/fonts/outfit-v11-latin/outfit-v11-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}





:root {
	--primary: #00bf00;
	--primarytint: #caedb2;
	--primarypale: #f4fbf0;
	--blue: #6ac6f9;
	--yellow: #ffff00;
	--orange: #ff9900;
	--neongreen: #66ff00;
	--yellowgreen: #4dd200;
	--mint: #00ff8e;
	--midblue: #0087FF;
	--nearblack: #282828; 
	--darkgrey: #444444;
	--skyoverlay: #52728b;
	
	--white: #ffffff;
	--black: #000000;
}


















.wp-block-image img{	
	height: auto !important;
}
img {
	image-rendering: -webkit-optimize-contrast;
}


html {
  	margin: 0 !important;
  	padding: 0 !important;	
  	width: 100% !important;
  	max-width: 100% !important;
  	overflow-x: hidden !important;
}

body {
  	width: 100% !important;
  	max-width: 100% !important;
  	margin: 0;
  	padding: 0;	
  	font-size: 17px;
  	line-height: 1.4em;
  	font-weight: 400;
  	background-color: #ffffff;
  	width: 100vw !important;
  	overflow-x: hidden !important;
}
body.elementor-editor-active {
	background: #cccccc;
}
body, p, h1, h2, h3, h4, h5, h6, ul, li, a {  
	font-family: 'Outfit', sans-serif !important;
  	color: var(--black);  
  	font-weight: 400;
	
}
body, p, ul, li, a {	
  	font-size: 20px;
	line-height: 1.5em;
}

h1 {
	font-size: 180px;
	font-weight: 700;
	line-height: 0.9em;
}
@media (max-width: 1800px) {
	h1 { font-size: 10vw; }
}

h2 {
  	font-size: 50px;
  	font-weight: 500;
}
h2 strong {
	font-weight: 700;
}

h3 {
  	font-size: 32px;
  	font-weight: 500;
  	line-height: 1.5em;
}
h3 strong {
  font-weight: 800;
}
h4 {
	font-size: 20px;
    font-weight: 300;
    line-height: 1.5;
}
h4 strong {
  	font-weight: 700;
}

p {
	margin-bottom: 20px;
}
.largetext p {
	font-size: 34px;
	line-height: 1.4em;
}
.largetext p strong {
	font-weight: 600;
}
.mediumtext p {
	font-size: 28px;
	line-height: 1.6em;
}
a {
  	color: var(--black);
  	text-decoration: none;
}
a:hover {
 	color: #000000; 
  	text-decoration: none;
}
@media only screen and (max-width: 767px) {
	p { line-height: 1.4em; }
}

@media only screen and (max-width: 767px) and (orientation: portrait) {
	br.shy { display: none; }
}

#content.site-content {
 	padding-bottom: 0 !important; 
 	padding-top: 0 !important; 
}
figcaption {
	text-align: left;
	font-size: 14px;
    padding-top: 5px;
    color: var(--darkmint) !important;
	font-weight: 500 !important;
}
.captionright figcaption {
	text-align: right;
}
.aubergine figcaption {
	color: var(--aubergine) !important;
}

@media (max-width: 1024px) {
	.elementor-inner-section > .elementor-container.elementor-column-gap-default .elementor-widget-wrap { padding: 30px; }
}

/* hide some theme bits ----------------------------------------------------------------------------------------------------------------- */


header.page-header {
	display: none;
}
.entry-header {
 	display: none; 
}
.navbar-toggler {
  display: block;
}
body.elementor-editor-active section.elementor-top-section:nth-of-type(1) {
	margin-top: 100px;
}
button.navbar-toggler {
	display: none !important;
}





/* HEADER ---------------------------------------------------------------------------------------------------------------------------------------- */


#site-header {
	position: fixed;
    top: 0;
    left: 0;
	width: 100%;
    height: 80px;
    z-index: 999;
	background: var(--white);
	transition: all .3s linear;
	padding: 10px;
	box-shadow: 0px 6px 6px rgba(0,0,0,0.15);
}
body.elementor-editor-active #site-header { position: relative; background: #999999; height: auto; }
body.passwordshield-active #site-header { display: none; }

#site-header .header-inner {
	max-width: 100%;
	margin-top: -4px;
}
#site-header .site-branding {
	margin-top: 0;
}
#site-header .site-branding h1 {
	font-size: 0;
	line-height: 0;
}
#site-header .site-branding a {
	font-size: 0;
	line-height: 0;
}
#site-header .site-branding img {
	max-width: 140px;
	margin-left: 3px;
	margin-top: 2px;
}
#site-header .site-description {
	display: none;
}
#site-header .site-navigation {
	max-width: 90%;
}




/* main nav */

#site-header #menu-main-nav li:nth-last-of-type(1), 
#site-header #menu-main-nav li:nth-last-of-type(2) {
	display: none;
}

#menu-main-nav {
	margin-right: 10px;
	justify-content: flex-end;
}
#menu-main-nav li a {
	font-weight: 300;
    font-size: 36px;
	color: var(--primary);
	padding: 0 20px;
}
#menu-main-nav li a:hover {
	color: var(--darkgrey);
}
@media (max-width: 1400px) {
	#menu-main-nav li a { font-size: 32px; }
}
@media (max-width: 1200px) {
	#menu-main-nav li a { font-size: 28px; }
}





@media (min-width: 1025px) {
	#site-header .site-navigation-toggle-holder { display: none !important; }
	#site-header .site-navigation { display: flex !important; }
}
@media (min-width: 1px) and (max-width: 1024px) {
	#site-header .site-navigation-toggle-holder { display: block !important; }
	#site-header .site-navigation { display: none !important; }
}
@media (min-width: 1px) and (max-width: 1024px) {
	#site-header .site-navigation-toggle-holder {
		max-width: 80px;
		padding: 10px;
		margin-top: 0;
		z-index: 999;
	}
	#site-header .site-navigation-toggle-holder .site-navigation-toggle {
		background-color: rgba(0,0,0,0);
		height: 50px;
	}
	#site-header .site-navigation-toggle i,
	#site-header .site-navigation-toggle i::before, 
	#site-header .site-navigation-toggle i::after { 
		content: '';
		background: var(--primary);
		position: absolute;
		display: inline-block;
		width: 50px;
		height: 4px;
		border-radius: 2px;
		left: 0;
		transform: none;
		transition: all .2s ease-in-out;
	}
	#site-header .site-navigation-toggle i { 
		color: rgba(0,0,0,0);
		position: relative;
	}
	#site-header .site-navigation-toggle i::before { top: -10px; }
	#site-header .site-navigation-toggle i::after { top: 10px; }

	#site-header .site-navigation-toggle:hover i::before { top: -15px; }
	#site-header .site-navigation-toggle:hover i::after { top: 15px; }

	#site-header .elementor-active .site-navigation-toggle i { width: 0; }
	#site-header .elementor-active .site-navigation-toggle i::before { transform: rotate(135deg); top: 0; left: -20px; }
	#site-header .elementor-active .site-navigation-toggle i::after { transform: rotate(-135deg); top: 0; left: -20px; }

	#site-header #menu-main-nav {
		border-top: var(--black) 4px solid;
	}
	#site-header #menu-main-nav a {
		background: var(--white);
		color: var(--black);
		border-bottom: var(--black) 4px solid;
		text-align: center;
		font-size: 48px;
		padding: unset;
		padding-left: 20px;
		padding-right: 20px;
	}
	#site-header #menu-main-nav a:hover {
		color: var(--highlight);
	}
	#site-header #menu-main-nav li.current-menu-item a {
		background: #eeeeee;
	}
	#site-header #menu-main-nav li.current-menu-item a:hover {
		filter: none;
	}

	/* override theme settings */
	.site-navigation-toggle-holder.elementor-active+.site-navigation-dropdown,
	.site-navigation-toggle-holder:not(.elementor-active)+.site-navigation-dropdown {
		transform: none;
		max-height: 5000px;
		transition: bottom .5s ease-in-out;
		z-index: -1; 
	}
	.site-navigation-toggle-holder.elementor-active+.site-navigation-dropdown a,
	.site-navigation-toggle-holder:not(.elementor-active)+.site-navigation-dropdown a {
		transition: padding-top .8s linear, padding-bottom .8s linear;
	}

	.site-navigation-toggle-holder.elementor-active+.site-navigation-dropdown {	bottom: 0; } /* adjust according to number of links and their padding! */
	.site-navigation-toggle-holder:not(.elementor-active)+.site-navigation-dropdown { bottom: 3500px; }

	.site-navigation-toggle-holder.elementor-active+.site-navigation-dropdown a { padding-top: 0.5vh !important; padding-bottom: 0.5vh !important; }
	.site-navigation-toggle-holder:not(.elementor-active)+.site-navigation-dropdown a { padding-top: 90px !important; padding-bottom: 90px !important;}
}








/* contact tab */


body.startseite #contacttab { 
	top: 35px;
}
body:not(.startseite) #contacttab { 
	top: 2px;
}

#contacttab {
	position: fixed;
    right: 20px;
    width: 80px;
    height: 50px;
    z-index: 9999;
  	transition: all .4s linear;
  	transition-timing-function: cubic-bezier(0,.29,.14,1);
}

#contacttab.hovering {
	top: 75px !important;
}
#contacttab.up {
	top: 55px !important;
}
#contacttab.down {
	top: 155px !important;
}
#contacttab.pushup {
	top: 35px !important;
}
#contacttab.mini.pushup {
	top: 2px !important;
}

@media (max-width: 1024px) {
	#contacttab, #contacttab.hovering, #contacttab.up, #contacttab.down, #contacttab.pushup, #contacttab.mini.pushup { top: 2px !important; }
}


#contacttab .elementor-container, #contacttab .elementor-widget-html {
	height: 100%;
}

#contacttab .background {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
#contacttab .background svg circle:nth-of-type(1) {
	fill: var(--mattes);
	transition: all .1s ease-in-out;
}
body.mattes #contacttab.hovering .background svg circle:nth-of-type(1) {
	fill: #ff8f33;
}
#contacttab .background svg circle:nth-of-type(2) {
	fill: var(--duexx);
	transition: all .1s ease-in-out;
}
body.duexx #contacttab.hovering .background svg circle:nth-of-type(2) {
	fill: #22afff;
}


#contacttab a:hover .background svg circle {
	fill: white;
}
#contacttab .background svg path {
	fill: var(--white);
}
#contacttab .phone svg path, #contacttab .mail svg polygon {
	fill: var(--darkblue);
}

#contacttab .phone, #contacttab .mail, #contacttab .ampersand {
    position: absolute;
}
#contacttab .phone {
	width: 26px;
    height: 26px;
    left: 10%;
    top: 50%;
    transform: translateY(-50%);
}
#contacttab .mail {
	width: 24px;
    height: 24px;
    right: 10%;
    top: 50%;
    transform: translateY(-50%);
}
#contacttab .ampersand {
	width: 14px;
    height: auto;
    left: calc(50% - 7px);
    top: 50%;
    transform: translateY(-50%);
}
#contacttab .ampersand svg path {
	fill: var(--darkblue);
}


  
/* containers --------------------------------------------------------------------------------------------------------------------- */

div[data-elementor-type="wp-page"] {
  	width: 100%;
	padding-top: 80px;
}
body.passwordshield-active {
	background: var(--primary) !important;
}
body.impressum, body.datenschutz {
	background: var(--corporate);
}
#content > .container {
  max-width: 100%;
}
body.elementor-editor-active .elementor-top-section {
  margin-top: 50px;
}
body.elementor-editor-active .elementor-inner-section {
  margin-top: 50px;
}

div[data-elementor-type="wp-page"] section.elementor-top-section:nth-of-type(1) {
	padding-top: 0;
}


.fullheight { height: 100vh; }
/*
.fullheight > .e-con { height: 100%; }
.fullheight > .e-con > .elementor-column { height: 100%; }
.fullheight > .e-con > .elementor-column > .elementor-widget-wrap { height: 100%; }
*/


.elementor-widget-text-editor img {
  margin-bottom: 10px;
}
.elementor-inner-section > .elementor-container.elementor-column-gap-default {
	padding: 0;
}
.elementor-inner-section > .elementor-container.elementor-column-gap-default .elementor-widget-wrap {
	padding: 20px;
}

.elementor-editor-active .e-con { padding: 10px; border: blue 2px solid; }




/* lightbox popup ------------------------ */
.elementor-lightbox .dialog-lightbox-close-button {
	/*
 	right: calc(50% - 15px); 
	*/
}
.elementor-lightbox i.eicon-share-arrow {
	display: none;
}
.elementor-lightbox i.eicon-zoom-in-bold {
	display: none;
}
.elementor-lightbox i.eicon-close {
	background: var(--coral);
    width: 60px;
    height: 60px;
    border-radius: 100%;
}
.elementor-lightbox i.eicon-close::before {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.elementor-lightbox .elementor-slideshow__header {
	display: none;
}
.elementor-lightbox .elementor-slideshow__title {
	display: none;
}

.buttuptonext .elementor-widget-wrap {
	padding-bottom: 0 !important;
}
.buttuptonext h2 {
	margin: 0 !important;
}


.arrowattop {
	position: absolute;
	top: -1px;
	left: 0;
	width: 100%;
	height: 2vw;
	clip-path: polygon(100% 0, 100% 0%, 52% 0%, 50% 100%, 48% 0%, 0 0, 0 0);
	background-position: bottom center;
	background-size: cover;
	z-index: 1;
}

.gotopage a {
	padding: 5px 20px 10px 20px;
    border: var(--primary) 2px solid;
    font-size: 34px;
    color: var(--primary);
	transition: all .1s ease-in-out;
}
@media (max-width: 576px) {
	.gotopage a { font-size: 30px; }
}
.gotopage a em {
	font-style: normal;
    color: var(--white);
}
.gotopage.onblack a { border-color: var(--primary); color: var(--primary); }
.gotopage.onblack a em { color: var(--white); }

.gotopage.ongreen a { border-color: var(--black); color: var(--black); }
.gotopage.ongreen a em { color: var(--white); }

.gotopage.onwhite a { border-color: var(--primary); color: var(--primary); }
.gotopage.onwhite a em { color: var(--black); }

.gotopage.whitebg a { border-color: var(--primary); color: var(--primary); background-color: var(--white); }
.gotopage.whitebg a em { color: var(--black); }

.gotopage.yellow a { border-color: var(--yellow); color: var(--yellow); }
.gotopage.yellow a em { color: var(--yellow); }

.gotopage.white a { border-color: var(--white); color: var(--white); }
.gotopage.white a em { color: var(--white); }

.gotopage.primary a { border-color: var(--primary); color: var(--primary); background-color: var(--white); }
.gotopage.primary a em { color: var(--black); }
.gotopage.primary a:hover { color: var(--white); background-color: var(--primary); }
.gotopage.primary a:hover em { color: var(--black); }

.gotopage.primary.onblack a { border-color: var(--primary); color: var(--primary); background-color: rgba(0,0,0,0); }
.gotopage.primary.onblack a em { color: var(--white); }
.gotopage.primary.onblack a:hover { color: var(--white); background-color: var(--primary); }
.gotopage.primary.onblack a:hover em { color: var(--white); }

.gotopage.whiteongreen a { border-color: var(--white); color: var(--white); background-color: var(--primary); }
.gotopage.whiteongreen a em { color: var(--black); }
.gotopage.whiteongreen a:hover { color: var(--primary); background-color: var(--white); }
.gotopage.whiteongreen a:hover em { color: var(--black); }

.gotopage.yellowongreen a { border-color: var(--yellow); color: var(--yellow); background-color: var(--primary); }
.gotopage.yellowongreen a em { color: var(--black); }
.gotopage.yellowongreen a:hover { color: var(--primary); background-color: var(--yellow); }
.gotopage.yellowongreen a:hover em { color: var(--black); }






/* START ---------------------------------------------------------------------------------------------- */

body.home #start {
	background-color: var(--primary);
    height: calc(100vh - 80px);
}

body.home #start .startmap {
	width: 100vh;
	height: 100vh;
	position: fixed;
	top: calc(80px - 5vh);
	left: -4vh;
}
body.home #start .backgroundtint {
	display: none;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 40%;
	background: linear-gradient(0, var(--primary) 20%, rgba(0,0,0,0) 100%);
	opacity: 1;
	/*
	mix-blend-mode: multiply;
	*/
}
body.elementor-editor-active.home #start .backgroundtint { display: block; position: relative; height: 200px; }

body.home #start .startlogo {
	margin: 40px;
	width: 20vw;
	max-width: 400px;
	filter: saturate(0) brightness(2);
}
body.home #start .startheading {
	width: auto;
    position: absolute;
    top: 70%;
	right: 35px;
	transform: translateY(-50%);
}
body.home #start .startheadingmobil {
	display: none;
	position: absolute;
	top: 70%;
	left: 15px;
}
body.home #start .startheadingmobil h2 {
	font-size: 14.8vw;
    line-height: 0.95em;
    letter-spacing: -0.02em;
	font-weight: 700;
}
body.home #start .startheadingmobil h2 em {
	font-style: normal;
	color: var(--black);
}
body.home.elementor-editor-active #start .startheadingmobil { display: block; top: 40%; z-index: 99; }
body.home.elementor-editor-active #start .startheadingmobil h2 { font-size: 50px; }


body.home #start .startheading .elementor-widget-text-editor:nth-of-type(2) {
	padding-left: 1vw;
}
body.home #start .startheading h1 {
	font-weight: 600;
	font-size: 6.5vw;
	line-height: 0.9em;
	color: var(--white);
	letter-spacing: -0.02em;
	margin: 0;
}
@media (max-width: 2000px) {
	body.home #start .startmap { top: calc(80px - 5vh); left: -12vh; }
}

@media (max-aspect-ratio: 1/1) {
	body.home #start { height: calc(100vh - 80px); }	
	body.home #start .startmap { width: 130vw; height: 130vw; top: calc(80px - 10%); left: 50%; transform: translateX(-50%); }	
	body.home #start .startheading { width: 95%; bottom: 100px; right: unset; transform: none; }
	body.home #start .startheading h1 { font-size: 11vw; }
}
@media (max-aspect-ratio: 1/1) and (max-width: 1024px) {
	body.home #start .startmap { top: calc(80px - 15vw); left: 50%; }
	body.home #start .backgroundtint { display: block; }
}
@media (max-aspect-ratio: 1/1) and (max-width: 768px) {
	body.home #start .startheading { display: none; }
	body.home #start .startheadingmobil { display: block; }
	body.home #start .startmap { top: calc(80px - 15vw); left: 50%; }
	body.home #start .backgroundtint { display: block; }
}
@media (max-aspect-ratio: 3/5) {
	body.home #start { height: 170vw; }	
	body.home #start .startmap { width: 170vw; height: 170vw; top: calc(80px - 4%); }	
	body.home #start .startheading { width: 95%; bottom: unset; top: 120vw; right: unset; transform: none; }
	body.home #start .startheading h1 { font-size: 11vw; }
}




/* INTRO ---------------------------------------------------------------------------------- */

#intro {
}
#intro .iconbox {
	width: 100%;
}
#intro .elementor-widget-image {
	margin-right: 1vw;
}

#green-bubble {
    margin: auto;
    background-color: #00bf00;
    width: 550px;
    height: 550px;
    border-radius: 100%;
}

#green-bubble .largetext {
    margin: auto;
    width: 60%;
    font-weight: 600;
}
#green-bubble .largetext p {
    line-height: 1.3em;
}

#green-bubble p {
    font-weight: 600;
}
@media (max-width: 600px) {
	#gree-bubble { width: 90vw; height: 90vw; }
}
@media (max-width: 600px) {
	#green-bubble { width: 90vw; height: 90vw; }
}
@media (max-width: 576px) {
	#green-bubble .largetext { width: 70%; }
	#green-bubble p { font-size: 6.5vw; }
}

.bullets {
	
}
.bullets p {
    margin-left: 0px; 
    padding-left: 35px;
	margin-bottom: 10px;
}
.bullets p::before {
    content: "";
    position: absolute;
    left: 0px;
    margin-top: 9px;
    width: 0; 
    height: 0; 
    border-top: 20px solid transparent; 
    border-bottom: 20px solid transparent; 
    border-left: 20px solid #00bf00;
}



/* AERIAL ---------------------------------------------------------------------------------- */

#aerial {
}

.viewportindicator { display: block; opacity: 0 !important; width: 200px; height: 30px; background: var(--blue); position: absolute; top: 40%; left: 50%; transform: translate(-50%, -50%); }
.viewportindicator p { text-align: center; }

body.elementor-editor-active #aerial { margin-bottom: 80px; }
body.elementor-editor-active .viewportindicator { opacity: 1 !important; z-index: 99; position: relative; left: 0; top: 0; transform: none; width: 400px; height: 100px; padding-top: 30px; }
body.elementor-editor-active .viewportindicator p { font-size: 24px; }
body.elementor-editor-active .textbubble.waiting { opacity: 1 !important; width: 150px !important; height: 150px !important; }
body.elementor-editor-active .textbubble.waiting p { opacity: 1 !important; }




.bubblebox {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}


.textbubble.bt0 { top: 39%; left: 15%; }
.textbubble.bt1 { top: 48%; left: 64%; }
.textbubble.bt2 { top: 34%; left: 59%; }
.textbubble.bt3 { top: 50%; left: 42%; }
.textbubble.bt4 { top: 29%; left: 30%; }
.textbubble.bt5 { top: 36%; left: 85%; }
.textbubble.bt6 { top: 24%; left: 92%; }
.textbubble.bt7 { top: 74%; left: 88%; }
.textbubble.bt8 { top: 90%; left: 60%; }
.textbubble.bt9 { top: 90%; left: 25%; }
.textbubble.bt10 { top: 45%; left: 3%; }
.textbubble.bt11 { top: 80%; left: 72%; }

.textbubble.waiting, .textbubble.big.waiting { width: 0; height: 0; }
.textbubble.waiting p { opacity: 0; }
.textbubble.think.waiting p::before { width: 0; height: 0; }
.textbubble.think.waiting p::after { width: 0; height: 0; }




.textbubble {
	width: 150px;
    height: 150px;
	position: absolute;
    background: var(--primary);
	border-radius: 100%;
    transform: translate(-50%, -50%);
	transition: all .3s ease-in-out;
}
.textbubble.big {
	width: 180px;
	height: 180px;
}
.textbubble p {	
	color: var(--white);
	font-weight: 600;
	font-size: 22px;
	line-height: 1em;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	margin: 0;
	padding: 0;
	opacity: 1;
	transition: all .3s ease-in-out .3s;
}
.textbubble::before, .textbubble::after { 
	content: '';
	display: block;
	background: var(--primary);
	position: absolute;
	transform: translate(-50%, -50%);
	border-radius: 100%;
}
.textbubble::before {
	width: 20%;
	height: 20%;
}
.textbubble::after {
	width: 10%;
	height: 10%;
}

.textbubble.left { transform: translate(0, -50%); }
.textbubble.botleft { transform: translate(0, -100%); }
.textbubble.bottom { transform: translate(-50%, -100%); }
.textbubble.botright { transform: translate(-100%, -100%); }
.textbubble.right { transform: translate(-100%, -50%); }

.textbubble.left::before { left: -13%; top: 50%; }
.textbubble.botleft::before { left: 5%; top: 95%; }
.textbubble.bottom::before { left: 50%; top: 113%; }
.textbubble.botright::before { left: 95%; top: 95%; }
.textbubble.right::before { left: 113%; top: 50%; }

.textbubble.left::after { left: -31%; top: 50%; }
.textbubble.botleft::after { left: -8%; top: 108%; }
.textbubble.bottom::after { left: 50%; top: 131%; }
.textbubble.botright::after { left: 108%; top: 108%; }
.textbubble.right::after { left: 131%; top: 50%; }


.testcontainer {
	width: 400px;
	height: 50px;
	position: absolute;
	top: 0;
	left: 0;
	background: rgba(0,0,0,0.4);
}

@media (max-width: 1600px) {
	.textbubble { width: 130px; height: 130px; }	
	.textbubble.big { width: 160px; height: 160px; }
	.textbubble p { font-size: 20px; }
}
@media (max-width: 1400px) {
	.textbubble { width: 115px; height: 115px; }	
	.textbubble.big { width: 140px; height: 140px; }
	.textbubble p { font-size: 18px; }
}
@media (max-width: 1200px) {
	.textbubble { width: 110px; height: 110px; }	
	.textbubble.big { width: 130px; height: 130px; }
	.textbubble p { font-size: 17px; }
}
@media (max-width: 992px) {
	.textbubble, .textbubble.big { width: auto; height: auto; border-radius: 0; }
	.textbubble .elementor-widget-container { transform: scale(0.8); }
	.textbubble::before, .textbubble::after { display: none; }
	.textbubble p { font-size: 20px; background: var(--primary); padding: 10px; }
	
	.textbubble.bt0 { top: 39%; left: 15%; }
	.textbubble.bt1 { top: 52%; left: 52%; }
	.textbubble.bt2 { top: 28%; left: 62%; }
	.textbubble.bt3 { top: 63%; left: 37%; }
	.textbubble.bt4 { top: 20%; left: 32%; }
	.textbubble.bt5 { top: 24%; left: 85%; }
	.textbubble.bt6 { top: 0; left: 89%; }
	.textbubble.bt7 { top: 62%; left: 89%; }
	.textbubble.bt8 { top: 89%; left: 55%; }
	.textbubble.bt9 { top: 75%; left: 20%; }
	.textbubble.bt10 { top: 40%; left: 10%; }
	.textbubble.bt11 { top: 85%; left: 78%; }
}

@media (max-width: 576px) {
	.textbubble { display: none !important; }
}




/* KEYFACTS ------------------------------------------------------------------------------------------------------ */

#keyfacts {
	overflow: hidden;
	margin-top: -2vw;
}
#keyfacts .keyfactsinner {
	background-color: var(--nearblack);
}
#keyfacts .inversearrow.attop {
	position: relative;
	margin-bottom: -1px;
}
#keyfacts .graphcontent {
	height: 1150px;
	transform-origin: 50% 0;
}
@media (max-width: 1400px) {
	#keyfacts .graphcontent { left: 20px; }
}
@media (max-width: 1300px) {
	#keyfacts .graphcontent { transform: scale(0.9); left: 20px; }
}
@media (max-width: 1200px) {
	#keyfacts .graphcontent { transform: scale(0.88); left: 10px; }
}
@media (max-width: 1024px) {
	#keyfacts .graphcontent { transform: none; left: 0; overflow: hidden; }
}
@media (max-width: 767px) {
	#keyfacts .keyfactsinner { overflow: hidden; }
	#keyfacts .graphcontent { overflow: visible; }
	#keyfacts .textcontent { padding-top: 20px !important; }
}
@media (max-width: 600px) { #keyfacts .graphcontent { transform: scale(0.89); margin-bottom: -100px; } }
@media (max-width: 500px) { #keyfacts .graphcontent { transform: scale(0.7); margin-bottom: -300px; } }
@media (max-width: 400px) { #keyfacts .graphcontent { transform: scale(0.6); margin-bottom: -400px; } }





#keyfacts .linegraph {
	height: 100%;
	position: relative;
	overflow: visible;
}
#keyfacts .linegraph svg {
	fill: none;
	stroke: #00BF00;
	stroke-width: 2;
	height: 2000px;
	position: absolute;
	top: -500px;
	left: 50%;
	transform: translateX(-50%);
}

#keyfacts .graphtext {
	position: absolute;
	width: 250px;
	max-width: 250px;
	height: 200px;
	display: flex;
	justify-content: flex-end;
}
#keyfacts .graphtext .e-con-inner {
	gap: 0;
}
#keyfacts .graphtext.gtleft {
	padding-right: 30px;
	right: 50%;
	align-items: flex-end;
	margin-right: 0;
	transition: margin-right .4s ease-in-out .2s;
}
#keyfacts .graphtext.gtleft.elementor-invisible { margin-right: 100px; }

#keyfacts .graphtext.gtright {
	padding-left: 30px;
	left: 50%;
	align-items: flex-start;
	margin-left: 0;
	transition: margin-left .4s ease-in-out .2s;
}
#keyfacts .graphtext.gtright.elementor-invisible { margin-left: 100px; }



#keyfacts .graphtext.gtleft .e-con-inner {
	justify-content: flex-end;
}
#keyfacts .graphtext.gtright .e-con-inner {
	justify-content: flex-start;
}

#keyfacts .graphtext.gtleft::after {
	content: '';
	display: block;
	width: 20px;
	height: 20px;
	border: var(--primary) 2px solid;
	border-radius: 100%;
	background-color: var(--nearblack);
	position: absolute;
	right: 0;
	transform: translate(50%, -50%);
	transition: all .4s ease-in-out .2s;
}
#keyfacts .graphtext.gtleft.elementor-invisible::after { right: -100px; width: 0; height: 0; }

#keyfacts .graphtext.gtright::before {
	content: '';
	display: block;
	width: 20px;
	height: 20px;
	border: var(--primary) 2px solid;
	border-radius: 100%;
	background-color: var(--nearblack);
	position: absolute;
	left: 0;
	transform: translate(-50%, -50%);
	transition: all .4s ease-in-out .2s;
}
#keyfacts .graphtext.gtright.elementor-invisible::before { left: -100px; width: 0; height: 0; }

#keyfacts .graphtext.gtleft::after,
#keyfacts .graphtext.gtright::before {
	top: 68%;
}



#keyfacts .graphtext.gtleft p,
#keyfacts .graphtext.gtleft h3 {
	text-align: right;
	margin: 0;
}
#keyfacts .graphtext.gtright p,
#keyfacts .graphtext.gtright h3 {
	text-align: left;
	margin: 0;
}

#keyfacts .graphtext p {
	color: var(--white);
	font-size: 20px;
	line-height: 1.1em;
}
#keyfacts .graphtext p em {
	font-style: normal;
	font-size: 20px;
	opacity: 0.5;
    display: none;
}
#keyfacts .graphtext h3 {
	color: var(--primary);
	font-size: 50px;
	font-weight: 700;
	line-height: 0.9em;
	margin-bottom: 3px !important;
}
#keyfacts .graphtext h3 em {
	font-style: normal;
	font-weight: 300;
	font-size: 24px;
	line-height: 0.9em;
}
#keyfacts .graphtext span {
	visibility: hidden;
}

#keyfacts .graphtext .elementor-widget-html {
	font-size: 0;
	line-height: 0;
	margin-bottom: 5px;
}

#keyfacts .graphtext .st0,
#keyfacts .graphtext .st1,
#keyfacts .graphtext .st2 {
	fill: none;
	stroke: var(--white);
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}





#keyfacts .graphtext.gt1 { top: 0%; }
#keyfacts .graphtext.gt1::after { top: 77%; }

#keyfacts .graphtext.gt2 { top: 12%; }
#keyfacts .graphtext.gt2::before { top: 77%; }

#keyfacts .graphtext.gt3 { top: 25%; right: calc(50% + 140px); }
#keyfacts .graphtext.gt3::after { top: 70%; }

#keyfacts .graphtext.gt4 { top: 38%; left: calc(50% + 140px); }
#keyfacts .graphtext.gt4::before { top: 68%; }

#keyfacts .graphtext.gt5 { top: 48%; }
#keyfacts .graphtext.gt5::after { top: 77%; }

#keyfacts .graphtext.gt6 { top: 65%; }
#keyfacts .graphtext.gt6::before { top: 56%; }

#keyfacts .graphtext.gt7 { top: 76%; }
#keyfacts .graphtext.gt7::after { top: 70%; }
#keyfacts .graphtext.gt7 svg { transform: scaleX(-1); }





#keyfacts .textcontent {
	padding-top: 100px;
	padding-bottom: 100px;
}
#biszu {
	position: absolute;
    top: -5px;
    left: 52%;
}
#biszu p {
    color: var(--primary) !important;
    font-weight: 600 !important;
    font-size: 28px !important;
}
@media (max-width: 1024px) {
	#biszu { top: 2%; }
}



/* MAP VIEW ------------------------------------------------------------------------------------------------------------- */

#mapview {
}
#mapview::before {
	background: linear-gradient(180deg, rgba(255,255,255,0.6) 0%, rgba(255,255,255,0.6) 100%);
}
#mapview .headingbox {
	padding-bottom: 50px;	
}
#mapview h2 {
	font-size: 180px;
	line-height: 0.8em;
	font-weight: 700;
	color: var(--primary);
	word-spacing: -10px;
	margin: 0;
}
@media (max-width: 1800px) {
	#mapview h2 { font-size: 10vw; }
}
#mapview h2 em {
	font-style: normal;
	color: var(--black);
	margin-left: -0.1em;
}
#mapview .contentbox {
}
#mapview .largetext {
    background-color: var(--nearblack);
    padding: 5px 15px 8px 15px;
}
#mapview .largetext p {
	margin: 0;
	font-size: 28px;
	color: var(--primary);
}
#mapview .largetext p span.white {
    color: white;
}
#mapview .largetext p strong {
	background: var(--nearblack);
	font-weight: normal;
    padding: 5px 15px 8px 15px;
}
#mapview .largetext p strong em {
	color: var(--white);
	font-style: normal;
}
#mapview .gotopage a {
	margin-top: 20px;
	padding-top: 265px;
    display: block;
    background-image: url(https://nmk.hhvision.de/wp-content/uploads/Aerial_nmk_white.webp);
    background-size: contain;
    background-repeat: no-repeat;
	position: relative;
}
#mapview .gotopage a strong {
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 80%;
	background-image: url(https://nmk.hhvision.de/wp-content/uploads/Icon_HandCursor_white.png);
	background-position: center;
	background-size: 60px;
	background-repeat: no-repeat;
	font-size: 0;
	color: rgba(0,0,0,0);
}



/* BANNER ------------------------------------------------------------------------------------------------------------- */

#banner {
	background-color: var(--primary);
	margin-top: -1px;
}

.gotopage.yellow.ongreen a:hover {
    border-color: white;
    color: white;
}




/* AKTUELLES ------------------------------------------------------------------------------------------------------------ */

#aktuelles {
	background-color: #eeeeee;
}
body.aktuelles #aktuelles {
	padding-top: 70px;
}
#aktuelles .postcontainer article {
	background: #ffffff;
	padding: 10px 10px 50px 10px;
	position: relative;
	top: 0;
	opacity: 1;
	transition: all .3s ease-in-out;
}
#aktuelles .postcontainer .elementor-post__card {
	overflow: visible;	
}
#aktuelles .postcontainer article .elementor-post__thumbnail__link {
	order: 1;
}
#aktuelles .postcontainer article .elementor-post__thumbnail__link::after {
	display: none;
}
#aktuelles .postcontainer article .elementor-post__meta-data {
	padding: 0px 10px;
    margin-bottom: 0;
    border-top: none;
    display: flex;
    order: 2;
	font-size: 30px;
	color: var(--primary);
}
#aktuelles .postcontainer article .elementor-post__text {
	order: 3;
	padding: 0px 10px;
	margin-top: 15px;
}
#aktuelles .postcontainer article h3 a {
	font-size: 26px;
	font-weight: 400;
	color: var(--black);
	line-height: 1.1em;
}
#aktuelles .elementor-post__read-more-wrapper {
	position: absolute;
    right: 0;
    top: 100%;
    width: auto;
    height: 30px;
	margin-top: -5px;
}
#aktuelles .elementor-post__read-more {
	border: var(--primary) 2px solid;
    padding: 1px 12px 5px 12px;
    text-transform: none;
    color: var(--primary);
    font-size: 24px;
    font-weight: normal;
	transition: all .1s ease-in-out;
}
#aktuelles .elementor-post__read-more:hover {
	background: var(--primary);
    color: var(--white);
}

/* on homepage */
body.home #aktuelles .postcontainer.elementor-invisible {
	opacity: 1 !important;
}
body.home #aktuelles .postcontainer.elementor-invisible article {
	top: 100px;
	opacity: 0;
}
body.home #aktuelles .postcontainer article:nth-of-type(1) { transition-delay: .1s; }
body.home #aktuelles .postcontainer article:nth-of-type(2) { transition-delay: .2s; }
body.home #aktuelles .postcontainer article:nth-of-type(3) { transition-delay: .3s; }
body.home #aktuelles .postcontainer article:nth-of-type(4) { transition-delay: .4s; }
body.home #aktuelles .postcontainer article:nth-of-type(5) { transition-delay: .5s; }
body.home #aktuelles .postcontainer article:nth-of-type(6) { transition-delay: .6s; }



/* single posts */

#singlepost {
	background: var(--white);
	padding-top: 280px;
	padding-bottom: 150px;
}
#singlepost .allenews {
	margin-top: 3px; 
	position: absolute;
	left: -50px;
	transform: translateX(-100%);
}
@media (max-width: 1920px) {
	#singlepost .allenews { position: relative; left: 0; transform: none; }
}
#singlepost .allenews a {
	color: var(--primary);
    padding: 2px 8px 4px 24px;
    font-size: 20px;
    border: var(--primary) 1px solid;
	white-space: nowrap;
}
#singlepost .allenews a::before {
	display: block;
	content: '';
	position: absolute;
	left: 10px;
	top: 14px;
	background: var(--primary);
	height: 2px;
	width: 12px;
}
#singlepost .allenews a::after {
	display: block;
	content: '';
	position: absolute;
	left: 10px;
	top: 11px; 
	width: 8px;
	height: 8px;
	border-top: var(--primary) 2px solid;
	border-left: var(--primary) 2px solid;
	transform: rotate(-45deg);
}
#singlepost .allenews a:hover {
	background: var(--primary);
	color: var(--white);
}
#singlepost .allenews a:hover::before {
	background: var(--white);
}
#singlepost .allenews a:hover::after {
	border-top-color: var(--white);
	border-left-color: var(--white);
}
#singlepost .featuredimage {
	max-width: 600px;
}
#singlepost h1 {
	color: var(--primary);
	font-size: 60px;
	margin-top: 30px;
	margin-bottom: 30px;
}
#singlepost .articledate a span {
	font-size: 30px;
	color: var(--primary);
}
#singlepost .rule span {
	max-width: 600px;
	border-color: var(--primary);
}
#singlepost .elementor-widget-theme-post-content {
	margin-top: 20px;
	margin-bottom: 20px;
}
#singlepost .elementor-widget-theme-post-content a {
	color: var(--primary);
}
#singlepost .elementor-widget-theme-post-content a:hover {
	text-decoration: underline;
}
#singlepost .elementor-post-navigation {
	margin-top: 20px;
	border-top: #dddddd 1px solid;
	padding-top: 12px;
}
#singlepost .elementor-post-navigation span {
	color: var(--primary);
	font-family: 'Outfit', sans-serif;
}
#singlepost .post-navigation__arrow-wrapper {
	position: absolute;
	top: 33px;
}
#singlepost .post-navigation__arrow-wrapper i {
	font-size: 26px;
}

#singlepost .post-navigation__prev--label,
#singlepost .post-navigation__next--label {
	font-size: 20px;
	margin: 0 22px;
}
#singlepost .post-navigation__prev--title,
#singlepost .post-navigation__next--title {
	font-size: 16px;
}


#singlepost .elementor-post-navigation__separator {
	display: none;
}


/* FOOTERBILD ---------------------------------------------------------------------------------------------------- */

@media (max-aspect-ratio: 1/1) {
	.footertrenner { height: 80vw; }
}



/* SEITE: DIE VISION ----------------------------------------------------------------------------------------------- */



body.die-vision #anflug .headingbox {
	position: absolute;
	padding: 50px 20px 0 20px;
}
body.die-vision #anflug .headingbox h1 {
	color: var(--primary);
	word-spacing: -10px;
	margin: 0;
}
body.die-vision #anflug .headingbox h1 em {
	font-style: normal;
	color: var(--white);
}

body.elementor-editor-active #anflug .headingbox { position: relative; }


/* unsere vision --------------- */

#unserevision {
	background: rgba(0,0,0,0.8);
}
#unserevision .tripleheading h2 {
	font-size: 60px;
	margin-bottom: 0;
}


/* denken wir neu ---------------- */

#denkenwirneu {
	background: var(--white);
}



/* top ten (illus) --------------- */


body.elementor-editor-active #topten { flex-direction: row; flex-wrap: wrap; padding-bottom: 400px; }
body.elementor-editor-active #topten .thread svg { stroke-dashoffset: 0; }
body.elementor-editor-active #topten .toptenbox { opacity: 1; position: relative; left: 0 !important; top: 0 !important; width: 400px !important; min-height: 600px !important; max-width: 400px !important; }
body.elementor-editor-active #topten .toptenbox { transform: none; cursor: initial; float: left !important; flex-basis: 25%; flex-grow: 1; flex-shrink: 0; }
body.elementor-editor-active #topten .toptenbox .elementor-widget-html { height: auto; min-height: 300px; }
body.elementor-editor-active #topten .toptenbox .elementor-widget-text-editor { position: relative !important; left: 0 !important; top: 0 !important; margin: 0 !important; }
body.elementor-editor-active #topten .toptenbox p { opacity: 1; top: 0 !important; left: 0 !important; }


#topten {
	opacity: 1 !important;
	padding-top: 50px;
}
#topten.elementor-invisible {
	opacity: 1 !important;
}
#topten .thread {
	line-height: 0;
}
#topten .thread svg {
	stroke-dasharray: 11000;
	stroke-dashoffset: 11000;
	transition: stroke-dashoffset 3s linear;
}
#topten .thread.draw svg {
	stroke-dashoffset: 0;
}
#topten .thread svg path {
	stroke: var(--primary);
    stroke-width: 3px;
    opacity: 1;
    fill: none;
}
#topten .toptenbox {
	position: absolute;
	width: auto;
	transform: translate(-50%, -50%);
	transform-origin: center;
	cursor: pointer;
	opacity: 0;
	transition: all .2s ease-in-out;
}

#topten .toptenbox.display {
	opacity: 1;
}
.tt1 { top: 6vw; left: 18%; z-index: 20; }
.tt2 { top: 16vw; left: 40%; z-index: 19; }
.tt3 { top: 11vw; left: 55%; z-index: 18; }
.tt4 { top: 6vw; left: 76%; z-index: 17; }
.tt5 { top: 20vw; left: 90%; z-index: 16; }
#topten .toptenbox.tt5 p { left: -100%; }
.tt6 { top: 28vw; left: 65%; z-index: 15; }
.tt7 { top: 35vw; left: 45%; z-index: 14; }
.tt8 { top: 27vw; left: 15%; z-index: 13; }
.tt9 { top: 48vw; left: 25%; z-index: 12; }
.tt10 { top: 53vw; left: 54.5%; z-index: 11; }

#topten .toptenbox svg {
	transform: scale(calc(100vw/2560));
	transform-origin: 0 0;
}
#topten .toptenbox svg:nth-of-type(1) {
	z-index: 1;
}
#topten .toptenbox svg:nth-of-type(2) {
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
}
#topten .toptenbox svg:nth-of-type(2) * {
	fill: none;
	stroke: var(--white);
	stroke-width: 30px;
}
#topten .toptenbox svg .cls-1 {
    fill: #caedb2;
	opacity: 1;
}

#topten .toptenbox .elementor-widget-html {
	z-index: 1;
}
#topten .toptenbox .elementor-widget-text-editor {
	position: absolute;	
	top: 100%;
	left: 0;
	max-width: 200px;
}
#topten .toptenbox h2 {
	color: var(--primary);
    font-size: 60px;
    font-weight: 700;
    background: var(--white);
    padding: 8px;
    margin-bottom: 0;
    display: inline-block;
    line-height: 50px;
}
#topten .toptenbox h3 {
	font-size: 24px;
	font-weight: 600;
	line-height: 1.2em;
	padding: 0 8px;
	margin-top: 0;
	background: var(--white);
}
#topten .toptenbox p {
	display: none;
	opacity: 0;
	background: var(--primarypale);
	font-size: 20px;
    line-height: 1.3em;
	width: 400px;
	position: relative;
    left: 0;
    top: 30px;
    margin: 0;
    padding: 15px 20px;
    box-shadow: 10px 10px 10px rgba(0,0,0,0.2);
	transition: opacity .2s ease-in-out, top .2s ease-in-out;
	z-index: 1;
}
#topten .toptenbox:hover p {
	top: -10px;
	opacity: 1;
	z-index: 5;
	display: inline-block;
}

@media (max-width: 1400px) {
	#topten .toptenbox h2 { font-size: 50px; }
	#topten .toptenbox h3 { font-size: 22px; line-height: 1.1em; margin-top: -10px; }
	#topten .toptenbox p { font-size: 19px; line-height: 1.2em; }
}
@media (max-width: 1200px) {
	#topten .toptenbox h2 { font-size: 40px; margin-top: -15px; }
	#topten .toptenbox h3 { font-size: 20px; }
	#topten .toptenbox p { font-size: 18px; width: 320px; }
}
@media (max-width: 1024px) {
	#topten .toptenbox h2 { font-size: 32px; }
	#topten .toptenbox h3 { font-size: 18px; margin-top: -16px; }
	#topten .toptenbox p { font-size: 16px; width: 240px; }
}
@media (max-width: 767px) {
	#topten { flex-direction: row; column-gap: 40px; padding: 0 20px; padding-bottom: 100px; }
	#topten .toptenbox { position: relative; left: 0; top: 0; transform: none; max-width: 100%; width: 100%; cursor: unset; margin-bottom: 50px; }
	#topten .toptenbox .elementor-widget-html { width: auto !important; height: auto !important; }
	#topten .toptenbox .elementor-widget-html .elementor-widget-container { display: flex; align-items: flex-end; }
	#topten .toptenbox .elementor-widget-html svg { transform: none !important; }
	#topten .toptenbox .elementor-widget-text-editor { max-width: unset; position: relative; top: 0; }
	#topten .toptenbox h2 { font-size: 60px; padding: 0; }
	#topten .toptenbox h3 { font-size: 24px; margin-top: unset; padding: 0; }
	#topten .toptenbox p { font-size: unset; width: 100%; display: block; opacity: 1; background: var(--white); box-shadow: none; padding: 0; top: 0; }
	#topten .toptenbox:hover p { top: 0; }
}







/* MAP ------------------------------------------------------------------------------------------------------ */


body.elementor-editor-active #poimap { margin-top: 50px; height: 250vh; background-color: #cccccc; }
body.elementor-editor-active #poimap .popups { height: auto; }
body.elementor-editor-active #poimap .popups .e-con { position: relative; top: 0; left: 0; margin-top: 20px; width: 50vw; max-width: 50vw; min-width: 400px; }
body.elementor-editor-active #poimap .popups .e-con::before { }
body.elementor-editor-active #poimap .popups .e-con .e-con-inner { opacity: 1; margin-top: 0; padding-left: 50px; width: 100%; max-width: 100%; min-width: 100%; transform: none; height: auto; }
body.elementor-editor-active #poimap .popups .elementor-widget-image { max-width: 340px; }


#poimap {
	margin-top: -3vw;
}
#poimap .elementor-shape-top {
	margin-top: -1px;
}
#poimap .elementor-shape-top::before {
	content: '';
	display: block;
	width: 0;
	height: 0;
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
    border: transparent 15px solid;
    border-top: var(--primary) 15px solid;
    z-index: 1;
}
#poimap .popups {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
#poimap .popups .e-con {
	position: absolute;
	cursor: pointer;
	z-index: 1;
	width: 0;
}
#poimap .popups .e-con::before {
	content: '';
	display: block;
	background: url('../Icon_Mapmarker_black.png');
	background-repeat: no-repeat;
	position: absolute;
	top: -90px;
	left: -30px;
	width: 60px;
	height: 90px;
	background-size: 60px;
	filter: saturate(1) brightness(1);
	transition: all .2s ease-in-out;
}
#poimap .popups .e-con:hover {
	z-index: 5;	
}
#poimap .popups .e-con:hover::before {
	filter: saturate(0) brightness(2);
}
#poimap .popups .e-con .e-con-inner {
	background: var(--white);	
	padding: 0;
	overflow: hidden;
	opacity: 0;
	margin-top: 50px;
	width: 0;
	height: 0;
	transition: opacity 0 ease-in-out, margin-top 0 ease-out;
	box-shadow: 10px 10px 10px rgba(0,0,0,0.3);
	transform: translateX(-50%);
	min-width: 340px;
	max-width: 340px;
}
#poimap .popups .e-con:hover .e-con-inner {
	opacity: 1;
	margin-top: 0;
	padding: 10px 20px;
	width: auto;
	height: auto;
	transition: opacity .2s ease-in-out, margin-top .2s ease-out;
}
#poimap .popups h4 {
	color: var(--primary);
    font-weight: 600;
    font-size: 22px;
    margin-bottom: 10px;
	line-height: 1.2em;
}
#poimap .popups p {
	color: var(--darkgrey);
	line-height: 1.2em;
}
#poimap .popups .elementor-widget-image {
	margin-top: -20px;
	margin-bottom: 10px;
}

#poimap .popups .e-con:nth-of-type(1) { left: 29%; top: 24%; }
#poimap .popups .e-con:nth-of-type(2) { left: 34%; top: 29%; }
#poimap .popups .e-con:nth-of-type(3) { left: 38%; top: 34%; }
#poimap .popups .e-con:nth-of-type(4) { left: 44%; top: 35%; }
#poimap .popups .e-con:nth-of-type(5) { left: 51%; top: 36%; }
#poimap .popups .e-con:nth-of-type(6) { left: 59%; top: 35%; }
#poimap .popups .e-con:nth-of-type(7) { left: 83%; top: 28%; }



@media (max-aspect-ratio: 1/1) and (max-width: 992px) {
	#poimap { height: 100vw; overflow: hidden; }
	#poimap > .elementor-widget-image img { width: 100%; height: 100%; }
	#poimap > .elementor-widget-image,
	#poimap .popups { position: absolute; top: 0; left: 0; width: 160%; max-width: 160%; height: 100%; transform: translateX(-25%); }
	#poimap .popups .e-con .e-con-inner { width: 600px !important; max-width: 90vw !important; display: flex; flex-direction: row-reverse; padding: 0 !important; }
	#poimap .popups .e-con:hover .e-con-inner { padding: 25px 20px 10px 20px !important; }
	#poimap .popups .e-con .e-con-inner .elementor-widget-image { width: calc(30% - 10px); margin-right: 0; padding-top: 15px; }
	#poimap .popups .e-con .e-con-inner .elementor-widget-text-editor { width: calc(70% - 10px); }
	#poimap .popups .e-con h4 { margin-top: -12px; }
}




/* PHASEN -------------------------------------------------------------------------------------------------------- */

#phasen {
	background: var(--nearblack);
}
#phasen h3 em {
	display: block;
	width: 95%;
	font-style: normal;
	border-bottom: var(--white) 1px solid;
	margin-bottom: 35px;
}
#phasen ul {
	padding-top: 5px;
}

#phasen .playlink {
	margin-top: 160px;
}
#phasen .playlink p {
	margin-bottom: -20px;
}
#phasen .playlink a {
	font-size: 0;
	line-height: 0;
	display: inline-block;
	text-indent: -9999px;
	width: 70px;
	height: 70px;
	border: var(--primary) 2px solid;
	border-radius: 100%;
	position: relative;
}
#phasen .playlink a::before {
	content: '';
    display: block;
    position: absolute;
    left: 50%;
    top: 56%;
    width: 0;
    height: 0;
    border-top: 20px solid transparent;
    border-bottom: 20px solid transparent;
    border-left: 34px solid var(--primary);
    transform-origin: center;
    transform: translate(-50%, -50%) rotate(90deg);
}



/* RAIL MAP ----------------------------------------------------------------------------------------------------- */

body.elementor-editor-active #railmap { height: auto !important; z-index: initial; height: auto; }
body.elementor-editor-active #railmap .e-con { display: flex; flex-direction: row; flex-wrap: wrap; }
body.elementor-editor-active #railmap .overlaycontainer { position: relative; left: 0; top: 0; transform: none; width: auto; height: auto; }
body.elementor-editor-active #railmap .strapline { opacity: 1 !important; width: auto; }
body.elementor-editor-active #railmap .strapline p { font-size: 30px; }
body.elementor-editor-active #railmap .mapoverlay { width: 400px; height: 400px; display: inline; position: relative; left: 0; top: 0; border: pink 2px solid; opacity: 1 !important; }
body.elementor-editor-active #railmap .mapoverlay.mo2 .st1 { opacity: 1; fill-opacity: 0.4; }
body.elementor-editor-active #railmap .mapoverlay.mo3 .st1 { opacity: 1; fill-opacity: 0.9; }
body.elementor-editor-active #railmap .mapoverlay.mo6 .st1 { opacity: 1; } 
body.elementor-editor-active #railmap .mapoverlay svg path { stroke-dashoffset: 0 !important; }
body.elementor-editor-active #railmap .lineoverlay { width: 400px; height: 400px; display: inline; opacity: 1; position: relative; left: 0; top: 0; border: cyan 2px solid; }
body.elementor-editor-active #railmap .lineoverlay svg path { opacity: 1; stroke-dashoffset: 0 !important; }
body.elementor-editor-active #railmap .lineoverlay.lo7 .st1 { opacity: 1; }
body.elementor-editor-active #railmap .overlaycontainer .elementor-widget-text-editor { display: inline-block; position: relative; left: 0; top: 0; transform: none; width: 200px; height: 300px; border: red 2px solid; }
body.elementor-editor-active #railmap .overlaycontainer .elementor-widget-text-editor p { position: relative; top: 0; left: 0; transform: none; color: var(--black); opacity: 1; display: block !important; }
body.elementor-editor-active #railmap .legend { position: relative; left: 0; top: 0; border: red 2px solid; }
body.elementor-editor-active #railmap .legend .elementor-widget-text-editor { opacity: 1; position: relative; left: 0; top: 0; border: red 2px solid; }

#railmap {
	background: var(--primary);
	overflow: hidden;
	z-index: -1;
	height: 700vh;
}
#railmap .overlaycontainer {
	width: 100vw;
	height: 100vh;
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%) scale(1.1);
	transform-origin: center;
}
@media (min-aspect-ratio: 1/1) { #railmap .overlaycontainer { width: 100vw; height: 100vw; } }
@media (max-aspect-ratio: 1/1) { #railmap .overlaycontainer { width: 100vh; height: 100vh; } }

#railmap .strapline {
	position: fixed;
    top: 50%;
    left: 150px;
    width: auto;
    text-align: left;
    z-index: 20;
	transform: translateY(-40vh);
	opacity: 0;
	transition: all 1s ease-in-out;
}
#railmap .strapline.display {
	opacity: 0.5;
}
#railmap .strapline p {
	color: var(--yellow);
    font-size: 100px;
    font-weight: 600;
    text-transform: uppercase;
}
#railmap .strapline.sl1 {
	
}
#railmap .strapline.sl2 {
	
}


#railmap .mapoverlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	transition: opacity .5s ease-in-out;
}
#railmap .mapoverlay.display {
	opacity: 1;
}
#railmap .mapoverlay .st0 { opacity: 0; fill: none; } /* artboard */

#railmap .mapoverlay.mo1 .st1 { opacity: 1; fill: none; stroke: var(--blue); stroke-width: 8px; stroke-dasharray: 1700; stroke-dashoffset: 1700; transition: all 2.5s ease-in-out; } /* rhein */
#railmap .mapoverlay.mo1.display .st1 { stroke-dashoffset: 0; } /* rhein */

#railmap .mapoverlay.mo2 .st1 { opacity: 0; fill: var(--black); fill-opacity: 0.07; stroke: var(--primary); stroke-width: 1; stroke-miterlimit: 10; transition: all 2s ease-in-out; } /* bezirksflächen */
#railmap .mapoverlay.mo2.display .st1 { opacity: 1; } /* bezirksflächen */

#railmap .mapoverlay.mo3 .st1 { opacity: 0; fill: var(--black); fill-opacity: 0.3; stroke: none; transition: all 2s ease-in-out; } /* richtungen */
#railmap .mapoverlay.mo3.display .st1 { opacity: 1; } /* richtungen */

#railmap .mapoverlay.mo4 .st1 { opacity: 1; fill: none; stroke: var(--black); stroke-width: 0.7; stroke-miterlimit: 10; stroke-dasharray: 1700; stroke-dashoffset: 1700; transition: all 2s ease-in-out; } /* bahnlinien sub */
#railmap .mapoverlay.mo4.display .st1 { stroke-dashoffset: 0; } /* bahnlinien sub */
#railmap .mapoverlay.mo4 .st2 { opacity: 1; fill: none; stroke: var(--black); stroke-width: 1.8; stroke-miterlimit: 10; stroke-dasharray: 1700; stroke-dashoffset: 1700; transition: all 2s ease-in-out; } /* bahnlinien main */
#railmap .mapoverlay.mo4.display .st2 { stroke-dashoffset: 0; } /* bahnlinien main */
#railmap .mapoverlay.mo4 .st3 { opacity: 1; fill: none; stroke: var(--black); stroke-width: 0.2; stroke-miterlimit: 10; stroke-dasharray: 1700; stroke-dashoffset: 1700; transition: all 2s ease-in-out; } /* bahnlinien sub */
#railmap .mapoverlay.mo4.display .st3 { stroke-dashoffset: 0; } /* bahnlinien sub */

#railmap .mapoverlay.mo5 .st1 { opacity: 0; fill: none; stroke: var(--black); stroke-width: 1.8; stroke-miterlimit: 10; transition: all 2s ease-in-out; } /* bahnhoefe */
#railmap .mapoverlay.mo5.display .st1 { opacity: 1; } /* bahnhoefe */

#railmap .mapoverlay.mo6 .st1 { opacity: 0; transition: all 2s ease-in-out; } /* bezirksnamen-gruppe */
#railmap .mapoverlay.mo6.display .st1 { opacity: 1; } /* bezirksnamen-gruppe */
#railmap .mapoverlay.mo6 .st2 { fill: var(--primary); fill-opacity: 0.7; stroke: none; filter: brightness(1); } /* bezirksnamen */

.mo1 { z-index: 5; } /* outer green */
.mo2 { z-index: 1; } /* green */
.mo3 { z-index: 1; } /* isar */
.mo4 { z-index: 6; } /* minor roads */
.mo5 { z-index: 25; } /* major roads */
.mo6 { z-index: 5; } /* motorways */

#railmap .lineoverlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#railmap .lineoverlay svg path {
	transition: stroke-dashoffset 3s cubic-bezier(0,.66,.33,1);
}
#railmap .lineoverlay .st0 { opacity: 0; fill: none; } /* square 1000x1000 */

#railmap .lineoverlay.lo0 .st1 { opacity: 1; fill: none; stroke: var(--black); stroke-width: 2px; stroke-dasharray: 100; stroke-dashoffset: 100; transition-duration: 1.2s; } /* fernbahnhof kringel */
#railmap .lineoverlay.lo0.display .st1 { stroke-dashoffset: 0; } /* fernbahnhof kringel */
#railmap .lineoverlay.lo0 g path { opacity: 0; fill: var(--black); stroke: none; transition: all 1s ease-in-out; } /* fernbahnhof name */
#railmap .lineoverlay.lo0.display g path { opacity: 1; } /* fernbahnhof name */

#railmap .lineoverlay.lo1 .st1 { opacity: 1; fill: none; stroke: var(--black); stroke-width: 2px !important; stroke-dasharray: 100; stroke-dashoffset: 100; transition-duration: .4s; transition-timing-function: linear; } /* verbindungslinien */
#railmap .lineoverlay.lo1 .st1:nth-last-of-type(1) { stroke-dasharray: 250; stroke-dashoffset: 250; } /* lange linie */
#railmap .lineoverlay.lo1 .st1.display { stroke-dashoffset: 0; } /* verbindungslinien */

#railmap .lineoverlay.lo2 .st1 { opacity: 1; fill: none; stroke: var(--mint); stroke-width: 2.9px; stroke-dasharray: 1300; stroke-dashoffset: 1300; } /* suedwest-nord */
#railmap .lineoverlay.lo2 .st1.display {  stroke-dashoffset: 0; } /* suedwest-nord */

#railmap .lineoverlay.lo3 .st1 { opacity: 1; fill: none; stroke: var(--midblue); stroke-width: 7.5px; stroke-miterlimit: 10; stroke-dasharray: 200; stroke-dashoffset: 200; transition-duration: 1s; } /* tunnel */
#railmap .lineoverlay.lo3 .st1.display { stroke-dashoffset: 0; } /* tunnel */

#railmap .lineoverlay.lo4 .st1 { opacity: 1; fill: none; stroke: var(--yellow); stroke-width: 2.9px; stroke-dasharray: 1300; stroke-dashoffset: 1300; } /* nord-sued */
#railmap .lineoverlay.lo4 .st1.display { stroke-dashoffset: 0; } /* nord-sued */

#railmap .lineoverlay.lo5 .st1 { opacity: 1; fill: none; stroke: var(--orange); stroke-width: 2.9px; stroke-dasharray: 1300; stroke-dashoffset: 1300; } /* west-nord */
#railmap .lineoverlay.lo5 .st1.display { stroke-dashoffset: 0; } /* west-nord */

#railmap .lineoverlay.lo6 .st1 { opacity: 1; fill: none; stroke: var(--neongreen); stroke-width: 2.9px; stroke-dasharray: 1300; stroke-dashoffset: 1300; } /* west-sued */
#railmap .lineoverlay.lo6 .st1.display { stroke-dashoffset: 0; } /* west-sued */

#railmap .lineoverlay.lo7 .st1 { opacity: 0; fill: none; stroke: var(--blue); stroke-width: 8px; stroke-miterlimit: 10; transition: all .2s ease-in-out; } /* stueck vom rhein oben drüber */
#railmap .lineoverlay.lo7.display .st1 { opacity: 1; } /* stueck vom rhein oben drüber */

#railmap .lineoverlay.lo8 { opacity: 0; fill: var(--black); stroke: none; transition: all .5s ease-in-out; } /* tief */
#railmap .lineoverlay.lo8.display { opacity: 1; } /* tief */

#railmap .lineoverlay.lo9 .st1 { opacity: 1; fill: none; stroke: var(--primary); stroke-width: 5.5px; stroke-miterlimit: 10; stroke-dasharray: 240; stroke-dashoffset: 240; transition-duration: 1s; filter: brightness(0.95); } /* highline */
#railmap .lineoverlay.lo9.display .st1 { stroke-dashoffset: 0; } /* highline */



.lo0 { z-index: 30; } /* fernbahnhof */
.lo1 { z-index: 5; } /* anbindung */
.lo2 { z-index: 12; } /* suedwest-nord */
.lo3 { z-index: 4; } /* tunnel */
.lo4 { z-index: 15; } /* nord-sued */
.lo5 { z-index: 14; } /* west-nord */
.lo6 { z-index: 13; } /* west-sued */
.lo7 { z-index: 21; } /* stueck vom rhein oben drüber */
.lo8 { z-index: 20; } /* tief */
.lo9 { z-index: 22; } /* highline */


.lo1a .st1 { opacity: 0 !important; stroke-linecap: butt; stroke-dasharray: 2 !important; filter: brightness(0.85); animation: roll forwards 1s infinite; animation-timing-function: linear; transition: opacity 2s linear; }
.lo1a .st1.display { opacity: 1 !important; }
.lo2a .st1 { opacity: 0 !important; stroke-linecap: butt; stroke-dasharray: 2 !important; filter: brightness(0.85); animation: roll forwards 1s infinite; animation-timing-function: linear; transition: opacity 2s linear; }
.lo2a .st1.display { opacity: 1 !important; }
.lo3a .st1 { opacity: 0 !important; stroke-linecap: butt; stroke-dasharray: 2 !important; filter: brightness(0.85); animation: roll forwards 1s infinite; animation-timing-function: linear; transition: opacity 2s linear; }
.lo3a .st1.display { opacity: 1 !important; }
.lo4a .st1 { opacity: 0 !important; stroke-linecap: butt; stroke-dasharray: 2 !important; filter: brightness(0.85); animation: roll forwards 1s infinite; animation-timing-function: linear; transition: opacity 2s linear; }
.lo4a .st1.display { opacity: 1 !important; }


@keyframes roll {
    0% {
        stroke-dashoffset: 200;
    }
	100% {
        stroke-dashoffset: 0;		
	}
}


#railmap .overlaycontainer .textoverlay {
	position: absolute;
	z-index: 30;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#railmap .overlaycontainer .textoverlay p {
	position: absolute;
	font-size: 20px;
	font-weight: 700;
	opacity: 0;
	margin: 0;
	transition: all .8s ease-in-out;
}
#railmap .overlaycontainer .textoverlay p.display { opacity: 1; }
#railmap .overlaycontainer .textoverlay p svg {
	display: inline;
    width: 32px;
    margin: 0 5px 3px 5px;
}

#railmap .overlaycontainer .textoverlay p:nth-of-type(1) { display: none; }
#railmap .overlaycontainer .textoverlay p:nth-of-type(2) { display: none; }
#railmap .overlaycontainer .textoverlay p:nth-of-type(3) { left: 56.5%; top: 10%; color: var(--mint); transform: translate(-100%, 0) rotate(90deg); transform-origin: 100% 0; }
#railmap .overlaycontainer .textoverlay p:nth-of-type(3).display { left: 56.5%; top: 38%; }
#railmap .overlaycontainer .textoverlay p:nth-of-type(3) svg { fill: var(--mint); }
#railmap .overlaycontainer .textoverlay p:nth-of-type(4) { left: 47%; top: 48.8%; color: var(--midblue); transform: translateX(-50%); }
#railmap .overlaycontainer .textoverlay p:nth-of-type(5) { left: 57.8%; top: 12.6%; color: var(--yellow); transform: translate(-100%, -100%) rotate(90deg); transform-origin: 100% 100%; }
#railmap .overlaycontainer .textoverlay p:nth-of-type(5).display { left: 57.8%; top: 37%; }
#railmap .overlaycontainer .textoverlay p:nth-of-type(5) svg { fill: var(--yellow); }
#railmap .overlaycontainer .textoverlay p:nth-of-type(6) { left: 18%; top: 51.2%; color: var(--orange); transform: translate(-100%, 0) rotate(28.7deg); transform-origin: 100% 0; }
#railmap .overlaycontainer .textoverlay p:nth-of-type(6).display { left: 29%; top: 57.3%; }
#railmap .overlaycontainer .textoverlay p:nth-of-type(6) svg { fill: var(--orange); }
#railmap .overlaycontainer .textoverlay p:nth-of-type(7) { left: 18%; top: 46%; color: var(--neongreen); transform: translate(-100%, -100%); }
#railmap .overlaycontainer .textoverlay p:nth-of-type(7).display { left: 28%; top: 46%; }
#railmap .overlaycontainer .textoverlay p:nth-of-type(7) svg { fill: var(--neongreen); }


#railmap .legend {
	position: fixed;
	right: 0;
	top: 0;
	max-width: 400px;
	padding-top: 100px;
	z-index: 99;
}
#railmap .legend .elementor-widget-text-editor {
	position: relative;
	left: calc(100% - 10px);
	padding: 15px;
	margin: 0 20px;
	background: var(--nearblack);
	opacity: 1;
	transition: all .5s ease-in-out .01s;
}
#railmap .legend .elementor-widget-text-editor.display {
	opacity: 1;
	left: 0;
}
#railmap .legend p {
	color: var(--white);
	margin: 0;
	font-weight: 200;
	line-height: 1.2em;
}
#railmap .legend p strong {
	font-size: 20px;
	font-weight: 700;
}
#railmap .legend p svg {
	display: inline;
    width: 32px;
    margin: 0 5px 3px 5px;
	fill: var(--white);
}

#railmap .legend .elementor-widget-text-editor:nth-of-type(1) p strong { color: var(--white); }
#railmap .legend .elementor-widget-text-editor:nth-of-type(2) p strong { color: var(--white); }
#railmap .legend .elementor-widget-text-editor:nth-of-type(3) p strong { color: var(--mint); }
#railmap .legend .elementor-widget-text-editor:nth-of-type(3) p strong svg { fill: var(--mint); }
#railmap .legend .elementor-widget-text-editor:nth-of-type(4) p strong { color: var(--midblue); }
#railmap .legend .elementor-widget-text-editor:nth-of-type(4) p strong svg { fill: var(--midblue); }
#railmap .legend .elementor-widget-text-editor:nth-of-type(5) p strong { color: var(--yellow); }
#railmap .legend .elementor-widget-text-editor:nth-of-type(5) p strong svg { fill: var(--yellow); }
#railmap .legend .elementor-widget-text-editor:nth-of-type(6) p strong { color: var(--orange); }
#railmap .legend .elementor-widget-text-editor:nth-of-type(6) p strong svg { fill: var(--orange); }
#railmap .legend .elementor-widget-text-editor:nth-of-type(7) p strong { color: var(--neongreen); }
#railmap .legend .elementor-widget-text-editor:nth-of-type(7) p strong svg { fill: var(--neongreen); }
#railmap .legend .elementor-widget-text-editor:nth-of-type(8) p strong { color: var(--primary); }
#railmap .legend .elementor-widget-text-editor:nth-of-type(8) p strong svg { fill: var(--primary); }


#railmap .keepscrolling {
	display: inline-block;
    width: 100px;
    height: 100px;
    border-radius: 100%;
    background: rgba(0,0,0,0.5);
    position: fixed;
    left: 50%;
    top: 110px;
    transform: translateX(-50%);
	opacity: 0;
	transition: opacity .3s linear;
}
#railmap .keepscrolling.display {
	opacity: 1;
}
#railmap .keepscrolling p {
	color: var(--yellow);
    text-transform: uppercase;
    font-size: 15px;
    line-height: 1.3;
    margin-top: 21px;
}
#railmap .keepscrolling p::after {
	content: '';
    display: block;
    position: absolute;
    left: 50%;
    top: 67%;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 13px solid var(--yellow);
    transform-origin: center;
    transform: translateX(-50%);
}


@media (max-aspect-ratio: 1/1) and (max-width: 992px) {
	#railmap .strapline { display: none; }
	#railmap .legend { left: 0; bottom: 0; right: unset; top: unset; width: 100%; max-width: 100%; height: 300px; }
	#railmap .legend .elementor-widget-text-editor { position: absolute; bottom: 60px; left: 100%; height: 140px; width: calc(100vw - 20px); max-width: 400px !important; }
	#railmap .legend .elementor-widget-text-editor.display { left: calc(100% - 20px); transform: translateX(-100%); }
}
@media (max-height: 1000px) {
	#railmap .legend { left: 0; bottom: 0; right: unset; top: unset; width: 100%; max-width: 100%; height: 300px; }
	#railmap .legend .elementor-widget-text-editor { position: absolute; bottom: 60px; left: 100%; height: 140px; width: calc(100vw - 20px); max-width: 400px !important; }
	#railmap .legend .elementor-widget-text-editor.display { left: calc(100% - 20px); transform: translateX(-100%); }
}





/* FILM ------------------------------------------------------------------------------------------------------ */

#derfilm {
	z-index: 1;
}
.gallerytrigger {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 80px;
}
body.elementor-editor-active .gallerytrigger {
	position: relative;
	background-color: #cccccc;
}


/* GALLERY --------------------------------------------------------------------------------------------------- */

#gallery {
	background: var(--nearblack);
	height: 200vh;
	z-index: -5;
}
body.elementor-editor-active #gallery {
	height: 100vh;
}
#gallery.display {
	z-index: 0;
}
.galleryheadingtint {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 40vh;
	z-index: 1;
	background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, var(--skyoverlay) 100%);
	mix-blend-mode: multiply;
}
.galleryheading {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
.galleryslider {
	position: fixed;
	top: 80px;
	left: 0;
	width: 100%;
	height: 100%;
}
.gallerythumbnails {
	position: fixed;
	bottom: -170px;
	background: rgba(0,0,0,0.8);
	width: 100%;
	transition: all .3s ease-in-out;
}
.gallerythumbnails.display {
	bottom: 0;
}
.gallerythumbnails.off { z-index: -99; }
.gallerythumbnails .showhidethumbnails {	
	position: absolute;
	top: -40px;
    left: 10px;
    width: 80px;
    height: 40px;
	background-color: var(--nearblack);
	cursor: pointer;
	display: inline-block;
}
.gallerythumbnails .showhidethumbnails p {	
	font-size: 0;
	line-height: 0;
	color: rgba(0,0,0,0);
	width: 0;
	height: 0;
}
.gallerythumbnails .showhidethumbnails::before {
	content: '';
	display: block;
	position: absolute;
	left: 25px;
    top: -5px;
    width: 0;
    height: 0;
    border: transparent 15px solid;
    opacity: 0.7;
    border-top: var(--white) 15px solid;
	transform: rotate(180deg);
}
.gallerythumbnails.display .showhidethumbnails::before {
	transform: rotate(0);
    top: 13px;
}
.gallerythumbnails .elementor-widget-image {
	cursor: pointer;
	flex-basis: 14%; /* adjust this manually when adding or removing images (14% ~ 7 images) */
	height: 160px;
}
@media (max-width: 1800px) {
	.gallerythumbnails .elementor-widget-image { height: 8vw; }	
}
.gallerythumbnails .elementor-widget-image img {
	height: 100%;	
	width: 100%;
	background: var(--darkgrey);
	object-fit: cover;
	transition: all .2s ease-in-out;
	border: var(--black) 2px solid;
}
.gallerythumbnails .elementor-widget-image.contain img {
	object-fit: contain;
}
.gallerythumbnails .elementor-widget-image img:hover {
	border: var(--white) 2px solid;
}
.gallerythumbnails .elementor-widget-image img.active {
	border: var(--primary) 2px solid;
}
body.elementor-editor-active #gallery { height: auto; z-index: unset; }
body.elementor-editor-active .galleryheading { position: relative; z-index: unset; }
body.elementor-editor-active .galleryslider { position: relative; top: 0; z-index: unset; }
body.elementor-editor-active .gallerythumbnails { position: relative; height: auto; bottom: 0; }

#gallery .swiper-slide-inner {
	padding: 0;
	margin: 0;
	position: absolute;
	top: -60px;
	left: 0;
	background: rgba(0,0,0,0.6);
	width: 100%;
	height: 60px;
	transition: top .4s ease-in-out;
display: none !important;
}

#gallery .swiper-slide-inner.display {
	top: 0;	
}
#gallery .swiper-slide-contents {
	max-width: 100%;
	height: 100%;
	padding: 15px;
}
#gallery .elementor-slide-heading {
	display: inline-block;
	margin-right: 15px;
	padding-right: 15px;
    border-right: var(--white) 1px solid;
	font-size: 24px;
	font-family: 'Outfit', sans-serif;
}
#gallery .elementor-slide-description {
	display: inline-block;
	font-family: 'Outfit', sans-serif;
}
#gallery .elementor-slide-button {
	display: none;
}

#gallery .eicon-chevron-left::before,
#gallery .eicon-chevron-right::before {
    content: '';
    display: block;
    width: 50px;
    height: 50px;
}
#gallery .eicon-chevron-left::before {
    border-left: var(--white) 6px solid;
    border-top: var(--white) 6px solid;
    transform: rotate(-45deg);
	margin-left: 20px;
}
#gallery .eicon-chevron-right::before {
    border-right: var(--white) 6px solid;
    border-top: var(--white) 6px solid;
    transform: rotate(45deg);
	margin-right: 20px;
}

/* MITMACHEN ------------------------------------------------------------------------------------------------------------------------ */


/* start */

body.mitmachen #start {
	height: 100vh;
	background-position: 50% 0;
}
body.mitmachen #start::before {
	display: block;
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: rgba(0,0,0,0.25);
	opacity: 1;
	transition: opacity .4s ease-in-out;
}
body.mitmachen #start.bright::before {
	opacity: 1;
}
body.mitmachen #start::after {
	display: block;
	content: '';
	width: 100%;
	height: 40%;
	position: absolute;
	bottom: 0;
	left: 0;
	align-self: flex-end;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0.4) 50%);
}
body.mitmachen .elementor-element {
	z-index: 1;
}
body.mitmachen .headingbox {
	margin-top: 33vh;
	margin-left: 1vw;
}
body.mitmachen .headingbox > .e-child { 
	max-width: calc(50vw - 30px);
}
body.mitmachen .headingbox h1 {
	line-height: 0.8em;
}
body.mitmachen .taglinebox {
	margin-bottom: 150px;
}
body.mitmachen .taglinebox p {
	line-height: 1.4em;
}
@media (max-width: 1200px) {
	body.mitmachen .headingbox { margin-left: 2vw; }
	body.mitmachen .headingbox h1 { font-size: 120px; }
}
@media (max-width: 768px) {
	body.mitmachen .headingbox { margin-left: 5vw; }
	body.mitmachen .headingbox h1 { font-size: 18vw; }
}


/* über uns */

#ueberuns {
	
}
#ueberuns .elementor-widget-toggle {
	border-top: var(--black) 1px solid;
	margin-top: -10px;
}
#ueberuns .elementor-toggle .elementor-tab-title {
    font-weight: 700;
    line-height: 1;
    margin: 0;
    padding: 15px 0 15px 30px;
    border-bottom: 1px solid var(--black);
	position: relative;
	transition: all .3s linear;
}
#ueberuns .elementor-toggle .elementor-tab-title:hover {
	background: var(--primarypale);
}
#ueberuns .elementor-toggle .elementor-tab-title.elementor-active {
    border-bottom: 1px solid #ffffff;
    padding: 30px 0 0 30px;
}
#ueberuns .elementor-toggle .elementor-tab-title.elementor-active:hover {
    background: var(--white);
}
#ueberuns .elementor-toggle .elementor-tab-title span i {
	display: none;
}
#ueberuns .elementor-toggle .elementor-tab-title .elementor-toggle-icon {
	position: absolute;
	left: 0;
	top: 50%;
	width: 20px;
	height: 20px;
	transform: translateY(-50%);
}
#ueberuns .elementor-toggle .elementor-tab-title .elementor-toggle-icon span::before,
#ueberuns .elementor-toggle .elementor-tab-title .elementor-toggle-icon span::after {
	display: block;
	content: '';
	background-color: var(--black);
	position: absolute;
}
#ueberuns .elementor-toggle .elementor-tab-title span.elementor-toggle-icon-closed::before { width: 20px; height: 2px; left: 0; top: 9px; }
#ueberuns .elementor-toggle .elementor-tab-title span.elementor-toggle-icon-closed::after { width: 2px; height: 20px; left: 9px; top: 0; }

#ueberuns .elementor-toggle .elementor-tab-title span.elementor-toggle-icon-opened::before { width: 20px; height: 2px; left: 0; top: 9px; }
#ueberuns .elementor-toggle .elementor-tab-title span.elementor-toggle-icon-opened::after { width: 2px; height: 0; left: 9px; top: 0; }

#ueberuns .elementor-toggle .elementor-tab-title a {
	color: var(--primary);
}
#ueberuns .elementor-toggle .elementor-tab-title:hover a {
	color: var(--black);	
}
#ueberuns .elementor-toggle .elementor-tab-title.elementor-active a {
	color: var(--black);
}
#ueberuns .elementor-toggle .elementor-tab-content {
    padding: 15px 15px 15px 30px;
	border-bottom: var(--black) 1px solid;
}


/* mach mit */

#machmit {
	background-color: #f2f2f2;
}


/* petition */

#petition {
	padding-top: 100px;
	background: var(--primary);
}
#petition .petitiongraph {
	font-size: 0;
	line-height: 0;
}
#petition .signees {
	position: absolute;
	left: 0;
	top: 90px;
	font-size: unset;
	line-height: unset;
	z-index: 10;
}
body.elementor-editor-active #petition .signees { position: relative; }

#petition .signees .counter {
	margin-top: -30px;
}
#petition .signees .counter p {
	font-size: 180px;
	line-height: 1em;
	color: var(--yellow);
	font-weight: 600;
	display: block;
	margin-bottom: -35px;
}
#petition .triggerbox p {
	opacity: 0;
	font-size: 0;
	line-height: 0;
}
body.elementor-editor-active #petition .triggerbox p { opacity: 1; font-size: unset; line-height: unset; }

#petition .elementor-widget-html {
	width: 100%;
}
#petition svg .cls-1 {
	fill: none;
	stroke: var(--yellow);
	stroke-width: 8px;
	stroke-linejoin: round;	
	stroke-dasharray: 2400;
	stroke-dashoffset: 2400;
	transition: stroke-dashoffset 3.5s ease-in-out;
}
#petition svg .cls-1.draw {
	stroke-dashoffset: 0;
}
#petition svg .cls-2 {
}
#petition svg .cls-3 {
	fill: var(--yellowgreen);
	fill-opacity: 1;
	stroke: none;
	opacity: 0;
	transition: opacity .3s ease-in-out;
}
#petition svg .cls-3.display{
	opacity: 1;
}
#petition .svgextension {
	background: var(--primary);
	margin-top: -1px;
	transition: all .3s ease-in-out;
}
#petition .svgextension.display {
	background: var(--yellowgreen);
}
#petition .textextension {	
	margin-top: -40px;
	margin-bottom: 90px;
}
#petition .textextension .largetext p {
	margin: 0;
	line-height: 1.4em;
}

@media (max-width: 1800px) {
	#petition .signees .counter p { }
	#petition .petitiongraph { padding-top: calc(220px - 10vw); }
	#petition .textextension { margin-top: calc(100px - 8vw); }
}
@media (max-width: 1024px) {
	#petition .signees { top: 70px; }
	#petition .signees .counter p { font-size: 140px; }
	#petition .petitiongraph { padding-top: 110px; }
	#petition svg .cls-1 { stroke-width: 12px; }
	#petition .textextension { margin-bottom: 70px; }
	#petition .textextension .largetext p { display: inline; }
}
@media (max-width: 767px) {
	#petition .signees { top: 50px; }
	#petition .signees .counter p { font-size: 120px; }
	#petition svg .cls-1 { stroke-width: 16px; }
	#petition .textextension .largetext p { font-size: 24px; font-weight: 400; }
}
@media (max-width: 480px) {
	#petition .petitiongraph { padding-top: 180px; }
}


/* highline */

#highline {
	height: 85vh;
}
#highline::before {
	content: '';
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	height: 40%;
	background: linear-gradient(180deg, rgba(0,0,0,0) 0, rgba(0,0,0,0.6) 100%);
	align-self: flex-end;
}
#highline h2 {
	font-size: 80px;
}

/* social media */

#vernetzt {
	margin-top: -1px;
}



/* VIDEO UPLOAD --------------------------------------------------------------------------------------------------- */

/* removed, see text file in "documents" for css */



/* SCROLLTOP ------------------------------------------------------------------------------------------------------ */

#scrolltop {
	width: 50px;
	height: 50px;
	display: inline-block;
	position: fixed;
	bottom: 50px;
	right: 20px;	
	background-color: var(--darkblue);
	border: var(--mattes) 3px solid;
	border-radius: 100%;
	transition: all .2s ease-in-out;
	opacity: 0;
	z-index: 9999;
}
#scrolltop.display {
	opacity: 1;
}
#scrolltop:hover {
	cursor: pointer;
	background-color: var(--darkblue);
}
#scrolltop .scrollarrow {
	width: 22px;
    height: 22px;
    position: absolute;
    left: 11px;
    top: 15px;
    display: inline-block;
    border-top: var(--mattes) 3px solid;
    border-right: var(--mattes) 3px solid;
	transition: all .2s ease-in-out;
    transform: rotate(-45deg);
}
#scrolltop:hover .scrollarrow {
	transform: rotate(-405deg);
}
@media only screen and (max-aspect-ratio: 1/1) {
	#scrolltop { display: none; }
}






/* FOOTER ----------------------------------------------------------------------------- */


/* elementor pro -------------------- */

body.passwordshield-active #efooter { display: none; }

#efooter {
	background: var(--darkgrey);
	padding-top: 120px;
	padding-bottom: 160px;
}

#efooter .footerlogo img {
	width: 200px;
}
#efooter h2 {
	color: var(--primary);
	font-size: 60px;
	margin-bottom: 0;
	margin-top: 50px;
}
@media (max-width: 900px) {
	#efooter h2 { font-size: 6.5vw; line-height: 1.7em; }
}
@media (max-width: 767px) {
	#efooter h2 { font-size: 60px; }
}
@media (max-width: 600px) {
	#efooter h2 { font-size: 10vw; }
}
#efooter h2 em {
	color: var(--white);
	font-style: normal;
}
#efooter .elementor-nav-menu a {
	color: var(--white);
	font-size: 22px;
	font-weight: 300;
	transition: color .1s ease-in-out;
	line-height: 0.6em;
	padding-left: 0;
}
#efooter .elementor-nav-menu a:hover {
	color: var(--primary);
}

#efooter .socialicons {
	width: 125px;
	margin-top: 25px;
}
#efooter .socialicons .elementor-widget-image {
	width: 30px !important;
}
@media (max-width: 767px) {

}


/* elementor basic ------------------------ */

/*
body.passwordshield-active #site-footer { display: none; }

#site-footer {
	background: var(--darkgrey);
	padding-top: 80px;
	padding-bottom: 100px;
}
#site-footer #menu-main-nav-1 {
	flex-direction: column;
}
#site-footer #menu-main-nav-1 a {
	text-transform: lowercase;
	font-size: 16px;
	color: var(--white);
}
#site-footer #menu-main-nav-1 a:hover {
	color: var(--primary);
}
#site-footer .site-description, #site-footer .copyright {
	display: none;
}
*/








/* DATENSCHUTZ, IMPRESSUM ------------------------------------------------------------------------------------------ */

body.impressum h1, body.datenschutz h1 {
	margin-top: -50px;
	margin-bottom: 50px;
	color: var(--primary);
}
body.impressum #kontakt #footerh1,
body.impressum #kontakt #footerh2,
body.datenschutz #kontakt #footerh1,
body.datenschutz #kontakt #footerh2 {
	
	visibility: hidden;
	
}
#impressum h1, #datenschutz h1 {
    font-size: 60px;
}
#impressum h3, #datenschutz h3 {
    font-weight: 500;
	margin-top: 30px;
    color: var(--duexx);
}
#impressum a, #impressum ul li, #datenschutz a, #datenschutz ul li {
	font-family: 'Outfit', sans-serif !important;
}
#datenschutz table th, #datenschutz table td {
	text-align: left;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 400;
}


@media screen and (max-width: 1024px) { 	
	#impressum h1, #datenschutz h1 { font-size: 40px; }
}
@media screen and (max-width: 767px) { 	
	#impressum h1, #datenschutz h1 { font-size: 24px; font-weight: 700; }
	#datenschutz table { max-width: 100%; }
}

#datenschutz .cookietable {
	margin-top: -20px;
}
#datenschutz .cookietable th {
    font-weight: bold;
	padding: 5px 10px;
	hyphens: auto;
	width: 25%;
}
#datenschutz .cookietable td {
	padding: 5px 10px;
	hyphens: auto;
	width: 25%;
}
#datenschutz .cookietable .linear {
	display: none;
}
@media only screen and (max-width: 540px) {
	#datenschutz .cookietable .linear { display: block; }
	#datenschutz .cookietable table { display: none; }
}



/* 404 ----------------------------------------------------------------------------------------------------------------- */


body.error404 {

}
body.error404 .num404 p {
	font-size: 220px;
	font-weight: 700;
	line-height: 1em;
	color: var(--primary);
}
body.error404 .largetext p {
	line-height: 1.4em;
}


/*
body.error404 #kontakt {
	display: none;
}
*/




/* COOKIE BANNER --------------------------------------------------------------------------- */

div.animate__animated.animate__fadeInDown { animation-delay: 3s !important; }





/* dies und das ---------------------------------------------------------------------------------- */

.sectionpadding {
	padding-top: 120px;
	padding-bottom: 140px;
}
.sectionpaddingtop {
	padding-top: 120px;
}
.sectionpaddingbottom {
	padding-bottom: 140px;
}

.pagemargin {
	padding-left: 60px !important;
	padding-right: 60px !important;
}
@media (max-width: 1024px) {
	.pagemargin { padding-left: 40px !important; padding-right: 40px !important; }
}
@media (max-width: 768px) {
	.pagemargin { padding-left: 20px !important; padding-right: 20px !important; }
}
@media (max-width: 576px) {
	.sectionpadding { padding-top: 80px; padding-bottom: 100px; }
	.sectionpaddingtop { padding-top: 80px; }
	.sectionpaddingbottom { padding-top: 100px; }
}


.anchorfake {
  	position: relative; 
  	top: -100px;
  	height: 0;
}

body.elementor-editor-active .anchorfake { top: 0; height: 50px; background: rgba(255,100,0,0.5); }

body.elementor-editor-active .elementor-widget-spacer {
    background: rgba(0,255,196,0.4);
}
body.elementor-editor-active .desktop.elementor-widget-spacer {
    background: rgba(0,100,196,0.4);
}
body.elementor-editor-active .mobile.elementor-widget-spacer {
    background: rgba(140,100,196,0.4);
}


/* arrows between sections */


.inversearrow {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2vw;
	clip-path: polygon(0 0, 48% 0, 50% 100%, 52% 0, 100% 0, 100% 100%, 0 100%);
}
.attop {
	top: 0;
}
.atbottom {
	bottom: 0;
}
.inversearrow.greenbg { background-color: var(--primary); }
.inversearrow.whitebg { background-color: var(--white); }
.inversearrow.darkgreybg { background-color: var(--darkgrey); }
.inversearrow.nearblackbg { background-color: var(--nearblack); }

.shifttop50 {
	margin-top: -50px;
}


.desktop {
  
}
.mobile {
  display: none;
}
@media screen and (max-width: 767px) {
  .desktop { display: none; }
  .mobile { display: block; }
  .elementor-inner-column { width: 100% !important; }
}
body.elementor-editor-active .desktop, body.elementor-editor-active .mobile {
  display: block;
} 


.listbullets ul {
	list-style: none;
	margin-left: 0;
	padding-left: 0;
}
.listbullets li {
	padding-left: 30px;
	margin-top: 1em;
}
.listbullets li::before {
	content: "";
    position: absolute;
    left: 0px;
    margin-top: 2px;
    width: 0;
    height: 0;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    border-left: 18px solid var(--primary);
}

.short {
	max-width: 1100px !important;
}

.narrow {
  max-width: 1000px !important;
  margin: 0 auto;
}
.boxed {
  max-width: 1400px;
  margin: 0 auto;
}
.paddingleft {
	padding-left: 50px;
}
.paddingright {
	padding-right: 50px;
}

.slim > .elementor-container, .slim.e-con {
  max-width: 700px !important;
  margin: 0 auto;
}
.slimleft {
  max-width: 400px;
  margin: 0;
}
.slimright {
  max-width: 400px;
  margin: 0;
}
.slim.half {
  margin: 0;
}
.veryslim {
  max-width: 520px;
}
.anorexic {
  max-width: 300px;
  margin: 0 auto;
}

.uppercase {
	text-transform: uppercase;
}
.nowrap {
	white-space: nowrap;
}
br.smallscreen {
	display: none;
}
span.notsmallscreen { 
	display: inline;
}
@media (max-width: 576px) {
	br.smallscreen { display: block; }
	span.notsmallscreen { display: none; }
}




.round img {
  border-radius: 100%;
}
.grecaptcha-badge {
  visibility: hidden;
}



.fixedbg {
  background-attachment: fixed;
}
.fixedbg > .elementor-widget-wrap {
  background-attachment: fixed;
}
body.mobiledevice .fixedbg {
  	background-attachment: scroll !important;
	background-size: cover;
}
body.mobiledevice .fixedbg .elementor-background-overlay {
  	background-attachment: scroll !important;
	background-size: cover;
}
@media (max-aspect-ratio: 1/1) {
	/*
	body.mobiledevice .fixedbg.fullheight { max-height: 100vw; }
	*/
}




.narrow {
	max-width: 900px;
	margin: 0 auto;
}
@media (max-width: 1600px) {
	.padforlogo > .elementor-widget-wrap { padding-left: 80px !important; }
}
@media (max-aspect-ratio: 1/1) and (max-width: 1024px) {
	.padforlogo > .elementor-widget-wrap { padding-left: 30px !important; }
}
.nobotmargin {
	margin-bottom: 0 !important;
}





.white, .white p, .white h1, .white h2, .white h3, .white h4, .white h5, .white h6, .white a, .white ul li, .white td, .white th {
  color: #ffffff !important;
}
.white p {
  font-weight: 300;
}
.black, .black p, .black h1, .black h2, .black h3, .black h4, .black h5, .black h6, .black a, .black ul li, .black td, .black th {
  color: #000000 !important;
}
.green, .green p, .green h1, .green h2, .green h3, .green h4, .green h5, .green h6, .green a, .green ul li {
  color: var(--primary) !important;
}
.yellow, .yellow p, .yellow h1, .yellow h2, .yellow h3, .yellow h4, .yellow h5, .yellow h6, .yellow a, .yellow ul li {
  color: var(--yellow) !important;
}
.boldgreen p strong {
	color: var(--primary);
}

.blue, .blue p, .blue h1, .blue h2, .blue h3, .blue h4, .blue h5, .blue h6, .blue a, .blue ul li {
  color: var(--blue) !important;
}
.orange, .orange p, .orange h1, .orange h2, .orange h3, .orange h4, .orange h5, .orange h6, .orange a, .orange ul li {
  color: var(--mattes) !important;
}

.mint .elementor-divider span { 
	border-top-color: var(--mint) !important;
}

.bggreen {
  background-color: var(--green);
}
.bgyellow {
  background-color: var(--yellow);
}
.bgwhite {
  background-color: #ffffff;
}





body:not(.elementor-editor-active) .invisible {
   	visibility: hidden;   
}
body:not(.elementor-editor-active) .hidden {
   	display: none;   
}
body.elementor-editor-active .elementor-widget-html {
	position: relative !important;
	left: 0 !important;
	top: 0 !important;
	transform: none !important;
	min-height: 50px;
	background-color: rgba(255,0,0,0.5);
}






body.login {
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  background-color: var(--primary);
  background-Image: url(./expose/img/loginBg.webp);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

body.login #login {
    background-color: rgba(255,255,255,0.7);
    padding: 0;
	position: absolute;
	left: calc(50vw - 160px);
	top: calc(50vh - 210px);
  	box-shadow: 0 0 20px 2px rgb(0 0 0 / 50%);
}

body.login #login h1 {
  display: none;  
}

body.login #login form, body.login #login .message {
    background-color: rgba(255,255,255,0.8) !important;
  }

body.login #login form {
    border-left: none;
    border-right: none;
  }

body.login #login .message {
  border: none !important;
}






.post-password-form {
    margin: 0 auto;
	margin-top: 30vh;
	width: 80%;
	max-width: 300px;
  	z-index: 2;
	position: relative;
	text-align: center;
}
.post-password-form .d-block {
	display: none !important;
}
.post-password-form label {
	color: rgba(0,0,0,0);
	font-size: 0;
	width: 100%;
}
.post-password-form p {
	display: block;
}
body.passwordshield-active {
	background: var(--primary);
}
body.passwordshield-active p {
	font-size: 32px;
	font-weight: 700;
	color: var(--black);
}

.post-password-form p:nth-of-type(1) {
	display: none;
}
body.passwordshield-active p:nth-of-type(2)::before {
	content: 'Login';
	display: block;
}

.mr-2 {
  margin-right: 0 !important;
}
.post-password-form input[type='password'] {
 	height: 30px;
    width: 100%;
    color: var(--primary);
    -webkit-user-select: text;
    font-size: 18px;
    border-radius: 4px;
    border: #ffffff 1px solid;
	border: none;
}

.post-password-form input[type='submit'] {
    width: 50px;
    height: 50px;
    text-indent: -99999px;
    margin: 0 auto;
    margin-top: 18px;
    background-color: rgba(0,0,0,0);
    border: rgba(0,0,0,0) 2px solid;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    border-radius: 100%;
    filter: brightness(0);
}
.post-password-form input[type='submit']:hover {
  	cursor: pointer;
}
.post-password-form input[type='submit'] { background-image: url(https://nmk.hhvision.de/wp-content/uploads/ArrowRight_Duexx.png); }





input.button.logout {	
    position: fixed;
    display: inline-block;
    top: 100px;
    left: 10px;
    z-index: 99999999;
    background: rgba(0,0,0,0);
    background-repeat: no-repeat;
    background-size: 36px;
    background-position: 50% 50%;
    width: 42px;
    height: 50px;	
    filter: saturate(0) brightness(2);
    color: var(--white);
    border: none;
    text-indent: -9999px;
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;	
	background-image: url(https://nmk.hhvision.de/wp-content/uploads/LogoutIcon_Duexx.png);
}
input.button.logout:hover {
  color: var(--ultramarine);
}









