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


/* ROOT TEXT */
html 				{ font-size: 15px; line-height: 1.7;}


/* HEADLINES */
h1 				 	{ font-size: 1.8rem; line-height: 1.4; }	/* Title Block */ 
h2 					{ font-size: 1.3rem; }	/* Title Block */ 
h3 					{ font-size: 1.1rem; }	/* Title Block */ 


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


/* TEXTE */
.ch_intro	  		{ font-size: 1.1rem; line-height: 1.4; }	/* Intro 		= h3 */
.ch_body		 	{  }										/* Bodytext	 	= root */
.ch_note			{ font-size:  .7rem; }						/* Notes 		= 0.8 */
.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{
	height:		5px;
	width:		60px;
	left:		0;
	bottom:		-10px;
}




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

/* BASIS */
a			{ border-bottom: 1px solid currentColor; padding-bottom: 1px !important; }
a:hover		{  }
a:focus		{  }
a:active	{  }

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








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

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

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



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

#navbar { 
	padding: 	20px 3vw 0 3vw;
}
	#navbar.bg_white{
		height:				105px;
	}
	#navbar .bg {  }
		#navbar .bg.open {
			transition: height .3s ease;
			height:		100vh;
		}

		#navbar .bg.close {
			transition: height .3s ease;
			height:		0;
		}

	/* LOGO */
	#navbar .lrg-logo,
	#navbar .sml-logo {
		width: 		160px;
		height: 		55px;
	}

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

	/* MENU */
	#navbar .menu{
		position:		relative;
		top:				0;
  		width: 			60%;
		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: 2x Teaser        */
/*-------------------------------*/

.hero-teaser{
										/*border: solid 1px #55FF1E;*/
}
	/* IMAGE */
	.hero-teaser .imagebox{
		background-position: 	top;
	}





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

.hero-teaser{  }

	/* IMAGE */
	.hero-teaser .imagebox{
		width: 		50%;
		height:		100%;
		float: 		left;

	}
		.hero-teaser .imagebox .textbox{
			text-indent: -9999px;
		}

	/* TEASER */
	.hero-teaser .teaser-group{
		width: 		50%;
		height:		100%;
										/*background-color: #5CB4BF;*/
	}
		.hero-teaser .teaserbox{
			width: 		100%;
			height:		50%;
										/*background-color: #BE9292;*/
		}



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

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

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






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

.team-group { 
}
	.team-group .memberbloc{
		cursor: pointer;
		padding-bottom: 20px;
	}
			/*  OVERLAY */
			.memberbloc .overlay {
				display: none;
			}
				/*  JOBS */
				.memberbloc.jobs .overlay {
					display: block;
					padding: 10%;
					opacity: 1;
				}
					/* JOBS BUTTON (POSITION)*/
					.memberbloc.jobs .overlay .button-light-arrow {  
						bottom:		20%;
						right:		10%;
					}

	/* 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;
			}
				.memberbloc .img-box .img-holder{
				   	/*padding-top: 66.66%; 3:2 Aspect Ratio */
				   	width: 100%;
				   	padding-top: 150%; /* 2:3 Aspect Ratio */
				}



/*-------------------------------*/
/*       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.box {
			grid-column: span 2 !important; 					
		}
		.contact .img-box .img-holder{
		   	width: 		 100%;
	   		padding-top: 100%; /* 1:1 Aspect Ratio */
	   		display: none;
		}
	.contact .box.text {
		order: 2;												/*border: solid 1px #2EDE15;*/
		grid-column: span 4 !important; 	
		padding-right: 30px;
	}

	.contact .member{
		width: 100%;
	}
		.contact .member .img-box{
			width: 33%;
			margin-bottom: 0;
		}
			.contact .member .img-box .img-holder{
				display: block;
			}




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

.hero-textintro{
	padding-right: 10%;
}





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

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




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

.textbloc{
	padding-right: 10%;
}




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

.img-full-facts{
}
	/* IMAGE */
	.img-full-facts .img-holder{
	   	padding-top: 66.66%; /* 3:2 Aspect Ratio */
	}
	/* FACT BOX */
	.img-full-facts .factbox{
		padding-top: 8vh;
	}
		/* HEADER */
		.img-full-facts .factbox .header{
			height: 5vh;
		}



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

/* 2X SMALL */
.img-group-2x-small {
}
	/* SMALL: left */
	.img-group-2x-small .img-small.left {
		grid-column: span 2 !important;
	}
	/* SMALL: right */
	.img-group-2x-small .img-small.right {
		grid-column: span 2 !important;
	}



/*-------------------------------*/
/*        		Tabs			 */
/*-------------------------------*/

.tabs {
	 padding-bottom: 60px;
}
	/* ROW */
	.row:after {
	}
		/* TABS */
		.tab {
			min-height:		100px;
		}
			/* LABEL */
			.tab .label {
				display: none;
			}	
				/* ARROW */
				.arrow-box {
					/*padding-left: 10px;*/
				}
					.arrow-box .arrow,
					.arrow-box .line {
					}
					.arrow-box .arrow{
						background-size:  auto 80%;
						width:    15%;
					}
					.arrow-box .line {
						background-size:  auto 80%;
						width:    85%;
					}

	/* CONTENT */
	.tabs .containerTab {
	}
		/* LABEL (mobil) */
		.containerTab .label {
			width: 80%;
			display: block;
			margin-bottom: 20px;
		}
		.containerTab .colum1,
		.containerTab .colum2  {
			float: 			left;
			width:			100%;				/*background-color: #2AD014;*/
			margin-right: 	0;
		}


/*-------------------------------*/
/*        	Akkordion			 */
/*-------------------------------*/


.container {
}
	.acc {
	}
		.acc li {
		  padding-bottom: 15px;
		}







/* =============================================================================
   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 4 !important;}

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


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

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

  		/* SPAN (only from pos 1)*/
		/*.grid-3 .box.span-2, 
		.grid-3 .box.span-3 { grid-column: span 3 !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; }


/* SQUARE > 5:1; */
.ratio-square {  }
	.ratio-square:before {
	  /*padding-top:	25% !important;*/
	}



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

.button-light-arrow {  }
	.button-light-arrow span {  }
	.button-light-arrow span:after {
		transform:	scale(1.6);
		top: -0.8rem;
	}
.button-grey-arrow span:after {
	top: 		-10px;
}



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

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