html,body {
      height:98%;
   	width:100%;
}

body {
	
	margin: 1em auto;
	max-width: 80em;
	min-height: 50vh;
	font-family: sans-serif;
	color: #333333;

  	background-position: center;
  	background-repeat: no-repeat; 
	background-size: cover;
	background-attachment: fixed;

	
}     


@media only screen and ( max-width: 630px ) {
    /* mobile Geräte */
  	body {
		background-image: url("Images/m_background.jpg");
	}
  	#Logo {
		width: 90%;
	
	}
	ul.menue {
		width: 100%;
	}
	main {
		top: 6em;
	}
	footer {
		font-size: 80%;
		
	}
	
}
@media only screen and ( min-width: 630px) and (max-width: 950px ) {
    /* Tablets */
  	body {
		background-image: url("Images/background.jpg");
	}
  	main {
		top: 3em;
	}
	.Skills {
		display:grid;
		grid-template-columns: 1fr auto;
	}
	
}
@media only screen and ( min-width: 950px ) and (max-width: 1300px ) {
    /* PCs */
  	body {
		background-image: url("Images/background.jpg");
	}
  	main {
		top: 3em;
	}
		.Skills {
		display:grid;
		grid-template-columns: 1fr 1fr auto;
	}
	
} 
@media only screen and ( min-width: 1300px ) {
    /* PCs */
  	body {
		background-image: url("Images/background.jpg");
	}
  	main {
		top: 3em;
	}
		.Skills {
		display:grid;
		grid-template-columns: 1fr 1fr 1fr auto;
	}
	
} 

header { position: fixed;
	top: 0.1em;
      height: 5vh;
      min-height: 2em;
	width:95%;
	max-width: 80em;
	padding: 0 1em 0 1em;

}

main {
	position: fixed;
	bottom: 9vh;
	
	
	width:93%;
	max-width: 80em;
	max-height: 83vh;
	overflow: auto;
	padding: 0 1em 0 1em;
	
	
}

 
footer {
      position: fixed;
	bottom: 0.1em;
	width:95%;
	height: 5vh;
	min-height: 2em;
	max-width: 80em;

	border-radius: 0.5em 0.5em 0.5em 0.5em;
	
	background: #e4ebf2;
	background-color:rgba(255,255,255,0.8);
	
	display: grid;
	grid-template-columns: 35% 35% auto;
	
	text-align: center;
	padding: 0 1em 0 1em;
}

#Logo {
  background-color: #4CAF50;
  color: white;
  display: block;
  padding: 8px 16px;
  text-decoration: none;
  float:left;
  border-radius:5em;
  margin:5px;
}

ul.menue {
  list-style-type: none;
  margin: 0;
  padding: 0;
  background-color:rgba(255,255,255,0);
  overflow: auto;
}

ul.menue li a {
  display: block;
  color: #000;
  padding: 8px 16px;
  text-decoration: none;
  float:left;
  background-color: #e4ebf2;
  border-radius:5em;
  margin:5px;
}
 

ul.menue li a:hover:not(.aktiv) {
  background-color: #555;
  color: white;
}


.content {
	background-color:rgba(255,255,255,0.75);
	text-align: center;
	padding: 1em;
}

input[type=text], input[type=password], select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
  text-align: left;
}

label {
	display:block;
	text-align: left;
	padding: 6px;
}

input[type=submit] {
  background-color: #e4ebf2;
  color: #000;
  padding: 12px 20px;
  border: none;
  border-radius: 5em;
  cursor: pointer;
}

input[type=submit]:hover {
  background-color: #45a049;
}


h1,h2 {
	text-align: center;
	margin-top: 3em;
}
.SkillBlock {
	text-align: center;
	margin: 1em auto 3em auto;
	width:300px;
	}