/* ##################################################################### */
/* #### Fonts ########################################################## */

	/* open-sans-regular - latin */
	@font-face {
		font-family: 'Open Sans';
		font-style: normal;
		font-weight: 400;
		src: url('../fonts/open-sans-v34-latin-regular.eot'); /* IE9 Compat Modes */
		src: local(''),
			url('../fonts/open-sans-v34-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
			url('../fonts/open-sans-v34-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
			url('../fonts/open-sans-v34-latin-regular.woff') format('woff'), /* Modern Browsers */
			url('../fonts/open-sans-v34-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
			url('../fonts/open-sans-v34-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
  }
  /* open-sans-700 - latin */
  @font-face {
		font-family: 'Open Sans';
		font-style: normal;
		font-weight: 700;
		src: url('../fonts/open-sans-v34-latin-700.eot'); /* IE9 Compat Modes */
		src: local(''),
		 	url('../fonts/open-sans-v34-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 	url('../fonts/open-sans-v34-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
		 	url('../fonts/open-sans-v34-latin-700.woff') format('woff'), /* Modern Browsers */
		 	url('../fonts/open-sans-v34-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
		 	url('../fonts/open-sans-v34-latin-700.svg#OpenSans') format('svg'); /* Legacy iOS */
  }

/* ############################################################## */
/* #### HTML5 display definitions ############################### */

	article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary { display: block; }


/* ############################################################## */
/* #### Base #################################################### */

	html{
		overflow-y: scroll; /* Scrollbar */
		color:#777;
		background-color:#000;
		font-size: 16px;
		line-height: 1.4;
		/*
		Prevents iOS text size adjust after orientation change, without disabling user zoom
		www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/
		*/
		-webkit-text-size-adjust:100%;
		-ms-text-size-adjust: 100%;
	}

	html, button, input, select, textarea{
		/* addresses font-family inconsistency between form elements. */
		font-family:'Open Sans', helvetica, arial, sans-serif;
	}

	body{
		margin:0; /* addresses margins handled incorrectly in IE6/7 */
	}

	/* Remove text-shadow in selection highlight. These selection declarations have to be separate. */
	::-moz-selection{ background: #b3d4fc; text-shadow: none; }
	::selection{ background: #b3d4fc; text-shadow: none; }


/* ############################################################## */
/* #### Allg. Formatierungen #################################### */

	/*###
	//# Links
	###*/

	a{ color:#acacac; text-decoration:none; }
	a:hover{ color: #777; }
	/*
	a:visited{ color: #551a8b; }
	*/
	a:focus{ outline: thin dotted; } /* Addresses outline displayed oddly in Chrome */
	a:hover, a:active{ outline: 0; } /* Improve readability when focused and hovered in all browsers: h5bp.com/h */


	/*###
	//# Typography
	###*/

	/* h1 nur als Signet, s.u. */
	h2{
		font-size:1em;
		margin:0 0 0 0;
	}
	h3{
		font-size:22px;
		font-weight:normal;
		/*text-transform:uppercase;*/
		padding-top:75px;
		margin:-75px 0 10px 0;
	}

	p{ margin: 0 0 1em 0; }

	b, strong{ font-weight:bold; }

	small{ font-size: 85%; }

	/* Position subscript and superscript content without affecting line-height: h5bp.com/k */
	sub, sup{ font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
	sup{ top: -0.5em; }
	sub{ bottom: -0.25em; }


	/*###
	//# Lists
	###*/

	ul, ol{ margin: 1em 0; padding: 0 0 0 40px; }
	dd{ margin: 0 0 0 40px; }


	/*###
	//# Embedded content
	###*/

	img{
		width:100%; height:auto; margin-bottom:20px;
		border: 0; /* Removes border when inside 'a' element in IE6/7/8/9, FF3 */
		-ms-interpolation-mode: bicubic; vertical-align: middle; /* Improves image quality when scaled in IE7 */
	}
	.backlink img{ width:50px; }

	/*###
	//# Figures
	###*/
	
	figure{ margin:0; } /* Set margin to 0. Addresses margin not present in IE6/7/8/9, S5, O11 */


	/*###
	//# hr ("paragraph-level thematic break")
	###*/

	div.divider{ margin: 2em 0; background-color:#ccc; height:1px; overflow:hidden; }
		div.divider hr{ display:none; }

	
	/*###
	//# Tables
	###*/

	table { border-collapse: collapse; border-spacing: 0; }
	td { vertical-align: top; }
	

/* ############################################################## */
/* #### non-semantic helper classes ############################# */

	.clearer{ clear:both; }
	.align-right{ text-align:right; }
	.align-center{ text-align:center; }

	/* Contain floats: h5bp.com/q */
	.clearfix:before, .clearfix:after{ content: ""; display: table; }
	.clearfix:after{ clear: both; }
	.clearfix{ *zoom: 1; }



/* ############################################################## */
/* #### Gestaltungsraster ####################################### */

	/*###
	//# L / Default width
	###*/
		body{ min-width:1230px; } /* For old IE */
		div.centered{ position: relative; margin: 0 auto; width:1200px; }
		
			header{
				position:fixed; top:0; left:0; width:100%; min-width:700px; background-color:#777; z-index:1;
				border-bottom:1px solid #ccc; padding:30px 0 10px 0;
			}
				h1{ line-height:20px; margin:0; float:left; text-transform:uppercase; font-size:18px; font-weight:normal; }
					h1 img{ display:block; height:20px; width:auto; margin:0; }
					h1 strong{ font-weight:bold; }
					h1 span.hidden{ display:none; }
	h1 span.smaller{ text-decoration:none; font-size:13px;  }
					h1 a{ color:#fff; }
					h1 a:hover{ color: #999; }


				nav#mainnav{ float:right; padding:2px 0 0 0; }
					nav#mainnav ul{ margin:0; padding:0; list-style:none; }
						nav#mainnav li{ margin:0 0 0 15px; padding:0; display:inline; }
							nav#mainnav a{ color:#fff; }

	
			div#stage{ padding: 80px 0 20px 0; }

				.project{ border-bottom:1px solid #aaa; padding:100px 0 10px 0; margin-top:-80px; }
				.project.disabled{ display:none; }
				
				figure.preview{ margin:20px 0; padding:0 0 10px 0; /*border-bottom:1px solid #ccc;*/ }
					figure.preview img{ margin-bottom:5px; }
				/*
					figure.preview .imgwrap{ width:50%; float:left; }
					figure.preview .imgwrap .inner{ padding-right:15px; }
					figure.preview figcaption{ float:right; width:50%; }
						figure.preview figcaption .inner{ padding-left:15px; }
						*/

	/*###
	//# Variabel 
	###*/
	@media (max-width:1229px){
		body{ min-width:0; }
		div.centered{ width:auto; margin:0 15px; }
		
		header{ min-width:0; }
	}
	
	
	@media (max-width:365px){
		header{ padding:9px 0 4px 0; }
			h1{ float:none; }
			nav#mainnav{ float:none; text-align:right; padding-top:9px; }
			
		/* figure.preview */
			/*
			figure.preview .imgwrap, figure.preview figcaption{ float:none; width:auto; }
			figure.preview .imgwrap .inner, figure.preview figcaption .inner{ padding:0; }
			figure.preview figcaption{ padding-top:15px; }
			*/
	}