@charset "utf-8";


@font-face{
    font-family:"HelveticaNeueW01-45Ligh";
    src:url("fonts/5a13f7d1-b615-418e-bc3a-525001b9a671.woff2") format("woff2"),url("fonts/530dee22-e3c1-4e9f-bf62-c31d510d9656.woff") format("woff");
}
@font-face{
    font-family:"Helvetica Neue LT W05_35 Thin";
    src:url("fonts/7d63ccf8-e0ae-4dee-ad4d-bbc798aa5803.woff2") format("woff2"),url("fonts/b2c1327f-ab3d-4230-93d7-eee8596e1498.woff") format("woff");
}


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	/*font: inherit;
	*/vertical-align: baseline;
	scroll-behavior: smooth;
}

/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

* {
 	padding: 0; margin: 0;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
/*
@font-face {
	font-family: 'HelveticaNeueLight';
	src: url('../media/font.eot');
	src: url('../media/font.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
*/

html{
    max-width:100%;

    height:100%;width:100%;
    /*
    -webkit-touch-callout: none;
    -ms-content-zooming: none;
    -ms-touch-action: none;
    touch-action:none;
    */
    /*
    -webkit-touch-callout: none;
    touch-action:none;
    -webkit-user-drag: none;
    max-width:100vw;
    */
    overflow:hidden;

}

body {
    /*-webkit-user-drag: none;*/

    /*-webkit-overflow-scrolling: touch;*/
position: relative;
    max-width:100%;
	height: 100%; margin:0px;
    width:100%;
    /*
	touch-action:none;
	-ms-touch-action:none;
	-webkit-user-drag:none;*/
	-ms-user-select: none;
    background-color:#000000;
	font-size: calc(6px + (10 - 6) * ((100vw - 300px) / 2200));
	/*font-size:10px; !* davon abgeleitet, werden alle anderen Fontgr��en in % dargestellt *!*/
	font-family: 'HelveticaNeueW01-45Ligh', HelveticaNeue, Helvetica, Arial, sansserif;
	font-weight:normal;
	font-style: normal;
	line-height:18px;
	overflow-x:hidden;
	overflow-y:scroll;

}


/* ################################### Color Classes */


.fgWhite {	color:#FFFFFF;	}

.fgLightGrey {	color:#848484;	}

.fgDarkGrey {		color:#505050;	}

.fgErrRed {  color:#ff0000;  }

.fgOKGreen {  color:#00bb00;  }


.bgWhite {	background-color:#FFFFFF;	}

.bgBlack {		background-color:#000000;	}


/* ################################### Link Classes */

a {
	text-decoration:none;
	font-weight:bold;
	color:#404040;
}

/* ################################### Font-size Classes */

h1 {
	font-size:360%;
	padding:0px;
	font-weight:normal;
	font-style: normal;
	line-height:140%;
	margin:0px;
}


.textInnerH1Sub {
	font-size:50%;
	padding:0px;
	font-weight:normal;
	font-style: normal;
	margin:0px;
	padding-left:3px;
}

.textH1Sub {
	font-size:180%;
	padding:0px;
	font-weight:normal;
	font-style: normal;
	margin:0px;
}

.textTopSub {
	font-size:180%;
	padding:0px;
	font-weight:normal;
	font-style: normal;
	line-height:150%;
	margin:0px;
}

.textContent {
	font-size:180%;
	padding:0px;
	font-weight:normal;
	font-style: normal;
	line-height:150%;
	margin:0px;
}

.textContent h1 {
	font-size:180%;
	padding:0px;
	font-weight:normal;
	font-style: normal;
	line-height:140%;
	margin:0px;
	padding-bottom:45px;
}

.textContent h2 {
	padding:45px 0px;
	font-weight:normal;
	font-style: normal;
	line-height:140%;
	margin:0px;
}

.textContent h3 {
	padding:0px;
	padding-bottom:35px;
	font-weight:bold;
	font-style: normal;
	line-height:140%;
	margin:0px;
}


/* ################################### Content & Startseite */

		#all {
			/*position:absolute;
			top:0px;left:0px;
			width:100%;
			overflow-x:hidden;
			height:101%;*/
		}

		.logo {
					/*position:absolute;top:0px;left:0px;width:272px;height:101px;*/
					position:absolute;
					/*top:65px;left:60px;*/
					/*width:210px;height:34px;*/
					/*background-image:url(../media/logo.png);*/
					background-position:bottom left;
					background-repeat:no-repeat;
					z-index:8000;
					cursor:pointer;
					width: auto; height: auto; top: 5%; left: 5%; line-height: initial;
					text-shadow: grey 0.5px 0.5px;

		}
		.logoBig{
			font-size: 300%;
		}
		.logoSmall{
			font-size: 225%;
		}

		#legal {
					display: flex;
					align-items: center;
					position:fixed;
					color:#ffffff;
					bottom:1%;left:5%;
					width:auto;height:34px;
					font-size:170%;
					z-index:9000;
					text-shadow: 1px 1px 2px #646464;
					cursor:pointer;
		}

		#infoText2 {
				float:left;
				color:#ffffff;
				background-color:#000000;
				font-size:150%;
				padding: 18px 18px 20px 21px;
				cursor:pointer;
		}


		.menusmall {
					display: flex;
					justify-content: flex-end;
					position:fixed;
					bottom:0px;
					right:0px;
					width:auto;
					height:56px;
					background-color:black;
					/*padding-right:25px;*/
					z-index:8000;
					float:right;
					overflow:hidden;
		}

		#impressumMM{
			display: none;
		}
		#dsMM{
			display: none;
		}



		.symsmall {
			position:relative;
			/*background-color:#000000;*/
			padding: 16px 18px 19px 21px;
			min-width:28px;
			min-height:30px;
			background-position:top left;
			background-repeat:no-repeat;
			z-index:8000;
			cursor:pointer;
			float:left;
		}


		.menubig {
				position:fixed;
				top:-100%;left:0px;
				width:100%;height:80px;
				background-color:#000000;
				z-index:8000;
				/*text-align:right;*/
				display:block;
				float:left;
		}

		#menubigLogo {
				top:23px;
				left:60px;
				position:absolute;
				bottom:20px;left:5%;
				width:210px;height:34px;
				/*background-image:url(../media/logo.png);*/
				background-position:bottom left;
				background-repeat:no-repeat;
		}

		.menubig ul {
				display:flex;
				flex-direction: row-reverse;
				position:absolute;
				bottom:32px;
				/*float:right;*/
				right:50px;
				width:800px;
				font-size:220%;
				padding-top:30px;
				list-style-type:none;
				white-space: nowrap;
				cursor:pointer;
		}

		.menubig li, .menubig a{
				padding-left:10%;
				list-style-type:none;
				white-space: nowrap;
				/*float:left;*/
				/*float:right;*/
				color:#ffffff;
		}

		.nomenu li, .nomenu a{
			/*padding-left:0px;*/
			list-style-type:none;
			white-space: nowrap;
			/*float:left;*/
			float:right;
			color:#ffffff;
		}



.menubigSub {
				position:fixed;
				top:80px;left:0px;
				width:100%;height:40px;
				background-color:#000000;
				z-index:8000;
				text-align:right;
				display:block;
				float:left;
		}

		.menubigSub ul {
				position:absolute;
				/*bottom:32px;*/

				right:50px;
				/*width:950px;*/
				font-size:160%;
				/*padding-top:30px;*/
				list-style-type:none;
				white-space: nowrap;
				cursor:pointer;
		}
		.menuspacing{
				padding-right: 0 !important;
		}

		.menubigSub li{
				padding-right:100px;
				list-style-type:none;
				white-space: nowrap;
				float:left;
				color:#ffffff;
		}

		.cElem {
				position:relative;
				width:900px;
				left:50%;
    			margin-left:-450px;
 				/*border: 2px solid #ff00ff;		*/
		}

		/*.topHeadLine {*/
		/*		padding-top:50px;*/
		/*}*/

		#simpleProjMainPic{
					left:0px;
					top:0px;
					width:100%;
					height:auto;
					background-size: cover;
					background-color:#FFFFFF;
					background-repeat: no-repeat;
					background-position: bottom center;
					overflow:hidden;
		}

		.pListThumb{
					position:relative;
					width:275px;
					height:174px;
					color:#ffffff;
					background-color:#000000;
					background-size: 100% 100%;
					background-repeat: no-repeat;
					background-position: top center;
					overflow:hidden;
					float:left;
					margin-right:20px;
					margin-bottom:20px;
					cursor:pointer;
		}

		.pListThumb p {
				position:absolute;
				bottom:0px;
				height:auto;
				width:100%;
				left:0px;
			padding-left: 10px !important;
				background-color:#000000;
				color:#ffffff;
				padding-left:1px;
				font-size:90%;
				float:left;
				cursor:pointer;
		}

		.projectsClearFix {
				clear:both;
				margin-bottom:30px;
		}

		#content {
					position:absolute;
					left:0px;
					top:100%;
					margin:-160px 0px 0px 0px;
					width:100%;
					height:auto;
					z-index:5000;
					display:none;

        }

		#content img{
			width:100%;
			height:auto;
		}

		#contentHeaderTrans{
			display:flex;
			align-items: center;
			left:0px;
			top:0px;
			width:100%;
			height:160px;
			background-color:#000000;
		}

		.scrollFadeOut{
			transition: all 400ms;
			opacity: 0;
		}

		.fadeOut{
			opacity: 0.8;
		}

		#contentHeader{
					width:100%;
					background-color:#000000;
					padding:2.5px 0px 2.5px 0px;
					height:auto;
		}

		#contentMain {
					height:auto;
					width:100%;
					left:0px;
					/*border: 2px solid #ff0000;*/
					background-color:#ffffff;
		}

		.contentBlock {
					padding:70px 0px 50px 0px;
		}

		.contentBlock table {
					border:none;
					width:100%;
		}

		.contentBlock table td:first-child{
					width:30%;
					text-align:left;
					padding-right:30px;
		}

		.contentBlock table td{
					padding-bottom:15px;
					text-align:left;
					/*padding-left:30px;*/
		}

		.contentBlock table td h5{
					font-size:90%;
					line-height:120%;
					font-weight:normal;
					color:#999;
		}


		.contentGalleryWrapper{
			width:100%;
			height:550px;
			overflow:hidden;
			background-color:#000000;
			padding:25px 0px 25px 0px;
		}



		#contentGalleryWrapperInner{
			position:relative;
			top:0px;
			height:100%;
			float:left;
			background-repeat:no-repeat;
			background-position:center center;
		}

		.contentGallerySlider{
			width: 100%;
			height:100%;
		}

		.contentGallerySlider .slider {
			width: 100%;
			height: 100%;
		}

		.contentGallerySlider .slider .item {
			position: relative;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			margin: 0 0 0 0;
			background: #000;
			background-size: contain;
			background-repeat: no-repeat;
			background-position: center center;
		}

		#contentGallerySlideRight {
			margin-top:222px;
			margin-right:-80px;
			width:53px;
			height:105px;
			z-index:5001;
			background-image:url(../media/pfeil-rechts.png);
			background-position:top left;
			background-repeat:no-repeat;
			float:right;
		}

		#contentGallerySlideLeft {
			margin-top:222px;
			margin-left:-80px;
			width:53px;
			height:105px;
			z-index:5001;
			background-image:url(../media/pfeil-links.png);
			background-position:top left;
			background-repeat:no-repeat;
			float:left;
		}

		.contentWrapper{
			width:100%;
			height:auto;
			min-height:300px;
			overflow:hidden;
			padding:25px 0px 25px 0px;
		}


		.singlePageNoSlider{
			padding-top:70px;
		}

		.singlePageNoSliderWithSubMenu{
			padding-top:120px;
		}


		.minimalTable td{
				padding-top:5px;
				padding-bottom:5px;
				padding-right:30px;
				vertical-align:top;
		}

		.minimalTable td:first-child{
				white-space:nowrap;
				min-width:100px;
		}

		.awards td{
				min-width:40%;
				padding-bottom:40px !important;
		}


		.imgChanger {
				/*margin-bottom:35px;*/
		}

		.imgChanger img {
				margin-top:30px;
		}

		.imgChanger .but {
				width:auto;
				min-width:100px;
				height:30px;
				background-color:#999;
				color:#fff;
				padding:5px 10px;
				font-size:140%;
				cursor:pointer;
				float:left;
		}

		.imgChanger .butactive {
				background-color:#000;
				color:#fff;
		}

		#bueroMS, #bueroAH, #bueroTeam {
				display:none;
		}



		.bueroBut {
				width:auto;
				min-width:100px;
				height:30px;
				background-color:#333;
				color:#fff;
				padding:0px 20px;
				font-size:80%;
				cursor:pointer;
				float:left;
		}

		.bueroButActive {
				background-color:#fff;
				color:#000;
		}

		.teamWrapper {
			display:none;
		}

		.teamBut {
				width:33%;
				min-width:100px;
				height:110px;
				background-color:#000;
				color:#fff;
				padding:30px 30px;
				text-align:center;
				font-size:100%;
				font-weight:normal;
				font-style: normal;
				line-height:140%;
				cursor:pointer;
				float:left;
		}


/*******************************************   ios Slider  ***************************************/
	#startSliderWrapper{

        /*-webkit-user-drag: none;*/
        /*-webkit-overflow-scrolling: auto !important;*/
,
        -webkit-overflow-scrolling: touch;
        /*touch-action: none;*/
        /*-webkit-touch-callout: none;*/
		position:absolute;
		left:0;
		top:0;
		width: 100%;
		height:100%;
		margin: 0 0 0 0;
		padding: 0 0 0 0;
		overflow:hidden;
		background-color:#000000;
        display:block;
        float:left;

    }

	.startSlider{
        /*position: relative;*/
        /*overflow:hidden;*/
        width: 100%;
		height:100%;
        max-width:100%;
	}

	.startSlider .slider {
		width: 100%;
		height: 100%;
	}

	.startSlider .slider .item {


		position: relative;
		top: 0;
		left: 0;

        /*
		!*position:absolute;*!
		!*top: 0;*!
		!*left: 0;*!
		width: 100%;
		height: 100%;
		margin: 0 0 0 0;
		padding: 0 0 0 0;
		background: #ffffff;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: bottom center;
        */
        float: left;
        overflow: hidden;
        width: 100%;
        display: block;
        margin: auto;
        height: 100%;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
	}



#slideLeft {
	position:absolute;

	top:45%;left:6%;
	width:53px;
	height:7.5%;

	z-index:5000;
	background-image:url(../media/pfeil-links.png);
	background-position:center left;
	background-repeat:no-repeat;

    /*top:0;*/
    /*left:0;*/
    /*width: 50%;*/
    /*height: 100%;*/
    /*display: flex;*/
    /*flex-flow: row;*/
    /*justify-content: flex-end;*/
    /*align-items: center;*/
    /*align-content: center;*/
    /*padding-left:4%;*/

}

#slideRight {

	position:absolute;

	top:45%;
	right:6%;
	width:53px;
	height:7.5%;

	z-index:5000;
	background-image:url(../media/pfeil-rechts.png);
	background-position:center right;
	background-repeat:no-repeat;

    /*top:0;*/
    /*right:0;*/
    /*width: 50%;*/
    /*height: 100%;*/
    /*display: flex;*/
    /*flex-flow: row;*/
    /*justify-content: flex-end;*/
    /*align-items: center;*/
    /*align-content: center;*/
    /*padding-right:4%;*/
}

#infoText1{
	font-size:150%;
	color:#ffffff;
}

#scrollDown{

	left: 45%;
	bottom: 0%;
	padding: 16px 18px 19px 18px;
	min-width:28px;
	min-height:30px;
	background-position:top left;
	background-repeat:no-repeat;
	z-index:8000;
	cursor:pointer;
}
@media screen and (max-width: 1180px){
	  body { 			font-size:8px; 		}

		#legal{ display: none; }
		#infoText2 {display: none;}

		.logo {				}
		#menubigLogo {			background-size: 75% 75%;	bottom:	25px;}

		.cElem {
				width:80%;
	   			margin-left:10%;
				left:0%;
				padding-left: 5%;
				padding-right: 5%;
		}

		#contentGallerySlideRight, #contentGallerySlideLeft {
			width:38px; height:75px;
			background-size:contain;
            position: absolute;
            top:45%;
		}

    #contentGallerySlideRight {
        right:-10%;
        margin-top:0;
        margin-right:0;
    }

    #contentGallerySlideLeft {
        left:-10%;
        margin-top:0;
        margin-left:0;
    }


    /*#slideRight, #slideLeft {*/
		/*	width:180px;*/
		/*	height:75px;*/
		/*	padding-right:55px;*/
		/*	padding-top:30px;*/
		/*	background-size:contain;*/
		/*}*/

		.pListThumb{
					width:30%;
					height:auto;
		}

		.pListThumb p {
				font-size:80%;
		}

	.menubig li{
		padding-left: 5%;
	}
	.awards	tr td {
		padding: 0;
		display: block;
		width: 100%;
	}

	.contentBlock table td:first-child{
		width: 100%;
	}

	.projTable table tbody tr td {
		width:45% !important;
	}

}

@media screen and (max-width: 768px){

	.logo{
		width: 100%;
		background: transparent;
	}
	.logochange{
		position: fixed;
		z-index: 10000;
		left: 0px;
		top: 0px;
		background: black none repeat scroll 0% 0%;
		height: 40px;
	}
	.logochange .logoBig{
		margin-left: 5%;
	}
	.logoBig{
		/*margin-left: 5%;*/
		position: relative;
		top: 5px;
	}
	.logoSmall{
		position: relative;
		top: 5px;
	}

	#contentMain {
		padding-bottom: 10%;
	}

	.singlePageNoSlider{
		padding-top:5%;
		padding-bottom: 10%;
	}

	.singlePageNoSliderWithSubMenu{
		padding-top: 15%;
		padding-bottom: 10%;
	}

	.textContent h1 {
		padding-top: 10px;
		padding-bottom:5%;
	}

	#slideRight{
		padding-top: 24px;
		padding-right: 0px;
		padding-left: 50px;
	}


	#menubigLogo {
		left: 5%;
	}
	#menubigLogo .logoBig{
		margin-left: 0px;
	}


	.menubig{
		height: 92%;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}

	.menusmall {
		display: flex;
		justify-content: space-evenly;
		align-items: center;
		position:fixed;
		bottom:0px;
		right:0px;
		width:100%;
		height:8%;
		background-color:black;
		/*padding-right:25px;*/
		z-index:8000;
		float:right;
		overflow:hidden;
	}

	.menubigSub{
		top: 40px;
		height: 70px;
	}

	.menubigSub ul{
		display: flex;
		flex-direction: row;
		justify-content: space-evenly;
		align-items: center;
		right: 0px;
		left: 0px;
		flex-wrap: wrap;
		width: auto;
		height: 70px;
	}

	.menubigSub li{
		padding-right: 5%;
	}

	.menubig ul{
		font-size: 300%;
		line-height: 3rem;
		flex-direction: column-reverse;
		padding-top: 0;
		right:0px;
		width: auto;
		bottom:auto;
		position: relative;
		align-items: flex-start;
		padding-left: 5%;
	}

	.menubig li{
		padding-left: 0px;
	}

	.menubig li, .menubig a{
		padding-left:0px;
		list-style-type:none;
		white-space: nowrap;
		/*float:left;*/
		float:right;
		color:#ffffff;
	}

	.nomenu li, .nomenu a{
		/*padding-left:0px;*/
		list-style-type:none;
		white-space: nowrap;
		/*float:left;*/
		float:right;
		color:#ffffff;
	}

	#simpleProjMainPic{

		height: 400px !important;

	}

	#dsMM{
		display: block;
		font-size: 50%;
		line-height: 50%;
	}
	#impressumMM{
		display: block;
		font-size: 50%;
	}

	.pListThumb{
		margin-bottom: 10px;
		margin-right: 1%;
		margin-left: 1%;
		margin-top: 1%;
		width: 48%;

	}
	.awards tr td {
		padding: 0;
		display: block;
		width: 100%;
	}

	.awards .contentBlock table td:first-child{
		width: 100%;
	}

	.bueroFlex{
		display: grid;
		grid-template-columns: 1fr 1fr;
		text-align: center;
	}

	.bueroBut{
		display: flex;
		justify-content: center;
		align-items: center;
	}

	#contentGallerySlideRight, #contentGallerySlideLeft{
		/*display: none;*/
	}

	.contentGallerySlider{
		position: static !important;
		/*overflow: clip !important;*/
	}
    #contentGallerySlideRight {
        width:2rem;
        height:2rem;
    }

    #contentGallerySlideLeft {
        width:2rem;
        height:2rem;
    }

	.projTable table tbody tr td {
		width:45% !important;
	}

}




@media screen and (max-width: 1300px) {
	#simpleProjMainPic {

		height: 400px !important;

	}
}


/*
@media screen and (max-width: 1024px) {
    #startSliderWrapper .startSlider {
        touch-action: none;
    }
    #startSliderWrapper .startSlider .slider {
        touch-action: none;
    }
    #startSliderWrapper .startSlider .slider .item {
        touch-action: none;
    }

}
*/


