#wrapper {
	min-width: auto;
	max-width: auto;
	margin-right: auto;
	margin-left: auto;
	font-family: sans-serif, arial;
}

* {box-sizing: border-box}
body {font-family: Arial, Helvetica, sans-serif;}
.navbar {
  width: auto;
  background-color: #555;
  overflow: auto;
  align-content:center ;
  filter:drop-shadow(8px 8px 10px gray)
}
.sticky {
  position: fixed;
  top: 0;
  width: auto;
  z-index: 1;
}
/* Navigation links */
.navbar a {
  float: center;
  color: white;
  text-decoration: none;
  font-size: 36px;
  width: auto; /* Four equal-width links. If you have two links, use 50%, and 33.33% for three links, etc.. */
  text-align: center; /* If you want the text to be centered */
  font-family: sans-serif;
  font-weight: bold;
}
/* Add a background color on mouse-over */
.navbar a:hover {
  background-color: #9acd32;
  
}
/* Style the current/active link */
.navbar a.active {
  background-color: #9acd32;
}
/* Add responsiveness - on screens less than 500px, make the navigation links appear on top of each other, instead of next to each other */
@media screen and (max-width: 800px) {
  .navbar a {
    float: none;
    display: block;
	font-size: 40px;
    width: 20%;
    text-align: left; /* If you want the text to be left-aligned on small screens */
  }
}

header {
	padding-top: 10px;
	padding-bottom: 400px;
	height: 300px;
	text-align: center;
	padding-right: 10px;
}

nav {
	text-align: center;

}

nav ul {
	list-style-type: none;
}

nav li {
	display: inline;
	margin-right:  80px;
	padding-left:  20px;	
}

a {
	text-decoration: none;
	color: #686a68;
	font-size: 35px;
}

section {
	width: 100%;
	float: center;
	height: 1500px;
	border-left: #9acd32 2px solid;
	border-top: none;
	border-right: #9acd32 5px solid;
	border-bottom: #9acd32 5px solid;
	border-radius: 5px;
}

.whatwemake {
	text-align: center;
	font-size: 20px;
	padding-top: 40px;
	  filter:drop-shadow(8px 8px 10px gray);
	  font-weight: bold;	  
}
.whatwemake_beschreibung {
	margin-left: 60px;
	margin-right: 60px;
	text-align: center;
}

.whatwemake h1{
	text-align: center;
	font-size: 58px;
	float: center;
	border: #9acd32 10px double;
	margin-right: 80px;
	margin-left: 80px;
	margin-bottom: 15px;
	border-radius: 8px;
}

.whatwemake h1:hover{
	transform: scale(1.15);
	transition: 1s ease-out;
}

.whatwemake h2{
	text-align: center;
	float: center;
	font-size: 28px;
	border-top: #9acd32 6px solid;
	border-bottom: #9acd32 2px solid;
	border-left: #9acd32 6px solid;
	border-right: #9acd32 2px solid;
	margin-right: 200px;
	margin-left: 200px;
	margin-top: 30px;
	margin-bottom: 35px;
	border-radius: 8px;
}

.whatwemake h2:hover{
	transform: scale(1.25);
	transition: 1s ease-out;
}

.whatwemakeline {
	font-size: 20px;
	font-weight: italic;
	text-align: left;
	padding-left: 420px;
}

/* Beginn zertifikiat Design */

.zertifikat_design_1 {
	padding-top: 20px;
	padding-bottom: 20px;
	padding-right: 20%;
	padding-left: 20%;
	max-height: 1460px;
	margin: 0 auto;

}

/* Ende zertifikiat Design */

										/* Begin zertifikat Desing mobile 800px max*/
										@media (max-width: 800px) {
											.zertifikat_design_1 {
											max-width: 100%;
											max-height: 100%;
											padding-top: 50px;
											}
										}
										/* Ende zertifikat Desing mobile 800px max*/

/* Begin fernwartung Design */

.fernwartung_design_1 {
	padding-top: 60px;
	height: auto;
	text-align: center;
	font-size: 40px;
	filter:drop-shadow(8px 8px 10px gray);
	margin-right: 30px;
	margin-left: 30px;
}

.fernwartung_design_1 h1{
	text-decoration:underline;
	text-decoration-line: solid;	
}

.fernwartung_design_1 p {
	font-size: 18px;
}

.fernwartung_design_2 {
	width: 50%;
	display: flex; 
	padding-top: 20px;
	margin: 0 auto;
	margin-bottom: 80px;
    filter:drop-shadow(8px 8px 10px gray);
	border-radius: 5px;
	opacity: 0.75;
}
.fernwartung_design_3_1 {
	margin:0;
	text-align:center;
}
a.fernwartung_design_3 {
	font-size: 75px;
	width: auto;
	margin: 21%;
	text-align: center;
	align-items: center;
	border: #9acd32 10px double;
	filter:drop-shadow(8px 8px 10px gray);
	border-radius: 5px;
	color: black;
	background-color: none;
	transition: transform .2s;
}

.fernwartung_design_3:hover {
	color:white;
	background-color: #9acd32;
	transform: scale(1.10);
}


.fernwartung_design_4 {
	display: flex;
	height: 420px;
	width: 700px;
	padding-top: 50px;
	margin-left: 200px;
	filter:drop-shadow(8px 8px 10px gray);
	opacity: 0.75;
}
/* Ende fernwartung Design */

													/* Beginn Fernwartung Design Mobile 800px */
													@media (max-width: 800px){
														
													.fernwartung_design_1 {
														padding-top: 15px;
														text-align: center;
														max-height: auto;
														font-size: 20px;
														filter:drop-shadow(8px 8px 10px gray);
														margin-right: 10px;
														margin-left: 10px;
													}

													.fernwartung_design_1 h1{
														text-decoration:underline;
														text-decoration-line: solid;	
													}

													.fernwartung_design_1 p {
														font-size: 14px;
													}

													.fernwartung_design_2 {
														display: block;
														width: 100%;
														padding-top: 20px;
														margin-bottom: 40px;
														height: auto;
													    filter:drop-shadow(8px 8px 10px gray);
														border-radius: 5px;
														opacity: 0.55;
													}
													
													a.fernwartung_design_3 {
														font-size: 17px;
														text-align: center;
														margin-top: 30px;
														margin-bottom: 30px;
														border: #9acd32 10px double;
														filter:drop-shadow(8px 8px 10px gray);
														border-radius: 5px;
														color: black;
														background-color: none;
														transition: transform .2s;
													}

													.fernwartung_design_3:hover {
														color:white;
														background-color: #9acd32;
														transform: scale(1.10);
													}


													.fernwartung_design_4 {
														height: 360px;
														width: 600px;
														padding-top: 50px;
														margin-left: 200px;
														filter:drop-shadow(8px 8px 10px gray);
														opacity: 0.75;
													}
												}
													/* Ende fernwartung Design mobile 800px*/
/* Beginn Kontakt Design */

.kontakt_design_1 {
	margin-top: 130px;
	padding-top: 0px;
	max-height: auto;
	width: 50%;
	border-right: #9acd32 5px solid;
	border-bottom: #9acd32 5px solid;
	border-top: #9acd32 2px solid;
	filter:drop-shadow(8px 8px 10px gray);
}

.kontakt_design_2{
	margin-top: 0px;
	font-size: 20px;
	padding-top: 20px;
	text-align: left;
	padding-left: 50px;
}

#kontakt_design_3 {
	margin-top: 145px;
	margin-left: 800px;
	line-height: 70%;
}

.kontakt_design_4 {
	margin-top: 90px;
	width: 40%;
	border-left: #9acd32 5px solid;
	border-bottom: #9acd32 5px solid;
	border-top: #9acd32 2px solid;
	filter:drop-shadow(8px 8px 10px gray);
}

.kontakt_design_5 {
	margin-top: 130px;
}

.kontakt_desing_6 {
	margin-top: 10px;
	width: 60%;
	height: 35%;
	filter:drop-shadow(8px 8px 10px gray);
	opacity: 0.80;
	
}
/* Ende Kontakt Design */

														/* Begin Kontakt Design mobile 800px max*/
														@media (max-width: 800px){
															.kontakt_design_1 {
																margin-top: 20px;
																padding-top: auto;
																width: 75%;
																border-right: #9acd32 5px solid;
																border-bottom: #9acd32 5px solid;
																border-top: #9acd32 2px solid;
																filter:drop-shadow(8px 8px 10px gray);
															}

															.kontakt_design_2{
																margin-top: auto;
																font-size: 20px;
																padding-top: 20px;
																text-align: left;
																padding-left: 5px;
																padding-right: auto;
															}

															#kontakt_design_3 {
																margin-left: auto;
																margin-top: 150px;
															}

															.kontakt_design_4 {
																margin-top: 20px;
																width: 70%;
																filter:drop-shadow(8px 8px 10px gray);
																padding-left: 0px;
																padding-right: auto;
																margin-bottom: 20px;
															}

															.kontakt_design_5 {
																margin-top: 130px;
															}

														.kontakt_desing_6 {
															margin-top: auto;
															width: 100%;
															height: 40%;
															filter:drop-shadow(8px 8px 10px gray);
															opacity: 0.80;
	
														}			
														}									
														
														/* Ende Kontakt Design mobile 800px max*/

/* Beginn Impressum Design */
.impressum {
	padding-top:20px;
	padding-left: 5px;
	padding-right: 5px;
	font-size: 20px;
}

.impressum h1 {
	font-size: 40px;
	font-weight: bold;
	text-align:center;
}
.impressum ul {
	font-weight: bold;
}
.impressum h2 {
	font-size: 15px;
	font-weight: normal;
	font-weight: bold;
}
.impressum b {
	font-size: 10px;
	font-weight: normal;

}
.nummerkorrektur {
	font-size: 20px;
}
/* Ende Impressum Design */
														/* Beginn Impressum Design mobile 800px max*/
														@media (max-width: 800px){
															.impressum {
																font-size: 15
															}
															.impressum h1{
																font-size: 30px;
															}
															.impressum h2 {
																font-size: 17px;
															}
															.impressum b {
																font-size: 12px;
															}
														}
														/* Ende Impressum Design mobile 800px max*/
span {
  content: "\27A3";
  color: #686a68;
  font-size: 25px;
}

#home{
  filter:drop-shadow(8px 8px 10px gray);
  padding-top: 0px;
}

.responsive {
	padding-top: auto;
 	width: 100%;
 	height: auto;
    border-radius: 5px;
	opacity: 0.75;
}

footer {
	height: 50px;
	text-align: center;
	font-family: sans-serif, arial;
	font-weight: bold;
	font-size: 12px;
}

.firstlinefooter {
	font-size: 20px;
	max-width: 100%;
	text-align: center;
}

#copyright {
	float: right;
}

                                           /* Beginn Index mobile 800px max */

@media (max-width: 800px){
	header{
		  max-width:100%;
		  padding: 0px;
		  height:100%;
	}
	
.logoimg{
		max-width:100%;
		max-height:100%;
		float: center;
	}
	section {
		width: 100%;
		float: center;
		height: 100%;
		border-left: #9acd32 2px solid;
		border-top: none;
		border-right: #9acd32 5px solid;
		border-bottom: #9acd32 5px solid;
		border-radius: 5px;
	}
	.navbar a:hover {
	  background-color: #9acd32;
	  width: 100%;
  
	}
	.navbar a {
		width: 100%;
	}
	.navbar a.active {
	  background-color: #9acd32;
	  width: 100%;
	}

	.whatwemake {
		text-align: left;
		font-size: 20px;
		padding-top: 40px;
		  filter:drop-shadow(8px 8px 10px gray);
		  font-weight: bold;	  
	}
	.whatwemake_beschreibung {
		margin-left: 30px;
		margin-right: 30px;
		text-align: center;
	}
	.whatwemakeline {
		margin-left: 30px;
		margin-right: 30px;
		text-align: center;
	}

	.whatwemake h1{
		text-align: center;
		font-size: 35px;
		float: center;
		border: #9acd32 10px double;
		margin-right: auto;
		margin-left: auto;
		margin-bottom: 15px;
		border-radius: 8px;
	}

	.whatwemake h1:hover{
		transform: scale(1.15);
		transition: 1s ease-out;
	}

	.whatwemake h2{
		text-align: center;
		float: center;
		font-size: 20px;
		border-top: #9acd32 6px solid;
		border-bottom: #9acd32 2px solid;
		border-left: #9acd32 6px solid;
		border-right: #9acd32 2px solid;
		margin-right: auto;
		margin-left: auto;
		margin-top: 30px;
		margin-bottom: 35px;
		border-radius: 8px;
	}

	.whatwemake h2:hover{
		transform: scale(1.25);
		transition: 1s ease-out;
	}
	.firstlinefooter {
		font-size: 8px;
		max-width: 100%;
		text-align: center;
	}


}
												/* Ende Index mobile 800px max */