/* 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, label, 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%;
	font: inherit;
	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: "PT Sans", Helvetica, Arial, sans-serif;
	color: #464647;
	background-color: #FFFFFF;
}
a {
	color: #FF0000;
	text-decoration: none;
	outline: none;
}
a:focus, a:hover, a:active {
	text-decoration: underline;
	color: #aac654;
}
a[rel=lightbox] {
	cursor: url('../images/lupe.cur'), pointer;
}
h1 {
	margin: 0;
	font-size: 28px;
	line-height: 125%;
	font-weight: 700;
	color: #e30613;
}

h2 {
	margin: 10px 0 0 0;
	font-size: 18px;
	color: #676666;
	font-weight: 700;
}
h3 {
	margin: 20px 0 0 0;
	font-size: 14px;
	color: #aac654;
	font-weight: 700;
}
small {
	font-size: 10px;
}
/* ----------------------------- */
/* ------- Basic Classes ------- */
/* ----------------------------- */
.floatleft {
	float: left;
}
.floatright {
	float: right;
}
.clearfloat {
	clear: both;
}

/* ----------------------------- */
/* ---- Document Structure ----- */
/* ----------------------------- */
#container {
   width: 100%;
   max-width: 960px;
   margin: 0 auto;
   position: relative;
}
.site-header {
   position: relative;
   width: 100%;
}
#main {
	position: relative;
	padding: 0 20px;
}
article {
	position: relative;
	background: rgba(232,232,232,.8); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(232,232,232,.8) 0%, #ffffff 98%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(232,232,232,.8) 0%,#ffffff 98%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(232,232,232,.8) 0%,#ffffff 98%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(232,232,232,.8)', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
	border-top: solid 5px rgba(162,138,106,.8);
	margin: 30px 0 20px 0;
}
footer {
   clear: both;
   padding: 0 20px;
   margin-bottom: 60px;
}

/* ----------------------------- */
/* ---------- Header ----------- */
/* ----------------------------- */
#logo {
	width: 100%;
	max-width: 382px;
	height: auto;
	margin: 30px auto;
	z-index: 100;
}
#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: 22px;
	color: #aac654;
	border: solid 1px #aac654;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding: 10px 10px 10px 40px;
	margin: 20px 0;
	background: url(../images/menu.png) 5px 7px no-repeat #fff;
}
.off-canvas-nav ul li a:hover {
	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;
	background: #b8ce67;
}
.active-nav .main-nav ul li a {
	display: block;
	font-size: 24px;
	background-color: #e30613a;
	color: #fff;
	padding: 10px 20px;
	text-decoration: none;
	border-bottom: solid 1px #baccb8;
}
.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: #fff;
	color: #e30613;
}
.active-nav .main-nav ul ul {
	margin-bottom: 0;	
}
.active-nav .main-nav ul ul li a {
	padding-left: 40px;
	font-size: 20px;
}
.active-nav .main-nav ul ul a img,
.active-nav .main-nav ul ul a .submenu-text {
		display: none;
}


/* --------- Info-Box ---------- */
#infobox {
	background-color: #ffffff;
	border: solid 1px #4e9a42;
	border-radius: 4px;
}
#infobox h3 {
	font-size: 26px;
	margin: 20px;
}
#infobox p {
	font-size: 18px;
	font-weight: 700;
	color: #e30613;
	margin: 0 20px 20px 20px;
}

/* ----------------------------- */
/* ---------- Content ---------- */
/* ----------------------------- */
article {
	padding: 36px 20px;
}

article p {
	margin: 26px 0 0 0;
	line-height: 150%;
	font-size: 15px;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
}
article a[rel=lightbox] {
	cursor: url('../images/lupe.cur'), pointer;
}
.content ul,
.content ol {
	margin: 26px 0 0 20px;
}
.content ul li,
.content ol li {
	font-size: 15px;
	line-height: 150%;
	margin-top: 7px;
}

article img {
	width: 100%;
	max-width: 283px;
	height: auto;
	border: solid 3px #fff;
	outline: solid 1px #d9d9d9;
}
article img.floatleft {
	float: none;
	margin: 20px auto;
	display: block;
}
article img.floatright {
	float: none;
	margin: 20px auto;
	display: block;
}
article .col,
footer .col {
	width: 100%;
	margin-top: 30px;
}

/* Tabelle */
table {
	margin: 30px 0;
	border-collapse: collapse;
	width: 100%;
}
td, th {
	padding: 5px;
	border: solid 1px #d9d9d9;
}
th {
	background-color: #4e9a42;
	color: #fff;
}

/* Navigationsboxen im Content */
#contentnav {
	list-style-type: none;
	margin: 40px 0 0 0;
	padding: 0;
}
#contentnav li {
	width: 258px;
	height: auto;
	margin: 0 auto;
	display: inline-block;
	vertical-align: top;
}
#contentnav li a {
	-webkit-hyphens: auto;
	 -moz-hyphens: auto;
	 -ms-hyphens: auto;
	 hyphens: auto;
	 display: block;
	 min-height: 230px;
	 color: #464647;
}
#contentnav li a:hover {
	filter: alpha(opacity = 50); /* IE 6, 7, 8 */ 
	-ms-filter: "alpha(opacity = 50)"; /* ab IE 8 zusätzlich möglich */ 
	opacity: .5; /* alle anderen Browser einschließlich IE 9 */
}
#contentnav li a .contentnav-header {
	display: inline-block;
	width: 218px;
	background-color: #676666;
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	padding: 5px 20px;
}
#contentnav li a#contentnav-1 {
	background: url(../images/contentnav_01.jpg) 0 30px no-repeat;
}
#contentnav li a#contentnav-2 {
	background: url(../images/contentnav_02.jpg) 0 30px no-repeat;
}
#contentnav li a#contentnav-3 {
	background: url(../images/contentnav_03.jpg) 0 30px no-repeat;
}
#contentnav li a#contentnav-4 {
	background: url(../images/contentnav_04.jpg) 0 30px no-repeat;
}
#contentnav li a#contentnav-5 {
	background: url(../images/contentnav_05.jpg) 0 30px no-repeat;
}
#contentnav li a#contentnav-6 {
	background: url(../images/contentnav_06.jpg) 0 30px no-repeat;
}
#contentnav li a .contentnav-text {
	display: inline-block;
	padding: 160px 5px 0;
	font-size: 13px;
	line-height: 130%;
}
/* ----------------------------- */
/* ----------- Footer ---------- */
/* ----------------------------- */
footer {
	color: #404040;
	font-size: 14px;
}
footer p {
	margin-bottom: 12px;
	line-height: 120%;
}
footer a {
	color: #c3a37f;
}
footer a:hover {
	color: #FFFFFF;
	text-decoration: none;
}
.credit {
	clear: both;
	font-size: 12px;
	text-align: right;
	margin-right: 100px;
}
.credit a {
	color: #7e7f80;
}
.credit a:hover {
	color: #7e7f80;
}
.credit a:hover .red {
	color: red;
}
.credit a:hover .green {
	color: #8c755b;
}
/* ---------- Footer Navigation ----------- */
footer nav ul {
	float: left;
	margin: 0 40px 0 15px;
}
footer nav ul:last-of-type {
	margin-right: 0;
}

footer nav li {
	color: #c3a37f;
}
footer nav li a {
	color: #404040;
}
footer nav li a:hover {
	color: #eb2316;
	text-decoration: none;
}

@media screen and (max-width: 599px) {
	h1 {font-size: 23px;}
	footer {
		text-align: left;
	}
	footer p {
		margin-bottom: 20px;
	}


}


/* ----------------------------- */
/* --------- Specials ---------- */
/* ----------------------------- */

	#slider-container-top {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: auto;
	}
/* ---------- Google Map ----------- */
.map {
	position: relative;
	padding-bottom: 100%;
	height: 0;
	overflow: hidden;
}
.map iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/* --------- Accordion --------- */
.faq {width:90%;margin: 20px 0 60px 0;}
.faq dt {width:100%;color: #735325; font-size:18px;padding:12px 20px;border-bottom:solid 1px #fff; margin-bottom: 5px; background:#fff; border: solid 1px #cbc7c7; border-radius: 5px;}
.faq dd {display:none; color:#262728;padding:24px 20px;line-height:140%;}
.faq a {display:inline-block;width:20px;height:20px;float:left;background-position:0 3px; background-repeat:no-repeat; padding: 0 12px 0 0;}
.faq .closed {background-image:url(../images/arr-down.png);}
.faq .open {background-image:url(../images/arr-up.png);}
.faq a span {position:absolute;left:-10000px; top:auto; width:1px; height:1px; overflow:hidden;}
.faq dd ul {margin: 0;}

/* -------------- Kontaktformular --------------- */
form {margin: 30px 0; width:100%; max-width: 400px; }
label {font-size: 16px; width: 100%; }
input[type="text"],
textarea {
	border: solid 1px #ccc;
	border-radius: 4px;
	padding: 6px;
	font-size: 16px;
	width: 100%;
	margin: 7px 0 12px 0;
}
.checkbox label {
	font-weight: normal;
	line-height: 200%;
}
div.checkbox {
	margin-bottom: 20px;
}
input.captcha { 
	width: 20%; 
	display: inline-block; 
	margin-right: 20px;
}
img.captcha-image,
img.refresh-image {
	vertical-align: middle;
}
.form-control {
	border-radius: 2px;
	margin-bottom: 5px;
	background-color: #FFFFFF;
}
.textend {
	margin: 15px 0;
}
.zwtext{
  margin: 10px 0;
}
article form img {
	width: auto;
	height: auto;
}
form .btn {
	color: #fff;
	padding: 7px 10px;
	border-radius: 5px;
	font-size: 15px;
	margin-right: 10px;
}
form .btn.btn-success {
	border: solid 1px #3e8f3e;
	background: linear-gradient(#5ab65a, #419641);
}
form .btn.btn-success:hover {
	border: solid 1px #398439;
	background: linear-gradient(#4ea64e, #419641);
}
form .btn.btn-danger {
	border: solid 1px #b92c28;
	background: linear-gradient(#d7504c, #c12e2a);	
}
form .btn.btn-danger:hover {
	border: solid 1px #ac2925;
	background: linear-gradient(#cc3f3b, #c12e2a);	
}


/* ----------------------------- */
/* ------- Media Queries ------- */
/* ----------------------------- */


@media screen and (max-width: 1023px) {
	#slider-container-top {display:none;}
	#container {background:url(../images/slider_01.jpg) 0 0 no-repeat; background-size: contain;}


	table, tr, td {
		display: block;
	}
	thead {
		display: none;
	}
	tr td:first-child {
		background-color: #b29a7a;
		font-weight: bold;
	  	color: #fff;
	}	
	tr td:first-child.nobg {
		background-color: transparent;
		font-weight: normal;
	  	color: #464647;
	}	

	td { 
		/* Behave  like a "row" */
		position: relative;
		display: block;
		text-align: center	
	}
	td::before {
	  content:attr(data-th);
	  display: block;
	  text-align: center;
	}
	#contentnav li {
		margin-bottom: 30px;
	}
	footer {
		background-color: #afcd55;
		border-top: solid 5px #e30613;
		margin-bottom: 0;
	}
	footer nav ul {
		display: block;
		width: 100%;
	}
	footer nav ul li {
		margin-bottom: 7px;
	}
	.credit {
		margin: 0;
		width: 100%;
		text-align: center;
		padding: 40px 0;
	}
}
@media screen and (min-width: 768px) {
	.flex-caption {
		display: block;
		clear: both;
		position: relative;
		float: right;
		height: 27px;
		padding: 7px 20px 0 60px;
		bottom: 34px;
		background: #fed964;
		color: #007fb3;
		font-size: 18px;
	}
	article img {
		width: auto;
		height: auto;
	}
	article img.floatleft {
		float: left;
		margin: 0 20px 15px 0;
	}
	article img.floatright {
		float: right;
		margin: 0 0 15px 20px;
	}

}
@media screen and (min-width: 1024px) {
	#fullscreen-bg {
		width:100%;
		height: 35px;
		background: url(../images/bg_menu.png) 0 0 repeat-x;
		position: absolute;
		top: 121px;
		left: 0;	
	}
	#logo {margin: 0 auto;}
	.main-nav {
		position: relative;
		width: 100%;
		height: 44px;
		z-index: 99;
	}
	.main-nav ul {
		list-style: none;
		width: 100%;
		margin: 0;
		padding: 0;
		display: inline-block;
	}
	.main-nav li {
		list-style: none;
		display: inline;
		position: relative;
	}
	.main-nav > ul > li {
		float: left; 
		display: block; 
		position: relative;
	}
	.main-nav a {
		display: block;
		float: left;
		height: 28px;
		font-size: 18px;
		color: #404040;
		padding: 16px 40px 0 40px;
		margin: 0;
		text-align: center;
		background: url(../images/topnav_separator.png) 0 8px no-repeat transparent;
	}
	.main-nav > ul > li:first-child a {
		background-image: none;
	}
	.main-nav ul li:hover a {
	color: #eb2316;
	text-decoration: none;
	}

	.main-nav ul ul {position: absolute; left: 0; top: 100%; display:none; z-index: 1000;margin: 0;padding: 10px 0 10px 0; background: rgba(184, 206, 103, .9); width: 250px;}
	.main-nav li:hover > ul {display: block;}
	.main-nav li:hover > ul li a {display: block; width: 230px; background-image: none; margin: 0; padding: 5px 10px 0 10px; text-align: left;}
	.main-nav ul ul li:hover a {background: #fff;}
	.off-canvas-nav {
		display: none;
	}
	#infobox {
		float: right;
		width: auto;
		background-color: rgba(255,255,255,.8);
		border: solid 1px rgba(255,255,255,.8);
		margin: 0 52px 44px 0;
	}
	#main {
		margin-top: 98px;
		padding: 0;
	}
	article {
		padding: 36px 52px;
		box-shadow: 0 9px 0px 0px white, 10px 0 15px -4px rgba(9,8,9, 0.2), -10px 0 15px -4px rgba(9,8,9, 0.2);
		margin-top: 0;
		margin-bottom: 60px;
	}
	article .col {
		width: 45%;
		float: left;
		margin-top: 30px;
	}
	article .col:first-of-type {
		margin-right: 10%;
	}
	td, th {
		display: table-cell;
	}
	#contentnav li {
		width: 258px;
		margin: 0 0 30px 0;
		padding: 0;
		margin-right: 36px;
		box-shadow: 10px 0 15px -14px rgba(9,8,9, 0.4), -10px 0 15px -14px rgba(9,8,9, 0.4);
	}
	#contentnav li:nth-of-type(3n+3) {
		margin-right: 0;
	}
	footer {
	}
	footer .col {
		width: 45%;
		float: left;
		margin-top: 20px;
		margin-bottom: 30px;
	}
	footer .col:first-of-type {
		margin-right: 10%;
	}
	footer nav ul {
		margin-bottom: 30px;
	}
	.credit {
		margin: 0;
		width: 100%;
		text-align: center;
	}
	#fullscreen-bg-footer {
		width: 100%; 
		height: 149px;
		background: url(../images/bg_footer.png) 0 0 repeat-x;
		margin: -270px 0 60px 0;
	}
}