body {
	background-color: white;
	overflow: hidden;
	font-family: MonumentGroteskRegular, sans-serif;
}

@font-face {
	font-family: SportingGrotesqueRegular;
	src:    url('source/font/Sporting_Grotesque-Regular_web.eot');
    src:    url('source/font/Sporting_Grotesque-Regular_web.eot?#iefix') format('embedded-opentype'),
            url('source/font/Sporting_Grotesque-Regular_web.woff') format('woff'),
            url('source/font/Sporting_Grotesque-Regular_web.woff2') format('woff2'),
            url('source/font/Sporting_Grotesque-Regular_web.ttf') format('truetype'),
            url('source/font/Sporting_Grotesque-Regular_web.svg#svgFontName') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
	font-family: MonumentGroteskRegular;
	src:
			url('source/font/monument-regular/MonumentGrotesk-Regular.otf') format('otf'),
			url('source/font/monument-regular/MonumentGrotesk-Regular.woff') format('woff'),
			url('source/font/monument-regular/MonumentGrotesk-Regular.woff2') format('woff2');
	font-weight: normal;
	font-style: normal;
}

.header {
	position: absolute;
	width: 200px;
}

#mail {
	left: 0;
	margin: 10px 30px;
}

#portfolio {
	right: 0;
	text-align: right;
	margin: 10px 30px;
}

#mLink,
#pLink {
	top: 0;
	height: 100px;
	width: 300px;
	max-width: 45vw;
	cursor: pointer;
}

#mLink {
	left: 0;
}

#pLink {
	right: 0;
}

#container {
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	background-image: url('source/bg_kissen.jpg');
	background-size: cover;
	background-position: center;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

h1 {
	font-size: 6vw;
	text-align: center;
	line-height: 140%;
}

@media screen and (max-width: 575px)
{
	h1 {
		font-size: 32px;
	}
	
	h2 {
		font-size: 20px;
	}
}

#w1 {
	background-image: url('source/bg_rotewolken_1.png');
}

#w2 {	
	background-image: url('source/bg_rotewolken_2.png');
}

#w3 {	
	background-image: url('source/bg_rotewolken_3.png');
}

.wolke {
	position: absolute;
	background-size: cover;
	width: 108%;
	min-height: 108%;
	top: -4%;
	left: -4%;
	display: none;
}