@charset "utf-8";
/* CSS Document */
html, html * {
	margin:0;
	padding:0;
	box-sizing:border-box;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 16px;
	background-clip:border-box;
	}
	
body{
	
	background-size:cover;
	background-position:0px -200px;
	}
html, body {
    height: 100%;
}

.wrapper {
    position: relative;
    min-height: 100%;
    height: auto !important;
    height: 100%;
}

main {
    padding-bottom: 100px;
}

footer {
    position: absolute;
    bottom: 0px;
    width: 100%;
	height:100px;
}

	
.textfield{
	position:relative;
	left:50px;
	top:200px;
	max-width: 70%;
	height:auto;
	padding:15px;
	background-color:rgba(255,255,255,0.4);
	border-radius:15px;
	}
	
/*Desktop View*/
.hamburg{
	display:none;
	}
	
.nav{
	display:none;}
	
.header{
	position:fixed;
	}

.top-head {
		width: 100%;
		margin-top:0px;
		padding-top:10px;
		padding-bottom:10px;
		display:flex;
		justify-content: space-between;
		flex-wrap: wrap;
		background: rgba(255,255,255,0.4);
	}

.logo {
	height:70px;
	margin-left:15px;
	}
	
.navDesk{
	display:flex;
	height:70px;
	}

.dropdownDesk{
	position: relative;
	display: block;
	margin-right:10px;
	}

.dropdownTitle{
	height: 70px;
	display:flex;
	flex-direction:column;
	
	}

.dropdownList{
	display:block;
	position:absolute;
	max-height:0px;
	overflow:hidden;
	background-color:rgba(255,255,255,0.4);
	transition:0.7s;
	
	}
	
.dropdownDesk:hover .dropdownList{
	display:block;
	max-height:200px;
	
	}
	
.dropdownTitle a, .dropdownList a{
	display:block;
	padding:5px;
	text-transform:uppercase;
	text-decoration:none;
	color:black;
	font-size:16px;
	}
	
.dropdownList a:nth-child(1){
	padding-top:15px;}
	
.dropdownTitle a{
	margin-top:auto;
	}
	
.dropdownTitle:hover a{
	color:orange;
	}
	
.dropdownList a:hover {
	color:orange;
	}
	
	
/*Mobile View*/
@media(max-width: 1023px){
	
html, html *{
	font-size:50px;}
body{
	background-position:0 0;}

.navDesk{
	display:none;
	}
	
.top-head {
		width: 100%;
		margin-top:0px;
		padding-top:20px;
		padding-bottom:20px;
		display:flex;
		justify-content: space-between;
		align-items: center;
		flex-wrap: wrap;
		background: rgba(255,255,255,0.4);
	}

.logo {
	height:140px;
	margin-left:30px;
	}	


.hamburg{
	display:block;
	width: 60px; height: 80px;
	transition: border-radius .5s;
	margin-right:30px;
	
	
	}

.hamburgline{
	position: relative;
	height: 8px; width:70px; background:black; 
	border-radius: 4px;
	display: block;
	transition: 1s;
	transform-origin: center;
	}
	
.hamburgline:nth-child(1){top: 16px;}
.hamburgline:nth-child(2){top: 31px;}
.hamburgline:nth-child(3){top: 46px;}

.hamburg.checked .hamburgline:nth-child(1){
	transform: translateY(22px) rotate(-405deg);
	}
.hamburg.checked .hamburgline:nth-child(2){
	opacity:0;
	}
.hamburg.checked .hamburgline:nth-child(3){
	transform: translateY(-22px) rotate(405deg);
	}


.nav{
	display:block;
	position:absolute;
	right:30px;
	top:20px;
	max-height: 0px;
	max-width:0px;
	overflow:hidden;
	transition:1s;
	}
	
.nav.checked{
	right:30px;
	top:120px;
	max-height:900px;
	max-width:500px;
	}

.nav ul{
	display:block;
	list-style-type: none;
	text-align:right;
	background-color:rgba(255,255,255,0.4);
	}
	
.obermenu {
	display: block;
	text-decoration: none;
	text-transform:uppercase;
	font-size:0px;
	color: black;
	margin-top:30px;
	transition:1s;
	}

.obermenu.checked {
	font-size:50px;
	transition: 1s;
	}

.untermenu {
	display:block;
	max-height:0px;
	overflow:hidden;
	transition:1s;
	}
	
.untermenu.checked {
	max-height:500px;
	}

.untermenu li a{
	display:block;
	text-decoration: none;
	color: black;
	text-transform:uppercase;
	font-size: 0px;
	transition: 1s;
	}	

.untermenu.checked li a{
	font-size: 42px;
	margin-top: 30px;
	}
	

}