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

body, div,
h1, h2, h3, h4, h5, h6,
p, blockquote, pre, dl, dt, dd, ol, ul, li, hr,
fieldset, form, label, legend, th, td,
article, aside, figure, footer, header, hgroup, menu, nav, section,
summary, hgroup {
  margin: 0;
  padding: 0;
  border: 0;
}

a:active,
a:hover {
  outline: 0;
}

@-webkit-viewport { width: device-width; }
@-moz-viewport { width: device-width; }
@-ms-viewport { width: device-width; }
@-o-viewport { width: device-width; }
@viewport { width: device-width; }


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




html, body {
	font:50% Arial, Verdana, Helvetica, sans-serif;
	text-align:left;
	font-weight:300;
	font-style:normal;
	color:rgb(51,51,51);
}



body {
    overflow-y:scroll;
	font-size:1.9rem;
	line-height:2.85rem;
	background-color:rgb(255,255,255);
	
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	text-size-adjust: 100%;
}



::-moz-selection { 
   color:rgb(255,255,255);
   text-shadow:none;
   
   background-color:blue;
}

::selection  { 
   color:rgb(255,255,255); 
   text-shadow:none;
   
   background-color:rgb(232,176,1); 
}



a {
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

 
a:link, a:visited, a:focus, a:active {
	text-decoration:none;
	color:rgb(232,176,1);
}
	
a:hover {
	text-decoration:underline;
	color:rgb(232,176,1);
}

a.hellgrau {
	color:rgb(102,102,102);
}



p {
	font:1.9rem Arial, Verdana, Helvetica, sans-serif;
	line-height:2.85rem;
	font-weight:100;
	color:rgb(51,51,51);
	margin:0 0 2.85rem 0;
}

p.kleiner-abstand-dahinter {
	margin:1.425rem 0 1.425rem 0;
}

	
.bold {
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-weight:700;
}


.klein {
	font:1.6rem Arial, Verdana, Helvetica, sans-serif;
	line-height:2.4rem;
	font-weight:300;
}


.weiss {
	color:rgb(255,255,255);
}


.hellgrau {
	color:rgb(102,102,102);
}


.kursiv-normal {
	font:1.9rem Arial, Verdana, Helvetica, sans-serif;
	font-style:italic;
}


.hervorhebung {
	display:block;
	position:relative;
	width:100%;
	height:auto;
	padding:3.25%;
	font:2.3rem Arial, Verdana, Helvetica, sans-serif;
	line-height:3.45rem;
	font-weight:700;
	color:rgb(232,176,1);
	background-color:rgba(232,176,1,0.15);
	border-top:rgb(232,176,1) 10px solid;
}


ul.aufzaehlung {
	font:1.9rem Arial, Verdana, Helvetica, sans-serif;
	line-height:2.85rem;
	font-weight:300;
	margin:0 0 1.425rem 0;
}

ul.aufzaehlung li {
	color:rgb(51,51,51);
	margin:0 0 0 0;
	padding:0 0 0 17px;
    list-style-type:none;
    background-image:url(../icone/listenzeichen.svg);
    background-repeat:no-repeat;
    background-position:0px 10px;
}



ul.aufzaehlung.links {
	font:1.9rem Arial, Verdana, Helvetica, sans-serif;
	line-height:5.7rem;
	font-weight:300;
	margin:0 0 1.425rem 0;
}

ul.aufzaehlung.links li {
	margin:0 0 0 0;
	padding:0 0 0 34px;
    background-image:url(../icone/linkzeichen.svg);
    background-repeat:no-repeat;
    background-position:0px 15px;
	background-size:20px;
}



h1 {
	display:block;
	width:100%;
	height:auto;
	font:4rem Arial, Verdana, Helvetica, sans-serif;
	line-height:6rem;
	font-weight:700;
	color:rgb(232,176,1);
	text-align:left;
	text-transform:uppercase;
	margin:0 0 2.85rem 0;
	}



h2 {
	display:block;
	width:100%;
	height:auto;
	font:4rem Arial, Verdana, Helvetica, sans-serif;
	line-height:6rem;
	font-weight:500;
	color:rgb(232,176,1);
	text-align:center;
	text-transform:uppercase;
	margin:0 0 6rem 0;

}



h3 {
	font:2.6rem Arial, Verdana, Helvetica, sans-serif;
	line-height:2.85rem;
	font-weight:700;
	color:rbg(81,56,74);
	margin:0 0 1.425rem 0;
}


h4 {
	font:1.9rem Arial, Verdana, Helvetica, sans-serif;
	line-height:2.85rem;
	font-weight:700;
	color:rgb(51,51,51);
	margin:0 0 1.425rem 0;
}

h5 {
	font:1.9rem Arial, Verdana, Helvetica, sans-serif;
	line-height:2.85rem;
	font-weight:700;
	color:rgb(51,51,51);
	margin:0 0 0 0;
}



figure, figure img, img {
	display:block;
	width:100%;
	height:auto;
}


figcaption {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-style:italic;
	font-weight:300;
	color:rgb(51,51,51);
}



/* Clearfix */

.clearfix::after {
	content:".";
	display:block;
	clear:both;
	font-size:0; 
	height:0px;
	visibility:hidden;
}






/* ------------------------------------------
  FIXED HEADER
--------------------------------------------- */

header {
	
	position:fixed;
	display:block;
	z-index:3;
	width:100%;
	max-height:105px;
	left:0;
	top:0;
	padding:10px 3.125% /* 10 / 320 */ 10px 3.125%; /* 10 / 320 */
	z-index:1000;
	border-top:10px solid rgb(232,176,1);
  
	background:linear-gradient(to bottom, rgba(255,255,255,1) 80%,rgba(255,255,255,0.8) 100%); 
}


nav.nav-collapse, a.logotype {
	display:block;
}


.logotype img {
	display:block;
	position:relative;
	width:300px;
	height:auto;
	padding:0 0 0 0;
	float:left;
	margin:0 0 0 0;
}



/* ------------------------------------------
  NAV TOGGLE STYLES
--------------------------------------------- */

@font-face {
	font-family: "responsivenav";
	src:url("../icone/responsivenav.eot");
	src:url("../icone/responsivenav.eot?#iefix") format("embedded-opentype"),
    	url("../icone/responsivenav.ttf") format("truetype"),
   	 	url("../icone/responsivenav.woff") format("woff"),
   	 	url("../icone/responsivenav.svg#responsivenav") format("svg");
	font-weight: normal;
	font-style: normal;
}

.nav-toggle {
	display:block;
	position:relative;
	overflow:hidden;
	width:60px;
	height:55px;
	margin:0 0 0 0;
	top:-25px;
  
	background-color:rgb(232,176,1);
}

.nav-toggle:before {
	color:rgb(255,255,255); /* Edit this to change the icon color */
	font:normal 28px/55px "responsivenav"; /* Edit font-size (28px) to change the icon size */
	text-transform:none;
	text-align:center;
	position:absolute;
	content:"\2261"; /* Hamburger icon */
	text-indent:0;
	speak:none;
	width:100%;
	left:0;
	top:0;
}

.nav-toggle.active:before {
	font-size:24px;
	content:"\78"; /* Close icon */
}



/* ------------------------------------------
  RESPONSIVE NAV STYLES
--------------------------------------------- */

.nav-collapse ul {
	display:block;
	margin:0 0 0 0;
	padding:0;
	width:100%;
	list-style:none;
}

.nav-collapse li {
	display:block;
	width:100%;
}

.js .nav-collapse {
	clip:rect(0 0 0 0);
	max-height:0;
	position:absolute;
	display:block;
	overflow:hidden;
	zoom:1;
}

.nav-collapse.opened {
	max-height:9999px;
}

.disable-pointer-events {
	pointer-events:none !important;
}

.nav-toggle {
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	-o-user-select:none;
	user-select:none;
}



/* ------------------------------------------
  NAVIGATION STYLES
--------------------------------------------- */

.fixed {
	position:fixed;
	width:100%;
	left:0;
	top:0;
}



.nav-collapse,
.nav-collapse ul {
	width:100%;
	float:left;
	list-style:none;

}


.nav-collapse li {
	width:100%;
	float:left;

}

.nav-collapse a {
	width:100%;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	font:2rem Arial, Verdana, Helvetica, sans-serif;
	line-height:3.2rem;
	font-weight:700;
	text-decoration:none;
	padding:0.7em 1em 0.7em 1em;
  	color:rgb(255,255,255);
	border-top:3px solid rgb(255,255,255);
	float:left;
	
	background-color:rgb(232,176,1);

}

.nav-collapse a:hover,
.nav-collapse a:active,
.nav-collapse .active a {
	color:rgb(81,56,74);
}





/* ------------------------------------------
  MASK
--------------------------------------------- */

.mask {
  -webkit-transition: opacity 300ms;
  -moz-transition: opacity 300ms;
  transition: opacity 300ms;
  background: rgba(0,0,0,0.6);
  visibility: hidden;
  position: fixed;
  opacity: 0;
  z-index: 2;
  bottom: 0;
  right: 0;
  left: 0;
  top: 0;
}

.android .mask {
  -webkit-transition: none;
  transition: none;
}

.js-nav-active .mask {
  visibility: visible;
  opacity: 1;
}



/* ------------------------------------------
  Wrapper
--------------------------------------------- */
#wrapper {
	position:relative;
	top:93px;   /* = Header-Höhe */
}




/* ------------------------------------------
  SECTIONS
--------------------------------------------- */

section {
	position:relative;
	text-align:left;
	padding:3rem 3.125% /* 10 / 320 */ 6rem 3.125%; /* 10 / 320 */
	width:100%;
	min-height:calc(90vh - 12rem - 55px);   /* 100vh minus Header und Footer */
}



/* ------------------------------------------
  Content
--------------------------------------------- */


figure {
	margin:2.85rem auto;
}



/* ------------------------------------------
  Footer
--------------------------------------------- */
footer {
	position:relative;
	display:block;
	width:100%;
	min-height:20vh;
	padding:2.85rem 3.125% /* 10 / 320 */ 2.85rem 3.125%; /* 10 / 320 */

	background-color:rgb(232,176,1);
}


div.footer-nav a h3 {
	font:2.2rem Arial, Verdana, Helvetica, sans-serif;
	line-height:2.19rem;
}


div.footer-nav a,
div.footer-nav p.klein {
	margin:0 2rem 0 0;
}

div.footer-nav a,
div.footer-nav p.klein {
	color:rgb(255,255,255);
}


div.footer-nav a:hover {
	color:rgb(203,236,204);
}





/******************************************
@media screen and (min-width: 400px)
*******************************************/

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


/* ------------------------------------------
  FIXED HEADER
--------------------------------------------- */


.logotype img {
	margin:0 calc(100% - 360px) 0 0;     /* Abstand zum Toggle???? */	
}


	
/* ------------------------------------------
  NAV TOGGLE STYLES
--------------------------------------------- */
	
.nav-toggle {
	top:5px;	
	background-color:rgb(232,176,1);
}


	
}




/******************************************
@media screen and (min-width: 500px)
*******************************************/

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

/* ------------------------------------------
  RESPONSIVE NAV STYLES
--------------------------------------------- */

.nav-collapse ul {
	margin:0 0 0 10%;
	width:calc(100% - 20%);
}


}







/******************************************
@media screen and (min-width: 600px)
*******************************************/

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


/* ------------------------------------------
  Container
--------------------------------------------- */

section,
footer {
	padding:6rem 6.25% /* 20 / 320 */ 6rem 6.25%; /* 20 / 320 */
}



/* ------------------------------------------
  Footer
--------------------------------------------- */


div.footer-nav {
	display:flex;
	flex-flow:row nowrap;
	justify-content:space-between;
	align-items:baseline;
	margin:6rem 0 0 0;
}

div.footer-nav p.klein,
div.footer-nav a {
	display:block;
	position:relative;
	width:auto;
	height:auto;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

div.footer-nav p.klein {
	text-align:right;
}

  
  
  
}





/******************************************
@media screen and (min-width: 768)
*******************************************/

@media screen and (min-width: 768px) {
	
	
html, body {
	font:62.5% Arial, Verdana, Helvetica, sans-serif;
}



/* ------------------------------------------
  FIXED HEADER
--------------------------------------------- */

header.cbp-af-header {
	display:flex;
	flex-flow:column-reverse wrap;
	position:fixed;
	z-index:3;
	width:100%;
	max-height:470px;
	left:0;
	top:0;
	padding:0 40px 0 40px;
	margin:0 0 0 0;
	z-index:1000;
	border-top:20px solid rgb(232,176,1);
	
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;	
}

header.cbp-af-header.cbp-af-header-shrink {
	display:flex;
	flex-flow:row nowrap;
	height:100px;
	padding:0 20px 0 20px;
	border-top:10px solid rgb(232,176,1);
}



header.cbp-af-header a.logotype img {
	margin:0 0 0 0;
}



.cbp-af-header-shrink a.logotype {
	padding:20px 20px 0 0;
}


nav.nav-collapse {
	width:100%;
	height:auto;
	padding:0 0 0 0;
	margin:0 auto 0 auto;
}


.cbp-af-header-shrink nav.nav-collapse {
	padding:0 0 0 0;
}

a.logotype {
	margin:0 0 0 0;
}


a.logotype img {
	width:300px;
	height:auto;
	margin:20px 0 0 0;
	
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

.cbp-af-header-shrink a.logotype img {
	width:230px;
	height:auto;
	margin:0 0 0 0;
}







/* ------------------------------------------
  RESPONSIVE NAV STYLES
--------------------------------------------- */

		
.js .nav-collapse {
    position: relative;
}

.js .nav-collapse.closed {
    max-height: none;
}

.nav-toggle {
    display: none;
}



/* ------------------------------------------
  MASK
--------------------------------------------- */


.mask {
	display: none !important;
	opacity: 0 !important;
}



/* ------------------------------------------
  NAVIGATION STYLES
--------------------------------------------- */

nav.nav-collapse ul {
	display:flex;
	flex-flow:row nowrap;
	justify-content:space-between;
	position:relative;
	width:100%;
	height:auto;
	padding:0 0 0 0;
	margin:0 auto;
}
 .nav-collapse ul li {
    width:auto;	
}
  
  
.nav-collapse ul li a {
    position:relative;
	display:block;
	width:100%;
	height:auto;
    padding:20px 10px 20px 0;
	margin:0 0 0 0;
	font:2.2rem Arial, Verdana, Helvetica, sans-serif;
    text-align:left;
	color:rgb(81,56,74);
	border-top:0;
    float:none;
	background:none;
}

.cbp-af-header-shrink .nav-collapse ul li a {
	font:1.7rem Arial, Verdana, Helvetica, sans-serif;
	padding:44px 10px 0 0;
	background:none;
}

.nav-collapse ul li a:hover {
	color:rgb(232,176,1);
	background:none;
}

.cbp-af-header-shrink .nav-collapse ul li a:hover {
	background:none;
}

.nav-collapse ul li.active a {
    color:rgb(232,176,1);
	background:none;
}

.cbp-af-header-shrink .nav-collapse ul li.active a {
	background:none;
	color:rgb(232,176,1)
}


.nav-collapse ul ul a {
    display: none;
}




/* ------------------------------------------
  Wrapper
--------------------------------------------- */
#wrapper {
	position:relative;
}




/* ------------------------------------------
  Container
--------------------------------------------- */

section {
	padding:0 20px 9rem 20px;
}

footer {
	padding:1.5rem 20px 9rem 20px;
}


h1, h2 {
	max-width:644px;
	margin:9rem auto 0 auto;
}

h3 {
	max-width:644px;
	margin:3rem auto 0 auto;
}

h4 {
	max-width:644px;
	margin:0 auto 1rem auto;
}

h5 {
	max-width:644px;
	margin:3rem auto -3rem auto;
}

p {
	max-width:644px;
	margin:4rem auto 3rem auto;
}

p.kleiner-abstand-dahinter {
	max-width:644px;
	margin:1rem auto 0 auto;
}

p.kleiner-abstand-davor {
	max-width:644px;
	margin:1rem auto 3rem auto;
}

ul.aufzaehlung, ul.aufzaehlung.links {
	max-width:644px;
	margin:1rem auto 3rem auto;
}





/* ------------------------------------------
  Content
--------------------------------------------- */


ul.aufzaehlung li {
	background-position:0 13px;
}

ul.aufzaehlung.links li {
	background-position:0 20px;
}


figure {
	margin:9rem auto;
}



/* ------------------------------------------
  Footer
--------------------------------------------- */


div.footer-nav {
	max-width:644px;
	margin:6rem auto 0 auto;
}




}



/******************************************
@media screen and (min-width: 8000)
*******************************************/

@media screen and (min-width: 800px) {
	
	
/* ------------------------------------------
  FIXED HEADER
--------------------------------------------- */


a.logotype {
	margin:0 2.6041666666666668% /* 20 / 768 */ 0 0;
}


}




/******************************************
@media screen and (min-width: 1150)
*******************************************/

@media screen and (min-width: 1150px) {
	
	
/* ------------------------------------------
  FIXED HEADER
--------------------------------------------- */

header.cbp-af-header {
	display:flex;
	flex-flow:row nowrap;
	justify-content:space-between;
	height:200px;
	padding:40px 40px 0 40px;
}


header.cbp-af-header.cbp-af-header-shrink {
	display:flex;
	flex-flow:row nowrap;
	height:100px;
	padding:0 40px 0 40px;
	border-top:10px solid rgb(232,176,1);
}


a.logotype {
	margin:0 5.217391304347826% /* 60 / 1150 */ /* 40 / 1150 */ 0 0;
}
	
a.logotype img {
	margin:0 0 0 0;
}



/* ------------------------------------------
  NAVIGATION STYLES
--------------------------------------------- */

.nav-collapse ul li a {
    padding:28px 10px 20px 0;
	margin:0 0 0 0;
}


.cbp-af-header-shrink .nav-collapse ul li a {
	font:2.2rem Arial, Verdana, Helvetica, sans-serif;
	padding:36px 0 0 0;
}



/* ------------------------------------------
  Content
--------------------------------------------- */


figure {
	margin:11rem auto;
}





}





/******************************************
@media screen and (min-width: 1400)
*******************************************/

@media screen and (min-width: 1400px) {
	
	
	/* ------------------------------------------
  NAVIGATION STYLES
--------------------------------------------- */

nav.nav-collapse ul {
	max-width:955px;
	padding:0 0 0 0;
	margin:0 auto;
}
	
	
}