

	/* not really working, flickering heights of .pages */
	body.iphone #stage {
		bottom: -20px;
	}
	@media screen and (orientation:portrait) {
		body.iphone #stage {
		bottom: -20px;
	}
	}
	#iphoneSpacer {
		height: 60px;
		width: 100%;
		position: absolute;
		left: 0;
		top: 100%;
		z-index: 1;
	}
	
		/*  */
		@media screen and (orientation:portrait) {
			body.iphone #stage div.page {
				min-height: 416px;
			}
		}
		@media screen and (orientation:landscape) {
			body.iphone #stage div.page {
				min-height: 256px;
			}
		}
	
	
	body.mobile > #contact_circle {
		display: none;
	}
	
	
	body.mobile #header {
		height: 39px;
	}
		body.mobile #header #logobig {
			display: none;
		}
		body.mobile #header h1 {
			display: none;
		}
		body.mobile #header ul.metanavigation {
			display: none;
		}
		body.mobile #header ul.navigation {
			display: none;
		}
		body.mobile #header div.toggletop {
			display: none;
		}
		body.mobile #header #logosmall {
			display: block;
			visibility: visible;
			opacity: 1;
			left: 10px;
		}
		body.mobile #header #loading {
			left: 13px;
		}
		body.mobile #header #loadingBig {
			display:none;
		}
		
	@media screen and (orientation:portrait) {
		body.mobile #header #logosmall {
			width: 26px;
		}
	}
	
	
	
	
	
	#mobileHeaderMain {
		position: absolute;
		left: 50%;
		width: 200px;
		margin-left: -100px;
		text-align: center;
		line-height: 36px;
	}
		#mobileHeaderMain a {
			font-size: 14px;
			text-decoration: none;
			color: #ada397;
			text-transform: uppercase;

			background-image: url(/img/mobile.mhm.bg.sprite@2.gif);
			background-size: 20px 72px;
			background-repeat: no-repeat;
			background-position: right top;
			padding-left: 20px;
			padding-right: 20px;
			
			display: inline-block;
			height: 36px;
			
			-webkit-transition: 0.2s background-position 0.2s;
		}
		#mobileHeaderMain.open a {
			background-position: right bottom;
		}
		
	#mobileHeaderMeta {
		position: absolute;
		right: 12px;
		top: 10px;
		width: 18px;
		height: 18px;
		
		text-decoration: none;

		background-image: url(/img/icons_mobile.png);
		background-position: 0px -287px;
		background-repeat: no-repeat;			
		
		-webkit-transition: 0.2s background-position 0.2s;
	}
		#mobileHeaderMeta.open {
			background-position: 0px -311px;
		}
	
	
	div.mobileNavi {
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		background-color: #eeebe9;
		box-shadow: 0px 0px 6px 0px #000000;
			
		z-index: 8000;
		overflow: hidden;
	}
		div.mobileNavi ul {
			list-style-type: none;
			margin: 0;
			padding: 0;
			margin-top: 39px;
		}
		div.mobileNavi ul li {
			text-transform: uppercase;
		}
		div.mobileNavi ul li a {
			text-decoration: none;
			color: #ada397;
		}
	
	#mobileNaviMain ul {
		font-size: 14px;
		line-height: 26px;
	}
		#mobileNaviMain ul li {
			text-align: center;
		}
		#mobileNaviMain ul li.active {
			background-color: white;
		}
		#mobileNaviMain ul li a {
			display: block;
			width: 100%;
		}
	
	#mobileNaviMeta {
		font-size: 12px;
		line-height: 24px;
		font-weight: 300;
	}
		#mobileNaviMeta ul {
			margin-top: 49px;
			margin-bottom: 10px;
			margin-right: 12px;
			text-align: right;
		}
			#mobileNaviMeta ul li {
			}
				#mobileNaviMeta ul li a {
				}
					#mobileNaviMeta ul li a span.icon {
						display: inline-block;
						background-image: url(/img/icons_mobile.png);
						background-repeat: no-repeat;
						width: 18px;
						height: 18px;
						margin-left: 10px;
						vertical-align: sub;
					}
			#mobileNaviMeta ul li#icon_share {
				display: none;
			}
	
	
	
	
	body.mobile #stage ul.filter {
		position: absolute;
		z-index: 100;
		width: 100%;
		left: 0;
		top: 68px;
		background-color: white;
		text-align: center;
		
		font-size: 14px;
		line-height: 26px;
		color: #ADA397;
		margin: 0;
		
		overflow: hidden;
		
		-webkit-transition: none;
		-moz-transition: none;
		-o-transition: none;
		-ms-transition: none;
		transition: none;
	}
		body.mobile #stage ul.filter li {
			display: block;
			margin: 0;
			padding: 0;
		}
		body.mobile #stage ul.filter li a,
		body.mobile #stage ul.filter li.active a,
		body.mobile #stage ul.filter li:hover a,
		body.mobile #stage ul.filter li a:hover {
			display: block;
			background-color: white;
			color: #ADA397;
			box-shadow: none;
			padding: 0;
			
			-webkit-transition: none;
			-moz-transition: none;
			-o-transition: none;
			-ms-transition: none;
			transition: none;
		}
	
		body.mobile #stage ul.filter li.active a {
			background-color: #ADA397;
			color: white;
		}
	
	
	
	body.mobile .page div.bar {
		margin-top: 39px;
		background-color: white;
		font-size: 14px;
		color: #ADA397;
		text-align: center;
		line-height: 28px;
		height: 28px;
		
		position: relative;
	}
	
		body.mobile .page div.bar a {
			text-transform: uppercase;
			text-decoration: none;
			color: #ADA397;
			height: 28px;
			padding-left: 10px;
			padding-right: 10px;
			display: inline-block;
		}
		
		body.mobile .page div.bar .center {
			margin: 0 auto;
		}
		body.mobile .page div.bar .left {
			position: absolute;
			left: 10px;
			top: 0;
		}
		body.mobile .page div.bar .right {
			position: absolute;
			right: 10px;
			top: 0;
		}


	a.openclose {
		background-image: url(/img/openclose@2.gif);
		background-size: 20px 56px;
		background-repeat: no-repeat;
		background-position: right 0px;
		
		padding-right: 20px !important;
		
		-webkit-transition: 0.2s background-position 0.2s;
	}
		a.openclose.open {
			background-position: right -28px;
		}



	/* folio */
	body.mobile  #folio ul.items {
		margin: 15px;
	}
	@media screen and (orientation:portrait) {
		body.mobile  #folio ul.items {
			margin: 25px;
		}
	}
	
	/* contact */
	body.mobile #contact #contact_circle {
		top:65px;
		right:0;
		left: 50%;
		margin-left: -160px;
		position: relative;
	}
	
	body.mobile  #contact div.margin {
		margin: 25px;
		margin-top: 85px;
	}
	
	
	
	/* statements */
	body.mobile #statements div.container {
		margin: 0;
		margin-top: 10px;
		padding-bottom: 10px;
		text-align: center;
	}
	
	body.mobile #statements div.container div.circle {
		margin: 10px auto;
		margin-top: 0;
		float: none;
	}
	
	
	/* prevent breaks while not js-modified*/
	body.mobile #clients .container {
		display: none;
	}
	
	body.mobile #clients div.containerMobile {
		color: #76695a;
		font-size: 12px;
		margin: 10px;
		margin-top: 49px;
		font-weight: 300;
	}
	
	body.mobile #clients div.containerMobile ul {
		list-style-type: none;
		margin: 0;
		padding: 0;
		margin-bottom: 10px;
	}
	
	body.mobile #clients h1,
	body.mobile #clients a {
		position: relative;
		text-decoration: none;
		height: 26px;
		display: inline-block;
		padding-left: 7px;
		padding-right: 4px;
		text-decoration: none;
		text-transform: uppercase;
		
		font-weight: 300;
		font-size: 14px;
		color: #ada397;
		
		-webkit-transition: all 0.4s;
		-moz-transition: all 0.4s;
		-o-transition: all 0.4s;
		-ms-transition: all 0.4s;
		transition: all 0.4s;
	}
	
	
	body.mobile #clients > div > a {
		margin-right: 15px;
		margin-top: 0.7em;
		margin-bottom: 0.7em;
	}
	
	
	body.mobile #clients > div > div > h1,
	body.mobile #clients > div > a.active,
	body.mobile #clients > div > a:hover {
		background-color: #ADA397;
		color: white;
		box-shadow: inset 2px 2px 5px 0px #8F8477;		
	}
	
	body.mobile #clients a span,
	body.mobile #clients h1 span {
		background-color: #EEEBE9;
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 8px;
		border-top-left-radius: 8px;
	}
	
	body.mobile #clients div ul li:last-child {
		margin-top: 10px;
	}
	
	@media screen and (orientation:landscape) {
		body.mobile #clients div.containerMobile > div {
			float: left;
			width: 230px;
		}
		body.mobile #clients div.containerMobile > a {
			display: none;
		}
	}
	@media screen and (orientation:portrait) {
		body.mobile #clients div.containerMobile > div > h1 {
			display: none;
		}
		
		body.mobile #clients div.containerMobile > div {
			position: absolute;
			left: 10px;
			top: 93px;
			opacity: 0;
			-webkit-transition: opacity 0.5s;
		}
		body.mobile #clients div.containerMobile > div.active {
			opacity: 1;
			-webkit-transition: 0.5s opacity 0.5s;
		}
	}
	
	
	/* pdf folio + vita */
	body.mobile #pdf {
	}
	
	body.mobile #pdf p {
		width: 100%;
		text-align: center;
		margin-top: 80px;
		font-size: 12px;
		color: #8e8478;
	}
	
	body.mobile #pdf div.pdf {
		position: absolute;
		left: 30px;
		top: 140px;
		
		margin-left: -40px;
		
		width: 80px;
		height: 80px;
		
		background-color: #948a80;
		color: #eceaeb;
	}
		body.mobile #pdf div.pdf div.table {
			display: table;
			height: 100%;
			width: 100%;
		}
		body.mobile #pdf div.pdf a {
			display: table-cell;
			vertical-align: middle;
			color: #eceaeb;
			text-decoration: none;
		}
	body.mobile #pdf div.lang {
		position: absolute;
		left: 63px;
		top: 50px;
		
		font-size: 12px;
		text-transform: uppercase;
		
		line-height: 27px;
		
		width: 28px;
		height: 28px;
		
		background-color: #67554b;
		opacity: 0.9;
		
		color: white;
	}
	
	body.mobile #pdf div.pdf.de {
		left: 30%;
	}
	body.mobile #pdf div.pdf.en {
		left: 70%;
	}
	
	
	/* folio_view */
	body.mobile #folio_view {
		overflow: hidden;
	}
	
	body.mobile #folio_view div.align {
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		margin: 0;
		-webkit-transition: none;
	}
	
	body.mobile #folio_view .images {
		top: 89px;
		left: 0;
		height: 220px;
	}
	
	body.mobile #folio_view div.data {
		top: 310px;
		background-color: none;
		box-shadow: none;
	}
		body.mobile #folio_view div.data .infos {
			left: 10px;
		}
			body.mobile #folio_view div.data .infos > div > div {
				width: 200px;
			}
			@media all and (orientation:landscape) {
				body.mobile #folio_view div.data .infos > div > div {
					width: 300px;
				}
			}
			body.mobile #folio_view div.data .infos div.tab {
				width: 70px;
			}
		body.mobile #folio_view div.data .sliderbullets {
			left: 30px;
		}
	
	@media all and (orientation:landscape) {
		body.mobile #folio_view div.images {
			top: 67px;
			box-shadow: none;
		}
		
		body.mobile #folio_view div.data {
			bottom: 0;
			top: initial;
			pointer-events: none;
			-webkit-transition: opacity 0.5s;
			
			background-color: rgba(246,245,244,0.95);
			
			box-shadow: 0px 0px 8px 0px #b3aca4;
		}
		body.mobile #folio_view div.data.hidden {
			opacity: 0;
		}
	}
	
	/* about */
	
	body.mobile #about {
		overflow: visible;
	}
	
	body.mobile #about .job_bg {
		background-image: url(/img/about.job.background.mobile.jpg);
	}
	body.mobile #about .fun_bg {
		background-image: url(/img/about.fun.background.mobile.jpg);
		background-position: center center;
	}
	
	body.mobile #about div.circle.clients {
		display: none;
	}
	body.mobile #about div.circle.pdf {
		display: none;
	}
	
		body.mobile #about .section.job {
			overflow: hidden;
		}
	
		body.mobile #about .fun_bg {
			position: absolute;
			top: 100%;
			bottom: inherit;
			height: 100%;
			width: 100%;
		}
		body.mobile #about .section.fun {
			position: absolute;
			top: 100%;
			width: 100%;
			overflow: hidden;
		}
		body.mobile #about .section.fun .move {
			position: absolute;
			height: 100%;
			width: 300%;
			left: -33%;
		}
		body.mobile #about .section.fun .move .circle {
			pointer-events: none;
		}
	

	
	body.mobile #about .XSlider {
		top: 49px;
		left: 50%;
		margin-left: -151px !important;
		bottom: initial;
	}
	body.mobile #about .sliderbullets {
		left: 50%;
		margin-left: -34px;
		bottom: initial;
		top: 360px;
	}
	
	body.mobile #about div.circle.lang.en {
		left: 50%;
		top: 332px;
		margin-left: 72px;
	}
	body.mobile #about div.circle.lang.de {
		left: 50%;
		top: 310px;
		margin-left: 102px;
	}
	
	body.mobile #about .section.job .circle.info {
		background-color: #4C4135;
		color: #EEEBE9;
		width: 70px;
		height: 70px;
		font-size: 12px;
		text-transform: uppercase;
		font-weight: 300;
		opacity: 0.75;
		
		position: absolute;
		left: 20px;
		bottom: 20px;
		
		display:table;
		text-align: center;
	}
	
	body.mobile #about .section.job .circle.info span {
		display: table-cell;
		vertical-align: middle;
		height: 100%;
		width: 100%;
	}
	
	
	div#contact a:hover {
		background-color: transparent !important;
	}
	
	
	body.mobile #vorschalt {
		display: block;
		position: absolute;
		width: 100%;
		top: 0;
		left:0;
		bottom:0;
		z-index: 100000;
		background-color: #eae7e5;
		
		background-image: url(/img/vorschalt.bg@2.gif);
		background-size: 210px 280px;
		background-position: center;
		background-repeat: no-repeat;
		
		overflow: hidden;
	}
	
/* 	body.mobile.iphone #vorschalt {
		bottom: -60px;
	}; */
	