/*
** style sheet for CSS3-capable browsers.
** Web-Site: www.metalltechnik.de
** Copyright FORTYSIXDEVELOPMENTS - http://www.46developments.de/
*/

body {
	 margin:0;
   font-size: 15px;
   color:#333333;
   background-color:#cccccc;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   line-height: 18px;
   height: 100%;
  }

.fett {
   font-weight: bold;
   }

.kursiv {
   font-style: italic;
   }

.main {
   padding: 0px 0px !important;
	 margin-left: auto;
	 margin-right: auto;
	 max-width:1280px;
   background-color:#FFFFFF;
   }

.header {
	padding: 2%;
	padding-bottom:1%;
  background-color:#8f8d8d;
  box-shadow: 4px 0px 6px rgba(0, 0, 0, 0.5);
  filter:alpha(opacity=95);
  -moz-opacity:0.95;
  opacity:0.95;
}

.logodiv {
	float:left;
	width:30%;
}

.navi_allg {
    width:70%;
    margin-top:2.6%;
    display:block;
    float:left;
    font-size:14px;
}

.navigation {
    color:#ff9900;
    float:left;
    width:100%;
}

ul#topnavi li {
	font-weight:bold;
  list-style:none;
	float: left;
	display:inline;
	padding-left:5.8%;
	white-space:nowrap;
	/*padding-top:2px;*/
}

ul#topnavi li a {
	text-decoration: none;
	color:#ff9900;
}

ul#topnavi li a#aktiv {
	text-decoration: none;
	color:#333333;
}

ul#topnavi li a:hover {
	text-decoration: none;
	color:#333333;
}

#hamburger {
	cursor:pointer;
	color:#ff9900;
	font-size:28px;
	padding-right:2%;
	padding-top:4%;
	float:right;
	display:none;
}

#close {
	cursor:pointer;
	color:#ff9900;
	font-size:28px;
	padding-right:2%;
	padding-top:4%;
	float:right;
	display:none;
}

.ccontainer {
  box-shadow: 4px 0px 6px rgba(0, 0, 0, 0.5);
  padding:10%;
  padding-top:6%;
  padding-bottom:3%;
}

div#smallcontainer {
	min-height:800px;
}

.schmal,.schmalprod  {
	width:30%;
	float:left;
}

.breit,.breitprod {
	width:70%;
	float:left;
}

.schmal_auss,.schmalimp2 {
	width:30%;
	float:left;
	margin-top:-3%;
}

.schmalimp {
	width:8%;
	float:left;
	margin-top:-3%;
}

#manager, #managerb{
	margin-top:-1.5%;
}

.breit_auss,.breitimp,.breitimp2 {
	width:70%;
	float:left;
	margin-top:-3%;
}

.impressum {
	text-align:left;
}

h2 {
	padding-top:5%;
	color:#ff9900;
}

h4 {
	padding-top:1%;
	color:#ff9900;
	margin-top:0;
	margin-bottom:0;
}

.button, .buttonbreit {
  margin-top: 4%;
  margin-bottom: 2%;
  width:24%;
  margin-left: 38%;
  margin-right: 38%;
  text-align:center;
  background-color:#ffffff;
  color:#ff9900;
  border:2px solid #ff9900;
  padding-top:15px;
  padding-bottom:15px;
  letter-spacing:1.5px;
  font-weight:bold;
  display: flex;
}

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

.tel a {
	text-decoration:none;
	color:#333333;
}

.buttonlink {
	text-decoration: none;
	color:#ff9900;
	width:100%;
}

.footer {
	background-color:#8f8d8d;
	box-shadow: 4px 0px 6px rgba(0, 0, 0, 0.5);
	padding-left:10%;
	padding-right:10%;
	display: block;
}

.footer_mobil {
	background-color:#8f8d8d;
	box-shadow: 4px 0px 6px rgba(0, 0, 0, 0.5);
	padding-left:10%;
	padding-right:10%;
	display: none;
}

a.footerlink {
	text-decoration:none;
	color:#ffffff;
}

a.footerlink#aktiv {
	text-decoration: none;
	color:#ff9900;
}

a.footerlink:hover {
	text-decoration: none;
	color:#ff9900;
}

#mobile_navi {
	visibility:hidden;
	padding-left:6%;
	padding-right:4%;
	width:90%;
	padding-top:10px;
	padding-bottom:10px;
	background-color:#CCCCCC;
	color:#333333;
	position:absolute;
	top:67px;
	float:right;
	right:0;
	z-index:300;
	line-height:24px;
	font-size:13px;
}

#mobile_navi a {
	text-decoration: none;
	color:#333333;
	font-weight:bold;
}

#mobile_navi a#aktiv {
	text-decoration: none;
	color:#ff9900;
	font-weight:bold;
}

#mobile_navi a:hover {
	text-decoration: none;
	color:#ff9900;
	font-weight:bold;
}

.spalte_links {
		float:left;
		margin-top:0.8%;
		width:15%;
		margin-left:30%;
		text-align:left;
		font-weight:bold;
		color:#999999;
	}

.spalte_rechts {
		float:left;
		margin-top:0.8%;
		width:35%;
		margin-left:5%;
		margin-right:15%;
		text-align:left;
	}

.linksbuendig {
	text-align:left;
}

h2.linksbuendig {
	padding-left:14%;
	color:#ff9900;
}

.flexproj {
	display: flex;
	flex-flow: row;
	align-items: stretch;
}

.fboxproj {
	flex:1;
	padding-left:4%;
	padding-right:2%;
}

#standort1 {
	display:block;
}

#standort2 {
	display:block;
}

#standort1_ipad {
	display:none;
}

#standort2_ipad {
	display:none;
}

#standort1_mobil {
	display:none;
}

#standort2_mobil {
	display:none;
}

.beraten {
	font-size:15px;
	line-height:18px;
	/*padding-left:2%;
	padding-right:2%;*/
}

.abstand_klein {
	padding-left:5%;
	padding-right:5%;
}

.intro {
	font-size:17px;
	margin-top:4%;
	line-height: 20px;
}

@media screen and (max-width:1024px) {

	body {
   font-size: 15px;
   line-height: 18px;
   height: 100%;
  }

	.main {
	   padding: 0px 0px !important;
		 margin-left: auto;
		 margin-right: auto;
		 max-width:1024px;
	   background-color:#FFFFFF;
   }

	h2 {
		padding-bottom:1.2%;
		color:#ff9900;
	}

	h2.linksbuendig {
		padding-left:5%;
		color:#ff9900;
	}

	.abstand {
		padding-left:5%;
		padding-right:5%;
	}

	.abstand_klein {
		padding-left:5%;
		padding-right:5%;
	}

	.button, .buttonbreit {
	  width:34%;
	  margin-left: 33%;
	  margin-right: 33%;
	  text-align:center;
	  background-color:#ffffff;
  	color:#ff9900;
  	border:2px solid #ff9900;
	  padding-top:10px;
	  padding-bottom:10px;
	  letter-spacing:1.5px;
	  margin-top: 2%;
  	margin-bottom: 2%;
  	font-weight:bold;
	}

	.logodiv {
		float:left;
		width:20%;
		margin-top:0.8%;
	}

	.navi_allg {
    width:80%;
    margin-top:0.9%;
	}

	ul#topnavi li {
		font-size:12px;
		padding-left:4%;
		/*padding-top:2px;*/
	}

	.kontakt {
		margin-top:-1.9%;
	}

	.logo_weiss {
		width:9%;
	}

	.list-service {
		font-size:13px;
	}

	.image-text {
    font-size:14px;
    line-height:17px;
	}

	.fboxproj {
		flex:1;
		padding-left:4%;
		padding-right:2%;
	}

	.ccontainer {
	  padding:7%;
	  padding-top:5%;
	  padding-bottom:3%;
	}

	.footer {
		padding-left:7%;
		padding-right:7%;
		font-size:15px;
		display:block;
	}

	.footer_mobil {
		display:none;
	}

	.footerlink {
		color:#ffffff;
	}

	#standort1 {
		display:none;
	}

	#standort2 {
		display:none;
	}

	#standort1_ipad {
		display:block;
	}

	#standort2_ipad {
		display:block;
	}

	#standort1_mobil {
		display:none;
	}

	#standort2_mobil {
		display:none;
	}

	.schmal_auss {
		width:30%;
		float:left;
		margin-top:-3%;
	}

	.breit_auss {
		width:70%;
		float:left;
		margin-top:-3%;
	}

	.schmal  {
		width:30%;
	}

	.breit {
		width:70%;
	}

	.schmalimp {
		width:25%;
	}

	.breitimp {
		width:75%;
	}

	.schmalimp2 {
		width:40%;
	}

	.breitimp2 {
		width:60%;
	}

}

@media screen and (max-width:820px) {

	body {
   font-size: 12px;
   line-height: 16px;
  }

	#mobile_navi {
		line-height:24px;
		font-size:13px;
	}

	ul#topnavi li {
		font-size:12px;
		line-height:16px;
		padding-left:3%;
		/*padding-top:2px;*/
	}

	/*.schmal  {
		width:40%;
	}

	.breit {
		width:60%;
	}*/

	.footer {
		padding-left:5%;
		padding-right:5%;
		font-size:13px;
		display:none;
	}

	.footer_mobil {
		padding-left:5%;
		padding-right:5%;
		font-size:13px;
		display:block;
	}

	div#smallcontainer {
		min-height:500px;
	}

}

@media screen and (min-width:680px){
	.flexi {
		display: flex;
		flex-flow: row;
		align-items: stretch;
	}

	.fbox {
		flex:1;
	}

	.fboxprod1 {
		flex:2;
	}

	.fboxprod2 {
		flex:4;
		padding-left:5%;
	}


}

@media screen and (max-width:680px){

	body {
   font-size: 12px;
   line-height: 16px;
  }

	.header {
		padding:2%;
		padding-bottom:1%;
	  background-color:#8f8d8d;
	  box-shadow: 4px 0px 6px rgba(0, 0, 0, 0.5);
	  filter:alpha(opacity=95);
	  -moz-opacity:0.95;
	  opacity:0.95;
	}

	#mobile_navi {
		line-height:24px;
		font-size:13px;
	}

	div#smallcontainer {
		min-height:500px;
	}

	.schmal {
		width:46%;
		float:left;
	}

	.breit {
		width:54%;
		float:left;
	}

	.schmalprod {
		width:33%;
		float:left;
	}

.breitprod {
		width:67%;
		float:left;
	}

	.schmal_auss {
		width:46%;
		float:left;
		margin-top:-5%;
	}

	.breit_auss {
		width:54%;
		float:left;
		margin-top:-5%;
	}

	.schmalimp {
		width:25%;
		float:left;
		margin-top:-5%;
	}

	.breitimp {
		width:75%;
		float:left;
		margin-top:-5%;
	}

	.schmalimp2 {
		width:40%;
		float:left;
		margin-top:-5%;
	}

	#manager, #managerb{
		margin-top:-4%;
	}

	.breitimp2 {
		width:60%;
		float:left;
		margin-top:-5%;
	}

	.navi_allg {
    display:none;
	}

	#hamburger {
    display:block;
	}

	.logodiv {
		float:left;
		width:65%;
		margin-top:0.7%;
	}

	.beraten {
		font-size:14px;
		line-height:16px;
	}

	.fboxproj {
		flex:22;
	}

	.fboxproj2 {
		flex:1;
	}

	.button {
	  width:36%;
	  margin-left: 32%;
	  margin-right: 32%;
	  margin-top: 2%;
  	margin-bottom: 4%;
	}

	.buttonbreit {
	  width:50%;
	  margin-left: 25%;
	  margin-right: 25%;
	  margin-top: 2%;
  	margin-bottom: 4%;
	}

	.buttonlink {
		font-size:13px;
	}

	h2 {
		color:#ff9900;
	}

	.image_klein {
		width:88%;
		margin-left:6%;
		margin-right:6%;
		padding-bottom:3%;
	}

	.logo_weiss {
		width:12%;
	}

	.kontakt {
		margin-top:-3.6%;
	}

	.image-text {
    font-size:14px;
    line-height:14px;
	}

	.klein {
		font-size:12px;
		font-weight:normal;
	}

	.ccontainer {
	  padding:5%;
	  padding-top:4%;
	  padding-bottom:3%;
	}

	.footer {
		padding-left:5%;
		padding-right:5%;
		font-size:13px;
		display:none;
	}

	.footer_mobil {
		padding-left:5%;
		padding-right:5%;
		font-size:13px;
		display:block;
	}

	#standort1 {
		display:none;
	}

	#standort2 {
		display:none;
	}

	#standort1_ipad {
		display:none;
	}

	#standort2_ipad {
		display:none;
	}

	#standort1_mobil {
		display:block;
	}

	#standort2_mobil {
		display:block;
	}

	.abstand_klein {
		padding-left:7.5%;
		padding-right:7%;
		font-size:14px;
	}

}

@media screen and (max-width:680px) and (orientation:landscape){
	.schmal_auss {
		margin-top:0;
	}

	.breit_auss {
		margin-top:0;
	}

	.schmalimp {
		width:30%;
		margin-top:0;
	}

	.breitimp {
		width:70%;
		margin-top:0;
	}

	.schmalimp2 {
		width:45%;
		margin-top:0;
	}

	#manager, #managerb{
		margin-top:0;
	}

	.breitimp2 {
		width:55%;
		margin-top:0;
	}
}

@media only screen and (min-width : 320px) and (max-width : 820px) {
	body {-webkit-text-size-adjust: none;}
}