@charset "utf-8";
/* CSS Document */

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%;
  line-height: 1.5em;
  font: inherit;
  vertical-align: baseline;
  -mox-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

HTML {
height: 100%;
overflow-y: scroll;
overflow-x: hidden;
}




body {	
height: 100%;
		background: #fff;
		background-image: url(hg-hell.jpg);
		background-repeat: no-repeat;
		background-position: center top;
		background-attachment: fixed;
		margin: 0;
		padding: 0;	
		font-color: #32461c;
}

html>body {
height: 90%;
}

@font-face {
    font-family: 'Manrope_bold';
       src:
         url('bold.woff2') format('woff2'),
         url('bold.woff') format('woff'),
         url('bold.ttf') format('truetype');
}

@font-face {
    font-family: 'Manrope_regular';
       src:
         url('regular.woff2') format('woff2'),
         url('regular.woff') format('woff'),
         url('regular.ttf') format('truetype');
}
		 
@font-face {
    font-family: 'Manrope_light';
       src:		 
		 url('light.woff2') format('woff2'),
         url('light.woff') format('woff'),
         url('light.ttf') format('truetype');
}

@font-face {
    font-family: 'Manrope_thin';
       src:		 
		 url('thin.woff2') format('woff2'),
         url('thin.woff') format('woff'),
         url('thin.ttf') format('truetype');
}

.clear {
	clear: both;
	margin: 0;
	padding: 0;
	height: auto;
	font-size: 0%;
	line-height: 0.0em;
}

h1, h2 {
font-family: 'Manrope_regular', Helvetica, Arial, sans-serif;
    color: #658c2a;
	font-size: 135%;
	margin: 0 0 0.5em 0;
	line-height: 1.4em;
	letter-spacing: 0.05em;
}


h2 {
	font-size: 105%;
	
}


p, a {
font-family: 'Manrope_regular', Helvetica, Arial, sans-serif;
    color: #203018;
	font-size: 100%;
	margin: 0 0 0.5em 0;
	letter-spacing: 0.02em;
}

a {
	text-decoration: underline;
}

a:hover {
	opacity: 0.6;
	text-decoration: none;
}

header #schrift a {
  text-decoration: none;
	color: #658c2a;
}

header #schrift a:hover {
 opacity: 1.0;
}

p.border { 
    width: 100%;
    border-bottom: 1px dotted #658c2a;
	clear: both;
	padding-top: 1em;
}
		

/* -----------formate responsive grundlagen ------*/
@media all and (max-width : 1280px){

h1 {
	font-size: 130%;
}


h2 {
	font-size: 100%;	
}


p {
	font-size: 90%;
}	
}


@media all and (max-width : 768px){

h1 {
	font-size: 110%;
}


h2 {
	font-size: 90%;	
}


p {
	font-size: 80%;
}	


	
}

/* -----------big boxes und header ------*/

#wrapper, footer, header {
	margin: 0 auto;
	padding: 0;
	max-width: 1600px;
	width: 100%;
	/*border: red 1px solid;*/
	position: relative;
		
}

body > #wrapper {
height: 75%;
}

header {
	padding: 1em 1em 0 1em;	
}
	



header #logo {
	float: left;
	/*border: solid 1px green;*/
	padding: 0;
	width: 10%;
	max-width: 10%;
	/*z-index: 101;*/
}

header #logo img {
	width: 100%;
	border: 0;
}

header #logo img a {
	border: 0;
	background-image: none;
	padding: 0;
}

header #schrift {
	float: right;
	width: 87%;
	max-width: 87%;
	padding: 0.5em 0 0 0;
	font-family: 'Manrope_regular', Helvetica, Arial, sans-serif;
    color: #658c2a;
	font-size: 150%;
	line-height: 1.2em;
	/*border: solid 1px blue;*/
}



header p.titelgross {
	font-family: 'Manrope_regular', Helvetica, Arial, sans-serif;
    color: #658c2a;
	font-size: 175%;
	line-height: 1.0em;
	margin: 0;
	padding: 0;	
	letter-spacing: 0.05em;
}

header p {
	margin: 0;
	padding: 0;
    color: #658c2a;
	letter-spacing: 0.05em;
}

header #menue {
	float: right;
	width: 87%;
	max-width: 87%;
	border-top: solid 2px #658c2a;
	padding: 0;	
	height: 2.5em;
	max-height: 3em;
}


	
	

#wrapper nav, #menue nav {
		
	margin: 0.5em 1em 0 auto;
	padding: 0 0 0 0;
    line-height: 1.3em;
    /*background: rgba(255,255,255,0.5);*/
	/*border: red 1px solid;*/	 
	display:inline-block;
	position: absolute;
	width: 100%;
	z-index: 200; 
	right: 0;
	}
	
	
	
/*Responsive Styles grosse boxen und header*/

@media all and (max-width : 1280px){
	
	#wrapper, footer, header {
	margin: 0 auto;
	padding: 0;
	max-width: 1200px;
	width: 100%;
	/*border: red 1px solid;*/
	position: relative;
		
}
	
	header {
	padding: 1.5em 1em 0 1em;
}

header #logo {
	float: left;
	/*border: solid 1px green;*/
	padding: 0;
	width: 9%;
	max-width: 9%;
	/*z-index: 101;*/
}	
	
header #schrift {	
	font-size: 125%;
	line-height: 1.2em;
	/*border: solid 1px blue;*/
}

header p.titelgross {	
	font-size: 160%;
	line-height: 1.1em;
}

header #menue {
	margin-top: 0.5em;
	border-top: solid 1px #658c2a;
	padding: 0;		
	height: 1.5em;
	max-height: 2em;
}	
	
#menue nav {		
	margin: 0.3em 1em 0 auto;
}
	
	
}	
	
@media all and (max-width : 1024px){
	
	#wrapper, footer, header {	
	max-width: 1024px;		
}
	
	header {
	padding: 1em 1em 1em 1em;
}

header #logo {	
	width: 11%;
	max-width: 11%;
	/*z-index: 101;*/
}	
	
header #schrift {	
	font-size: 115%;
	line-height: 1.2em;
	/*border: solid 1px blue;*/
}

header p.titelgross {	
	font-size: 140%;
	line-height: 1.1em;
}

header #menue {
	margin-top: 0.5em;
	border-top: solid 1px #658c2a;
	padding: 0;		
	height: 1.5em;
	max-height: 1.8em;	
}	
	
#menue nav {		
	margin: 0.3em 1em 0 auto;
}
	
	
}	

	
@media all and (max-width : 768px){
	
	#wrapper, footer, header {	
	max-width: 768px;		
}
	
	header {
	padding: 1em 1em 1.5em 1em;
}

header #logo {	
	width: 12%;
	max-width: 12%;
	/*z-index: 101;*/
}	

header #schrift {	
	font-size: 115%;
	width: 85%;
	max-width: 85%;
	line-height: 1.2em;
	/*border: solid 1px blue;*/
}

header p.titelgross {	
	font-size: 135%;
	line-height: 1.1em;
}

header #menue {
	margin-top: 0.5em;
	border-top: solid 1px #658c2a;
	padding: 0;	
}	
	
#menue nav {		
	margin: 0.3em 1em 0 1em;
}	
	
}	

@media all and (max-width : 533px){
	
#wrapper, footer, header {	
	max-width: 533px;		
}



	header {
	padding: 1em 1em 1.5em 1em;
}

header #logo {	
	display: none;
	/*	width: 20%;
	max-width: 20%;*/
}	
	

header #schrift {
float: none;
	width: 100%;
	max-width: 100%;	
	font-size: 110%;
	line-height: 1.2em;
	border-bottom: solid 1px #658c2a;
	/*border: solid 1px blue;*/
}

header p.titelgross {	
	font-size: 120%;
	line-height: 1.1em;
}

header #menue {
	margin-top: 0.5em;
	border: none;
	padding: 0;	
}	
	
#menue nav {		
	margin: 0.3em 1em 0 1em;
}	
}

/*--------------Menue basics ----------------------*/

/*Strip the ul of padding and list styling*/
#menue nav ul {
    list-style-type:none;
    font-family: "Manrope_regular", Helvetica, Arial, sans-serif;
    margin:0%;
    padding:0; 
    position: relative;
	float: right;	
	letter-spacing: 0.03em;
	/*border: red 1px solid;*/
}
/*Create a horizontal list with spacing*/
#menue nav li {
    display:inline-block;
    float: left;
	width: auto;
    /*margin-left: 0.5em;*/
}
/*Style for menu links*/
#menue nav li a {
    display:block;
	width: auto;
   /*min-width:180px;*/
    height: 3em;
    text-align: center;
    line-height: 3em;
	font-size: 105%;
    color: #658c2a;
    text-decoration: none;
	padding: 0 2em;
}
/*Hover state for top level links*/
#menue nav li:hover a {
    color: #828c72;	
    background-color: rgba(255,255,255,0.7);/**/
    display:block;
	width: auto;
    /*min-width:180px;
	padding: 0 2em;*/
}

/*Style for dropdown links*/

#menue nav li:hover ul {
display: block;
	width: 100%;
    /*min-width:180px;*/
	font-size: 90%;	
}

#menue nav li:hover ul li {
margin-left: 0em;
}

#menue nav li:hover ul a {
    background-color: rgba(255,255,255,1.0);
    color: #658c2a;
	display:block;
	 /*width: auto;
	width: 100%; */
     /*min-width:160px;*/
    text-align: center;
    height: 3em;
    line-height: 3em;
	padding: 0;
    margin-left: 0;
}
/*Hover state for dropdown links*/
#menue nav li:hover ul a:hover {
    background-color: rgba(50,70,28,0.9);
    color: #fff;
}
/*Hide dropdown links until they are needed*/
#menue nav li ul {
    display: none;
}
/*Make dropdown links vertical*/
#menue nav li ul li {
    display: block;
    float: none;
}
/*Prevent text wrapping*/
#menue nav li ul li a {
    /*width: auto;
    min-width: 160px;
    padding: 0 20px;
	text-align: left;*/
}
/*Display the dropdown on hover*/
#menue nav ul li a:hover + .hidden, .hidden:hover {
    display: block;
}
/*Style 'show menu' label button and hide it by default*/
#menue nav .show-menu {
    font-family: "Manrope_regular", Helvetica, Arial, sans-serif;
    text-decoration: none;
    color: #658c2a;
    background: #fff;
    text-align: center;
    padding: 10px 0;
    display: none;
}
/*Hide checkbox*/
input[type=checkbox]{
    display: none;
}
/*Show menu when invisible checkbox is checked*/
input[type=checkbox]:checked ~ #menu{
    display: block;
}



a.open {
	opacity: 0.4;
}

/*Responsive Styles only menue*/

@media all and (max-width : 1280px){


#menue nav li a {
    /*min-width:150px;*/
    height: 2em;
    line-height: 2em;
   	font-size: 95%;
	padding: 0 2em;
}
/*
#menue nav li:hover a {
   min-width: 150px;
	padding: 0 1em;*/


#menue nav li:hover ul {
}

#menue nav li ul li a {
    width: auto;
   font-size: 90%;	
	}
}	
	
@media all and (max-width : 1024px){


#menue nav li a {
    /*min-width:175px;*/
    height: 2em;
    line-height: 2em;
   	font-size: 95%;
	padding: 0 1.5em;
}

#menue nav li:hover a {
  /* min-width: 170px;
	padding: 0 1em;*/
}

#menue nav li:hover ul {
   font-size: 88%;	
}

#menue nav li ul li a {
    width: auto;
	}

}

@media all and (max-width : 768px){


#menue nav li a {
    /*min-width:175px;*/
    height: 2em;
    line-height: 2em;
   	font-size: 80%;
	padding: 0 1.5em;
}

#menue nav li:hover a {
  /* min-width: 170px;
	padding: 0 1em;*/
}

#menue nav li:hover ul {
  font-size: 90%;	/* */
}

#menue nav li ul li a {
    width: auto;
	}

}


@media all and (max-width : 760px){
    /*Make dropdown links appear inline*/
#menue nav {
	width: 55%;
	max-width: 55%;
	/*border: red 1px solid;*/
	background-color: rgba(255,255,255,0.5);
	float: left;
	margin-left: 0;
}

  #menue nav  ul {
        position: static;
        display: none;
        width: 100%;  
    }
    /*Create vertical spacing*/
  #menue nav  li {
        margin-bottom: 5px;
		background-color: rgba(255,255,255,1.0);
    }
	
	#menue nav li a {    
    line-height: 2em;
   	font-size: 100%;
	
}
	
	#menue nav li:hover a {
    background-color: rgba(255,255,255,1.0);
	}
	
    /*Make all menu links full width*/
   #menue nav ul li, #menue nav li a {
        width: 100%;		
    background-color: rgba(255,255,255,1.0);
        display:block;
    }
	
	/* Unterpunkte von Anfang an sichtbar */
	
	#menue nav li ul {
    display: block;	
	font-size: 90%;
}

#menue nav li ul a {
	 text-align: center;
    height: 3em;
    line-height: 3em;
	padding: 0;
    margin-left: 0;	
}


	
    /*Display 'show menu' link*/
  #menue nav  .show-menu {
	  float: right;
	  width: 100%;
	  max-width: 100%;
        display:block;       
		margin: 2% 0 3px 0;
		color: #fff;			
   	font-size: 100%;
	background-color: #b1b85f
	/*border: solid 1px #980606;*/	
    }
}

@media all and (max-width : 667px){
	
	#menue nav {
	width: 95%;
	max-width: 95%;
	/*border: red 1px solid;
	margin-left: 3%;*/
}

}

/*--------------footer innen ---------------------*/

footer {
	font-family: 'Manrope_light', Helvetica, Arial, sans-serif;
    color: #fff;
	font-size: 100%;		
	letter-spacing: 0.03em;
	line-height: 1.5em;
	clear: both;
}

footer .gross {
	font-size: 110%;/**/
}


#footermenue, #unten {
	position: relative;
	margin: 0 1em;
	padding: 0 1em;
	background: #b1b85f;
	border: none;
	width: auto;
}

 #unten {
	 clear: both;
	 float: right;
	 color: #658c2a;
	 font-size: 100%;
	 margin-top: 0.4em;
	padding-right: 1em;
	background: transparent;
}

#footermenue ul, #footermenue ul.right,   #unten ul.right {
list-style-type: none;
    margin:1em 0 1em 1em;
    padding:0; 
    position: relative;
	float: left;
	width: 13%;
	max-width: 14%;
	/*border: red 1px solid;*/	
}

  #unten ul.right {
	  width: 20%;
	max-width: 20%;
	padding-left: 40%;
	/*border: red 1px solid;*/	
}


#footermenue ul.right, #unten ul.right {
	float: right;
    margin:1em;
}

#unten ul.right {
	display: none;
}

#footermenue li, #footermenue ul.right li {
	width: 80%;
	min-width: 80%;
	max-width: 90%;
	/*border: red 1px solid;*/
    
}

#footermenue ul.right li, #unten ul.right li {
	float: right;
}

#footermenue  ul li a, #footermenue  ul.right li a, #unten ul.right li a {
	margin: 0;
	padding: 0;
	color: #fff;
	font-size: 90%;
	text-decoration: none;
	width: auto;
	min-width: auto;
	height: auto;
	min-width: 10px;
}
	
#footermenue  ul.right li a, #unten ul.right li a {
	align: right;
}


/*Responsive Styles only footer*/

@media all and (max-width : 1280px){

footer {
	font-size: 80%;
	line-height: 1.5em;
}
}

@media all and (max-width : 1024px){
	
footer {	
	font-size: 75%;
	line-height: 1.5em;}
}

@media all and (max-width : 768px){	
#footermenue {	
	display: none;}
	
	#unten {		
	color: #fff;
	background: #b1b85f;
	width: 100%;
	max-width: 100%;
	margin-top: 1em;
	}
	
	#unten p {	
	padding: 1em 1em 1em 8%;	
	color: #fff;
	}
	
	#unten ul.right {
	display: block;
}
}


/* ------------- inhalt start --------------*/

.box-breit, .box-breit2, .breadcrumb {
	width: 60%;
	max-width: 60%;
	float: left;
	clear: left;
	margin: 1em 3% 1em 1em;
	padding: 3em 0 5em 0;
	background: transparent;
	font-size: 120%;
	line-height: 1.8em;
	/*border: red 1px solid;*/
}

.box-breit p, .box-breit2 p, .box-breit a, .box-breit2 a {
	font-family: 'Manrope_light', Helvetica, Arial, sans-serif;
}

 .box-breit2, .breadcrumb {
	width: 80%;
	max-width: 80%;
	float: left;
	clear: left;
	margin: 1em 8% 0 8%;
	padding: 1em 0 1em 0;
	/*border: red 1px solid;*/
}

.breadcrumb {	
	font-size: 80%;
	padding: 0;
	
}

.breadcrumb p, .breadcrumb a {	
font-family: 'Manrope_light', Helvetica, Arial, sans-serif;
}

.breadcrumb a {	
	text-decoration: none;
	color: #658c2a;
}

.breadcrumb a:hover {	
	opacity: 0.5;
}

.infobox {
	width: 32%;
	max-width: 32%;
	float: right;
	margin: 1em 1em 1em 0;
	padding: 1em 0;
	background: #ebedd6;
	/*border: red 1px solid;*/
}

.infobox h2 {
	padding: 0.5em 0.5em 0 5%;
	line-height: 1.3em;
	margin: 0;	
	text-transform: uppercase;
}

.infobox p {
	padding: 0 0.5em 0.5em 5%;
	font-size: 90%;
	margin: 0;
	line-height: 1.8em;
	font-family: 'Manrope_light', Helvetica, Arial, sans-serif;
}



/* ----------- responsive inhaltsboxen start ------*/
@media all and (max-width : 1280px){
	
.box-breit, .box-breit2 {	
	font-size: 110%;
	line-height: 1.7em;
	
}


.infobox p {
	font-size: 80%;
}	
}

/*@media all and (max-width : 900px){	
.box-breit, .box-breit2, .breadcrumb {
	width: 95%;
	max-width: 95%;	
	padding: 1em 0 0 0;
	margin: 2% 2% 0 2%;
	font-size: 100%;
	line-height: 1.6em;
}



 .breadcrumb {

	font-size: 80%;	 
}


} */

@media all and (max-width : 768px){	

.box-breit {
	width: 60%;
	max-width: 60%;	
	padding: 1em 0 0 0;
	margin-right: 0;
	font-size: 100%;
}

.infobox {
	padding: 0;
}

.infobox p {
	font-size: 75%;
}

.infobox h2 {
	font-size: 85%;
}

}

@media all and (max-width : 680px){	

.box-breit, .infobox {
	width: 95%;
	max-width: 95%;
	padding: 0;
}

.box-breit h1,.box-breit h2,.box-breit p {
	padding-right: 10px;
}

.infobox p {
	font-size: 75%;
}

.infobox h2 {
	font-size: 85%;
}

}

/* ------------- inhalt folgeseiten --------------*/

#bild {
	position: relative;
	margin: 1em 1em 0 1em;
	background: none;
	border: none;
	width: auto;
	/*border: blue 1px solid;*/
}



#bild img {
	width: 100%;
	max-with: 100%
}

.bildbox, .textbox, .bildbox2 {
	float: left;
	width: 31%;
	max-width: 31%;
	margin: 0 2% 2% 0;
	padding: 0;
}


.bildbox2 {
	width: 55%;
	max-width: 55%;
}
	
.textbox-breit {
	float: left;
	width: 100%;
	max-width: 100%;
	margin: 2% 0 0 0;
	padding: 0;
}

.textbox-breit img {
	float: left;
	width: 100%;
	max-width: 100%;
	
}


.textbox-breit, .bildbox2 {
	margin-top: 0;
}



.bildbox img, .textbox img, .bildbox2 img {
	width: 100%;
	max-width: 100%;
}

.textbox h2, .bildbox h2  {
	font-size: 95%;
	padding-top: 0.3em;
}


.bildbox p  {
	font-size: 75%;
	padding-top: 0.3em;
}

.bildbox2 p  {
	font-size: 55%;
	padding-top: 0.3em;
}


p.klein {
	font-size: 90%;
}

	
	
.textbox a  {
text-decoration: underline;
}

.textbox a:hover  {
text-decoration: none;
}

.box {
	float: left;
	width: 43%;
	max-width: 43%;
}



@media all and (max-width : 900px){	

.bildbox, .textbox {
	width: 46%;
	max-width: 46%;
}

.bildbox2, .box {
	width: 100%;
	max-width: 100%;
	margin-bottom: 1em;
}

}


@media all and (max-width : 768px){	

#bild {	
	margin: 2% 2% 0 2%;
	
}

.textbox h2  {
	font-size: 85%;
}

}

@media all and (max-width : 533px){	

#bild {
	width: 95%;
	max-width: 95%;
}

.bildbox, .textbox, .bildbox2 {
	width: 100%;
	max-width: 100%;
	margin: 4% 0 0 0;
}

.bildbox a.einfach, .bildbox2 a.einfach {
	 pointer-events: none;
        cursor: default;
}
}

/* ------------- sonderfall impressum --------------*/

.impbox {
	float: left;
	width: 65%;
	max-width: 65%;
	margin: 0 5% 0 0;
}


.impbox2 {
	float: left;
	width: 25%;
	max-width: 25%;
	margin: 0;
	font-size: 85%;
	line-height: 1.7em;
}



@media all and (max-width : 900px){	

.impbox, .impbox2 {
	width: 100%;
	max-width: 100%;
	margin: 4% 0 0 0;
}
.impbox2 {
	font-size: 100%;
	line-height: 1.7em;
}

}