@charset "UTF-8";
/* CSS Document */

@media all and (pointer:none), (pointer:coarse) and (orientation:portrait) {
	
	body{
		overflow: hidden;
		-webkit-tap-highlight-color: rgba(0,0,0,0);
		   -moz-tap-highlight-color: rgba(0,0,0,0);
		    -ms-tap-highlight-color: rgba(0,0,0,0);
		     -o-tap-highlight-color: rgba(0,0,0,0);
		        tap-highlight-color: rgba(0,0,0,0);
	}
	
	.left{
		width: calc(100% - (var(--padding) * 2));
	}

	.right{
		display: none;
	}
	
		
	#navi_desk{
		display: none;
	}
	
	#navi_desk_icon{
		display: none;
	}
	
	#navi_desk_hotspot{
		display: none;
	}
	
	#navi_mob_icon{
		display: block;
		position: fixed;
		z-index: 100;
		width:  calc((var(--baseline) * 2) / 4 * 5);
		height: calc( var(--baseline) * 2);
		top: var(--padding);
		left: calc(50% - (((var(--baseline) * 2) / 4 * 5) / 2));
	}
	
	#navi_mob{
		position: fixed;
		display: block;
		background: var(--grau);
		height: 100vh;
		height: calc(var(--vh, 1vh) * 100);
		width: 100%;
		z-index: 100;
	}
	
	.navi_mob_show{
		bottom: 0;
	}
				
	.navi_mob_hide{
		bottom: -100vh;
	}
	
	#navi_mob_container{
		position: absolute;
		width: 100%;
		height: calc((5 * var(--padding)) + (8 * (var(--baseline))));
		top: calc(50% - (((5 * var(--padding)) + (8 * (var(--baseline)))) / 2));
	}
	
	.navi_mob_item{
		text-transform: uppercase;
		font-size: calc((var(--baseline) / 100 * 115) * 2);
		line-height: calc(var(--baseline) * 2);
		height: calc(var(--baseline) * 2);
		margin-top: var(--padding);
		text-align: center;
	}
	
	#navi_mob_footer{
		position: absolute;
		height: 50px;
		width: 100%;
		bottom: var(--padding);
	}
	
	.navi_mob_footer_item.L,
	.navi_mob_footer_item.R {
		width: calc(50% - (var(--padding) * 1.5))
	}
	
	.navi_mob_footer_item.L{
		text-align: left;
		float: right;
		right: 0;
		padding-right: var(--padding);
		padding-left: calc(var(--padding) / 2);
	}
	
	.navi_mob_footer_item.R{
		text-align: right;
		float: left;
		left: 0;
		padding-left: var(--padding);
		padding-right: calc(var(--padding) / 2);
	}
				
	.segments_container{
		height: 100vh;
		height: calc(var(--vh, 1vh) * 100);
		scroll-snap-type: y proximity; /* [ mandatory | proximity ] */
	}
	
		
	.segment{
		height: 100vh;
		height: calc(var(--vh, 1vh) * 100);
	}
	
	#werte > .split_screen,
	#werteM > .split_screen,
	#kontakt > .split_screen,
	#kontaktM > .split_screen{
		float: none;
		width: calc(100% - (var(--padding) * 2));
	}
	
	#werte > .split_screen.R,
	#kontakt > .split_screen.R{
		display: none;
	}
	
	#werteM,
	#kontaktM{
		display: block;
	}
	
	#werteM > .split_screen.L,
	#kontaktM > .split_screen.L{
		display: none;
	}
	
	#werte > .split_screen.L > p.T {
		display: none;
	}
	
	#werteM > .split_screen.R{
		padding-top: calc(var(--padding) + (var(--baseline) * 2));
		padding-bottom: calc(var(--padding) + (var(--baseline) * 2));
		height: calc(100% - ((var(--padding) * 2) + (var(--baseline) * 2)));
	}
	
	#text_okologisch,
	#text_nachhaltig,
	#text_hochwertig{
		height: auto;
		overflow: hidden;
	}
	
	#angebot{
		height: auto;
	}
	
	#angebot > .split_screen.L{
		display: none;
	}
	
	#angebot > .split_screen.R{
		width: calc(100% - (var(--padding) * 2));
		overflow: hidden;
		height: auto;
	}
	
	.split_screen > .navi_mob_blocker {
		display: block;
		width: 100%;
		height: calc((var(--baseline) * 2) + var(--padding));
	}
	
	.angebot_content{
		max-height: calc(((var(--vh, 1vh) * 100) / 4) - var(--padding));
		width: 100%;
		left: calc(0px - var(--padding));
		overflow: hidden;
		padding-left: var(--padding);
		padding-right: var(--padding);
	}
	
	.angebot_content > h1{
		padding: 0px;
		margin: 0px;
		padding-bottom: var(--padding);
	}
	
	.angebot_content > p{
		max-height: 0px;
		overflow: hidden;
		padding: 0px;
		margin: 0px;
	}
	
	
	.angebot_mob_shadow{
		position: absolute;
		display: block;
		bottom: 0;
		width: 100%;
		height: calc(((var(--vh, 1vh) * 100) / 4) - (var(--padding) * 3));
		left: 0px;
		background: rgb(0,0,0);
		z-index: 10;
		background: -webkit-linear-gradient(0deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
		background:  -khtml-linear-gradient(0deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
		background:    -moz-linear-gradient(0deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
		background:     -ms-linear-gradient(0deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
		background:      -o-linear-gradient(0deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
		background:         linear-gradient(0deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
	}
	.angebot_mob_shadow,
	.angebot_mob_plus,
	.angebot_mob_hotspot_plus{
		display: block;
	}
	
	.angebot_mob_hotspot_clos{
		display: none;
	}
	
	.angebot_mob_plus{
		position: absolute;
		top: var(--padding);
		right: var(--padding);
		width:  calc(var(--baseline) * 2);
		height: calc(var(--baseline) * 2);
		background: url("../element/scheer_plus_black.svg");
		transform: rotate(0deg);
	}
	
	.angebot_mob_plus.first{
		top: 0;
	}
		
	.angebot_mob_hotspot_plus,
	.angebot_mob_hotspot_clos{
		position: absolute;
		top: var(--padding);
		width: calc(100% - (var(--padding) * 2));
		height: calc(((var(--vh, 1vh) * 100) / 4) - (var(--padding) * 2));
		z-index: 20;
	}
	
	.angebot_mob_hotspot_plus.first,
	.angebot_mob_hotspot_clos.first {
		top: 0;
	}
	
	.angebot_content.mob_open_angebot{
		max-height: calc(var(--vh, 1vh) * 200);
	}
	
	.angebot_content.mob_open_angebot > h1 {
		padding-bottom: calc(var(--padding) * 3);
	}
	
	.angebot_content.mob_open_angebot > p {
		padding-bottom: var(--baseline);
		max-height: 50vh;
	}
	
	.angebot_content.mob_open_angebot > .angebot_mob_plus{
		transform: rotate(45deg);
	}
	
	.angebot_content.mob_open_angebot > .angebot_mob_hotspot_plus{
		display: none;
	}
	
	.angebot_content.mob_open_angebot > .angebot_mob_hotspot_clos {
		display: block;
	}
	
	.image_note_01,
	.image_note_02{
		margin-left: 0;
		font-size: calc(var(--baseline) / 100 * 83);
		line-height: var(--baseline);
		height: calc(var(--baseline) * 1);
	}
	
	.angebot_image.show_1 > .image_note_01 > .desktop,
	.angebot_image.show_1 > .image_note_02 > .desktop,
	.angebot_image.show_2 > .image_note_01 > .desktop,
	.angebot_image.show_2 > .image_note_02 > .desktop{
		display: none;
	}
	
	.angebot_image.show_1 > .image_note_01 > .mobile,
	.angebot_image.show_1 > .image_note_02 > .mobile,
	.angebot_image.show_2 > .image_note_01 > .mobile,
	.angebot_image.show_2 > .image_note_02 > .mobile{
		display: block;
	}
	
	#engagement > div > h1 {
		font-size: calc(var(--baseline) / 100 * 83);
		line-height: var(--baseline);
	}
	
	.engBrDesk{
		display: none;
	}
	
	.engBrMob{
		display: block;
	}
	
	.footer_item.f1_4 {
		width: calc(100% / 2);
	}
	
	.footer_item.f3_4 {
		width: calc(100% / 2);
	}
	
	.footer_item.f1_4.MobF1_1,
	.footer_item.f3_4.MobF1_1 {
		width: calc(100% / 1);
	}
	
	.footer_item > p{
		font-size: calc((var(--baseline) / 100 * 83) / 2);
		line-height: calc(var(--baseline) / 2);
	}
	
	.footer_item > h1{
		font-size: calc((var(--baseline) / 100 * 83) * 1);
		line-height: calc(var(--baseline) * 1);
	}
	
	.footer_logo{
		height: calc((var(--footerbase) * 2) / 100 * 68);
		background: url("../element/SCH_Wortmarke_Schwarz.svg");
		background-repeat: no-repeat;
		margin-bottom: calc(var(--footerbase) * 2);
	}
	
	#kontaktM.segment{
		background: var(--rosa);
	}
	
	#kontakt > .split_screen > .kontakt_container{
		position: absolute;
		width: calc(100% - (var(--padding) * 2));
		height: calc(var(--baseline) * 12);
		top: calc(50% - (var(--baseline) * 7));
	}
	
	#kontakt > .split_screen > div >img {
		display: none;
	}
	
	#kontakt > .split_screen > div > p{
		font-size: calc((var(--baseline) * 2) / 100 * 90);
		line-height: calc(var(--baseline) * 2);
		margin-block-end: calc(var(--baseline) * 2);
		position: relative;
		width: 100%;
	}
	
	#kontakt > .split_screen > div > .T,
	#kontakt > .split_screen > div > .B{
		top: 0;
		bottom: auto;
	}
	
	.kontact_cta{
		display: block;
		position: absolute;
		width: calc(100% - (var(--padding) * 2));
		bottom: var(--padding);
	}
	
	.kontact_cta > .L,
	.kontact_cta > .R {
		width: calc(50% - (var(--baseline) * 2));
		float: left;
	}
	
	.kontact_cta > .L {
		text-align: left;
		padding-right: calc(var(--baseline) * 2);
	}
	
	.kontact_cta > .R {
		text-align: right;
		padding-left: calc(var(--baseline) * 2);
	}
			
	.personen > .person > .col > span,
	.personen > .person > .col > img {
		display: none;
		height: 0px;
	}
	
	.personen > .person > .col > .speichern {
		display: block;
		margin-top: calc(0px - var(--baseline));
		height: var(--baseline);
	}
		
	.personen > .person > .col,
	.social > .media {
		text-align: right;
		padding-left: calc(var(--baseline) * 2);
		width: calc(50% - (var(--baseline) * 2));
	}
	
	.personen > .person > .col:first-of-type,
	.social > .media:first-of-type {
		text-align: left;
		padding-left: 0;
		width: 50%;
	}
	
	.projectNavi{
		display: none;
	}
	
	.projekt > .kopfzeile {
		top: calc(100% - (var(--baseline) * 12) - (var(--padding) * 1));
		height: calc(var(--baseline) * 2);
	}
	
	.projekt > .infotext{
		top: calc(100% - (var(--baseline) * 12) - (var(--padding) * 1));
		height: calc(var(--baseline) * 8);
	}
		
	.projekt > .bild {
		position: absolute;
		top: var(--padding);
		width: calc(100% - (var(--padding) * 1));
		height: calc(100% - (var(--baseline) * 12) - (var(--padding) * 2));
	}
		
}