html, body
{
	height:				100%;
	margin:				0;
}

body
{
	font-family:		Open Sans;
	font-size:			1em;
	line-height:		2em;
	
	/* overflow-y:			hidden; */
}

.button, button, form label, form input
{
	width:				100%;
	padding:			0.7em 0;
	border:				none;
	border-radius:		3px;
	display:			block;
	font-size:			1em;
}

.button, button, input[type=button], input[type=submit], label[for=toggle] a
{
	color:				#fff;
	text-transform:		uppercase;
	background-color:	#009ee3;
	text-align:			center;
}

.main
{
	width:				100%;
	height:				100%;
	min-height:			805px;
	min-width:			360px;
	
	display:			flex;
	flex-direction:		column;
}

.header
{
	background:			url("../svg/duve consulting.svg") no-repeat center;
	min-height:			100px;
	/* height:				12%; */
	margin:				12px 0;
}

.middle
{
	flex-grow:			1;
	position:			relative;
	
	background-image:	url("../images/duve-headerbild_2.jpg");
	background-size:	cover;
}

.content
{
	display:			inline-block;
	box-sizing:			border-box;
	width:				36ch;
	padding:			2em;
	
	position:			absolute;
	left:				4%;
	
	border-radius:		0 0 20px 20px;
	background-color:	#fff;
	
	-webkit-transition:	all 0.8s;
	transition:			all 0.8s;
}

.content h1
{
	/* text-align:			justify; */
	text-transform:		uppercase;
	
	color:				#002e5e;
	font-size:			2.7em;
	font-weight:		300;
	line-height:		115%;
}

.content ul
{
	padding-left:		0;
}

.content ul li
{
    list-style-type:	none;
}

.content ul li:before
{
	content:			"—";
	margin-right:		1em;
}

#toggle
{
	display:			none;
}

.footer
{
	text-align:			right;
	font-size:			0.8em;
	padding: 			10px 20px 6px;
}

a
{
	color:				initial;
	text-decoration: 	none;
}

.center
{
	display:			flex;
	justify-content:	center;
}

form
{
	display:			flex;
	flex-wrap:			wrap;
	
	border-radius:		20px;
	background-color:	#fff;
	
	-webkit-transition:	all 0.8s;
	transition:			all 0.8s;
}

form > div
{
	display:			flex;
	flex-direction:		column;
	flex-wrap:			wrap;
	justify-content:	space-between;
	box-sizing:			border-box;
	width:				36ch;
	padding:			2em;
}

form label
{
	display:			inline-block;
	vertical-align:		text-bottom;
	padding:			1em 0 0 0;
}

form label[for=message]
{
	flex-basis:			100%;
}

form textarea
{
	resize:				none;
	border-radius:		3px;
	width:				100%;
	height:				9em;
}

form input[type=text], form input[type=email], form input[type=tel], textarea
{
	/* border:				1px solid #ececec; */
	border:				1px solid #bcbcbc;
}

form input[type=text].required, form input[type=email].required, form input[type=tel].required, textarea.required
{
	border-color:		#ff0000;
}

#toggle:checked + .content
{
	/* bottom:				calc(100% + 150px); */
	
	-webkit-transition:	all 0.8s;
	transition:			all 0.8s;
}

@media (max-width: 765px)
{
	
}

@media (max-height: 700px)
[

}
