/* quicksand-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/quicksand-v37-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* quicksand-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/quicksand-v37-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* quicksand-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/quicksand-v37-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/*-----------------------------------------------------------------------------------*
/* = Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
/*-----------------------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	background: #fff;
	line-height: 1;
}
ol, ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
a img {
	border: 0;
}
img {
	max-width: 100%;
	height:auto;
}


/* Block elements */
header, hgroup, footer, section, article, aside {
	display: block;
}

.clear { clear: both }
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	font-size: 0;
}
* html .clearfix{ zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */
.remove-margin { margin-right: 0 !important }

/*-----------------------------------------------------------------------------------*
/* General
/*-----------------------------------------------------------------------------------*/

html, body {
  height: 100%;
}
body {
  display: flex;
  flex-direction: column;
}
body {
  font-family: 'Quicksand', sans-serif;
  font-weight:400;
  color:#111;
  font-size:24px;
  line-height: 1.25em;
  display: flex;
  flex-direction: column;
}
p {
	margin-bottom: 1em;
}
p:last-child {
	margin-bottom: 0;
}
main {
  flex: 1 0 auto;
}
footer {
  flex-shrink: 0;
}
.container {
	margin:0 auto;
	max-width:1000px;
	padding:60px 20px;
}
.container:not(#imprint) {
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-end;
}
.content {
	width:65%;
}
.columns {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}
#logo {
	padding:60px 20px;
}
h1 {
	font-size:72px;
	line-height: 1em;
	font-weight: 400;
	color:#798b91;
	text-align: center;
}
h1 span {
	font-size:32px;
	font-weight: 600;
	line-height: 1em;
	color:#111;
	display:block;
}
h2 {
	font-size:48px;
	font-weight: 400;
	color:#798b91;
	margin-bottom:0.75em;
}
strong {
	font-weight: 700;
}
#intro {
	background-color:#f2d5c9;
}
a {
	text-decoration: none;
	color:inherit;
}
a:hover {
	color:#798b91;
}
.teaser {
	font-weight: 700;
	background-color: #798b91;
	color:#FFF;
	width:20%;
	padding:20px;
	border-radius: 20px;
	margin-bottom: -100px;
}
#imprint {
	padding:30px 20px;
}
.imprint-content {
	padding:30px 0;
	display: none;
}
.footer-title {
	font-weight: 700;
	cursor: pointer;
}

@media screen and (max-width: 999px) {
	body {
	  font-size:20px;
	}
	h1 {
		font-size:60px;
	}
	h1 span {
		font-size:26px;
	}
	h2 {
		font-size:40px;
		line-height: 1.1;
	}
	#kontakt .columns {
		display: flex;
		flex-direction: column;
	}
	#kontakt .column {
		margin-bottom:1em
	}
	#kontakt .column:last-child {
		margin-bottom:0
	}
	.teaser {
		width:25%;
	}
}
@media screen and (max-width: 640px) {
	
	.content {
		width:100%;
	}
	.container {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}
	.teaser {
		width:50%;
		margin-top:60px;
	}
	#kontakt .container {
		padding-top: 100px
	}
}
@media screen and (max-width: 500px) {
	.teaser {
		width:65%;
	}
	body {
	  font-size:18px;
	}
	h1 {
		font-size:44px;
	}
	h1 span {
		font-size:20px;
	}
	h2 {
		font-size:32px;
	}
}