@charset "UTF-8";
/* CSS Document */

@font-face { font-family: 'Atelier'; src:url(../font/Atelier-Regular.otf) format('opentype'); }

* {
	margin: 0 auto;
	text-align: center;
	-webkit-overflow-scrolling: touch; /* Scroll Fix */
}

html, body {
	font-family: 'Atelier';
	font-size: 18px;
	
}

a {
	color: #000;
	text-decoration: none;	
}

p a {
	border-bottom: 1px solid #FF383B;
	padding-bottom: 4px;
}

#impr a, .impressum a {
	border-bottom: 1px solid #FF383B;
	padding-bottom: 4px;
}

/* Landing */
.landing {
	background-image: url(../img/bg.png);
	background-position: center;
	background-repeat:repeat;
	height: 100vh;
	width: 100vw;
	transition: height 999999s; /* Fixes mobile vh resize bug */
}

.l_img {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	
	display: block;
	height: calc(100vh - 30px);
	position: relative;
	width: calc(100vw - 30px);
	top:50%; /* move the top of the image to the vertical center of the parent */
    transform:translateY(-50%); /* offset the top of the image by half its height, thereby 'true' vertical centering it within the parent */
	transition: height 999999s; /* Fixes mobile vh resize bug */
}

.l_img a {
	display: block;
	height: 100%;
	width: 100%;
}

#logo {
	bottom: 50px;
	left: 50%;
	max-width: 200px;
	margin-left: -100px;
	position: absolute;
}

/* Content 1 */
.cont {
	height: 33.3vh;
	min-height: 215px;
	position: relative;
	width: 100vw;
}

.dl {
	left: 25px;
	top: 25px;
	position: absolute;
	height: 120px;
	width: 120px;
	z-index: 100;
}

.dl a {
	display: block;
	height: 120px !important;
	width: 120px;
}

.dl img {
	max-height: 120px;
	max-width: 120px;
}

.text {
	line-height: 28px;
	position: absolute;
	top: 50%; /* move the top of the image to the vertical center of the parent */
    transform:translateY(-50%); /* offset the top of the image by half its height, thereby 'true' vertical centering it within the parent */
	width: 100vw;
	z-index: 10;
}

.text p {
	width: 400px;
}

/* Content 2 */
#impr {
	bottom: 25px;
	position: absolute;
	width: 100vw;
}

.impressum {
	background:transparent;
	line-height: 20px;
	margin: 10vh auto 20vh;
	max-width:755px;
	text-align: center;
	z-index: 20;
}
#close {
	height: 32px;
	padding: 15px;
	position: fixed;
	right: 0;
	top: 0;
	width: 32px;
	z-index: 1000 !important;
}

ol,ul {
	list-style:none;
}

@media screen and (max-width:1024px) {
	.dl {
		left: calc(50% - 75px);
		-webkit-box-align: center;
    	-webkit-box-pack: center;
	}
	
	#open {
		top: 70%;
	}
	
	.cont {
		min-height: 350px;
	}
	
	.text {
		top:30%;
	}
	
	.text p {
		max-width: 500px;
		width:80%;
	}
	
	#impr {
		bottom:45px;
	}
	
	#close {
		padding: 15px 5px;
	}
	
	.impressum {
		max-width: 80%;
	}
}