
/* Big Screen */

@media (min-width: 1280px) { 

	#slider h3 { font-size: 60px !important; }
}



/* Rubberband */

@media (max-width: 1150px) { 
	.cloud .text h3,
	.headline h2,
	.beitrag h1			{ font-size: 54px !important; } 
}

@media (max-width: 1100px) { 
	.cloud .text h3,
	.headline h2		{ font-size: 50px !important; } /*.text p { font-size: 18px !important; }*/ 
}

@media (max-width: 1050px) { 
	.cloud .text span,
	.beitrag .text span	{ font-size: 17px !important; }
	.headline span 		{ font-size: 19px; }

	.cloud .text h3,
	.headline h2,
	.beitrag h1			{ font-size: 46px !important; }

	.cloud .text p,
	.beitrag .text p 	{ font-size: 12px !important; }
	.maintext p 		{ font-size: 14px; }

	#intro 				{ margin-bottom: 60px; }
	.home #intro .right { padding-right: 0px; }

	#intro .subtext		{ bottom: 24px; /*bottom: 102px;*/ }
	#intro .subtext p	{ line-height: 40px; }

	#kontakt-text .subtext 	 { bottom: -34px; }
	#kontakt-text .subtext p { line-height: 56px; padding-left: 270px; }

	#kontakt-text p, 
	#kontakt-text span  { font-size: 32px; }
}

@media (max-width: 1000px) { 
	br.tablex 			{ display: block; }
	.cloud .text h3,
	.headline h2,
	.beitrag h1			{ font-size: 42px !important; }

	#slider-text		{ width: 26%; }

	#kontakt-text p, 
	#kontakt-text span  	 { font-size: 28px; }
	#kontakt-text .subtext 	 { bottom: -33px; }
	#kontakt-text .subtext p { line-height: 51px; padding-left: 230px; }
}

@media (max-width: 850px)  { 
	.cloud .text span,
	.beitrag .text span	{ font-size: 15px !important; }
	.headline span 		{ font-size: 17px; }

	.cloud .text h3,
	.headline h2,
	.beitrag h1			{ font-size: 38px !important; margin-bottom: 10px; }

	.cloud .text p,
	.beitrag .text p	{ font-size: 11px !important; }
	.maintext p 		{ font-size: 13px; }

	#intro .subtext		{ bottom: 29px; /*bottom: 100px;*/ }
	#intro .subtext p	{ font-size: 13px; line-height: 36px; }

	#kontakt-text p, 
	#kontakt-text span  	 { font-size: 24px; }
	#kontakt-text .subtext 	 { bottom: -27px; }
	#kontakt-text .subtext p { line-height: 43px; padding-left: 138px; }

	a.more,
	.cloud .text a.more { font-size: 13px; }
	a.more:before,
	.cloud .text a.more:before { top: 9px; width: 80px; }
}

@media (max-width: 800px)  { 
	.cloud .text h3,
	.headline h2,
	.beitrag h1			{ font-size: 34px !important; }
}





/* Tablet */
@media (max-width: 850px) {

	/*.section, .section.cloud { padding: 50px 30px; }*/
	.section 				 { padding: 0px 30px; }
	.section.cloud 			 { padding: 50px 30px; }

	#buttons.section 		 { padding: 0 30px; }

	/*.cloud-1 				 { padding-bottom: 110px !important; }*/
	.cloud-1 .img2 			 { margin-right: -30px; }

	.cloud-2 .text.absatz 	 { /*width: 84%;*/ width: 80%; }
	.cloud-2 .text.absatz h3 { margin-left: -21%; }


	#nav { left: calc(7.9% + 29px); }
}




/* Mobile Switch */
@media (max-width: 720px) {


	.dextop    { display: none !important; visibility: hidden; }
	.smaxphone { display: block !important; visibility: visible; }

	br { display: none; }
	br.mob, br.tablex { display: block; }

	#layer-bg { background: rgba(0,0,0,.3); }


	.section 		{ padding: 0px 20px 0 20px !important; }
	.section.cloud 	{ padding: 0px 20px 50px 20px !important; }
	#intro.section  { padding-top: 40px !important; }

	#content.startseite,
	#content.projekte { padding-bottom: 32px; }


/* Defaults */
	h1, h2, h3, h4, h5, h6,
	.cloud .text h3, .headline h2 {
		font-size: 31px;
		/*line-height: 0.95;*/
		/*letter-spacing: .05em;*/
		margin: 0 0 5px 0;
		/*margin-bottom: 5px;*/
	}
	.headline h2 { font-size: 31px !important; }

	.headline span,
	.cloud-text span, 
	.beitrag .text span {
		font-size: 14px;
		line-height: 2.2;
		padding-left: 55px;
	}
	.cloud-text span,
	.beitrag .text span { padding-left: 50px; }


	#intro a.more 				{ margin-left: 58px; }
	.cloud-text a.more,
	.overview .beitrag a.more	{ margin-left: 52px; margin-bottom: 12px; }

	.cloud .text a.more,
	.cloud-text a.more,
	a.more {
		padding-left: 51px;
		/*font-size: 16px;*/
		/*line-height: 2.125;*/
		/*letter-spacing: .3em;*/
	}
	.cloud .text a.more:before,
	.cloud-text a.more:before,
	a.more:before {		
		top: 9px; left: 0;
		height: 10px; width: 43px;
		background: url(../img/pfeil_right_mobile.svg) no-repeat 0px 0px;
		background-size: 100% auto;
	}

	.cloud .text a.more:hover:before,
	.cloud-text a.more:hover:before,
	a.more:hover:before { left: 1px; }


/* Header */
	#header { height: 100px; }

	a#logo {
		left: 20px; top: 39px; 
		margin-left: 0;
		width: 260px;
		height: 25px;
		z-index: 99999;
		/*background: url(img/logo.svg) no-repeat 0px 0px;*/
		/*background-size: 100% auto;*/
	}


/* Menu */
	#burger {
		position: fixed; top: 34px; right: 20px;
		width: 40px; /*height: 26px;*/ height: 32px;
		/*background: url(../img/icon_burger.svg) no-repeat;*//*background-size: 100% auto;*/
		z-index: 10001;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
	}

	#fixednav,
	#fixednav.fixed {
		position: fixed;
		top: 0;
		width: 100%;
		height: 100%;
		z-index: 9999;
		left: 0px;

		-webkit-transform: translate3d(100%,0,0);
				transform: translate3d(100%,0,0);
		opacity: 1;
		overflow-x: hidden;
		overflow-y: scroll;
		-webkit-overflow-scrolling: touch;
		-webkit-transition: all .3s;
		transition: all .3s;
	}
	.fixed #nav { opacity: 1; }

	.section-nav { height: 100%; }

	#nav { 
		background: #fff;
		/*z-index: 10000;*/
		position: absolute; top: 0; left: 0; width: 100%; height: 100%;
	}
	#nav.visible, .home #nav.visible,
	#fixednav.visible {
		-webkit-transform: translate3d(0%,0,0);
				transform: translate3d(0%,0,0);
		opacity: 1;
	}

	#nav ul					{ margin: 130px 0 52px 0; /*padding: 130px 0 100% 0; background: #fff;*/ }
	#nav ul li				{ display: block; margin-left: 110px; }
	#nav ul li a			{ 
		padding: 14px 0; 
		font: 21px/1 'Bureau Grot Wd Med';
		letter-spacing: 0.23em;
		display: block;
	}
	/*#nav ul li a:before 	{ content: ''; }*/
	/*#nav ul li a:hover 		{ text-decoration: underline; }*/

	#nav ul li a:before { top: 19px; left: -39px; }
	

	.single-projekt #nav li#menu-item-33 a   { margin-bottom: 0; }
	.single-projekt li#menu-item-33 a:before { top: 18px; }


	#nav-projekte {
		position: fixed;
		left: 0; top: 0;		
		width: 100%;
		/*height: 100%;*/
		height: calc(100% - 230px);
		/*padding-top: 175px;*/
		top: 230px;
		-webkit-transform: translate3d(-100%,0,0);
				transform: translate3d(-100%,0,0);
		/*z-index: 9999;*/
		/*background: rgba(125,0,0,.3);*/
		background: #fff;
		overflow-x: hidden;
		overflow-y: scroll;
		-webkit-overflow-scrolling: touch;
		-webkit-transition: all .3s;
		transition: all .3s;
		visibility: hidden;
	}
	#nav-projekte.hover {
		visibility: visible;
		-webkit-transform: translate3d(0%,0,0);
				transform: translate3d(0%,0,0);
	}

	#nav-projekte ul {
		padding-bottom: 30px;
	}
	#nav-projekte ul li a {
		display: block;
		/*font-family: 'Baskerville W01 Regular_705699';*/
		font-size: 17px;
		line-height: 46px;
		letter-spacing: .015em;

		padding-left: 60px;
	}

	#nav-projekte ul li,
	#nav-projekte ul li.visible,
	#nav-projekte ul li.visible-hover {
		height: auto;
	}
	#nav-projekte ul li a,
	#nav-projekte ul li.visible a,
	#nav-projekte ul li.visible-hover a {
		opacity: 1;
	}
	#nav-projekte ul li.visible a:before {
		left: 21px;
		top: 19px;
		width: 30px;
	}




/* Slideshows */
	#slideshow.section {
		padding: 0 0 0 20px;
	}
	/*#slider .slide { padding-left: 20px; }*/

	#buttons 		 { height: 66px; }
	#buttons.section { padding: 13px 20px 53px 20px; }

		.slick-prev, .slick-next {
			/*height: 47px;*/
			width: 47.5%;
		}
		.slick-prev::before, .slick-next::before {
			/*height: 47px;*/
			/*top: 20px;*/
			width: 84px;
		}


	#slideshow-headline {
		padding: 0 20px;
		margin-top: 0;
	}
	#slideshow-headline .slick-list { width: 100%; }
	#slideshow-headline h3 {
		color: #000;
		font: 26px/1.166 "Bureau Grot Wd Med";
		letter-spacing: 0.1em;
	}



/* Startseite */
	#intro 			{ margin-top: 0; margin-bottom: 0; }
	#intro.section 	{ padding-top: 65px; }

	#intro .left, #intro .right,
	.home #intro .right {
		float: none;
		width: 100%;
		padding: 0;
	}
	#intro .right,
	.home #intro .right { padding-left: 50px; padding-top: 43px; }


	.maintext p {
		font-size: 14px;
		/*line-height: 2.8125;*/
		line-height: 45px;
	}
	#intro .subtext {
		bottom: -24px;
		left: 0px;
		/*width: 340px;*/
		width: 100%;
	}
	#intro .subtext:not(*:root) { bottom: -22px } /* Android */
	#intro .subtext br { display: block; }

	#intro .subtext p, #kontakt-text .subtext p {
		/*font-family: "Baskerville W01 Regular_705699";*/
		font-size: 13px;
		line-height: 45px;
	}




/* Cloud = Slideshows */

.section.cloud,
.startseite .section.cloud-2 {
	margin: 0;
}

	.cloud .img, .cloud .img.hoch { 
		float: left !important;
		/*width: 100%;*/
		margin: 0 0 0 0 !important;
		padding-bottom: 32px;
		/*z-index: 4;*/
		clear: none;
	}
	.cloud-1 	 	{ padding-bottom: 0 !important; }
	/*.cloud-1 .img2 	{ margin-right: 0; }*/


	.cloud span.caption {
		/*position: absolute;*/
		/*height: 0px;*/
		/*font-family: 'Baskerville W01 Regular_705699';*/
		font-size: 13px;
		/*line-height: 1.23;*/
		/*letter-spacing: .015em;*/
		bottom: 2px !important;
		left: 0px !important;
		top: auto !important;
		right: auto !important;

		height: auto !important;
		width: 100%;
		text-align: center;
	}

	/*.cloud .text, .cloud .hoch .text {
		width: 100% !important;
		margin: 0 !important;
	}*/

	.cloud .slick-prev, .cloud .slick-next { top: -6px; }

	.cloud-text 			{ padding-top: 52px; }
	.projekte .cloud-text 	{ padding-top: 41px; }

	/*.section.cloud*/

	.cloud-text h3,
	.overview .beitrag h1 {
		/*font-size: 29px !important;*/
		/*font-size: 31px !important;*/
		line-height: 34px;
		/*margin-bottom: 1px;*/
		/*margin: 1px 0 0 3px;*/
		/*margin: 0 0 7px 3px;*/
		margin: 0 0 7px 0;
	}

	.cloud-text p,
	.beitrag .text p {
		font-size: 12px !important;
		padding-left: 50px;
		padding-right: 50px;
		margin-bottom: 10px;
	}
	.beitrag .text p {
		line-height: 1.4;
		padding-top: 0;
	}


/* Projekt */
	.projekt #slider-text,
	.blog #slider-text {
		/*position: absolute;
		bottom: -31px;*/
		position: relative;
		bottom: auto; 
		right: auto;
		width: 100%;
		/*margin: 0 -20px;*/
		margin: 16px 0 0 0;
		z-index: 999;
		/*background: rgba(125,0,0,.3);*/
	}
	.projekt #slider-text p,
	.blog #slider-text p {
		/*font-family: 'Baskerville W01 Regular_705699';*/
		font-size: 14px;
		line-height: 1.23;
		letter-spacing: 0;
		text-align: center;
	}
	.projekt #buttons.section,
	.blog #buttons.section { padding-top: 26px; }


	.page #intro .headline {
		margin-top: -20px;
		padding-left: 0;
	}

	#projekt-back { text-align: left; }
	#projekt-back a { margin: 90px 0 80px 40px; }



/* Aktuelles (Blog) */
	#blog-nav { height: 0; }

	.beitrag {
		padding: 0;
		/*margin: 41px 0 127px 0;*/
		margin: 41px 0 80px 0;
	}
		img.titelbild {
			float: none !important;
			width: 100% !important;
			margin-right: 0 !important;
		}
		.beitrag .text {
			position: relative !important;
			right: auto !important;
			bottom: auto !important;
			left: auto !important;
			top: auto !important;
			width: 100% !important;
			padding-left: 0px !important;
		}
			.overview .beitrag h1 {
				margin-left: 0;
				margin-right: 0;
			}

	#pagination { margin-bottom: 100px; }





/* BÜRO */

	#kontakt-text br { display: block; }

	#buero .img1 { float: none; margin: 50px 0 0 0; width: 100%; }
	#buero .img2 { float: none; margin: 20px 0 0 0; width: 100%; }

	#kontakt-text {
		position: relative; left: 0; top: 20px;
	}
		#kontakt-text p,
		#kontakt-text span {
			font-size: 18px;
		}
		#kontakt-text span {
			display: block;
			padding-bottom: 10px;
		}

		#kontakt-text .subtext {
			/*position: absolute;*/
			/*bottom: -33px;*/
			position: relative;
			bottom: auto;
			margin-top: 30px;
		}
			#kontakt-text .subtext p {
				font-size: 16px;
				line-height: 24px;
				padding-left: 0;
			}

	.buero #intro {
		margin-top: 0;
		margin-bottom: 50px;
	}
		.buero #intro .headline {
			/*margin-top: 20px; */
			margin-top: 0; 
		}


/* Impressum */
	.impressum #intro { margin-top: 0; margin-bottom: 100px; }


/* Footer */
	#network { height: 154px; }

}




@media (max-width: 340px) {

	#intro .subtext br { display: none; }

	a#logo { width: 210px; }


	#nav ul li { margin-left: 90px; }
	.single-projekt li#menu-item-33 a:before { height: 7px; left: -37px; top: 19px; }

	#nav-projekte ul li a 				 { padding-left: 41px; }
	#nav-projekte ul li.visible a:before { height: 7px; left: 8px; }

	#network p {
		font-size: 16px;
		line-height: 44px;
	}
}



/* Orientation Anpassungen
-------------------------------------------------------------- */

@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape) {
}
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) {
}

@media only screen and (max-device-width : 680px) and (orientation:landscape) {
	body { -webkit-text-size-adjust: 100%; }
}


@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation:landscape) {}
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation:portrait)  {}