::selection { background: #75b728; color: #fff; }
::-moz-selection { background: #75b728; color: #fff; }

* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
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, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; }
html, body { height: 100%; }
body { font-family: 'Lato', sans-serif; color: #4e4e4e; background: #75b728; }
.clearfix:before , .clearfix:after { content:""; display:table; } .clearfix:after { clear:both; } .clearfix { zoom:1; }
img { max-width: 100%; height: auto; vertical-align: bottom; }
a { text-decoration: none; }
strong { font-weight: bold; }
small { font-size: 11px; }
em { font-style: italic; }

/* Helper */
.container { margin: auto; max-width: 1080px; padding: 0 30px; }
.colset { margin: 0 -1.3888888888888888%; }
.col { float: left; margin: 0 1.3888888888888888%; }
.col-1-2 { width: 47.22222222222222%; }
.col-1-3 { width: 30.555555555555557%; }
.centered { text-align: center; }
.req { color: #f00; }
.msg { padding: 40px; border: 1px solid; color: #fff; }
.msg-success { background: rgba(16,196,105,.8); border-color: #10c469; }
.msg-error { background: rgba(255,91,91,.8); border-color: #ff5b5b; }
.scroll-btn { width: 170px; height: 129px; cursor: pointer; -webkit-background-size: contain; background-size: contain; background-repeat: no-repeat; }
#scrolltop { display: none; position: fixed; bottom: 30px; right: 30px; background-image: url(../images/scroll-up.png); }
#scrolldown { position: absolute; left: 30px; bottom: 30px; background-image: url(../images/scroll-down.png); }

/* Header */
#header { position: absolute; top: 0; left: 0; width: 100%; z-index: 99; }
.not-home #header { background: rgba(255,255,255,.8); }
#header #logo img { box-shadow: 0 0 20px rgba(0,0,0,.30); }
#header .container { max-width: 100%; }

/* Mainmenu */
#mainmenu { float: right; }
#mainmenu li { display: inline-block; }
#mainmenu a { max-height: 100px; display: block; padding: 76px 15px 10px 15px; color: #4e4e4e; font-weight: 900; text-transform: uppercase; font-size: 14px; -webkit-transition: color .3s; -o-transition: color .3s; transition: color .3s; }
#mainmenu a:hover { color: #75b728; }
#mainmenu a.current-menu-item { color: #fff; background: #75b728; }
#toggle-nav { display: none; cursor: pointer; width: 35px; height: 24px; position: absolute; right: 30px; top: 28px; }
.toggle-nav-inner { position: relative; top: 50%; margin-top: -2px; width: 35px; height: 4px; background: #75b728; }
.toggle-nav-inner:before, .toggle-nav-inner:after { content: ''; position: absolute; width: 35px; height: 4px; background: #75b728; left: 0; -webkit-transition: all .3s; -o-transition: all .3s; transition: all .3s; }
.toggle-nav-inner:before { top: -10px; }
.toggle-nav-inner:after { bottom: -10px; }
#mainmenu.mobile-menu .toggle-nav-inner { background: none; }
#mainmenu.mobile-menu .toggle-nav-inner:before { top: 0; transform: rotate(45deg); -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
#mainmenu.mobile-menu .toggle-nav-inner:after { bottom: 0; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }
#mainmenu.mobile-menu #menu { margin: 10px 0; display: block; background: rgba(255,255,255,.8); }
#mainmenu.mobile-menu #menu li { display: block; float: left; width: 50%; }
#mainmenu.mobile-menu #menu a { padding: 10px; font-size: 14px; }

/* Intro */
#intro { position: relative; padding: 0 30px; height: 700px; height: 100vh; background: url(../images/background-index.jpg) no-repeat; -webkit-background-size: cover; background-size: cover; }
#intro h1 { color: #fff; font-size: 40px; font-weight: 900; text-shadow: 0 0 20px rgba(0,0,0,.8); line-height: 1.4; text-transform: uppercase; position: absolute; top: 25%; left: 30px; }
#overview { overflow: hidden; position: absolute; right: 30px; bottom: 30px; width: 800px; height: 609px; background-image: url(../images/triangle-bg.png); -webkit-background-size: contain; background-size: contain; background-repeat: no-repeat; }
#overview ol { width: 50%; list-style: decimal; position: absolute; z-index: 9; bottom: 23%; right: 25%; -webkit-transform: translate(50%, 50%); -ms-transform: translate(50%, 50%); -o-transform: translate(50%, 50%); transform: translate(50%, 50%); }
#overview li { line-height: 1.5; }
#overview a { color: #000; font-size: 14px; }

/* Eyecatcher */
#eyecatcher { padding-bottom: 34%; background-color: #fff; background-repeat: no-repeat; -webkit-background-size: cover; background-size: cover; background-position: center center; }

/* Content */
#content { padding-top: 60px; padding-bottom: 40px; background: #fff; margin-bottom: 280px; }
#content.leitbild section { margin-bottom: 70px; }
#content h1, #content h2, #content h3, #content h4, #content h5, #content h6 { font-size: 26px; font-weight: 600; text-transform: uppercase; color: #75b728; margin-bottom: .8em; line-height: 1.4; }
#content h2, #content h3, #content h4 { font-size: 20px; }
#content h5, #content h6  { font-size: 18px; }
#content p, #content ul, #content ol { margin-bottom: 35px; line-height: 1.6; }
#content ul, #content ol { margin-left: 30px; }
#content ol { list-style: decimal; }
#content ul { list-style-type: square; }
#content a { color: #75b728; -webkit-transition: color .3s; -o-transition: color .3s; transition: color .3s; }
#content a:hover { color: #4e4e4e; text-decoration: underline; }

/* Footer */
#footer { color: #fff; padding: 60px 0; line-height: 1.6; position: fixed; width: 100%; height: 280px; bottom: 0; left: 0; z-index: -1; }
#footer .contact h4 { text-align: center; margin-bottom: 30px; font-size: 20px; border-bottom: 1px solid #a5ee4f; padding-bottom: 20px; }
#footer a { color: inherit; }
#footer a:hover { text-decoration: underline; }
#footer .spacer { display: inline-block; width: 40px; }

/* Form */
.field-group { margin-bottom: 30px; }
#contactform label { display: block; margin-bottom: -5px; }
#contactform input, #contactform textarea { font: inherit; border: 1px solid #dcdcdc; padding: 10px; width: 100%; }
#contactform input[type="submit"] { width: auto; font-weight: bold; cursor: pointer; padding: 10px 40px; -webkit-transition: all .3s; -o-transition: all .3s; transition: all .3s; }
#contactform input[type="submit"]:hover { background: #75b728; color: #fff; border-color: #a5ee4f; }
#contactform textarea { resize: none; height: 227px; }



.timeline {padding:20px 0 10px 0; background-image:url(../images/timeline.png); background-repeat: no-repeat; background-position: 20% 0;}
.w5 {width: 5%; float: left;}
.w20 {float: left; width: 20%;}
.w35 {float: right; width: 35%;}
.w60 {float: left; width: 60%;}
.w75 {width: 75%; float: left;}

.right {text-align: right;}

.clear {clear: both;}

/* Media Queries */
@media screen and (max-width: 1060px), screen and (max-height: 665px){
	#intro h1 { font-size: 32px; }
	#overview { width: 800px; height: 609px; }
}

@media screen and (max-width: 980px){
	#logo img { width: 250px; }
	#mainmenu a { padding: 56px 10px 10px 10px; font-size: 12px; }
}

@media screen and (max-width: 980px){
	.scroll-btn { width: 118px; height: 89px; }
}

@media screen and (max-width: 820px){
	#mainmenu { float: none; }
	#toggle-nav { display: block; }
	#menu { display: none; }
	#eyecatcher { padding-bottom: 45%; }
}

@media screen and (max-width: 760px){
	#contactform .col-1-3 { width: 47%; }
	#contactform .col-textarea { width: 97%; }

	.w35 {float: none; width: 100%;}
	.w60 {float: none; width: 100%;}

}

@media screen and (max-width: 680px){
	#content { margin-bottom: 0; }
	#footer { height: auto; position: static; }
	#footer .col-1-3 { width: auto; float: none; margin-bottom: 20px; }
}

@media screen and (max-width: 640px){
	#content .col-1-2 { width: 100%; float: none; }


}

@media screen and (max-width: 580px){
	.scroll-btn { width: 79px; height: 59px; }
	#scrolltop { bottom: 10px; right: 10px; }
	#overview, #scrolldown { bottom: 10px; left: 10px; }
}

@media screen and (max-width: 520px){
	#eyecatcher { padding-bottom: 60%; }
}

@media screen and (max-width: 460px){
	body { font-size: 14px; }
	#mainmenu.mobile-menu #menu li { float: none; width: 100%; }
	#contactform .col-1-3 { width: auto; float: none; }
	#content h1 { font-size: 20px; line-height: 1.4; }
	#content h2, #content h3, #content h4 { font-size: 17px; line-height: 1.4; }
	#content h5, #content h6  { font-size: 15px; line-height: 1.4; }
	#content p, #content ul, #content ol { margin-bottom: 25px; line-height: 1.4; }
	#content.leitbild section { margin-bottom: 40px; }
}

@media screen and (max-width: 380px){
	.container { padding: 0 15px; }
	#logo img { width: 160px; }
	#toggle-nav { top: 13px; }
}