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

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

/* HEADLINES */
h1 				{ font-size: 2.0rem; line-height: 1.2; }					/* Headline */ 
h2 				{ font-size: 0.6rem; line-height: 1.4; }					/* Titel Rubric */ 
h3 				{ font-size: 1.3rem; line-height: 1.2; }					/* Titel Kapitel */
h4 				{ font-size: 1.0rem; }											/* Absatztitel */ 


/* TEXTE */
.ch_intro 		{ font-size: 1.2rem; line-height: 1.4; }					/* Intro */

/* BUTTONS */
.ch_bt_label	{ font-size: 1.2rem ; line-height: 1.6; letter-spacing: 0.15em; }	

/* HIGHLIGHTING */
.label   		{ font-size: 0.6rem; line-height: 1.4; letter-spacing: 0.1em; }



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

/* NOTES */
.linknotes		{ font-size: 11.5pt; line-height: 1.2; }						/*Marginalien*/

/* NAVIGATION */
.linknav		{  }		/*Navigation*/

/* 
.touch .linknav				{ font-family: 'LotaGrotesqueAlt1-Light', Arial, sans-serif; font-size: 30pt; line-height: 1.2; color: var(--color2); }
.touch .linknav:hover		{ color: var(--color2); }
.touch .linknav:visited 	{ color: var(--color2); }
.touch .linknav:active		{ color: var(--color2); }
*/


/* =============================================================================
   Buttons
   ========================================================================== */

   

/* =============================================================================
   Other Elements
   ========================================================================== */
   
   


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



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

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



/*-------------------------------*/
/*            Header             */
/*-------------------------------*/

#header{  }

	/* LOGO */
	#header .lrg-logo{
		width: 			200px;
		height: 			15px;
	}
	#header .sml-logo{
		width: 			40px;
		height: 			40px;
		margin-top:		8px;
	}



/*-------------------------------*/
/*           SECTIONS            */
/*-------------------------------*/

.cd-cover,
.cd-content {
	padding-top: 		30vh;
}	



/*-------------------------------*/
/*         HERO / INTRO   	 	   */
/*-------------------------------*/

#section1 {  
}
	.hero-teaser {	
	}
		/* TEXT INTRO */
		.hero-teaser .txt-intro {  
			padding-bottom:	30px !important;
		}



/*-------------------------------*/
/*       FOCUS / POSITION  	   */
/*-------------------------------*/

#section2 {
	padding-bottom:  		10vh;
}
	.focus {

	}
		/* Text Animation */
		.focus .txt-ani {
			width:  				90%;			
			height: 				auto;	
			padding-bottom:  	25px;

		}
	.focus .img-scroll{
		width:  		25%;
		bottom:		0;
	}
		.focus .txt {
			height:  auto;
			/*width:  	50%;*/
		}


/*-------------------------------*/
/*        	 HEADLINE  			 	*/
/*-------------------------------*/

.headline { 
}
	.headline.centred .txt-block1,
	.headline.centred .txt-block2 {
		width:  			100%;	
		margin-left: 	0;
		text-align: 	left;
	}





/*-------------------------------*/
/*         TEXT + IMAGE    	 	*/
/*-------------------------------*/





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


.footer {
}
	.footer .copywrite {
		display: none;
	}	









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


/* 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; }






/*-------------------------------*/
/*			  BUTTON		     			*/
/*-------------------------------*/

/* DEFAULT */
.button,
.button-boarder,
.button-no-boarder {
}
		.button span:after,
		.button-boarder span:after, 
		.button-no-boarder span:after {
							
			background-size:	69px 17px;
			width:				69px; 
			height:				17px;
		}




/*-------------------------------*/
/*      IMAGE: ROUND CORNERS     */
/*-------------------------------*/

.border-radius-top-l {
	border-top-left-radius: 				30px 30px;
	-webkit-border-top-left-radius: 		30px 30px;
	-moz-border-radius-topleft: 			30px 30px;
}
.border-radius-top-r {
	border-top-right-radius: 				30px 30px;
	-webkit-border-top-right-radius: 	30px 30px;
	-moz-border-radius-topright: 			30px 30px;
}
.border-radius-bottom-r {
	border-bottom-right-radius: 			30px 30px;
	-webkit-border-bottom-right-radius: 30px 30px;
	-moz-border-radius-bottomright: 		30px 30px;
}
.border-radius-bottom-l {
	border-bottom-left-radius: 			30px 30px;
	-webkit-border-bottom-left-radius: 	30px 30px;
	-moz-border-radius-bottomleft: 		30px 30px;
}




/*-------------------------------*/
/*            SLIDER             */
/*-------------------------------*/

.projektGallery { }
	.owl-carousel { }

		/* NAV (Custom) */	
		.owl-nav{
			display:  none;
		}
		.btns{ }
			.customNextBtn, 
			.customPreviousBtn{
				display:  none;
			}
			.customPreviousBtn{
			    margin-top:  		0;
			}

	/* DOTS */
	.owl-theme .owl-dots { 
		text-align: 	left;
	}
		.owl-theme .owl-dots .owl-dot {  }
		    .owl-theme .owl-dots .owl-dot span {
		    	/* Circle */
		    	width:			10px;
		    	height: 			10px;
		    }






/* ALTER CODE, AM ENDE LÖSCHEN! ======================================================================================== */






/*-------------------------------*/
/*       Imprint / DSVGO         */
/*-------------------------------*/

.cd-imprint {
	padding: 			20vh 25px 0 25px;
	background-color: 	var(--color3);
}




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

/* COLUM */
.col 		{ margin-right: 0; }					/* Block mit Abstand */

/* WIDTH */
.s1			{ width: 100%; }						/* Block 1-spalte breit */
.s2			{ width: 100%; }						/* Block 2-spalten breit */
.s3			{ width: 100%; display: table; }		/* Block 3-spalten breit */


/* POSITION */
.s1-center,
.s2-center,
.s3-center	{ width: calc(100% - var(--pagemargin)); margin-left: 0; margin-right: 0; }	/* Block 3, mittig */

.s1-space,							
.s2-space	{ width: 100%; margin-right: 0%; }		/* Block 2/1, rechts leer */

.s1-pos-3	{ width: 100%; margin-left: 0%; }		/* Block 1, Position 3. Spalte */





/* SPACING */
.spacing1x{
	margin-bottom:			20px;
	display: 				inline-block;
}
.spacing2x{
	margin-bottom:			40px;
	display: 				inline-block;
}
.spacing3x{
	margin-bottom:			60px;
	display: 				inline-block;
}
.spacing4x{
	margin-bottom:			80px;
	display: 				inline-block;
}
.spacing5x{
	margin-bottom:			100px;
	display: 				inline-block;
}


/* POSITION */
.box-bottom{
	width: 			85%;
	bottom: 		5vh;
	position: 		absolute;
	vertical-align: bottom;
}