/*
@main_color: #4C4F51;
@white: #fff;
@space: 30px;
@max_width: 1200px;
*/

/*** Font ***/
@font-face {
	font-family: Raleway;
	src: url('fonts/Raleway/Raleway-Regular.ttf');
}
@font-face {
	font-family: Raleway;
	src: url('fonts/Raleway/Raleway-Medium.ttf');
	font-weight: bold;
}

/*** Main ***/
* { box-sizing: border-box; }
body { width: 100%; min-height: 100%; margin: 0; background: #4C4F51; color: #fff; font-family: Raleway, Arial; font-size: 22px; font-weight: 300; }
body > div:last-of-type { display: none; }
.container { display: block; position: relative; width: 1200px; margin: auto; }
.clear { clear: both; }
.text-wrap p { margin: 0 0 15px; }
.not-found { margin: 120px auto; text-align: center; }
.not-found h1 { margin: 0; font-size: 148px; }
h1 { text-transform: uppercase; }
/*** Response Message ***/
.response { margin-bottom: 30px; border: 2px solid #fff; padding: 20px; }
.response:before { margin-right: 5px; font-weight: bold; }
.response.success { border-color: #3c763d; background: #dff0d8; color: #3c763d }
.response.success:before { content: 'Erfolgreich:'; }
.response.error { border-color: #a94442; background: #f2dede; color: #a94442; }
.response.error:before { content: 'Fehler:'; }
/*** Buttons ***/
.button { border: 1px solid #bbb; padding: 15px; background: #fff; color: #4C4F51; text-transform: uppercase; cursor: pointer; transition: all 0.2s linear; }
.button:hover { border-color: #fff; background: #bbb; color: #fff; }


/*** Grid Layout ***/
.grid-container {
	display: grid;
	grid-template-columns:
		[full-start] minmax(1em, 1fr)
		[main-start] minmax(0, 1200px) [main-end]
		minmax(1em, 1fr) [full-end];
	grid-gap: 0; position: relative;
}
.grid-container > * { grid-column: main; }
.grid-container > #top-slider { grid-column: full; }

/*** Basic Navigation ***/
.nav { display: table; margin: 0; padding: 0; text-transform: uppercase; }
.nav * { transition: all 0.2s linear; }
.nav li { display: table-cell; padding: 0 15px; list-style: none; cursor: default; }
.nav li:hover > .sub-nav { display: block; }
.nav li a { color: #fff; text-decoration: none; }
.nav li a:hover { color: #bbb; }
.nav .sub-nav { position: absolute; display: none; margin-left: -15px; padding: 0; background: #4C4F51; }
.nav .sub-nav li { display: block; padding: 15px; }


/*** Header ***/
header { z-index: 2; height: 60px; clear: both; background: #4C4F51; }
header .logo { float: left; margin-left: -100px; }
header .main-nav { float: left; margin-top: 25px; margin-left: 100px; }

/*** Slider ***/
#top-slider { position: relative; overflow: hidden; max-width: 100%; height: 600px; margin: auto; }
.slides { display: none; }
.slides img { width: 100%; }

/*** Home ***/
.home { padding-top: 60px; }
.home .button-wrap { margin: 60px 0; }
.home .button-wrap .home-button:first-of-type { float: left; }
.home .button-wrap .home-button:last-of-type { float: right; }

/*** Map ***/
#map { height: 400px; border-radius: 0 0 30px 30px; box-shadow: 5px 5px 10px #000; }

/*** Page ***/
.page { margin-top: 120px; margin-left: 265px; }
.page a { color: #bbb; }
.page h2 { margin: 0; }
/*** Drafts ***/
.page .draft { float: left; width: 49%; margin-bottom: 30px; background: #fff; text-align: center; }
.page .draft:nth-of-type(even) { margin-left: 2%; }
.page .draft a { color: #fff; text-decoration: none; }
.page .draft a:hover { color: #bbb; }
.page .draft img { width: auto; max-width: 100%; height: 250px; }
.page .draft h2 { background: #4C4F51; text-align: left; font-weight: normal; }
/*** Contact ***/
.contact-wrap { width: 75%; }
.contact-wrap label { display: block; }
.contact-wrap input[type="text"] { width: 50%; margin-bottom: 30px; padding: 10px; line-height: 20px; }
.contact-wrap textarea { width: 100%; height: 250px; padding: 10px; }
.contact-wrap button { display: block; }
.contact-wrap .full-width { width: 100% !important; }
.contact-wrap .half-width { float: left; width: 49%; }
.contact-wrap .half-width:nth-of-type(even) { margin-left: 2%; }
.contact-wrap .half-width input[type="text"] { width: 100%; }
.contact-wrap .req-fields { margin: 30px 0; font-size: 18px; }
.contact-wrap .g-recaptcha { margin-bottom: 30px; }

/*** Footer ***/
footer { margin-top: 60px; padding-bottom: 30px; }
footer .nav { margin: 0 auto; }