

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


/* ROOT TEXT */
html 				{ font-size: 18px; line-height: 1.5; letter-spacing: 0.03em; }

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


/* TEXTE */
.ch_intro 		{ font-size: 1.3rem; line-height: 1.4; }													/* Intro */
.ch_rubictitle	{ text-transform: uppercase; letter-spacing: 0.15em; padding-bottom: 1.3rem; color:	var(--color3);} /* Rubikentitel */ 
.ch_text			{ font-size: 1.0rem; }																			/* Fließtext */
.ch_notes		{ font-size: 0.7rem; }																			/* Marginalien */

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

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




/* =============================================================================
   Links
   ========================================================================== */
   
/* NOTES */
.linknotes		{ font-size: 1.0rem; line-height: 1.2; }											/* Marginalien */

/* NAVIGATION */
.linknav			{ font-size: 1.0rem; line-height: 1.2; letter-spacing: 0.15em; }			/* Navigation */



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

   

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



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


/*-------------------------------*/
/*             Page              */
/*-------------------------------*/

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




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

#header{
	position: 			fixed;

	width: 				100%;
	height: 				auto;
	padding: 			3% var(--pagemargin) 0 var(--pagemargin);
	z-index: 			1001;
																				/*border: solid 1px #00F;*/
}
	/* LOGO */
	#header .lrg-logo,
	#header .sml-logo {
		display: 					inline-block;
		background-size: 			auto 100%;
		background-position:		left bottom;
	   background-repeat:		no-repeat;
																				/*border: solid 1px #F00;*/
	}
	#header .lrg-logo{
		width: 			260px;
		height: 			18px;

	   background-image:		url('../images/rakic-immobilien_logo.svg');
		background-position:	0 bottom;
		background-repeat:	no-repeat;
	}
	#header .sml-logo{
		width: 			50px;
		height: 			50px;
		margin-top:		6px;

	   background-image:	url('../images/rakic-immobilien_signet.svg');
		background-position:0 bottom;
		background-repeat:	no-repeat;
	}
		#header .lrg-logo.dark{
			background-image:		url('../images/rakic-immobilien_logo_white.svg');
		}
		#header .lrg-logo.light{
			background-image:		url('../images/rakic-immobilien_logo.svg');
		}
		#header .sml-logo.dark{
			background-image:		url('../images/rakic-immobilien_signet_white.svg');
		}
		#header .sml-logo.light{
			background-image:		url('../images/rakic-immobilien_signet.svg');
		}


	/*#header .bt_back{
		display: 			inline-block;

		float: 				right;
		width: 				30px;
		height: 				45px;
		
		background: 		url("../images/bt_back.svg");
		background-size: 	auto 30px;
		background-position:right bottom;
	    background-repeat:	no-repeat
	}*/




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

.cd-cover,
.cd-content {
	float: 					left;
  	position:				relative;
	padding: 				20vh var(--pagemargin) 5vh var(--pagemargin);
	width:					calc(100% - (2 * var(--pagemargin)) ) !important;
								
	/*mix-blend-mode: screen;
	background: white;*/
	/*background-color: 	#FFF;*/
																					/*border: 	solid 1px #0F0;*/
}	
	/* full screen */
	.cd-cover {
		display: 			table;
		min-height: 		75vh;		
		height:  			100%;
	}


/*.cd-scroll-down {
	position:			absolute;
	left: 				calc( 50% - 15px );
	right: 				auto;
	bottom:				3vw;

	width: 				30px;
	height: 			30px;
	
	background: 		url("../images/bt_scroll.svg");
	background-size: 	100% auto;
	background-position:center bottom;
    background-repeat:	no-repeat;
}*/



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

#section1 {  
		padding-bottom:  		0;
}

	.hero-teaser {	
		width:	100%;
		float: 	left;
		height: 	auto;
														/*border: solid 1px #FC253A;*/
	}
		/* TEXT INTRO */
		.hero-teaser .txt-intro {  
														/*border: solid 1px #FC253A;*/
		}

		/* IMAGE HERO*/
		/*.hero-teaser .hero {
			left: 		0; 
			bottom: 		-50%;
			width: 		100%;
			background-image: url("../images/rakic_hero1.jpg");
		}*/

		.hero-teaser .img-hero{
			position:			relative;
			float: 				left;
			width:  				calc( 100% + 2* var(--pagemargin) ) !important;		/* full width */
			left:   				calc( 0vw - var(--pagemargin) ) !important; 			/* hack: no global page margin */
			animation-delay:	1s;	

		}
			.hero-teaser .img-hero .img-holder{
				background-position: center;
				background-size: 		cover;
				background-repeat: 	no-repeat;
				transition: 			all 1s;
				background-image: url("../images/rakic_hero1.jpg");
			}
		



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

#section2 {
	padding-bottom:  40vh;
																/*border: solid 1px #6B00FF;*/
}
	.focus {
		display:		table-cell;
		height:  	100%;
																/*background-color:  #C3FFC1;*/
	}
		/* Text Animation */
		.focus .txt-ani {
			display:	table;
			width:  	100%;
			height: 	50%;				

			/*position: sticky;
			position: -webkit-sticky;
			top: 20vh;		*/								/*border: solid 1px #6B00FF;*/
		}
			.focus .txt-ani .headline{
				display: 			table-cell;
				text-align: 		center;
				vertical-align: 	middle;
																/*border: solid 1px #FC00ED;*/
			}

		.focus .txt {
			height:  80%;
																/*border: solid 1px #6B00FF;*/
		}

	.focus .img-scroll{
		position:	absolute;
		width:  		80%;
		right:		0;
		bottom:		60vh;
		z-index:  	2;
																/*border: 		solid 1px #FC0107;*/
	}





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


.headline { 
}
	.headline.centred .txt-block1{  
		display: 		block;
		width:  			50%;	
		text-align: 	right;
															/*border: solid 1px #6B00FF;*/
	}
	.headline.centred .txt-block2{ 
		display: 		block;
		width:  			50%;
		margin-left: 	25%;
		text-align: 	center;
															/*border: solid 1px #FC253A;*/
	}





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


.img-holder {
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: all 1s;
}

.txt-image,
.txt-image-right {  
														/*border: solid 1px #21AD11;*/
}
	.txt-image .txt {
		vertical-align: bottom;
														/*background-color: #E1E1E1;*/
	}

	.txt-image .img-medium,
	.txt-image .img-small {
														/*border: solid 1px #FC253A;*/
	}




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


/* PADDING RIGHT = 0 */
.projektGallery{
	display:	inline-block;
	float:	left; 

	padding-right:	0;
	width: calc(100vw - var(--pagemargin)) !important;
														/*border: solid 1px #2919F8;*/
}
	/* STAGE PADDING ONLY RIGHT SIDE */
	.projektGallery .owl-stage{
		padding-left: 0 !important;
	}

	/* NAV */
	.owl-nav{
														/*background-color: #E1E1E1;*/
	}

	/* SLIDE */
	.owl-theme .item .slide .image-holder{
		background-position: top;
		background-size:		cover;
		background-repeat:	no-repeat;
	}
	.owl-theme .item .info{
														/*border: solid 1px #2919F8;*/
	}




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


.footer { 
}
	.footer .imprint {
	}	
		.footer .imprint span{
			padding-right:  30px;
			/*border: solid 1px #FC253A;*/
		}
			.footer .imprint span a{
				text-decoration:  none;
			}

			 

/*-------------------------------*/
/*           IMPRINT             */
/*-------------------------------*/

#impressum h4,
#datenschutz h4 {
	padding-bottom: 0.5rem;
                                    /*border: solid 1px #FC253A;*/
}



