@charset "utf-8";

img, object, embed, video {	
	max-width: 100%;
	}

.handy{
	visibility:visible;
	display:block;
	float:left
}
.hoehe{
	height:45px;
	display:block;
}
	
.seite {
	width: 100%;
	margin-left: 0;
	background-image:url(http://www.starke-aufkleber.de/img/metall_3_250x250.jpg);
	}

.header{
	width: 80%;
	margin-left:10%;
	margin-top: 25px;
	margin-bottom:25px;
}

.logo{
	width: 38%;
	margin-top: 0px;
	margin-left: 40px;
	margin-right: 10px;
	float: left;
}

.logo_hoch{
	width: 38%;
	margin-top: -18px;
	margin-left: 40px;
	margin-right: 10px;
	float: left;
}

.slogan{
	width: 94%;
	margin-left:5%;
	font-size:130%;
	text-transform: uppercase;
	line-height: 140%;
}

.sligan{
	width: 90%;
	margin-left: 5%;
	margin-bottom: 3%;
	font-size: 220%;
	font-weight: 900;
	line-height: 110%;
}

.mitte {
	width: 80%;
	margin-left:10%;
	background-image:url(http://www.starke-aufkleber.de/img/metall_1500x1000.jpg);
	
	-webkit-box-shadow: 10px 10px 53px -15px rgba(0,0,0,0.75);
	-moz-box-shadow: 10px 10px 53px -15px rgba(0,0,0,0.75);
	box-shadow: 10px 10px 53px -15px rgba(0,0,0,0.75);
	border-radius:2px;
	min-height:1200px;

}

.footer{
 	width: 100%;
}
.container_1_1,.container_1_2,.container_1_3,.container_2_3,.container_1_4,.container_3_4,.container_1_5,.container_2_5,.container_3_5,.container_4_5,.container_1_6,.container_5_6, .footer, .mitte, .header, .seite{
	float:left;
	display: block;
}

.container_3_4{
	width: 72%;
}

.container_1_1 {
	width: 100%;
}

.container_1_2 {
	width: 45.75%;
	padding-top: 3%;
}

.container_1_3 {
	width: 55%;
	background-color: #f9bf57;
	text-align: center;
}

.container_2_3 {
	width: 65.7%;
}

.container_1_4 {
	width: 21.996%;
}

.container_3_4 {
	width: 76.4%;
}

.container_1_5{
	width: 17.4%;
}
.container_2_5 {
	width: 35.91%;
}

.container_3_5 {
	width: 55.57%;
}
.container_4_5 {
	width: 73.79%;
}
h2, h3, h4, h5, h6{
	margin-bottom: 5px;
	font-weight: 500;
	}
h1{
	font-size: 200%;
	line-height: 200%;
	margin-bottom:15px;
	color:#dc3103;
	font-weight: 500;
	text-transform: uppercase;
	}
h2{	
		font-size: 200%;
		color:#dc3103;
		margin-top:15px;
		margin-bottom:15px;
		line-height:200%;
		}		
h3{	
	font-size: 160%;
	font-weight: 500;
	color:#dc3103; 
	margin-top: 10px;
	margin-bottom: 10px;
	line-height:150%;
	}
h4{	font-size: 130%;
	font-weight: 300;	
	color:#dc3103; 
	margin-top: 10px;
	margin-bottom: 10px;
	line-height:150%;
	}
h5{	font-size: 150%;
	font-weight: 300;
	margin-top: 15px;
	line-height:150%;
	}
h6{ font-size: 180%; 
 	line-height:45px;
	}
h7{	
	font-size: 120%;
	margin-top:0px;
	color: #36f;
	}
h8{ font-size:220%; 
 	line-height:45px;
	color: #36f;
	}
.formular{
	padding-left: 3%;
	width: 90%;
	}

.bild{		
	width:19%;
	margin-bottom: 5px;
}

.bild1{		
	width:93%;
	margin-left: -10%;
	margin-top:30px;
	float:left;
	
}
.bild2{		
	width:88%;
	margin-left:13%;
	margin-top:70px;
	padding-left:3%;
	padding-right:2%;
	padding-bottom:2%;
	float:left;
}
.bild3{		
	width:78%;
	margin-left:8%;
	margin-top:70px;
	padding-left:3%;
	padding-bottom:2%;
	padding-right:8%;
	float:left;
}
.bild4{		
	width:80%;
	margin-left:8%;
	margin-top:20px;
	padding-left:2%;
	padding-left:2%;
	padding-right:5%;
	float:left;
	background:#f9bf57;
}

.abstand{margin-right:2%}

.footer{
	margin-top:45px;
	margin-bottom:25px;
	width:95%;
	text-align:right;
}

.daten{
	margin-top:45px;
	margin-bottom:45px;
	width:95%;
	text-align:left;	
}

@media only screen and (max-width: 1236px) {
.hoehe{height:45px}

.slogan{
	width: 90%;
	font-size: 130%;
	line-height: 140%;
}

.sligan{
	width: 97%;
	font-size: 170%;
	line-height: 110%;
}

.logo{
	margin-right: 30px;
}
}

@media only screen and (max-width: 1100px) {
	
	.slogan{
		margin-top:5px;
		font-size:90%;
		width: 90%;
		font-size: 140%;
		line-height: 180%;}
		
	h1{font-size:180%}
	h6{font-size:110%}
	.header{margin-top:0}
	
	.sligan{
		width: 90%;
		}
	}
		
/* ======================================================
Layout für Tablet: 799 px oder weniger. 
=========================================================*/
@media only screen and (max-width: 799px) {
 .handy{
	display:none;
	visibility:hidden;
	height:0px
}

h1{	font-size: 180%;}
h2{	font-size: 150%;
	line-height: 120%;}
h3{	font-size: 110%;}
h6{ font-size: 180%; }
.abstand{margin-right:0%}
.seite{
	width:96%;
	margin-left:2%
}

.bild1, .bild2, .bild4{
  margin-left: 3%;
}

.bild1.log{margin-top:75px}
.mitte{
	width:100%;
	margin-left:0;
}
.header{
	width:100%;
	margin-left:0;
}

.logo{
	margin-top:10px;
	margin-left:0px;
	width:95%;
}

.slogan{
	width: 87%;
	font-size: 125%;
	line-height: 140%;
}

.sligan{
	width: 90%;
	font-size: 180%;
	line-height: 110%;
}

.container_1_1 {
	width: 100%;
}
.container_1_2 {
	width: 95.74%;
}

.container_1_2 {
	/* width: 46.4%; */
	margin-right:3%
}

.container_1_3 {
	width: 100%;
}


.container_2_3 {
	width: 100%;
}

.container_1_4 {
	width: 22.5%;
}

.container_3_4{
	width: 100%;
}

.container_1_5 {
	width: 96.04%;
}

.container_2_5 {
	width: 45.7%;
}

.container_3_5 {
	width: 95.74%;
}
.container_4_5 {
	width: 95.74%;
}

.container_1_6 {
	width: 28.83%;
}

.container_5_6 {
	width: 62.27%;
}

}




/* ======================================================
Layout für Mobilgeräte: 480 px oder weniger. 
=========================================================*/

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


h1{
	font-size: 140%;
	line-height: 160%;
	color: #dc3103;
	margin-top:25px;
	text-transform: uppercase;}
	
h2{	font-size:140%;
	margin-top:15px;
	margin-bottom:10px;}

h3{font-size: 110%;}
	
h4{ font-size: 130%;
	line-height: 140%;
	font-weight: 600;}

h5{font-size: 130%;
	font-style: italic;
	color: #39c;
	float:right;
	margin-right:5%;}
	
h6{font-size: 110%;
text-transform: uppercase;
/* color: #39C; */}

.abstand_rechts{	
	margin-right:0}

.seite {
	width: 98%;
	margin-left: 1%;
	float: left;
}

.header{
	width: 100%;
	margin-top: 45px;
	float:left;
	margin-bottom:25px;
}

.logo{
	width: 95%;
	float: left;
	margin-left:4%;
	margin-top:45px;
}

.bild_50{width: 98%;float:left;
}

.slogan{
	width: 75%;
	margin-top:35px;
	float: left;
	margin-left:4%;
	font-size: 130%;
	text-transform: uppercase;
	line-height: 140%;
}

.sligan{
	width:90%;
	margin-top:1px;
	margin-left: 3px;
	margin-bottom: 3%;
	font-size: 170%;
	font-weight: 800;
	line-height: 110%;
}

.bild2{	
	margin-right:0%;
}

.mitte {
	float:left;
	display: block;
	width: 100%;
}

.container_1_1,.container_1_3,.container_2_3,.container_1_4,.container_3_4,.container_1_5,.container_2_5,.container_3_5,.container_4_5,.container_1_6,.container_5_6{
	width: 100%;
}

.container_1_2{
	width: 95%;
}

 .footer{
 width: 100%;
}

}

/* =============================================================
Breitbild - Layout: ab 1600px   Erbt Stile von: den Layouts für Mobilgeräte und Tablet-PCs. 
===============================================================*/

@media only screen and (min-width: 1800px) {


html{
	width: 1800px;
	margin:0 auto;
	background-image:url(../img/metall_3_250x250.jpg);
	float:none
}
}