/* =============================================================================
   Typography
   ========================================================================== */
   
/* ROOT TEXT */
html 					{ font-size: 18px; }

/* HEADLINES */
h1 					{ font-size: 1.9rem; } 	/* Titel */
h2 					{ font-size: 1.5rem; } 	/* Absatztitel */																														
h3 					{ font-size: 1.2rem; } 	

/* TEXTE */
.ch_bt_label		{ font-size: 0.7rem; }	/* Button Label */





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

/* NAVIGATION */
.linknav				{ font-size: 1.5rem; line-height: 1.2; text-decoration: unset; }	/* Menue */ 
.linknav.sub 		{ font-size: 1.0rem; line-height: 1.3; }									/* Navigation Sub */
.linknav.active 	{ border-bottom: 2px solid var(--color1); }




/* =============================================================================
   Icons
   ========================================================================== */

i{
/*	
	transform-origin: top left;
	transform: 			scale(0.8);*/
	width: 				50px;
	height: 				50px;
	margin-right:		8px;
	display: 			inline-block;
}



/* =============================================================================
   Embedded Content
   ========================================================================== */


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

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




/*-------------------------------*/
/*             ANCOR	            */
/*-------------------------------*/

.ancor {
    margin: -90px;
}




/*-------------------------------*/
/*             NAVBAR            */
/*-------------------------------*/

#navbar{
	padding: 	30px var(--pagemargin) 0 var(--pagemargin);
}
	/* LOGO */
	#navbar .lrg-logo,
	#navbar .sml-logo {
		transform-origin: 	top left;
		transform: 				scale(0.7);
	}

	/* BURGER */
	#navbar .bt_burger {
		transform-origin: top right;
		transform: scale(0.8);
	}


	/* MENU */
	#navbar .menu {  }
		#navbar .menu .ch_rubrictitle{
				display: none;
		}
		/* KONTAKT NOTRUF */
		#navbar .menu .kontakt-emergency	{ 
			width:  	42vw;
		}
			#navbar .menu .kontakt-emergency .txt{
			}
			#navbar .menu .kontakt-emergency span{
				display:  none;
			}
			#navbar .menu .kontakt-emergency .links{
/*				width:  	30%;
				display:	block;
    			float:   left;*/
			}		
				#navbar .menu .kontakt-emergency .links a {
				}
				#navbar .menu .kontakt-emergency .links i {
					margin-right:	10px;
				}
				#navbar .menu .kontakt-emergency .links p {
					/*display: none;*/
				}
				#navbar .menu .kontakt-emergency .links.mail {
					display: none;
				}
				#navbar .menu .kontakt-emergency .links.hochwasser {
					display: none;
				}	




/*-------------------------------*/
/*			 BUTTON: NOTRUF   	   */
/*-------------------------------*/

.bt_sticky-emergency {
	transform-origin: bottom right;
	transform: 			scale(0.7);
	bottom: 				15vh;
}



/*-------------------------------*/
/*        HERO FULLSCREEN        */
/*-------------------------------*/

.hero-start{  }
	.hero-start .diagonal-shape-left {
		-webkit-clip-path: polygon(0% 0%, calc(40% + 20%) 0%, 50% 100%, 0% 100%);
	}
	.hero-start .titlebox { 
		width: 50%;
	}




/*-------------------------------*/
/*        	HERO SUBPAGE         */
/*-------------------------------*/

.hero-subpage{	
	padding-top:  35vh !important; /* addtional padding */
}
	.hero-subpage .title{
		padding-right:  15%;		
	}
	.hero-subpage .diagonal-shape-bottom,
	.hero-subpage .diagonal-shape-top {
		height:		170vh;
	}
		/* TOP */
		.hero-subpage .diagonal-shape-top {
			-webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 60%, 0% 80%);
		}
		/* BOTTOM */
		.hero-subpage .diagonal-shape-bottom {
			-webkit-clip-path: polygon(0 20%, 100% 0%, 100% 80%, 0% 100%);
		}



/*-------------------------------*/
/*        	HERO TITLE         */
/*-------------------------------*/

.hero-title {	
	padding-top:  	35vh;
}





/*-------------------------------*/
/*			  TEXT: CENTER       	*/
/*-------------------------------*/

.txt-intro {  }
	.txt-intro .colpos-2-to-3 {
		grid-column: span 4 !important;
		margin-left:	10vw;
		margin-right:  10vw;
														/*background-color:  #D000C8;*/
	}



/*-------------------------------*/
/*				TEXT: LEFT 	      	*/
/*-------------------------------*/

.txt-left {
}
	.txt-left .txt.box {
														/*border:  solid 1px #2433FF;*/
		grid-column: span 3 !important;				
	}



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

.team-group {
	grid-template-columns:	13.33% 13.33% 13.33% 13.33% 13.33% 13.33% ;	/* change to grid-6 */
}
	.team-group .memberbloc{
		grid-column: span 2;
	}
	.team-group .txt{
		/*font-size: 0.7rem; 		.ch_note */
	}






/*-------------------------------*/
/*				TABLE LIST     		*/
/*-------------------------------*/

.tablelist {
}
	.tablelist .col1 {
		margin-bottom:		20px;
	}
		.tablelist li {
			min-height: 		35px;

			padding-left:		50px;
			padding-top:		2px;
			margin-bottom:		15px;

			background-size:		30px 30px;
			background-position: 0 0;
															/*background-color:  #D000C8;*/
		}




/*-------------------------------*/
/*				ACCORDION	   		*/
/*-------------------------------*/

.accordions {
}
	.accordions .acc {
	}
		.accordions .acc li {
		}

		/* BOX */
		.accordions .acc_ctrl {
			padding: 3% 15% 3% 5%;
		}

			/* ICON */
			.accordions .acc_ctrl:before,
			.accordions .acc_ctrl:after{
				margin-right: 	20px;
				right: 			0;
				width: 			15px;
				height: 			3px;
			}

		/* PANEL */
		.accordions .acc_panel {
			padding: 5% 8% 8% 5%;
		}





/*-------------------------------*/
/*					FOOTER   		   */
/*-------------------------------*/

#footer {
	/*height:  		100vh;*/
	padding-top:	40px;
}
#footer .span-2, 
#footer .center-span-4,
#footer .left-span-2{
	grid-column: span 3 !important;
}
	#footer .logo {
		transform-origin: top left;
		transform: 			scale(0.8);
	}






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



/*-------------------------------*/
/*      GRID: 4-SPALTIG          */
/*      GRID: 6-SPALTIG          */
/*-------------------------------*/


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

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

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

	/* COLUMN POSTION */
	.grid-4 .box.center-span-2	{ grid-column: span 4 !important; margin: 0 10% 0 10%}
	.grid-4 .box.colpos-2-to-3	{ grid-column: span 4 !important; }


	/* SPAN (only from pos 1)*/


/* 6-COLUMN GRID  */
.grid-6 {
}
	.grid-6 .box.center-span-4	{ 
		grid-column: span 6 !important;
	}



/* BLOC GAPS */
.gap-0-25-top 		{ padding-top:		  6px; }
.gap-0-25-bottom	{ padding-bottom:	  6px; }
.gap-0-5-top 		{ padding-top:		 12px; }
.gap-0-5-bottom	{ padding-bottom:	 12px; }
.gap-0-75-bottom	{ padding-bottom:	 20px; }
.gap-1-top 			{ padding-top:		 25px; }
.gap-1-bottom		{ padding-bottom:	 25px; }
.gap-2-top 			{ padding-top:		 50px; }
.gap-2-bottom		{ padding-bottom:	 50px; }
.gap-3-top 			{ padding-top:		 75px; }
.gap-3-bottom		{ padding-bottom:	 75px; }
.gap-4-top 			{ padding-top:		100px; }
.gap-4-bottom		{ padding-bottom:	100px; }






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

/* BUTTON DEFAULT */
.button {
	transition:		none;
	padding: 		9px 18px 10px 18px;
	border: 			0.2em solid var(--color1);
}

	.button span {
		padding-right: 20px;
	}
	.button span:after {
		transition:		none;
		transform:		scale(1);
		opacity:			1;
		top: 				0;
		padding-right: 20px;
	}

/* BUTTON INVERS */
.button.invers {
	border: 				solid 0.2em #FFF;
}

	/* HOVEREFFECT */
	.hover-teaser span,
	.button:hover span,
	.button-boarder:hover span,
	.button-light:hover span {
		padding-right: -20px;
	}

	.hover-teaser span:after,
	.button:hover span:after,
	.button-boarder:hover span:after,
	.button-light:hover span:after {
		right:		-20px;
	}