/* =============================================================================
   Typography
   ========================================================================== */


/* ROOT TEXT */
html 				{ font-size: 20px; }

/* ROOT TEXT 
html 				{ font-size: 28px; }

@media screen and (max-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) {
	html { 
		font-size: 20px; 
	}
}*/


/* HEADLINES */
h1 				 	{ font-size: 2.5rem; line-height: 1.3;  }	/* Title Block */ 
h2 					{ font-size: 1.4rem; letter-spacing: 0; }	/* Title Block */ 
h3 					{ font-size: 1.2rem; letter-spacing: 0; }	/* Title Block */ 


/* EXEPTIONS – Hero-Teaser */
.hero-teaser .imagebox .textbox h1	{ font-size: 1.4rem; letter-spacing: 0; }	/* Title Hero-Teaser > h2 */ 
.hero-teaser .teaserbox h2			{ font-size: 1.9rem; letter-spacing: 0; }	/* Title Teaser > h1 */ 



/* TEXTE */
.ch_intro	  		{ font-size: 1.2rem; line-height: 1.5; }	/* Intro 		= h3 */
.ch_body		 	{  }										/* Bodytext	 	= root */
.ch_note			{ font-size:  .7rem; }						/* Notes 		= 0.7 */
.ch_rubric-title	{ font-size:  .7rem; }						/* Rubric Title = ch_note */
.ch_facts			{ font-size: 3.0rem; line-height: 1.3; }	/* Numbers Facts= x4.0 */



/* HIGHLIGHTING */
.underline-small::after{
	left:		0px;
	height:		7px;
	width:		120px;
}
@media screen and (max-width: 1024px) {
	.underline-small::after{
		height:		5px;
		width:		80px;
	}
}





/* =============================================================================
   Links
   ========================================================================== */

/* BASIS */
a			{ border-bottom: 2px solid currentColor; padding-bottom: 0px; }
a:hover		{  }
a:focus		{  }
a:active	{  }


/* NAVIGATION */
.linknav			{ font-family: 'AvenirStdWeb95Black', Arial, sans-serif; color: var(--color1); font-size: 1.4rem; line-height: 1.6; }	/* Navigation	  = h1 */
.linknav.sub		{ font-family: 'AvenirStdWeb65Medium', Arial, sans-serif; font-size: 1.2rem; line-height: 1.5; }						/* Navigation Sub = ch_intro */
.linknav.active 	{ padding-bottom: 0 !important; }



/* =============================================================================
   Content: Modules
   ========================================================================== */


/*-------------------------------*/
/*             PAGE              */
/*-------------------------------*/

/* PADDING */
:root {
	--pagemargin: 	5vw;		/* padding left & right */
}


/*-------------------------------*/
/*        	  Navbar	            */
/*-------------------------------*/

#navbar { 
	padding: 	40px 5vw 0 5vw;
}
	#navbar .bg {  }
		#navbar .bg.open {
			transition: height .3s ease;
			height:		100vh;
		}
		#navbar .bg.close {
			transition: height .3s ease;
			height:		0;
		}

	/* BURGER */
	#navbar .bt_burger {
				
																											/* Vorrübergehend deaktiviert bis zum Launch! 
																											display:		block;	 */
																											display: none !important;
		display:	block;								
	}
		#navbar .bt_burger.show {
			display:	block;	
		}

	/* MENU */
	#navbar .menu{
		position:		relative;
		top:			8vh;
  		width: 			100%;
		display: 		inline-block;
		float: 			right;
		margin:			0;
		display: 		none;				/*background-color: #5CB4BF;*/
	}
		#navbar .menu ul{
		  padding: 		0px;
		  list-style:	none;
		  text-align:	left;
		}
		#navbar .menu li{
		  display:	block;
		  padding:	0;
		}
		/* GAP BEFORE SUB MENUE */
		#navbar .menu li:nth-child(6) {
			margin-top: 5vh;
		}




/*-------------------------------*/
/*         Hero + Teaser         */
/*-------------------------------*/

.hero-teaser{
	width: 		100vw;
	height:		100vh;
	padding:	0 !important;
										/*border: solid 1px #F5001D;*/
}
	/* IMAGE */
	.hero-teaser .imagebox{  
		background-position:	25%;
	}
		.hero-teaser .imagebox .textbox{
			width: 		100%;
			height: 		40%;
			padding: 	0 10% 5% 10%;
										/*background-color: #5CB4BF;*/
		}




/*-------------------------------*/
/*      Hero: Image & Text       */
/*-------------------------------*/

.hero-teaser{
	/* Setting under "Hero: 2x Teaser" */
}
	.hero-teaser.karriere .imagebox{
	}

	/* TEXT */
	.hero-teaser .textbox{
	}
		.hero-teaser .textbox .content{
			margin: auto 5vw 7vw 5vw;
		}
			.hero-teaser .textbox .introtext{
				padding-top:	30px; 
			}





/*-------------------------------*/
/*           Hero: Text          */
/*-------------------------------*/

.hero-textintro{
	padding-top: 20% !important;
	padding-right: 10%;					/*background-color: #BE9292;*/
}
	.hero-textintro .headline{
		margin-right: 30%;				/*background-color: #D8DA16;*/
	}





/*-------------------------------*/
/*     Project Teaser Group      */
/*-------------------------------*/

.teaser-group { 
}
	/* TEASER */
	.teaser-group .teaserbloc {
		padding-bottom: 30px;
	}
		/* TEXTBOX */
		.teaser-group .teaserbloc .textbox {
			padding-top: 20px;
		}





/*-------------------------------*/
/*     		   TEAM 			 */
/*-------------------------------*/

.team-group { 
	grid-template-columns:	30.66% 30.66% 30.66%;	/* change to grid-3 */
}
	.team-group .memberbloc{
		padding-bottom: 30px;
	}
		.team-group .memberbloc.box {	
			grid-column: span 1 !important;
		}
			/*  OVERLAY */
			.memberbloc .overlay {
				display: none;
			}
				/*  JOBS */
				.memberbloc.jobs .overlay {
					padding: 15%;
					display: block;
					opacity: 1;
				}

	/* TEXTBOX */
	.memberbloc .textbox {
		padding-top: 20px;
	}
		/* CONTACT (mobile) */
		.memberbloc .textbox .contact{
			display: block;
		}
			.memberbloc .textbox .contact a{
				display: block;
				float: left;
				padding-top: 10px;
				padding-right: 5px;
				border-bottom: none;
				border-bottom: 0 !important;
			}



/*-------------------------------*/
/*       Ansprechpartner		 */
/*-------------------------------*/

.contact { 
}
	.contact .rubric{
		order: 1;												
	}
		.contact .rubric.box {
			grid-column: span 3 !important; 					/*border: solid 2px #2EDE15;*/
		}
	.contact .img-box{
		order: 3;												/*border: solid 1px #2EDE15;*/
	}
		.contact .img-box .img-holder{
		   	/*width: 		 100%;
	   		padding-top: 100%;*/ /* 1:1 Aspect Ratio */
		}
	.contact .box.text {
		order: 2;												/*border: solid 1px #2EDE15;*/
		grid-column-start: 1 !important;
		grid-column-end: span 2 !important;		
		padding-right: 30px;
	}
	.contact .member{
		width: 100%;
	}
		.contact .member .img-box{
			width: 50%;
			margin-bottom: 10px;
		}
			.contact .member .img-box .img-holder{
			}




/*-------------------------------*/
/*        	  TEASER             */
/*-------------------------------*/

.teaserbox{  }	
	/* CONTENT */
	.teaserbox .content {  
		padding: 10%;
	}
	/* BUTTON (POSITION)*/
	.teaserbox .button,
	.teaserbox .button-boarder,
	.teaserbox .button-light {  
		bottom:		14%;
		right:		10%;
	}



/*-------------------------------*/
/*           Textblock           */
/*-------------------------------*/

.textbloc{
	padding-right: 20%;
}



/*-------------------------------*/
/*     Image: Full + Facts;      */
/*-------------------------------*/

.img-full-facts{  }

	/* IMAGE */
	.img-full-facts .img-holder{  }

	/* FACT BOX */
	.img-full-facts .factbox{  }

		/* HEADER */
		.img-full-facts .factbox .header{
			height: 20vh;
		}



/*-------------------------------*/
/*          Image: Group         */
/*-------------------------------*/

/* 2X SMALL */
.img-group-2x-small {
}
	/* SMALL: left */
	.img-group-2x-small .img-small.left {
		width: 100% !important;	
	}
	/* SMALL: right */
	.img-group-2x-small .img-small.right {
		width: 100% !important;	
		margin-left: 0;
	}



/*-------------------------------*/
/*       Tabelle: Bautafel       */
/*-------------------------------*/

/* TABLE */
.table-facts  {
}
	/* TITLE */
	.table-facts .title {
		padding-bottom: 20px;
	}

	/* TABLE GRID*/
	div.table { 
	}
		div.tr { 
		}
		div.tr.head {
		}
			div.td { 
			}
				/* LINES */
				div.head .td.first,
				div.head .td.last { 
				}
				/* ROWS */
				div.td.first{
					width:			35%;
				}
				div.td.last{
					width:			65%;	
				}





/* =============================================================================
   CHANGE: BASE and ADDONS
   ========================================================================== */


/*-------------------------------*/
/*      GRID: 4-SPALTIG          */
/*      GRID: 3-SPALTIG          */
/*-------------------------------*/


/* GRID  */
.grid-4,
.grid-3 {  }


/* 4-COLUMN GRID  */
.grid-4 {  }

	/* BOX */
	.grid-4 .box { grid-column: span 2 !important; }

		/* COLUMN START-END (from Position 2-4)*/
		.grid-4 .colpos-2-to-3	{ grid-column: span 4 !important; }
		.grid-4 .colpos-2-to-4	{ grid-column: span 4 !important; }

  		/* SPAN (only from pos 1)*/
		.grid-4 .box.span-2 { grid-column: span 2 !important; }
		.grid-4 .box.span-3 { grid-column: span 4 !important; }
		.grid-4 .box.span-4 { grid-column: span 4 !important; }



/* BLOC GAPS */
.gap-0-25-top 	{ padding-top:		  6px; }
.gap-0-25-bottom{ padding-bottom:	  6px; }
.gap-0-5-top 	{ padding-top:		 15px; }
.gap-0-5-bottom	{ padding-bottom:	 15px; }
.gap-1-top 		{ padding-top:		 30px; }
.gap-1-bottom	{ padding-bottom:	 30px; }
.gap-2-top 		{ padding-top:		 60px; }
.gap-2-bottom	{ padding-bottom:	 60px; }
.gap-3-top 		{ padding-top:		 90px; }
.gap-3-bottom	{ padding-bottom:	 90px; }
.gap-4-top 		{ padding-top:		140px; }
.gap-4-bottom	{ padding-bottom:	140px; }



/*-------------------------------*/
/*          TEXT BUTTONS         */
/*-------------------------------*/

.button,
.button-boarder,
.button-light {
	transition:		none;
	/*padding-right:	40px;*/
}
	.button span,
	.button-boarder span,
	.button-light span{
		transition: none;
	}
	.button span:after,
	.button-boarder span:after,
	.button-light span:after {
		transition:	none;
		/*transform:	scale(1.8);
		opacity:	1;
		top: 		-5px;
		right:		-20px;*/
	}
	/*@media screen and (max-width: 1024px) {
		.button span:after,
		.button-boarder span:after,
		.button-light span:after {
			transform:	scale(1.6);
			top: 	-1px;
		}*/
	}



/*-------------------------------*/
/*      ARROW BUTTON (CIRCLE)    */
/*-------------------------------*/

.button-light-arrow {  }
	.button-light-arrow span {  }
	.button-light-arrow span:after {
		transform:	scale(1.8);
		/*top: 		-23px;
		left:		18px;*/
		top: -0.84rem;
	}
	@media screen and (max-width: 1024px) {
		.button-light-arrow span:after {
			top: -0.85rem;
		}
	}



/*-------------------------------*/
/*     BUTTON / ICON (CIRCLE)    */
/*-------------------------------*/

.icon-number,
.button-mail,
.button-mail-light {
}
	/* NUMBER */
	.icon-number {
	}
	.icon-number span:after {
		transform:	scale(1.2)!important;
		top: 		-10px;
	}