/* open-sans-regular - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/open-sans-v15-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Regular'), local('OpenSans-Regular'),
       url('../fonts/open-sans-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/open-sans-v15-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/open-sans-v15-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/open-sans-v15-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/open-sans-v15-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}

/* open-sans-600 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/open-sans-v15-latin-600.eot'); /* IE9 Compat Modes */
  src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
       url('../fonts/open-sans-v15-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/open-sans-v15-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/open-sans-v15-latin-600.woff') format('woff'), /* Modern Browsers */
       url('../fonts/open-sans-v15-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/open-sans-v15-latin-600.svg#OpenSans') format('svg'); /* Legacy iOS */
}

/* merriweather-sans-800italic - latin */
@font-face {
  font-family: 'Merriweather Sans';
  font-style: italic;
  font-weight: 800;
  src: url('../fonts/merriweather-sans-v14-latin-800italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/merriweather-sans-v14-latin-800italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/merriweather-sans-v14-latin-800italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/merriweather-sans-v14-latin-800italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/merriweather-sans-v14-latin-800italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/merriweather-sans-v14-latin-800italic.svg#MerriweatherSans') format('svg'); /* Legacy iOS */
}

/* Reset */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, cite, code,del, dfn, img, ins, kbd, q, s, samp, strike, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, lael, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, .main-nav, output, ruby, section, summary,time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline;line-height: 100%;}
body {line-height: 1;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}
table {	border-collapse: collapse;border-spacing: 0;}

/* ----------------------------- */
/* ------- HTML Elements ------- */
/* ----------------------------- */
body {font-family: "Open Sans", Helvetica, Arial, sans-serif; color: #000; background-color: #FFFFFF; }
a {color: #007104; text-decoration: underline; outline: none;}
a:focus, a:hover, a:active {color: #fda81e; text-decoration: underline;}
h1 {margin: 0 0 4px 0; font-size: 38px; line-height: 150%; font-weight: 600; color: #007104;}
h2 {margin: 32px 0 0 0; font-size: 32px; line-height: 150%; color: #007104; font-weight: 600; }
h3 {margin: 32px 0 0 0;font-size: 24px; line-height: 150%; color: #007104; font-weight: 600;}

/* ----------------------------- */
/* ------- Basic Classes ------- */
/* ----------------------------- */
.floatleft {float: left;}
.floatright {float: right;}
.clearfloat {clear: both;}
.hidden {display:none;}

/* ----------------------------- */
/* ---- Document Structure ----- */
/* ----------------------------- */
#slider-container-top, #main {width:100%; max-width: 1400px; margin: 0 auto;}
#site-header, #footer-content, .content-schmal {width:100%; max-width:1000px; margin:0 auto; }

/* ----------------------------- */
/* ---------- Header ----------- */
/* ----------------------------- */
#logo {width: calc(100% - 40px); max-width: 264px; height: 70px; margin:20px auto;}
#logo img {width: 100%; height: auto;}

/* ------- Mobile Navigation Toggle ------- */
.off-canvas-nav ul {list-style: none;z-index: 10000;width: 100%;text-align: center;}
.off-canvas-nav ul li a {display: inline-block;font-size: 26px;color: #007104;padding: 10px 10px 10px 40px;margin: 20px 0;background: url(../images/menu.png) 5px 9px no-repeat #fff; text-transform: uppercase; text-decoration: none;}
.off-canvas-nav ul li a:focus, .off-canvas-nav ul li a:hover, .off-canvas-nav ul li a:active {text-decoration: none;}

/* ---------- .main-navigation ----------- */
.main-nav ul {display: none;}
.active-nav .main-nav ul {display: block;width: 100%;list-style: none;margin-bottom: 40px;}
.active-nav .main-nav ul li a {display: block;font-size: 22px;background-color: #fff; color: #007104;padding: 10px 20px;text-decoration: none;border-bottom: solid 1px #d8d8d8; font-weight: 600;}
.active-nav .main-nav ul li a:focus,.active-nav .main-nav ul li a:hover,.active-nav .main-nav ul li a:active {background-color: #007104;color: #fff;}
.active-nav .main-nav ul ul {margin-bottom: 0;}
.active-nav .main-nav ul ul li a {padding-left: 40px;font-size: 20px;}



/* ----------------------------- */
/* ---------- Content ---------- */
/* ----------------------------- */
article {padding: 20px 20px 40px 20px;}
article p {
	margin: 16px 0 0 0;
	line-height: 130%;
	font-size: 18px;
    font-weight: 400;
}

.content ul,
.content ol {
	margin: 14px 0 0 20px;
	overflow:hidden;
	padding-left: 30px;
}
.content ul li,
.content ol li {
	font-size: 18px;
	line-height: 130%;
	margin-top: 3px;
	font-style:normal;
}

p.bg-gruen {background-color: #007104; color: #fff; font-size: 24px; text-align: center; padding: 15px 60px; margin: 0;}
.content-breit {background: url("../images/maehdrescher.jpg") 0 0 no-repeat; width: 100%; max-width: 1400px; height: 438px; background-size: cover;}
.content-breit p {font-family: "Merriweather Sans", "Open Sans", Arial, sans-serif; font-size: 54px; color: rgba(255,255,255,.8); text-align: center; padding-top: 10%; font-style: italic; line-height: 130%;}

/* ----------------------------- */
/* ----------- Footer ---------- */
/* ----------------------------- */
footer {clear:both;}
#footer-content {}
footer .left p {text-align:left;  font-size: 17px; color: #191a12; line-height: 130%; margin: 0;}

#servicenav ul {list-style: none; margin: 0; padding:0;}
#servicenav li {position: relative; display: inline;}
#servicenav li:after {display: inline-block; content:"|"; margin: 0 2px 0 6px; color: #191a12;}
#servicenav li:last-child:after {content:""; margin: 0; }
#servicenav li a {font-size: 17px; color: #191a12; text-decoration: none;}
#servicenav li a:hover {text-decoration: underline;}

.credit {text-align: center; font-size: 12px; color: #626262; padding-bottom: 24px;}
.credit a {color: #626262; text-decoration: none;}
.credit a:hover {text-decoration: underline;}

/* ----------------------------- */
/* --------- Specials ---------- */
/* ----------------------------- */

/* ---------- Google Map ----------- */
.map {
	position: relative;
	padding-bottom: 50%;
	height: 0;
	overflow: hidden;
	margin-top:0;
}
.map iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
/* ---------- Slider ----------- */
#slider-container-top {position:relative;width: 100%;}
#slider-container-top .flexslider .slides li {position:relative;}
.slidertext {display: none;}


/* ---------- Kontaktformular ----------- */
#kontaktformular {margin-top:20px;}
#kontaktformular label {width:100%;display:block;margin:20px 0 5px 0;}
#kontaktformular .cb label {display: inline; }
#kontaktformular input[type="text"] {padding:5px;width:100%;max-width:400px;border-radius:3px;}
#kontaktformular .internal input {display: none;}
#kontaktformular input.captcha {width: calc(100% - 120px); max-width: 100px; float: left; margin-right: 20px;}
#kontaktformular img.captcha-image {display: inline;}
#kontaktformular textarea {width:100%;max-width:410px;border-radius:5px;min-height:163px;}
#kontaktformular input[type="submit"] {clear: both; display:block;width:240px;color:#fff;border:0;padding: 5px 10px;margin:20px 0;font-size:18px;border-radius:5px;background: #007104;cursor:pointer;font-weight:600;}
#kontaktformular input[type="submit"]:hover {background:#c4c4c4;color:#007104;}
#kontaktformular p {}

/* ----------------------------- */
/* ------- Media Queries ------- */
/* ----------------------------- */
@media screen and (min-width: 568px) {
}
@media screen and (max-width: 767px) {
	h1 {font-size: 24px;}
	h2 {font-size: 20px;}
	article img {width: auto; max-width: 100%; height: auto; margin: 0 auto;}
	
}
@media screen and (min-width: 768px) {
    .content-breit p {font-size: 66px;}
	footer p {margin-top:16px; font-size:17px;}
    
}
@media screen and (max-width: 1023px) {
	.desktop-only {display:none;}
    article p {-webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto;}
	article img.floatleft {float: none;margin: 20px auto;display: block;}
	article img.floatright {float: none;margin: 20px auto;display: block;}
    #footer-content {text-align: center; padding-top: 30px;}
    footer .left p {text-align:center;}
    footer .cols-2 {margin-bottom: 20px;}
	.credit {padding-top: 20px;}
	.flexslider .flex-direction-nav {display: none;}
}
@media screen and (min-width: 768px) and (max-width: 1023px) {

}
@media screen and (min-width: 1024px) {
	.mobile-only {display:none;}
	#logo {width: 264px; height: 70px; margin:22px 0 25px 0; float: left;}
	.off-canvas-nav ul {display:none;}
	.main-nav {width: calc(100% - 320px); float: right; margin: 44px 0 0 0; text-align:right;}
	.main-nav ul {display:block; list-style:none;}
	.main-nav li {position: relative; display: inline;}
	.main-nav li a {display:inline-block; font-size:20px; color:#007104; font-weight: 600; padding: 4px 2px 4px 2px; margin:0 26px; text-decoration: none; border-bottom: solid 2px #fff;}
    .main-nav li:last-of-type > a {margin-right: 0;}
	.main-nav li:hover a {text-decoration:none; color: #007104; border-bottom: solid 2px #007104;}
	article {padding: 62px 0 100px 0;}
	article img.floatleft {margin: 5px 24px 24px 0;}
	article img.floatright {margin: 5px 0 24px 24px;}
    article .cols-2 {width: 47.8%;}
    article .cols-2.left {float: left;}
    article .cols-2.right {float: right;}
    .content-breit {height: 438px; clear: both;}
    footer {}
	#footer-content {max-width: 1000px; padding:20px 0 0 0;}
	footer .cols-2 {width: 380px; }
    footer .cols-2.left {float: left; padding: 0; }
	footer .cols-2.right {float: right; padding: 0; text-align: right;}
    #servicenav ul {text-align: right;}
	#slider-container-top img {width:100%;height:728px; }
    #slider-container-top .slidertext-big {font-family: "Merriweather Sans", "Open Sans", Arial, sans-serif; position:absolute; bottom:360px;left: calc(50% - 450px); padding: 20px 30px; font-size: 60px; font-weight: 800; font-style: italic; color: #ff0000; line-height: 130%; }
    #slider-container-top .slidertext-small {position:absolute; bottom:124px;left: calc(50% + 100px); padding: 20px 30px; font-size: 30px; font-weight: 600; color: #246630; line-height: 167%;}
    #slider-container-top .slidertext .bigtext {font-size: 50px; line-height: 167%;}
    #slider-container-top .slidertext .smalltext {font-size: 22px; line-height: 167%;}
    #slider-container-top .slidertext-small a {color: #246630; text-decoration: none;}
    #slider-container-top .slidertext-small a:hover {text-decoration: underline;}
	#slider-container-top .slidertext.animated {display: block;}
    #slider-container-top .slidertext-big.animated {background-color: #fff500;}
    #slider-container-top .slidertext-small.animated {background-color: rgba(255,255,255,.8); border-radius: 20px;}
	#kontaktformular {}
	#kontaktformular input[type="submit"] {width:auto; padding:10px 20px; font-size:18px; margin: 20px 0 40px 0;}
	.map {padding-bottom: 16.35%;}
}
@media screen and (min-width: 1400px) {
    .content-breit {height: 438px; }
}
