/* Fonts */

@font-face { 
	font-family: 'Ubuntu';
	src: url('/inc/fonts/Ubuntu/Ubuntu-Regular.ttf') format('truetype'); 
}

@font-face { 
	font-family: 'Ubuntu-Medium';
	src: url('/inc/fonts/Ubuntu/Ubuntu-Medium.ttf') format('truetype'); 
}

@font-face { 
	font-family: 'Ubuntu-Bold';
	src: url('/inc/fonts/Ubuntu/Ubuntu-Bold.ttf') format('truetype'); 
}

@font-face { 
	font-family: 'Droid-Sans';
	src: url('/inc/fonts/Droid-Sans/DroidSans.ttf') format('truetype'); 
}

@font-face { 
	font-family: 'Droid-Sans-Bold';
	src: url('/inc/fonts/Droid-Sans/DroidSans-Bold.ttf') format('truetype'); 
}



/* Allgemeines */
* {
	margin:0;
	padding:0;
	transition:all 0.5s;
}

html {
	scroll-behavior:smooth;
}

body {
	font-family:"Droid Sans", Arial, Helvetica, sans-serif;
	font-size:16px;
	line-height:26px;
	padding:150px 0px 100px 0px;
}

a {
	text-decoration:none;
	color:#000;
}

a:focus {
	outline: 0;
}

h2 {
	font-family:Ubuntu-Medium;
	font-weight:normal;
	font-size:2.0em;
	line-height:1.3em;
	margin:80px 0px 50px 0px;
}

h2:after {
	content:" //";
}

p {
	margin-bottom:10px;
}




/* kopf */
#kopf {
	box-sizing:border-box;
	position:fixed;
	top:0px;
	left:0px;
	right:0px;
	z-index:999;
	background-color:rgba(255,255,255,0.8);
/*	background-color:#FFF; */
	height:150px;



/*	
	opacity:0.8;
	box-shadow: 0 7px 4px -4px #999; 
*/
	width:1200px; 
	max-width:95%; 
	margin:0 auto;
	border-bottom:5px solid #000;
}

#logo {
	font-family:Ubuntu-Bold;
	font-weight:normal;
	position:absolute;
	top:0px;
	font-size:2.2em;
	background-color:#000;
	color:#FFF;
	text-transform:none;
	padding:15px;
}





/* Kopfbereich */
#projektbild {
	box-sizing:border-box;
	max-width:1050px;
	height:400px;
	background-repeat:no-repeat;
	background-size:cover;
	background-position: bottom center;
	background-attachment:fixed;
	margin:0 auto;
	position:relative;
}

#projekttitel {
	position:absolute;
	bottom:30px;
	left:30px;
	background-color: rgba(255,255,255,0.4); 
	color:#000;
	max-width:50%;
}

#projekttitel strong {
	text-transform:uppercase;
}

#projekttitel a {
	color:#000;
	font-size:1.8em;
	font-weight:bold;
	line-height:1.3em;
	display:block;
	padding:20px;
}

#projekttitel a:hover {
	background-color: rgba(255,255,255,0.8); 

}

#bildinfo {
	font-size:10px;
	line-height:20px;
	 text-shadow: 1px 1px 1px #FFF;
/*	background-color: rgba(0,0,0,0.6); */
	margin:240px 0 0 0;
	position:absolute;
	bottom:0;
	right:0;
	padding:0px 5px 0px 5px;
}






/* Inhalt */
#inhalt {
	box-sizing:border-box;
	max-width:1050px;
	margin:0 auto;
	border:0px solid #000;
}

/* Text */
#text {
	padding:0px 0px 0px 30px;
	
}




/* Projekte */
#projektliste {
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
	border:0px solid #000;
}

#projektliste a {
	z-index:9999;
	border:0px solid #000;
	display:block;
}

.projekt {
	box-sizing:border-box;
	width:45%;
	margin-bottom:80px;
	background-color:#FFF;
	box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.15);
	border-bottom:3px solid #FFF;
}

.projekt-bild {
	background-repeat:no-repeat;
	background-size:cover;
	background-position: bottom center;
	background-attachment:fixed; 
	height:300px;
	width:100%;
	overflow:hidden;
	position:relative;
}


.projekt-bild h3  {
	font-family:Ubuntu-Medium;
	font-weight:normal;
	position:absolute;
	bottom:35px;
	left:0px;
	width:70%;
	z-index:99;
	font-size: 1.3em;
	line-height:1.3em;
	padding:20px 20px 20px 30px;
	background-color: rgba(255,255,255,0.4); 
}

.projekt:hover h3 {
	background-color:rgba(255,255,255,0.8);
}


.projekt-text {
	font-family:"Droid Sans", Arial, Helvetica, sans-serif;
	font-weight:400;
	box-sizing:border-box;
	padding:20px 30px 20px 30px;
	line-height:1.4em;

}

.kunde {
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.75em;
	line-height:1.3em;
	color:#999;
	text-transform:uppercase;
	padding:0px 30px 10px 30px;

}


/* Fussbereich */
/* Metanavi */
#metanavi {
	box-sizing:border-box;
	width:1200px; 
	max-width:95%; 
	text-align:center;
	margin:30px auto 0 auto; 
	border-top: 3px solid #000;
	padding:30px 0px  0px  0px;
}

#metanavi ul {

}

#metanavi li {
	list-style: none;
	display: inline;
}

#metanavi li a {
	font-family:Ubuntu-Bold;
	text-transform:uppercase;
	margin:0px 0px 0px 20px;
	padding:3px 3px 3px 3px;
}

#metanavi li a:hover {
	background-color:#000;
	color:#FFF;

}

#metanavi li a:after {
	content:"";
	font-style:normal;
}


/* c/o Hinweis */
#co {
	font-size:0.8em;
	margin-top:30px;
	text-align:center;
}


/* Cookie Hinweis */ 
#cookie-hinweis {
	box-sizing:border-box;
	display:block;
	position:fixed;
	bottom:50px;
	right:0px;
	width:350px;
	z-index:999999; 
	background-color:#FFF; 
	color:#000;
	padding:50px 30px 30px 30px;
	line-height:1.5em;
	box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.15);
	transition:right 0.3s;
}

#cookie-hinweis.gelesen {
	right:-400px;
}

#cookie-hinweis-titel {
	width:100%;
	font-size:1.5em;
	color:#000;
	font-weight:bold;
}

#cookie-hinweis p {
	margin:-10px 0px 20px 0px;
}

#cookie-hinweis a.button {
	border:1px solid #000;
	background-color:#000;
	padding:10px;
	text-align:center;
	color:#FFF;
	display:block;
	margin:10px 0px 10px 0px;
}

#cookie-hinweis a.button:hover {
	background-color:#FFF;
	color:#000;
}


#hoch {
	width:30px;
	height:auto;
}


@media all and (max-width: 900px) {

	.projekt {
		min-width:500px;
		width:90%;
		margin:0 auto 50px auto;
	}


/*
	#logo {
		font-size:1.8em;
		padding:10px;
	}

	#projekttitel  {
		max-width:80%;
	}

	#projekttitel a {
		font-size:1.5em;
	}

	#projektliste {
		margin-left:-30px;
	}
	

*/
}



/* eot :) */