@charset "UTF-8";
/* CSS Document */

* 	{ margin: 0; padding: 0; }

body { font-family: KefaIIPro-Regular; }

/* Navigationselemente */

#logo	{position: fixed; z-index: 7; float: left;}
#logolink	{margin: 0; }

#menu	{position: fixed; z-index: 7; right: 0;  top: 20px; }
#menu-ul	{list-style-type: none; }
#menu-unter	{ list-style-type: none; margin: 16px 0 0 0; padding: 20px 45px 20px 20px; background-color: rgba(70, 65, 50, 0.95); box-shadow: 0 0 10px rgb(0,0,0); text-align: right; }
.menu-unter-li	{}
#menu-picture	{margin-left: 66px; }
.menu-a		{text-decoration:none; 
	color: #000000; 
	font-family: KefaIIPro-Light; 
	font-size: 1.2em; 
	letter-spacing: 0.02em;
	color: rgba(255,255,255,1.00);}
	
#menu-ul>#menu-unter	{visibility: hidden; opacity: 0; }
#menu-ul:hover>#menu-unter	{visibility: visible; opacity: 1; 
						-webkit-transition: right 0.5s ease-out, opacity 0.5s cubic-bezier(0.5,0,0.25,0);
							-moz-transition: right 0.5s ease-out, opacity 0.5s cubic-bezier(0.5,0,0.25,0);
							-o-transition: right 0.5s ease-out, opacity 0.5s cubic-bezier(0.5,0,0.25,0);
							transition: right 0.5s ease-out, opacity 0.5s cubic-bezier(0.5,0,0.25,0); }

#Navi {
	position: fixed;
	left: 290px;
	margin: 0 auto;
	padding: 0; 
	list-style-type:none; 
	z-index: 6; }
	
.Navi-li, .Navi-li-umbruch	{float: left; margin: 0 20px; }
	
.Navi-a {	float: left;
	margin: 1.5em auto 1em auto;
	text-decoration:none; 
	color: #000000;
	text-align: center; 
	font-family: KefaIIPro-Light; 
	font-size: 1.2em; 
	letter-spacing: 0.02em;
	color: rgba(255,255,255,1.00); }
	
a:hover		{color: rgba(255,121,0,1.00); }
	
#hintergrund { position: fixed; width: 100%; height: 5em; background-color: rgba(70, 65, 50, 0.95); z-index:4; box-shadow: 0 0 10px rgb(0,0,0); }

@media only screen and (max-width: 1000px) {
	#Navi	{left: 0; top: 80px; padding: 0 0 0 31px; background-color: rgba(70,65,50,0.95); box-shadow: 0 0 10px rgb(0,0,0); width: 100%; }
	.Navi-a		{margin: 10px 0; }
	#hintergrund	{box-shadow: none; }
}

@media only screen and (max-width: 680px) {
	.Navi-li	{width: 150px; }	
	
}






/* Ende: Navigationselemente */

#erste, #zweite, #zweieinhalb, #dritte, #vierte	{}
#Philosophie, #Leistung, #Referenzen, #Unternehmen, #Kontakt	{margin-bottom: -6px; min-width: 1000px; } 
#pfeildiv	{position: absolute; width: 50%; left: 25%; bottom: 2%; text-align: center;}

/* Erster Teil */

#erste	{position: relative; margin: 0; color: rgba(0,0,0,1.00); }
#Teil-eins	{position: absolute; margin: 0px 0 0 50px; bottom: 20%; }
h1	{font-family: KefaIIPro-Regular; font-size: 2.5em; padding: 0 0 0.5em; color: rgba(0, 0, 0, 1.0); }
#wirleben	{font-family: KefaIIPro-Regular; font-size: 2.5em; padding: 0 0 0.5em; color: rgba(240, 240, 240, 1.0);}
#text1	{font-family: Verdana; font-size: 0.8em; letter-spacing: 0.00em; color: rgba(240, 240, 240, 1.0); width: 420px; text-align: left; margin: 0 0 0 0; }

.absatz		{font-family: Gill "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif; font-size: 1em; letter-spacing: 0.00em; color: rgba(0, 0, 0, 1.0); width: 40%; margin: 1% 0 0 0;}
#auszeichnung1		{padding-top: 25px; font-family: KefaIIPro-Italic; font-size: 2em; letter-spacing: 0.04em; color: rgba(240, 240, 240, 1.0); width: 420px; }
#pfeilanker {width: 100%; margin: 0; }	

@media only screen and (max-width: 1200px) {
	#h1	{font-size: 1.5em; }
	#wirleben	{font-size: 1.5em; }
	#text1	{font-size: 0.8em; }
	#auszeichnung1	{font-size: 1.3em; }
}

@media only screen and (max-width: 500px) {
	#text1	{width: 75%; }
}

@media only screen and (max-width: 570px) {
	#Teil-eins	{bottom: 5%; }
	#auszeichnung1	{visibility: hidden; }
}


/* Ende: Erster Teil */

/* Zweiter Teil */

#zweite {position: relative; text-align: center; margin: 0; color: rgba(255,255,255,1.00); }
#Teil-zwei	{position: absolute; margin: 0; bottom: 200px; }

#zweiteausrichtung	{width: 90%; margin: 0 auto; }
#leistungen	{padding: 0 0 1em; color: rgba(70, 65, 50, 1.0); }
.leistungen, .zulang	{float: left; width: 29.3%; padding: 0 2% 0px 2%; list-style-type: none; }
.zulang		{padding: 0 2% 0 2%; }
h2	{font-family: KefaIIPro-Regular; font-size: 1em; padding: 10px 0 0px 0; text-align: left; letter-spacing: 0; color: rgba(0, 0, 0, 1.0); }
.neben	{width: 100%; border-radius: 0.0em; }
.auflistung	{text-align: left; list-style-type: none; background-color: rgba(255, 255, 255, 0.5); height: 180px; border-radius: 0.0em; margin-top: -10px; }
.auflistungeinzeln	{font-family: KefaIIPro-Bold; color: rgba(70, 65, 50, 1.0); padding: 20px 10px 10px 20px; }
.auflistung1	{font-family: Verdana; font-size: 0.8em; color: rgba(70, 65, 50, 1.0); padding: 0 0 0 20px; }
#pfeilanker2	{width: 100%; margin: 0; }

@media only screen and (max-width: 1200px) {
	#leistungen	{font-size: 1.5em; }
	#Teil-zwei	{bottom: 20%}
}

@media only screen and (max-width: 1000px) {
	#Teil-zwei	{padding: 0; width: 100%; }
	#zweiteausrichtung	{width: 50%; }
	.leistungen, .zulang	{float: none; width: 100%; margin-bottom: 10px; padding-bottom: 10px; list-style-type: none; }
	.auflistung, .auflistungeinzeln, .auflistung1	{height: 100%; padding: 0; background-color: transparent;  }
	.neben	{display: none;}
	#leistungen	{padding: 0 60px 1em; }
}

@media only screen and (max-width: 500px) {
	#zweiteausrichtung	{width: 75%; }
}


/* Ende: Zweiter Teil */


/*  Zweieinhalb */

#zweieinhalb		{position: relative; margin: 0; color: rgba(255,255,255,1.00); }
#Teil-zweieinhalb	{position: absolute; margin: auto auto; bottom: 45%; width: 50%; left: 25%; }
#textzweidrei		{font-family: KefaIIPro-Italic; font-size: 1.3em; letter-spacing: 0.04em; color: rgba(240, 240, 240, 1.0); text-align: center; margin: 0 auto 0 auto; }
#wood	{text-align: center; color: rgb(240,240,240); }
#pfeilanker3	{width: 100%; margin: 0;}
#hintergrund2	{position: absolute; bottom: 25%; margin-left: 25%;  width: 50%; height: 80px; background-color: rgba(240,240,240,0.95); }

@media only screen and (max-width: 1200px) {
	#wood	{font-size: 1.5em; }
}

/* Ende: Zweieinhalb */


/* Dritter Teil */

#dritte		{z-index: 2; position: relative; margin: 0; color: rgba(255,255,255,1.00); }
#Teil-drei	{position: absolute; margin: auto auto; bottom: 25%; width: 50%; left: 25%; }
#text3		{font-family: Verdana; font-size: 0.8em; letter-spacing: 0.00em; color: rgba(70, 65, 50, 1.0); width: 450px; text-align: left; margin: 0 auto 0 auto; }
#auszeichnung		{font-family: KefaIIPro-Italic; font-size: 2em; letter-spacing: 0.04em; color: rgba(70, 65, 50, 1.0); text-align: center; margin: 2% auto 1em auto; }
#pfeilanker3	{width: 100%; margin: 0;}

@media only screen and (max-width: 1200px) {
	#auszeichnung	{font-size: 1.5em; }
}

@media only screen and (max-width: 1000px) {
	#text3	{width: 100%; }
}

@media only screen and (max-width: 570px) {
	#Teil-drei	{width: 80%; left: 10%; }
	#text3	{width: 100%; }
}

/* Ende: Dritter Teil */

/* Vierter Teil */

#vierte		{z-index: 2; position: relative; margin: 0; }
#Teil-vier	{position: absolute; margin: auto auto; bottom: 70%; width: 50%; left: 25%;}
#text4		{position: absolute; font-family: Verdana; font-size: 0.8em; letter-spacing: 0.00em; color: rgba(70, 65, 50, 1.0); width: 480px; text-align: center; margin: 0 0 0 -240px; left: 50%; }
#auszeichnung3 {font-family: KefaIIPro-Italic; font-size: 1.2em; letter-spacing: 0.04em; color: rgba(70, 65, 50, 1.0); width: 40%; text-align: center; margin: 15% auto 0 auto;}
#Kontakt-H	{font-family: KefaIIPro-Regular; font-size: 2.5em; padding: 0 0 0.5em; color: rgba(0, 0, 0, 1.0); text-align: center; }
#pfeilanker4	{width: 100%; margin: 0;}
#beide		{position: absolute; width: 100%; text-align: center; margin-top: 50px;}
.icon		{padding: 0 20px; margin: auto auto; }
#icon1, #icon2 	{margin: 40px auto 0 auto; padding: 0; }
.ende		{color: rgba(70, 65, 50, 1.0); margin: auto auto; text-align: center; }

@media only screen and (max-width: 500px) {
	#text4	{width: 100%; margin-left: -50%; left: 50%; }
	#Teil-vier	{bottom: 80%; }
	#beide	{margin-top: 175px; }
	#icon1, #icon2	{margin: 20px auto 0 auto; }	
}

@media only screen and (max-width: 1200px) {
	#Kontakt-H	{font-size: 1.5em; color: rgba(70, 65, 50, 1.0); }
}



/* Ende: Vierter Teil */