*{ box-sizing: border-box; } 
body{
    font-family: Helvetica, sans-serif;
   
    font-weight: 300;
    line-height: 1.5em;
    color: #454545;
    margin: 0;
    padding: 0;
	background-color: #999
}

.wrapper{
    min-width: 320px;
	height: auto;
	
	
}

section {  
    margin-top: 24px;
	position:relative;
}

header{  
    text-align: center;
	position:relative;
}
	
article
{    
    padding-bottom: 16px;
	padding-top: 16px
}

.foto{    
    display: none;
}

.logo{    
    margin-bottom: 32px;
}

.zentriert{
	text-align: center
	}

.logo h3{
	display: none
}

.phone p{    
	font-size: 1.2em;
	font-weight: 600;
	text-align:center
}
.tel{
	display: none
}
.logo p, .logo h1{
    font-size: 1.4em;
	font-weight: 600;
    text-transform: uppercase; 
}
.logo h3{
    font-size: 1.0em;
    font-weight: normal;
	color: #888     
}

.projekt article{
	border-top:solid 1px #700
}

p {
	
	padding-bottom: 12px
}


h1{
	font-size: 1.4em;
	font-weight: bold;
	padding-bottom: 12px
}

h2{
	font-size: 1.2em;
	font-weight: bold;
	padding-bottom: 12px;
	display: block;
	padding-top: 24px
}

header img{
    display: block;
	position:relative;
    top:0%;
	max-width: 100%; /* anpassen falls nötig! */
   	max-height: 100%; /* ebenfalls */
   	width: 100%;
   	height: 100%;
	padding-bottom: 4px;
	
		
}



.sprechzeit{
   text-align:center 
}

.map{
	width: 100%;
	height: 100%;
	max-width: 100%;
	max-height: 100%;
	margin-top: 6px;
	margin-bottom: 12px
	
	}
#karte{
	margin: 2%
	}

.link
{
	text-decoration: underline;
	font-size: 1em
	}

.bereich
{
	list-style: circle;
	margin-left: 24px;
	font-size: 1.2em;
	font-weight: bold;
	padding-top: 18px
	}

.bereich li
{
	padding-bottom: 12px
	}

/* Tabelle Maschinenliste */
#links td
{

width: 90%;
padding:8px 8px
}

tr
{
border-bottom:solid 1px #000
}



caption
{
text-align:left;
font-weight:bold;
text-transform:uppercase;
padding-bottom:14px;
text-decoration:underline}

tr:nth-of-type(even)
{
background-color:#aaa
}

/*tr:nth-of-type(odd)
{
background-color:#ccc
}
*/


nav ul{
    display: block;
    padding: 0;
	list-style:none;
	position:relative;
    top:0%;
	max-width: 100%; /* anpassen falls nötig! */
   	max-height: 100%; /* ebenfalls */
   	width: auto;
   	height: auto;
	
		
}
nav ul li{
	display:block;
	padding:4px;

	text-align: center;
	display: block;
	position:relative;
	
   border-bottom: 1px solid #ccc;
	
}

a{
	text-decoration: none;
	color: #2573a3
}






#unternehmen .unternehmen,
#maschinenliste .maschinenliste,
#leistungen .leistungen,
#qualitätsmerkmale .qualitätsmerkmale,
#umweltschutz .umweltschutz,
#anbieterkennzeichnung .anbieter,
#kontakt .kontakt,
#projekte .projekte,
#jobs .jobs
{
color: #e56038;
	cursor:default;
		
	}	






td{
	text-align:left;
	padding-rigt: 14px; 
	color: #555;
	min-width: 110px;
	padding-bottom: 6px;
	border-bottom: 1px dotted #bbb
}	
table{
    width:auto ;
    margin: auto;
}
footer p{
    font-size:.9em;
	color: #000;
	text-align:center  
}
/* MISC */
.clear{
    clear:both;
}
.hidden{
    display: none;
	position:absolute;
    clip: rect(1px 1px 1px 1px); /* IE6 & 7 */
    clip: rect(1px, 1px, 1px, 1px);
}


#links


{
	
	
	position: relative;
	
	
	margin-bottom: 2%;
	padding-left: 4%;
	width: 360px;
	min-width: 300px;
		
}


#rechts {

padding: 4%
	
}



#links p {
	font-size: .9em;
	line-height: 1.2em;
	
}

strong{
	font-weight:bold
	}

#partner a img{
	margin: 20px;
	padding-top: 20px
	}

.haftung{
	font-size: .8em
	}

h4{
	border-bottom: dotted 1px #eee;
	margin-bottom: 12px
	}
	
.line{
    
	margin-bottom: 4%;
	
}

.border{
    font-style: italic;
	padding-top: 12px;
	border-bottom: dotted 1px #666
	
}

/*Formular*/

#p_name,
#p_vorname,
#firma,
#strasse,
#ort,
#phon,
#fax,
#p_mail

{
	width: 300px;
	
}

.rot{
	border: 1px solid #C00
}

.okay{
	border: 1px solid #666
}

.meldung{
	color: #C00
}

@media only screen and (min-width: 500px) {
body{
    padding: 20px;
	font-size: .8em;
	background-color: #fff
}
.wrapper{    
	max-width: 2400px;
}
header{
    position:relative;
    width:auto;
    max-width:2400px;
    margin: 0 auto;  
   	text-align: left;
}

nav ul li{
	display:block;
	margin-right: 12px;
	padding:3px 15px;
	float:left;
}

nav ul li{
border: none
}

.zentriert{
	
	}
.line{
    border-top: 2px solid #e56038;
	margin-left: 4%;
	margin-right: 2.7%
}
.foto{
    display: block;
	position:relative;
    top:0%;
    left:2%;
	max-width: 97%; /* anpassen falls nötig! */
   	max-height: 97%; /* ebenfalls */
   	width: auto;
   	height: auto;
	padding-bottom: 4px;
	border-bottom: 1px solid #e56038;		
}
.logo{
	display: none;
}



	
	
	
#links p {
	font-size: 1.2em;
	line-height: 1.5em;
	
}	
#links{
	
	top: 14px;
	width: 45%;
	margin-right: 2%;
	float:left;
	
			
}





.wrapper{
	overflow:hidden
	}








#karte{
	position: relative;
	width: 40%;
	margin-left: 5%;
	margin-bottom: 2%;
	margin-right: 3%;
	float: left;
	}

.phone{
	display: none
}
address{
	padding-bottom: 12px
}
.tel{
	display: block;
	border-bottom: 1px solid #000
}	




nav{
    display: block;
	width: auto;
	padding-left: 5%;
	height: auto;
	margin: 0 auto;
	z-index: 999;
	padding-bottom: 24px
}
a, nav a, .current{
	font-size: 1.1em;
	color:#000;
}


nav ul li a, .current{
    
    text-transform:uppercase;
    transition: all .25s ease;
}
nav ul li a:hover,a:hover {
    color:#e56038;
}
.current{
	color: #000
	}
header, aside{
    width: 100%;
	height: auto;
    float: left;
}
.quote{
    float: none; 
    width: 100%;
    padding: 0;
}

header, aside{
    padding: 2%;
}
footer{
	padding-top: 6px
}
header img{        
	width: 100%;
}

#rechts{
	display: block;
	with: auto;
	position: relative;
	margin-bottom: 2%;
	margin-right: 8%;
	float: left;



}


@media only screen and (min-width: 680px) {
#rechts{
	display: block;
	with: auto;
	position: relative;
	margin-bottom: 2%;
	margin-right: 8%;
	float: right;
	
}


}



@media only screen and (min-width: 1024px) {
#rechts{
	display: block;
	with: auto;
	position: relative;
	
	margin-bottom: 2%;
	margin-right: 8%;
	float: right;
		
	}
	

}