/* quicksand-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 300;
  src: url('quicksand-v37-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* quicksand-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 400;
  src: url('quicksand-v37-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* quicksand-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 500;
  src: url('quicksand-v37-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* quicksand-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 600;
  src: url('quicksand-v37-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* quicksand-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 700;
  src: url('quicksand-v37-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/* open-sans-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('open-sans-v43-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: url('open-sans-v43-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}




* {outline: none; font-family: "Open Sans", sans-serif; font-size: 16px; box-sizing: border-box;}
pre {
	all: inherit;
	line-height: 130%;
	max-width: 900px;
	margin: 0 auto;
}
pre strong {display: block; padding-top: 30px;}
html, body {padding: 0; margin:0; }
body {background-color: #ba3c22;}
body {overflow-y: scroll;  }
nav, header, body, footer {width: 100%; }
header { margin: 0 auto;}
header img {width: 100%;}

main {}

section {width: 100%; max-width: 1160px; padding: 0 0px;  margin: 0 auto; position: relative;}
 
div.white {background-color: #fff;}
div.wrap { max-width: 1200px; margin: 0 auto; padding-left: 20px; padding-right: 20px;}


#logo {width: 400px; margin: 30px;  margin-left: 0; box-sizing: border-box; }
#footerlogo {width: 100px; margin: 0 auto; margin-top: -82px;}
#logoarea { display: block; }
nav section { } 
.header-circle {width: 100%; z-index: 200; position: absolute; top: 0; left: 0; ;}
.header-img {width: 100%; z-index: 100; position: absolute; top: 0; left: 0; ;}


footer {display: block; width: 100%; position: relative;}
footer > div {display: table; width: 100%; max-width: 1100px; margin: 0 auto; padding: 0 10px; box-sizing: border-box;}
footer > div > div {display: table-cell; vertical-align: top;}

main p{ margin-top: 15px; margin-bottom: 15px;

font-size: 16px;
line-height: 27px;
color: #000000;



 }




nav {padding-top: 0px; padding-bottom: 0px; background-color: #fff;}
@media screen and (max-width: 1000px) {
	nav { padding-top: 5px; padding-bottom: 15px; } 

	#logo {width: 200px; padding-top: 27px;  margin-left: 25px; margin-right: 25px; margin-bottom: 15px;}
	#logoarea {left: 25px;}
}

header { position: relative; }/* */

.btn {padding:  8px 20px; background: #ba3c22; color: #fff; border-radius: 5px; cursor: pointer; display: inline-block;}
.btn:hover { background: #0f8d31; color: #fff;}
article {width 100%;}

#searchbtn {
	position: absolute;
	top: 13px; right: 20px;	
}
#navbtn {
	display: none;
}
@media screen and (max-width: 1000px) {
	#navbtn {
		position: absolute;
		top: -67px; right: 0;	
		display: initial;
		z-index: 3000;
	}
	#searchbtn {
		position: absolute;
		top: 13px; right: 80px;	
	}	
}


header p {margin: 0; padding: 20px 0; color: #fff; font-size: 14px; text-align: center;}


@media screen and (max-width: 1000px) {
	#mainnav {display: none; z-index: 2000; background-color: #fff; position: Relative; padding: 30px; margin-top: 0; padding-top: 50px;}
	#mainnav.shown {display: block;}
	nav ul, nav li {
		list-style: none;
	}
	#mainnav {padding-left: 0;}
	#mainnav a {text-decoration: none; font-weight: normal; color: #515054; display: block; padding: 20px 10px; width: 100%; border-bottom: 1px solid #eee; font-size: 21pt; }
	#mainnav a:hover { background-color: #ba3c22; color: #fff; }
}

@media screen and (min-width: 1000px) {

	 nav > section > ul {
		display: table;
		z-index: 1000;
		width: 100%;
	}
	 nav > section >  ul > li {
		display: table-cell;
		vertical-align: top;
		padding-right: 30px;
		



		text-decoration: none;
		
		
		}
	
		
	#mainnav {margin-top: 20px; margin-bottom: 20px; padding-left: 0;}		
	 nav > section >  ul > li  ul{ display: none; }
	 nav > section >  ul > li > a { color: #1a1a1a; text-decoration: none; 	font-size: 16px; padding-bottom: 20px; transition: color 200ms; 	font-family: "Quicksand", sans-serif; font-weight: 400; padding-top: 15px; border-top: 4px solid #fff; line-height: 160%;}
	 nav > section >  ul > li:last-of-type  { padding-right: 0px;}
	 nav > section >  ul > li > a:hover { color: #ba3c22; transition: color 200ms;  }
	 nav > section >  ul > li.current > a { color: #0f8d31; }
	 nav > section >  ul > li  ul > li a { line-height: 160%; border-top: 0px solid #fff; color: #000; font-size: 16px;}
	 nav > section >  ul > li  ul > li a:hover {color: #cb181b; }
	 .activenav a {color: #333; text-decoration: none; padding-bottom: 5px; border-bottom: 2px solid #005aa1;}


	 nav > section > ul > li:hover > ul.main_subnav {
		list-style: none;
		display: block;
		position: absolute;
		margin-top: 10px;
		padding-top: 0px;
		padding-left: 0;
		margin-left: -20px;
		z-index: 500;
		border-top: 4px solid #ba3c22;
			background-color: #fff;

	}
	 nav > section > ul > li:hover > ul.main_subnav li {
		text-align: left;
		/*background-color: #e5e5e5; */
		
		border-bottom: 1px solid #ccc;
		
	}
	 nav > section > ul > li:hover > ul.main_subnav li a {
		border-bottom: 0;
		padding-left: 20px;
		padding-right: 20px;
		padding-top: 10px;
		padding-bottom: 10px;
		display: block;
		color: #000; text-decoration: none; 	font-size: 22px;
			text-transform: initial;
			font-size: 16px;
			min-width: 120px;
			z-index: 100;
			white-space: nowrap;
			font-family: "Quicksand"; 
			
	}
	 nav > section > ul > li:hover > ul.main_subnav li:hover {
		background-color: #f2f2f2;
	}
 nav > section > ul > li:hover > ul.main_subnav li:hover  a{
		color: #000;
	}	
}

footer {padding-top: 50px; padding-bottom: 100px;}
footer section > ul {
	list-style: none;
	display: table;
	padding-left: 0;
	float: left;
	margin-top: 0;
	width: 100%;
}
footer section {padding-top: 30px;}
footer section > ul > li {
	display: table-cell;
	padding-right: 20px;
}
li.fnav { padding-right:20px;}
footer section > ul > li > a {
		color:#1a1a1a;
		transition: color 200ms;
	text-transform: initial;
	font-weight: 500;
	text-decoration: none;
	padding-bottom: 20px;
	display: block;
	color: #fff;
	font-family: "Open Sans", sans-serif;
	white-space: nowrap; 
}
footer section > ul ul {
	display: block;
	list-style: none;
	padding-left: 0;
	margin-left: 0;
}
footer section > ul ul li {
	display: block;
	list-style: none;
padding-left: 0;
	margin-left: 0;	
}
footer section > ul ul li:last-of-type {
		padding-right: 0;
}
footer section > ul ul li a{
	color: #fff;
	transition: color 200ms;
	text-transform: initial;
	line-height: 35px;
	text-decoration: none;
	white-space: nowrap; 
}
footer section > ul ul li a:hover{
	color: #0f8d31;
	transition: color 200ms;
}
footer section > ul > li > a:hover{
	color: #fff;
	transition: color 200ms;
}
#copy {
	float: left;
	line-height: 28px;
}
#copy, #copy * {
	font-size: 16px;
	color: rgba(255,255,255,0.8);
	transition: color 200ms;
	text-decoration: none;
}
#copy a:hover {
	color: rgba(255,255,255,1);
	transition: color 200ms;
}
#copy u {font-size: 28px; color: rgba(255,255,255,1);  font-family: "Open Sans", sans-serif; }

#social {display: table-cell; vertical-align: top;}
#social a {color: #000; font-size: 14px;}
#social a:hover {	color: #0f8d31; font-size: 14px;}
#dhv {display: table-cell;  vertical-align: top; text-align: right;}
#lastrow {text-align: center; color: #fff; font-size: 11pt; padding-top: 40px; width: 100%; }
#lastrow img {display: inline-block; height: 25px;}
aside {background-color: #0f8d31; padding-top: 50px; padding-bottom: 80px;}
aside h2 {color: #fff;}

.instalink {position: absolute; top: 20px; right: 0;}

@media screen and (max-width: 1000px) { 
	/* footer section > ul { display: none; } */
	#lastrow {padding-top: 0;}
	footer section {padding-top: 0;}

	li.fnav { width: 100%; display: block; padding-bottom: 50px; text-align: center; padding-right: 0; }
	
}
@media screen and (max-width: 600px) { 
	footer div { display: block ! important; text-align: center ! important; }
	#dhv {padding-left: 0;}
	footer section {padding: 20px 0;}
	#social {padding: 40px; padding-bottom: 80px;}
	
}
@media screen and (max-width: 1130px) { 
	#copy { 
		float: right;
		display: block;
		width: 100%;
		line-height: 150%;
		text-align: center;
	}
}


main > section {padding-top: 25px; padding-bottom: 25px;}
main {line-height: 29px;  padding-bottom: 50px;}
main p, main li {font-weight: 300; color: rgba(84,84,84);}







div.icons { text-align: center; }
div.icons > div {background-color: #ba3c22; border-radius: 50%; text-align: center; padding: 20px; display: inline-block; width: 100px; height: 100px;}
div.icons > div img { width: 100%; }


h1 { font-family: "Quicksand", sans-serif; font-weight: normal;  font-size: 35px; color: #000; font-weight: 300;   line-height: 120%; margin-top: 30px; margin-bottom: 30px; text-align: left; background-color: #fff;

	z-index: 100;
	position: relative;


  hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  word-break: break-word;


}
h2 { font-family: "Open Sans", sans-serif;  font-size: 22px; color: #000; font-weight: 500;  line-height: 100%; margin-top: 0px; margin-bottom: 0; 
margin: 0 auto;  padding-top: 30px; padding-bottom: 15px; color: #333;
line-height: 140%;
}
 

main > section {display: table; width: 100%; margin-top: 0; margin-bottom: 0;}
main > section > article {display: table-cell; vertical-align: top; padding-right: 60px;}
main > section > aside {display: table-cell; vertical-align: top; width: 400px;  background-color: #eee; padding: 20px;}





@media screen and (max-width: 1180px) { 
	header section {padding: 0;}
	main img { max-width: 100%; }
	
}

hr {border: none; color: #0f8d31; background-color: #0f8d31; height: 1px; width: 100%; box-sizing: content-box; margin: 55px auto; max-width: 1020px;  }
@media screen and (max-width: 900px) {
	hr { margin: 0 auto;  }
}
main > section img {max-width: 100%;}


@media screen and (max-width: 600px) { 
	header h1 {font-size: 36px; padding-left: 40px;  padding-right: 40px;}
/*	section {padding-left: 20px; padding-right: 20px;} */
	section {padding: 0}
}



@media screen and (max-width: 1000px) { 

	main > section {padding-top: 50px; padding-bottom: 50px;}
}




main h3 {font-size: 24px; color: #0f8d31; font-weight: 300; line-height: 120%;  }
main a { color: #0f8d31; font-weight: 500; text-decoration: none; }
main a:hover { color: #ba3c22;   }
a.arrow { padding-top: 20px; display:inline-block;}
a.arrow::before {
    content: '\1433';
    padding-right: 0.5em;
	transition: padding 200ms;
}
a.arrow:hover::before {
	padding-right: 1em;
	transition: padding 200ms;
}

a img {

	transition: opacity 200ms;
}
a:hover img {
	opacity: 0.8;
	transition: opacity 200ms;
}

.copyright {font-size: 12px; color: rgba(0,0,0,0.3); display: block;}

@media screen and (min-width: 900px) { 
	.bild-text h2 {margin-top: 0px; }
	.bild-text div { display: table-cell; width: 50%; vertical-align: top; }
	.bild-text .bild img { max-width: 100%;   }
	.bild-text .bild  {  padding-right: 10px; }
	.bild-text .text  { padding-left: 10px; }
}


.text-kasten  img {width: 100%;}
.text-kasten  a {display: inline-block; }
.text-kasten .kasten a:hover {color: #fff; }
.text-kasten .kasten  { background-color: #0f8d31; padding: 10px; color: #fff; margin-top: 20px;}
.text-kasten .kasten p  { padding: 10px; color: #fff; padding-top: 0; padding-bottom: 0;}
.text-kasten .kasten li  {   color: #fff;}
.text-kasten h3 {font-size: 24px; color: #fff; font-weight: 400; padding: 10px; margin: 0; margin-top: 10px; }
.text-kasten img {padding-top: 50px;}
@media screen and (min-width: 900px) { 
	.text-kasten {display: block;}
	.text-kasten > div {display: table;}
	.text-kasten h2 {margin-top: 10px; text-align: center; }
	.text-kasten > div > div { display: table-cell; width: 50%; vertical-align: top; }
	.text-kasten .text  { padding-right: 20px;}
}



.kasten-text img {padding-top: 50px; width: 100%;}
.kasten-text a {display: block; width: 100%;}
.kasten-text .kasten  { background-color: #0f8d31; padding: 10px; color: #fff; margin-top: 20px;}
.kasten-text .kasten p  {  padding: 10px; color: #fff; padding-top: 0; padding-bottom: 0;}
.kasten-text .kasten li  {  color: #fff;}
.kasten-text h3 {font-size: 24px; color: #fff; font-weight: 400; padding: 10px; margin: 0; margin-top: 10px; }
@media screen and (min-width: 900px) { 
	.kasten-text {display: block;}
	.kasten-text > div {display: table;}
	.kasten-text h2 {margin-top: 10px; text-align: center; }
	.kasten-text > div > div { display: table-cell; width: 50%; vertical-align: top; }
	.kasten-text .text  { padding-left: 20px;}
}




.zitat span {font-size: 30px; color: #0f8d31; font-weight: 300; line-height: 120%; display: block; margin: 0 auto; max-width: 800px; text-align: center;  }


main .button { background-color: #ba3c22; color: #fff; display: inline-block; padding: 5px 20px; transition: padding 200ms; border: 0; appearance: none; cursor: pointer; border-radius: 5px;}
main .button:hover { background-color: #ba3c22; padding: 5px 30px; transition: padding 200ms; color: #fff;}
main .button::before { content: ''; padding-right: 0;}


aside .button { background-color: #fff; color: #333; display: inline-block; padding: 5px 20px; transition: padding 200ms; border: 0; appearance: none; cursor: pointer; border-radius: 5px; text-decoration: none; }
aside .button:hover { background-color: #fff; padding: 5px 30px; transition: padding 200ms; color: #000;}
aside .button::before { content: ''; padding-right: 0;}



footer .button { background-color: #0f8d31; color: #ba3c22; display: inline-block; padding: 5px 20px; transition: padding 200ms; border: 0; appearance: none; cursor: pointer; border-radius: 5px;  text-decoration: none;}
footer .button:hover { background-color: #ba3c22; padding: 5px 30px; transition: padding 200ms; color: #fff;}
footer .button::before { content: ''; padding-right: 0;}


.zwei-themen { max-width: 100%; padding: 0;   padding-bottom: 30px; }
.zwei-themen > div { width: 100%;  margin: 0 auto; }
.zwei-themen h2 {text-align: center; margin-top: 40px; min-height: 100px;}
.zwei-themen h3 {text-align: center;}
.zwei-themen p {text-align: center; padding-top: 0; padding-bottom: 20px;}
.zwei-themen a {display: inline-block; margin-top: 20px;}
.zwei-themen > div > div {text-align: center; padding-bottom: 60px;}

@media screen and (min-width: 900px) { 
	.zwei-themen > div {display: table; }
	.zwei-themen > div > div { display: table-cell; width: 50%; vertical-align: top; }
	.zwei-themen  div.thema { padding-left: 30px; padding-right: 30px; }
	.zwei-themen  div.thema:last-of-type { padding-right: 0; }
	.zwei-themen  div.thema:first-of-type { padding-left: 0; }
}

.text-text-bg {background-color: #ededed;padding-top: 50px; padding-bottom:50px;margin-top: 50px; margin-bottom: 50px;  }
.text-text {  display: block !important;  }
.text-text > div { column-count: 1; column-gap: 40px; }
.text-text > div > h2 { margin-top: 0;}
.text-text  p { break-inside: avoid; page-break-inside: avoid; }
@media screen and (min-width: 900px) { 
	.text-text > div {column-count: 2;}
	.text-text > h2 {text-align: center;}
}

header h1, header p {padding-left: 20px; padding-right: 20px;}

@media screen and (max-width: 600px) { 
	header h1 {padding-top: 65%;}
	.headerimg {
		margin-left: -100px;
		margin-right: -100px;
		
	}
}

@media screen and (min-width: 900px) { 
	section p:last-of-type {padding-bottom:0;}
}


main > h2 {}
form input {padding: 8px 16px;}
form button {padding: 8px 16px; background-color: #0f8d31; color: #fff; border: 2px solid #0f8d31; cursor: pointer;}
form button:hover { background-color: #ba3c22; transition: 200ms; border-color: #ba3c22;}
header {overflow: hidden;}
.headerimg {overflow: hidden;  position: relative;}
.headerimg img:first-of-type {position: relative; }
header h1 { padding-top: 0; }
@media screen and (min-width: 1200px) { 
	.headerimg { max-height: 500px;}
}
.noclick {cursor: default;}
.noclick:hover {color: inherit; cursor: default;}

@media screen and (max-width: 600px) {
	h1 {font-size: 42px;  }
	
	#logo {width: 200px; padding-top: 27px;  margin-left: 0px; margin-right: 25px; margin-bottom: 15px;}
	#logoarea {left: 0;}	
}



.thema h2 {margin-top: 0;}

strong {font-weight: 600; color: rgb(84,84,84);}


@media screen and (max-width: 1000px) {
	#mainnav {display: none; z-index: 2000; background-color: #fff; position: Relative; padding: 30px; margin-top: 0; padding-top: 50px;}
	#mainnav.shown {display: block;}
	nav ul, nav li {
		list-style: none;
	}
	#mainnav {padding-left: 0;}
	#mainnav a {text-decoration: none; font-weight: normal; color: #515054; display: block; padding: 20px 10px; width: 100%; border-bottom: 1px solid #eee; font-size: 21pt; }
	#mainnav a:hover { background-color: #ba3c22; color: #fff; }
	
	h1 {font-size: 36px; line-height: 120%;}
	h1 * {font-size: inherit; line-heigt: inherit;}
	
	aside section, footer section {padding-left: 40px; padding-right: 40px;}
}


h1 > * {font-size: inherit; line-height: inherit;}



.grau {background-color: #395f7f; padding-top: 20px; padding-left: 40px; padding-right: 40px; padding-bottom: 40px; margin-top: 30px;}
.grau h2 {color: #08c797; font-family: "Quicksand"; font-size: 40px;}
.grau p {color: #fff; }

.grau h2:nth-of-type(odd) {padding-left: 200px;} 
.grau p:nth-of-type(odd) {padding-left: 200px;} 

.grau h2:nth-of-type(even) {padding-right: 200px;} 
.grau p:nth-of-type(even) {padding-right: 200px;} 


#backtotop {
	background-color: rgb(15, 141, 49);
	position: fixed;
	border-radius: 100%;
	padding: 9px 16px;
	
	bottom: 20px;
	right: 20px;
	z-index: 400;
	color: #fff;
	transition: opacity 500ms;
}

.backtotophidden { opacity: 0; transition: 500ms }

@media screen and (min-width: 900px) { 
	.haupt {display: inline-block; vertical-align: top; width: calc(100% - 300px); padding-right: 30px;}
	.seitenleiste {display: inline-block; vertical-align: top; width: 300px; padding: 30px; background-color: #f9f9f9;}
}

pre {
	
  all: inherit;
  padding:0;
  display: inline; 
  
  background: red;
  color: #fff;
  font-weight: bold;
}
pre a {
	cursor: pointer;
  all: inherit;
  padding:0;
  display: inline; 
  
  background: red;
  color: #fff;
  font-weight: bold;
}
pre a:hover {
	cursor: pointer;
  all: inherit;
  padding:0;
  display: inline; 
  
  background: red;
  color: #fff;
  font-weight: bold;
}


.bildmodus1, .bildmodus1 img {width: 100%;}

.bildmodus2 {width: 250px; display: inline-block; vertical-align: top; margin-right: 10px; margin-bottom: 20px; line-height: 120%; font-family: "Open Sans", sans-serif; font-weight: 300;
  color: rgba(84,84,84);}
.bildmodus2 img {width: 100%; vertical-align: top; margin-bottom: 10px; }

aside p, aside a, aside h2, aside h3, aside h1, aside strong, aside b {
	color: #fff;
	
}
@media screen and (min-width: 1000px) {
		aside div {display: inline-block; vertical-align: top; padding-right: 80px;}
}

@media screen and (max-width: 1000px) {
		footer > section > ul {display: none;}
}