@charset "utf-8";
/* CSS Document */
@import url(https://fonts.googleapis.com/css?family=Questrial);

* {
	margin:0; padding:0;
	box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;
	-o-box-sizing: border-box; -ms-box-sizing:border-box;
	}
:after,:before{
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	}

html {
	font-family: 'Questrial', sans-serif;
	-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;
	font-size:1.0rem;
	}

html, .header-cont {
background-attachment: fixed;
background-position: top right;
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
background-color:#1c1814;
	}
body {font-size:100%; line-height:130%; margin:0; padding:0;}
.wrapper {}
.container {margin: 0 auto;}
	
table, div {border:0; border-spacing:0; border-collapse:collapse;width:100%;display:block;padding:0; margin:0; }
img {border:0;}

/*   layoutlayers   */
#left, #right {height:50%; width:2.5%; position:fixed; display:block;right:0; bottom:0;background:#700506;}
#left {top:0;left:0;}
#siteimg {position:fixed;bottom:0;right:5%;display:block;
	background-repeat:no-repeat;
	background-size:contain;
	background-position:bottom center;height:81%;max-width:20%;
	background-image:none;} 

/* z-index */
#siteimg  {z-index:1;}
.container {z-index:5;}
.header-cont{z-index:10;}
#left,#right {z-index:20;}
.biglabel {z-index:6;}
aside {z-index:7;}
	
/* Formatbreite */
	html, .wrapper, .header-cont, .logo img, .headbox {width:100%;}
	.header, #contwrap, .container, .biglabel {width:90%; max-width:1000px;}

/*  height 100%; */
	html, body, .wrapper, #contwrap, .innerhead {height:100%;}
	#contwrap {margin:0 auto;}
	.container {position:absolute;top:50%;}

/* NAVIGATION */
	nav, ul, li {margin:0; padding:0;}
	nav ul {list-style-type:none; margin-right:-25%;}
	.nav li {margin:0; padding:0;}
  	.nav a {padding: 0.9375rem 2rem;display:block;text-decoration:none;}
	.nav a {background-color:#1c1814;color:#fff;}
	.nav a:hover {}
	.nav a:hover:before, nav a.current:before {content:''; display:inline-block; margin-left:-18px; margin-top:4px;position:absolute;width:4px; height:12px; background:#fff;}
	nav a.current:before {background:#700506;}

/* offcanvas */
	.toggler {display:inline-block; cursor:pointer;float:right;margin-right:-0.9375rem;}
	.navicon {width:2.5rem; height:2.5rem; background:url('navicon.png') no-repeat center center; display:block;}
	
	aside {width:auto;position:absolute;right:0;margin-right:-100%;}
	.biglabel {height:100%;width:100%;position:absolute;cursor:pointer;}
    .toggle, .biglabel {display: none;}

	.toggle:checked + .wrapper #contwrap section .header-cont .header > aside {margin-right:0}
	.toggle:checked + .wrapper #contwrap > section .biglabel {display:block;}
	aside {
      -webkit-transition: margin 0.5s ease-in-out;
      -moz-transition: margin 0.5s ease-in-out;
      -ms-transition: margin 0.5s ease-in-out;
      -o-transition: margin 0.5s ease-in-out;
      transition: margin 0.5s ease-in-out;
    }

/*  header  */
	.header-cont {position:fixed;top:0;left:0;}
	.header {position:relative; height:auto;display:block;margin:0 auto;overflow:visible;}
	
	
	@media only screen and (min-width: 648px) {
	.header-cont {padding-top:0.9375rem;}}
	
	div.header {position:relative; height:auto;display:block;}
    div.row:before, div.header:before,
    div.row:after, div.header:after {content:''; display:table; height:0;width:100%;}
	div.logo {width:70%;display:inline-block;float:left;max-width:240px;}
	div.row:after {height:1.8375rem;}

/* höhe 144 */
div.row:nth-child(1) {margin-top:-144px;}
	.headbox,
	div.header-cont {height:116px;}
	aside {top:136px;}

/* textabstände paddings */
.txtbox, .logo, .headbox h2, .toggler {padding:0.9375rem;}

/* -------------------------------------------------------------------------------------*/
	.headbox {background:url(bgh3.jpg)/**/ repeat-x top center;}
	.innerhead {width:100%; display:table;}
	h2 {margin:0;padding:1em 0;
	color:#5e5e5e;
	line-height:100%;
	text-transform: uppercase;
}
	h3 {color:#5e5e5e; color:#700506; text-transform:uppercase;font-size:1rem;margin-bottom:0.5rem;}
	.headbox h2, .headbox img {}
	.headbox h2 {margin:0;display:table-cell;vertical-align:bottom;bottom:0;font-size:220%;line-height:100%;color:#9e7f6c;
    text-shadow: 0 -1px 1px #000, 0 1px 1px #fff;
	letter-spacing:0.05rem;
}

.headimg {overflow:hidden;}
.headimg img {width:auto;height:144px;float:right;}
p {margin-bottom:0.9875rem;
}
p, dl {
   -moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto; }
.txtbox {background: rgba(255,255,255,.75); padding-bottom:1.875rem;}
.imgbox, .imgbox img {width:100%;height:auto;}


.row {margin-bottom:0.75rem;}

.row p, .txtbox a, .row ul	{
	color:#333333;
	letter-spacing:0.025rem;
	line-height:150%;
	width:auto;
}
.row ul {list-style-type:none;}
.row li {padding-left:16px;}
.row li:before {content:'–';margin-left:-16px; width:16px;height:auto; display:inline-block;}

.txtbox a:hover {color:#000;}
strong, b, h3 {letter-spacing:0.05em;}

.artimg{width:40%;height:auto;float:right;margin-left:12px;display:inline-block;position:relative;clear:both;}
.artimg img {width:100%;position:relative;display:block;}

@media only screen and (min-width: 648px) {
.article {width:77%;}
aside {top:138px;}
}
#subnav ul {list-style-type:none;}
#subnav li {display:inline-block;}
#subnav {/*background:#1c1814;*/ color:#fff;
  position:fixed;
  top: 96px;
  z-index:200;padding:1rem;}
#subnav a {color:#fff;text-decoration:none;}
#subnav li:after {content:'|';margin:0 12px;}
#subnav li:last-child:after {content:'';margin-right:0;}

@media only screen and (min-width: 648px) {
#subnav {width:77%;}
}
table {margin:0; border:0;}
td {vertical-align:top; padding:9px 12px;}

.cols3, cols12{
	display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;    /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;  /* TWEENER - IE 10 */
	display: -webkit-flex; /* NEW - Chrome */
	display: flex;         /* NEW, Spec - Opera 12.1, Firefox 20+ */
  	-webkit-flex-wrap:wrap;
	flex-wrap:wrap;
  	-webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
	-webkit-box-align-content:stretch;
	justify-content: space-between;
  	-webkit-box-pack:justify;
  	-moz-box-pack:justify;
  	-webkit-flex-pack:justify;
}
@media only screen and (min-width: 800px) {
.cols3 > div {width:30%;}
.txt h3 {min-height:2.75rem;text-align:center;margin-top:6px;}
}

@media only screen and (max-width: 799px) {
.cols3 .grid {width:100%;	display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;    /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;  /* TWEENER - IE 10 */
	display: -webkit-flex; /* NEW - Chrome */
	display: flex;         /* NEW, Spec - Opera 12.1, Firefox 20+ */
  	-webkit-flex-wrap:wrap;flex-wrap:wrap;
  	-webkit-align-content: stretch;-ms-flex-line-pack: stretch;align-content: stretch;-webkit-box-align-content:stretch;
	justify-content: space-between;-webkit-box-pack:justify;-moz-box-pack:justify;-webkit-flex-pack:justify;
	margin-bottom:1.875rem;
}
.cols3 .grid:last-child {margin-bottom:0;}
.grid .imgbox {-webkit-flex-basis:30%;-moz-flex-basis:30%;flex-basis:30%;margin-right:16px;}
.grid .txt {-webkit-flex-grow:2; -moz-flex-grow:2; flex-grow: 2;-webkit-flex-basis:60%;-moz-flex-basis:60%;flex-basis:60%;}
}
.cols3:after {content:''; display:table; width:100%; height:0;clear:both;}
.txt h3 {
	-moz-hyphens: none;
	-o-hyphens: none;
	-webkit-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
	font-weight: normal;
	text-transform: none;
}
.txt p, .txt a {color:#fff;text-align:center;text-decoration:none;}
.txt p.left {text-align:left;}



/* FOOTER */
div.footerref p {text-align:center;}

div.footerref img, div.footerref a img {height:86px; width:auto; background:#fff; border:4px solid #fff;margin:0 10px!important;}

div.footerref p img:first-child, div.footerref p a img:first-child {margin-left:0;}
div.footerref p img:last-child, div.footerref p a img:last-child {margin-right:0;}

.footer:before, .footer:after {content:''; display:table; width:100%; height:0px;clear:both;border-bottom:1px solid #fff;}
.footer p {color:#fff;text-align:center;   -moz-hyphens: none;
   -o-hyphens: none;
   -webkit-hyphens: none;
   -ms-hyphens: none;
   hyphens: none;margin:8px 0;}
.footer a {text-decoration:none; color:#fff;}

.advanced p {text-align: center;font-size:12px;width:100%; display:block;margin:8px 0;color:#fff;}
.advanced a {color:#fff; text-decoration:none;padding-right:12px;}
.clr {width:100%; height:0px; display:block; clear:both;}


/* ANGEBOT toggle */
input.moreinfo[type=checkbox] {
  display:none;}
label.moreinfo { display:block;margin: 0;cursor: pointer;
  position:absolute;left:0;margin-top:-40px;margin-left:12px;width:38px;height:32px;display:block;background:url(btn-down.png) no-repeat center center;}

/* Default State */
dd.moreinfo {
font-size:14px;margin-left:48px;height:0px;padding:0px;position:absolute;display:none;}
dd.moreinfo {clear:right;}
/* Toggled State */
input.moreinfo[type=checkbox]:checked ~ dd.moreinfo,
input.moreinfo[type=checkbox]:checked ~ div.moreinfo {
position:relative;padding:12px; height:auto;background:#fff;display:block;}
input.moreinfo[type=checkbox]:checked ~ label.moreinfo {
  background:url(btn-up.png) no-repeat center center;
}

dl 	  {color:#5e5e5e;}
dl dt {float:left;font-weight:bolder; color:#990000; width:48px;}
dl dd {padding-left:48px;margin-bottom:12px;}
dd.bottomline {border-bottom:1px solid #fff;border-top:1px solid #fff;display:table;width:100%;}
dd.bottomline span {padding:4px 0; padding-left:48px;}
@media only screen and (min-width: 700px) {
dd.bottomline span {width:auto;display:inline-block;}
dd.bottomline span.preis {padding-left:0px;}
dd.bottomline span.preis {text-align:right;float:right;}
}
dl:after/*, .bottomline:after*/ {content:''; width:100%;display:block; height:18px; /*background:#999900;*/}
dd span {display:inline-block;height:auto;}
.preis i {font-style:normal; font-size:13px;}

@media only screen and (min-width: 800px) {
dd.moreinfo, div.moreinfo{
column-count: 2; column-gap: 16px; 
-moz-column-count: 2; -moz-column-gap: 16px; 
-webkit-column-count: 2; -webkit-column-gap: 16px;}
}
/* Ende ANGEBOT toggle */

p.whitetxt {color:#fff;margin-top:12px;}
p.whitetxt a {color:#fff;}

/* --- KARTE --- */
.absolute {position:absolute;}
div.lupe {width:100%; height:0px; display:block; position:relative;0}
div.lupe a {border:0px solid #7a7a7a; width:20%;height:10px;position:absolute;margin-left:53%;margin-top:16%;padding:9% 10%;
cursor:-webkit-zoom-in; cursor:-moz-zoom-in;}
div.lupe a:hover, div.lupe a:focus {background: url(../images/anfahrt_lupe.png) no-repeat top left;width:404px; height:348px;padding:0;margin-left:40%;margin-top:10%;cursor:auto;border:2px solid #7a7a7a;-webkit-box-shadow: 0px 0px 12px 4px rgba(102,102,102,0.64);
-moz-box-shadow: 0px 0px 12px 4px rgba(102,102,102,0.64);
box-shadow: 0px 0px 12px 4px rgba(102,102,102,0.64);}




/*Navigation
@media only screen and (min-width: 1000px) {
	.toggler {display:none;}
	aside {margin-right:0;top:0px;}
	nav, ul, li {}
	nav ul {margin-right:-10%;}
	.nav li {margin:0; padding:0;}
  	.nav a {padding: 0.4rem 0;}
	.nav a {background-color:transparent;}
	.nav a {color:#fff;}
	.nav a.current {background-color:#fff; color:#362a20;}
	.nav a:hover {background:none;}
	.nav a:hover:before, nav a.current:before {content:''; display:inline-block; margin-left:-18px; margin-top:4px;position:absolute;width:4px; height:12px; background:#fff;}
	nav a.current:before {color:#CC0033;}
	#siteimg {max-height:65%;}
} */