@-ms-viewport{
  width: device-width;
  height: device-height;
}

body {
	background-color: #ffffff;
	font-family: Trebuchet MS;
}



	.Div1 {
	background-image: url("pix/1038555-320.png");
	background-repeat: no-repeat;
	background-position: top left;
	width:100%;
	height:97px;
	}
	
	.Div1A {
	position:absolute;
	top:20px;
	left:2%;
	width:60%;
	max-width:200px;
	}
	
	.Div1A p {font-size:0pt; color:black;}
	h1 {font-size:10pt; color:red; padding-left:2px;}
	
	.H1Baustoffe {font-size:12pt; color:#ffffff; padding-left:2px;}		
				
	.Div2 {
	  position:relative;
	  width:100%; 
	  min-height:580px;
	  margin:0 auto;
	  font-size:16pt;
	  color:#000000;
	}
	
	.Div2A {
	 position:absolute;
	 top:70px;
	 left:10px;
	 
	 max-width:290px;
	 font-size:10pt;
	}
	
	.Div2A li {margin-left:1px;}
	
	.H2Willkommen {margin-left:5px; padding-top:5px; color:#FF0000; font-size:8pt;}
	.HRWillkommen {margin-left:5px; margin-top:-5px; height:2px; border-width:0; color:red; background-color:red; width:120px;}
	.H1SiRoBaustoffe {margin-left:35px; margin-top:-10px; font-size:15pt;}
	.H3Seit2019 {margin-left:5px; margin-top:-10px; color:#999999; font-size:0pt; max-width:100px;}	

	.Div3 {
	position:relative;
	top:-110px;
	background-image: url("pix/collage300x90v1.png");
	width:300px;
	height:90px;
	}	
		
	.Div4 {
	position:relative;
	top:-100px;
	width:100%;
	min-height:200px;
	font-size:16pt;
	color:#000000;
	}
	
	.H2Kontakt {margin-left:5px; padding-top:0px; color:#FF0000; font-size:8pt;}
	.HRKontakt {margin-left:5px; margin-top:-10px; height:2px; border-width:0; color:red; background-color:red; width:120px;}
	.H1Kontakt {margin-left:35px; margin-top:-10px; font-size:15pt;}
	.H3Kontakt {margin-left:35px; padding-top:0px; color:#999999; font-size:8pt; width:auto; min-width:200px; max-width:280px;}
	
	.Div4A{
	position:relative;
	top:1px;
	left:20px;
	min-width:400px;
	width:300px;
	font-size:10pt;
	font-family:Arial;	
	}
	
	.form{
	font-family:Arial;
	font-size:10pt;		
	}
	
	.form textarea {width:270px; height:130px;}
	.form input[type=text] {width:150px; margin-right:20px;}
	.form input[type=submit] {position:relative; left:70px; top:5px;}
	.formname {position:relative; left:42px;}
	.formkontakt {position:relative; left:10px;}
	
	.Div5 {
	position:relative;
	top:-100px;
	background-image: url("pix/714163-320px.png");
	width:300px; 
	height:30px;
	}

	.Impressum {
	position:relative;
	top:-100px;
	width:100%;
	min-height:580px;
	margin:0 auto;
	font-size:12pt;
	color:#000000;
	}
	
	.H2Impressum {margin-left:5px; padding-top:19px; color:#FF0000; font-size:8pt;}
	.HRImpressum {margin-left:5px; margin-top:-10px; height:2px;border-width:0;color:red;background-color:red; width:120px;}
	.H1Impressum {margin-left:35px; margin-top:-10px; font-size:15pt;}
	
	.ImpressumA {
		position:relative;
		top:5px;
		left:5px;
		min-width:200px;
		width:290px;
		font-size:10pt;
		font-family:Arial;
		}
		
	.ImpressumA p {font-size:8pt; color:#000000;}
	.ImpressumB p {font-size:8pt; color:#000000;}	
	.haftung {font-size:10pt;}
	



@media (min-width: 768px) and (max-width: 1023px){
	/* Mobile Version: Desktopansicht*/
	
	.Div1 {
	background-image: url("pix/1038555-768.png");
	background-repeat: no-repeat;
	background-position: top left;
	width:100%;
	height:232px;
	}
	
	.Div1A {
	position:absolute;
	top:30px;
	left:5%;
	width:60%;
	max-width:450px;
	}
	
	.Div1A p {font-size:9pt; color:#ffffff;}
	h1 {font-size:13pt; color:#FF0000;}	
	
	.H1Baustoffe {font-size:16pt; margin-top:-10px; color:#ffffff;}
			
	.Div2 {
	  position:relative;
	  width:100%; 
	  min-height:580px;
	  margin:0 auto;
	  font-size:16pt;
	  color:#000000;
	}
	
	.Div2A {
	 position:absolute;
	 top:50px;
	 left:300px;
	 width:60%;
	 max-width:450px;
	 font-size:12pt;
	}
	
	.Div2A li {margin-left:50px;}
	
	.H2Willkommen {margin-left:20px; padding-top:19px; color:#FF0000; font-size:6pt;}
	.HRWillkommen {margin-left:20px; margin-top:-10px; height:2px;border-width:0;color:red;background-color:red; width:120px;}
	.H1SiRoBaustoffe {margin-left:20px; margin-top:-10px; font-size:8pt;}
	.H3Seit2019 {margin-left:20px; margin-top:10px; color:#999; font-size:6pt; width:auto; min-width:200px; max-width:260px;}

	.Div3 {
	position:relative;
	top:-120px;
	background-image: url("pix/collage90px.png");
	width:768px;
	height:90px;
	}
		
	.Div4 {
	position:relative;
	top:-100px;
	width:500;
	min-height:400px;
	font-size:16pt;
	color:#000000;
	}
	
	.H2Kontakt {margin-left:20px; padding-top:0px; color:#FF0000; font-size:13pt;}
	.HRKontakt {margin-left:20px; margin-top:-10px; height:2px;border-width:0;color:red;background-color:red; width:120px;}
	.H1Kontakt {margin-left:20px; margin-top:-10px; font-size:20pt;}
	.H3Kontakt {margin-left:20px; padding-top:0px; color:#999; font-size:11pt; width:auto; min-width:200px; max-width:280px;}
	
	.Div4A{
	position:relative;
	top:-100px;
	left:320px;
	min-width:400px;
	width:450px;
	font-size:16pt;
	font-family:Arial;	
	}
	
	.form{
	font-family:Arial;
	font-size:16pt;		
	}
	
	.form textarea {width:400px; height:200px;}
	.form input[type=text] {width:200px; margin-left:50px;}	
	.form input[type=submit] {position:relative; left:130px; top:5px;}
	.formname {position:relative; left:42px;}
	.formkontakt {position:relative; left:-10px;}

	.Div5 {
	position:relative;
	top:-180px;
	background-image: url("pix/714163-768px.png");
	width:768px; 
	height:80px;
	}

	.Impressum {
	position:relative;
	top:-100px;
	width:100%;
	min-height:580px;
	margin:0 auto;
	font-size:12pt;
	color:#000000;
	}
	
	.H2Impressum {margin-left:20px; padding-top:19px; color:#FF0000; font-size:5pt;}
	.HRImpressum {margin-left:20px; margin-top:-10px; height:2px;border-width:0;color:red;background-color:red; width:120px;}
	.H1Impressum {margin-left:20px; margin-top:-10px; font-size:8pt;}
	
	.ImpressumA {
		position:relative;
		top:-70px;
		left:200px;
		min-width:400px;
		width:555px;
		font-size:14pt;
		font-family:Arial;
		}
		
	.ImpressumA p {font-size:9pt; color:#000000;}
	.ImpressumB p {font-size:12pt; color:#000000;}	
	.haftung {font-size:12pt;}

}

@media (min-width: 1024px) and (max-width: 1365px) {
	.Div1 {
	background-image: url("pix/1038555-1024.png");
	background-repeat: no-repeat;
	background-position: top left;
	width:1024px;
	height:310px;
	}	
	
	.Div1A {
	position:absolute;
	top:80px;
	left:5%;
	width:60%;
	max-width:620px;
	}
	
	.Div1A p {font-size:11pt; color:#ffffff;}
	h1 {font-size:14pt; color:#FF0000;}

	.H1Baustoffe {font-size:20pt; margin-top:-10px; color:#ffffff;}
			
	.Div2 {
	  position:relative;
	  width:100%; 
	  min-height:580px;
	  margin:0 auto;
	  font-size:16pt;
	  color:#000000;
	}
	
	.Div2A {
	 position:absolute;
	 top:50px;
	 left:350px;
	 min-width:40%;
	 width:auto;
	 max-width:660px;
	 font-size:14pt;

	}
	
	.Div2A li {margin-left:50px;}
	
	.H2Willkommen {margin-left:20px; padding-top:19px; color:#FF0000; font-size:15pt;}
	.HRWillkommen {margin-left:20px; margin-top:-10px; height:2px;border-width:0;color:red;background-color:red; width:120px;}
	.H1SiRoBaustoffe {margin-left:20px; margin-top:-10px; font-size:23pt;}
	.H3Seit2019 {margin-left:20px; padding-top:0px; color:#999; font-size:13pt; width:auto; min-width:330px; max-width:380px;}
	
	.Div3 {
	position:relative;
	top:-100px;
	background-image: url("pix/collage120px.png");
	width:1024px;
	height:120px;
	}
		
	.Div4 {
	width:100%;
	min-height:420px;
	margin:0 auto;
	font-size:16pt;
	color:#000000;
	}
	
	.H2Kontakt {margin-left:20px; margin-top:29px; color:#FF0000; font-size:15pt;}
	.HRKontakt {margin-left:20px; margin-top:-10px; height:2px;border-width:0;color:red;background-color:red; width:120px;}
	.H1Kontakt {margin-left:20px; margin-top:-10px; font-size:23pt;}
	.H3Kontakt {margin-left:20px; padding-top:0px; color:#999; font-size:13pt; width:auto; min-width:330px; max-width:380px;}
	
	.Div4A{
	position:relative;
	top:-120px;
	left:450px;
	min-width:400px;
	width:600px;
	font-size:16pt;
	font-family:Arial;	
	}
	
	.form{
	font-family:Arial;
	font-size:16pt;		
	}
	
	.form textarea {width:500px; height:220px;}
	.form input[type=text] {width:280px; margin-left:50px;}
	.form input[type=submit] {position:relative; left:180px; top:5px;}
	.formname {position:relative; left:42px;}
	.formkontakt {position:relative; left:-9px;}
	
	.Div5 {
	position:relative;
	top:-150px;
	background-image: url("pix/714163-1024px.png");
	width:1024px; 
	height:107px;
	}	

	
	.Impressum {
	position:relative;
	top:-100px;
	width:100%;
	min-height:580px;
	margin:0 auto;
	font-size:12pt;
	color:#000000;
	}
	
	.H2Impressum {margin-left:20px; padding-top:19px; color:#FF0000; font-size:15pt;}
	.HRImpressum {margin-left:20px; margin-top:-10px; height:2px;border-width:0;color:red;background-color:red; width:120px;}
	.H1Impressum {margin-left:20px; margin-top:-10px; font-size:23pt;}
	
	.ImpressumA {
		position:relative;
		top:-80px;
		left:250px;
		min-width:400px;
		width:760px;
		font-size:14pt;
		font-family:Arial;
		}
		
	.ImpressumA p {font-size:9pt; color:#000000;}
	.ImpressumB p {font-size:13pt; color:#000000;}	
	.haftung {font-size:13pt;}
}

@media (min-width: 1366px) and (max-width: 1919px){
	.Div1 {
	position:relative;
	background-image: url("pix/1038555-1366.png");
	background-repeat: no-repeat;
	background-position: top left;
	width:1366px;
	height:413px;
	}

	.Div1A {
	position:absolute;
	top:100px;
	left:5%;
	width:60%;
	max-width:800px;
	}
	
	.Div1A p {font-size:14pt; color:#ffffff;}
	h1 {font-size:20pt; color:#FF0000;}
	
	.H1Baustoffe {font-size:24pt; margin-top:-10px; color:#ffffff;}	
		
	.Div2 {
	  position:relative;
	  width:100%; 
	  min-height:580px;
	  margin:0 auto;
	  font-size:16pt;
	  color:#000000;
	}
	
	.Div2A {
	 position:absolute;
	 top:50px;
	 left:500px;
	 min-width:40%;
	 width:auto;
	 max-width:820px;
	 font-size:16pt;
	}
	
	.Div2A li {margin-left:50px;}
	
	.H2Willkommen {margin-left:20px; padding-top:19px; color:#FF0000; font-size:19pt;}
	.HRWillkommen {margin-left:20px; margin-top:-10px; height:2px;border-width:0;color:red;background-color:red; width:120px;}
	.H1SiRoBaustoffe {margin-left:20px; margin-top:-10px; font-size:27pt;}
	.H3Seit2019 {margin-left:20px; padding-top:0px; color:#999; font-size:17pt;  width:auto; min-width:400px; max-width:450px;}
	
	.Div3 {
	position:relative;
	top:-50px;
	background-image: url("pix/collage160px.png");
	width:1366px;
	height:160px;
	}
	
	.Div4 {
	width:100%;
	min-height:550px;
	margin:0 auto;
	font-size:16pt;
	color:#000000;
	}
	
	.H2Kontakt {margin-left:20px; margin-top:60px; color:#FF0000; font-size:20pt;}
	.HRKontakt {margin-left:20px; margin-top:-10px; height:2px;border-width:0;color:red;background-color:red; width:120px;}
	.H1Kontakt {margin-left:20px; margin-top:-10px; font-size:28pt;}
	.H3Kontakt {margin-left:20px; padding-top:0px; color:#999; font-size:18pt;}
	
	.Div4A{
	position:relative;
	top:-160px;
	left:650px;
	min-width:400px;
	width:800px;
	font-size:16pt;
	font-family:Arial;	
	}
	
	.form{
	font-family:Arial;
	font-size:16pt;		
	}
	
	.form textarea {width:600px; height:250px;}
	.form input[type=text] {width:300px; margin-left:60px;}
	.form input[type=submit] {position:relative; left:250px; top:5px;}
	.formname {position:relative; left:42px;}
	.formkontakt {position:relative; left:-9px;}
	
	.Div5 {
	position:relative;
	top:-180px;
	background-image: url("pix/714163-1366px.png");
	width:1366px; 
	height:142px;
	}
	
	
	.Impressum {
	width:100%;
	min-height:580px;
	position:relative;
	top:-200px;
	font-size:12pt;
	color:#000000;
	}
	
	.H2Impressum {margin-left:20px; padding-top:19px; color:#FF0000; font-size:20pt;}
	.HRImpressum {margin-left:20px; margin-top:-10px; height:2px;border-width:0;color:red;background-color:red; width:120px;}
	.H1Impressum {margin-left:20px; margin-top:-10px; font-size:28pt;}
	
	.ImpressumA {
		position:relative;
		top:-100px;
		left:350px;
		min-width:400px;
		width:900px;
		font-size:14pt;
		font-family:Arial;
		}
		
	.ImpressumA p {font-size:9pt; color:#000000;}
	.ImpressumB p {font-size:13pt; color:#000000;}	
	.haftung {font-size:13pt;}
	
}

@media (min-width: 1920px){
	.Div1 {
	position:relative;
	background-image: url("pix/1038555-1920.png");
	background-repeat: no-repeat;
	background-position: top left;
	width:1890px;
	height:580px;
	}
	
	.Div1A {
	position:absolute;
	top:220px;
	left:5%;
	width:60%;
	max-width:1100px;
	
	font-size:16pt; color:#ffffff;
	}
	
	.Div1A p {font-size:16pt; color:#ffffff;}
	h1 {font-size:24pt; color:#FF0000;}
	
	.H1Baustoffe {font-size:28pt; margin-top:-10px; color:#ffffff;}
	
	.Div2 {
	  position:relative;
	  width:100%; 
	  min-height:580px;
	  margin:0 auto;
	  font-size:16pt;
	  color:#000000;
	}
	
	.Div2A {
	 position:absolute;
	 top:50px;
	 left:500px;
	 min-width:40%;
	 width:auto;
	 max-width:1350px;
	 font-size:18pt;
	}
	
	.Div2A li {margin-left:50px;}
	
	.H2Willkommen {margin-left:20px; padding-top:19px; color:#FF0000; font-size:20pt;}
	.HRWillkommen {margin-left:20px; margin-top:-10px; height:2px;border-width:0;color:red;background-color:red; width:120px;}
	.H1SiRoBaustoffe {margin-left:20px; margin-top:-10px; font-size:28pt;}
	.H3Seit2019 {margin-left:20px; padding-top:0px; color:#999; font-size:18pt; width:auto; min-width:450px; max-width:500px;}
	
	.Div3 {
	position:relative;
	top:-50px;
	background-image: url("pix/collage225px.png");
	width:1890px;
	height:225px;
	}
	
	.Div4 {
	width:100%;
	min-height:580px;
	margin:0 auto;
	font-size:16pt;
	color:#000000;
	}
	
	.H2Kontakt {margin-left:20px; margin-top:60px; color:#FF0000; font-size:20pt;}
	.HRKontakt {margin-left:20px; margin-top:-10px; height:2px;border-width:0;color:red;background-color:red; width:120px;}
	.H1Kontakt {margin-left:20px; margin-top:-10px; font-size:28pt;}
	.H3Kontakt {margin-left:20px; padding-top:0px; color:#999; font-size:18pt;}
	
	.Div4A{
	position:relative;
	top:-160px;
	left:650px;
	min-width:400px;
	width:1200px;
	font-size:16pt;
	font-family:Arial;	
	}
	
	.form{
	font-family:Arial;
	font-size:16pt;		
	}
	
	.form textarea {width:600px; height:250px;}
	.form input[type=text] {width:300px; margin-left:60px;}
	.form input[type=submit] {position:relative; left:250px; top:10px;}
	.formname {position:relative; left:42px;}
	.formkontakt {position:relative; left:-9px;}
	
	.Div5 {
	position:relative;
	top:-180px;
	background-image: url("pix/714163-1920px.jpg");
	width:1890px; 
	height:195px;
	}
	
	.Impressum {
	width:100%;
	min-height:580px;
	position:relative;
	top:-200px;
	font-size:12pt;
	color:#000000;
	}
	
	.H2Impressum {margin-left:20px; padding-top:19px; color:#FF0000; font-size:20pt;}
	.HRImpressum {margin-left:20px; margin-top:-10px; height:2px;border-width:0;color:red;background-color:red; width:120px;}
	.H1Impressum {margin-left:20px; margin-top:-10px; font-size:28pt;}
	
	.ImpressumA {
		position:relative;
		top:-100px;
		left:450px;
		min-width:400px;
		width:1400px;
		font-size:14pt;
		font-family:Arial;
		}
		
	.ImpressumA p {font-size:10pt; color:#000000;}
	.ImpressumB p {font-size:14pt; color:#000000;}
	.haftung {font-size:15pt;}
}