
	
	/* display*/
	/*header nav li:first-child,*/
	.homenav,
	#burger-outer,
	#mobilenav { display: none; }
	
	/*pointer events*/
	header .contain { pointer-events: none; }
	header #logo,
	header nav li a { pointer-events: auto; }
	
	/* incubator logo */
	.incubator #topteaser .incubator-logo img { min-width: 185px;}
	
	
	/**************************************************   
	HEADER / NAV / LOGO
	**************************************************/	
	/* HEADER */
	header {position: relative; }
	header .contain {
		/*position: fixed;*/
		position: absolute; 
		width: 100%;
		height: 180px; 
		background-image: linear-gradient( 180deg, rgba(36,35,44,1), rgba(36,35,44,0) );
		pointer-events: none;
	}
	
	/* LOGO */
	header #logo { 
		position: absolute;
		left: 16.33%;
		top: 2rem;
		cursor: pointer;
	}
	#logo img { 
		height: auto;
		width: 180px;
	}
	
	/* NAV */
	header nav ul { 
		text-align: right; 
		padding-top: calc(2rem + 25px);
	}
	header nav li {
		display: inline-block;
		padding: 0 1.5rem;
	}
	header nav li a { font-size: 1.1em; }
	header nav li:last-child { padding-right: 5%;}
	header nav li:before { display: none; }
	
	nav a, 
	nav a:link, 
	nav a:visited { color: #FFE6FF; }
	
	
	/* SUBNAV */
	.sub-menu {
		visibility: hidden;
		opacity: 0;
		padding: .5em 0 0 1.5rem; 
		/*border-top: 1px solid #D3FF64;*/
		
		position: absolute;
		top: 100%;
		left: 0;
		
		min-width: 100%;
		white-space: nowrap;
		transition: visibility 0.2s, opacity 0.2s ease-in-out;
	}
	
	/*vert. trenner */
	.sub-menu li { padding: 0 .5rem 0 0; }
	.sub-menu li:not(:last-child):after {
		content: "";
		display: inline-block;
		width: 1px;
		height: 16px;
		background-color: #fff;
		margin-left: calc(.5rem + 5px);
	}

	header nav ul.sub-menu a {font-size: .9em;}
	
	/*underline*/
	header ul.sub-menu li a:before {
	  bottom: -2px;
	  height: 2px;
	  /*background: #D3FF64;*/
	}

	/* Ensure submenu is visible when hovering */
	.menu-item-has-children:hover > .sub-menu,
	.menu-item-has-children:focus-within > .sub-menu,
	.menu-item-has-children .current-menu-item  {
		visibility: visible;
		opacity: 1;
	}

	/**************************************************  
	BURGER
	**************************************************/
	#burger-outer { 
		position: fixed;
		top: 50px;
		right: 4%;
		cursor: pointer;
	}
	
	/* ------------------------ 
	animate BURGER
	------------------------ */
	.cmn-toggle-switch {
		display: block;
		position: relative;
		overflow: hidden;
		width: 32px;
		height: 25px;
		
		font-size: 0;
		text-indent: -9999px;
		border: none;
		cursor: pointer;
		background: transparent !important;
	}
	
	.cmn-toggle-switch span:before, 
	.cmn-toggle-switch span:after,
	.cmn-toggle-switch span {
		position: absolute;
		display: block;
		height: 3px;
		background: #FFE6FF;
	}
	
	/*darkmode*/
	#burger-outer.darkmode .cmn-toggle-switch span:before, 
	#burger-outer.darkmode .cmn-toggle-switch span:after,
	#burger-outer.darkmode .cmn-toggle-switch span { background: #2D2C37; }
	
	.cmn-toggle-switch span {
		top: 10px;
		left: 0px;
		right: 0px;
	}
	.cmn-toggle-switch span:before, 
	.cmn-toggle-switch span:after {
		left: 0;
		width: 100%;
		content: "";
	}
	.cmn-toggle-switch span:before { top: -10px;}
	.cmn-toggle-switch span:after { bottom: -10px;}
	
	.cmn-toggle-switch__htx span:before {
		/*-webkit-transition-property: top, -webkit-transform;*/
		transition-property: top, transform;
	}
	.cmn-toggle-switch__htx span:after {
		/*-webkit-transition-property: bottom, -webkit-transform;*/
		transition-property: bottom, transform;
	}
	.cmn-toggle-switch__htx span:before, 
	.cmn-toggle-switch__htx span:after {
		/*-webkit-transition-duration: 0.3s, 0.3s;
		-webkit-transition-delay: 0.3s, 0;*/
		transition-duration: 0.3s, 0.3s;
		transition-delay: 0.3s, 0;
	}
	
	/* active */
	.cmn-toggle-switch__htx.active span {background: none;}
	.cmn-toggle-switch__htx.active span:before {
		top: 0;
		-webkit-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	.cmn-toggle-switch__htx.active span:after {
		bottom: 0;
		-webkit-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	.cmn-toggle-switch__htx.active span:before, 
	.cmn-toggle-switch__htx.active span:after {
		-webkit-transition-delay: 0, 0.3s;
		transition-delay: 0, 0.3s;
	}
	
	
	/* ********* RESP-VIEW ********* */
	@media only screen and (max-width: 1440px) { }
	
	@media only screen and (max-width: 1279px) { 
		/*logo*/
		header #logo { left: 10.33%;}
		/*incubator logo*/
		.incubator #topteaser .col-2.spacer { display: none; }
		.incubator #topteaser .incubator-logo {margin-left: 10.33%;}
		
		 /*nav*/
		 header nav li {padding: 0 1rem;}
	}
	
	@media only screen and (max-width: 1160px) { 
		header nav li {padding: 0 .7rem;}
	}
	
	/*BRAKE MOBILE*/
	@media only screen and (max-width: 1024px) { 
		/*no gradient*/
		/*header .contain {background-image: none;}*/
		header .contain {height: 150px;}

		body.noscroll {overflow: hidden;}
		
		/*logo incubator page*/
		.incubator header #logo { display: none; }
		
		/*burger*/
		#burger-outer {
			display: block;
			z-index: 100; 
		}
		nav { z-index: 99; }
		header nav li:first-child { display: block;}
		
		/*nav*/
		nav {
			position: fixed; 
			top: 0px;
			width: 35vw;
			right: -35vw; 
			
			height: 100vh;
			box-shadow: -2px 0px 10px rgba(57, 63, 72, 0.1);
			background: #2D2C37;
			
			overflow-y: scroll;
			-webkit-overflow-scrolling:touch; 
			transition: all .4s ease;
		}
		nav.open {right: 0px;}
		
		header nav ul { padding-top: 40px; }
		nav ul li {
			width: 100%;
			text-align: left;
			padding: 0 20px 20px;
		}
		header nav li a { font-size: 1.25em;}
	}
	
	@media only screen and (max-width: 850px) { 
		/*logo*/
		header #logo {left: 2rem;}
		/* incubator logo */
		.incubator #topteaser .incubator-logo {margin-left: 2.5rem;}
		
		/*nav*/
		nav {
			width: 50vw;
			right: -50vw; 
		}
	}
	@media only screen and (max-width: 767px) { 
		/*logo*/
		#logo img {width: 160px;}
		/* incubator logo */
		.incubator #topteaser .incubator-logo {margin-left: 2rem;}
	}
	
	@media only screen and (max-width: 600px) { 
		/*logo*/
		header #logo {left: 1.5rem;}
		#logo img {width: 140px;}
	}
	
	
	@media only screen and (max-width: 479px) { 
		/*logo*/
		#logo img {width: 130px;}
		/* incubator logo */
		.incubator #topteaser .incubator-logo {margin-left: 1rem;}
		.incubator #topteaser .incubator-logo img { min-width: 160px;}
		
		/*nav*/
		nav {
			width: 100vw;
			right: -100vw; 
		}
	}
	
	
	