html, body {
  height: 100%
}



body {
  padding: 0px;
  margin: 0px;
  font-family: "Open Sans", sans-serif; }

h1, h2, h4, nav li a {
  font-family: "Open Sans", sans-serif; }

h1 {
  font-size: 48px;
  margin-top: 30px;
  margin-bottom: 10px;
  color: #002e40; }

h2 {
  margin-top: 30px;
  font-size: 28px; }


h2.formular_fehler {
	color: red !important;
}


h4 {
  font-size: 20px;
  margin-bottom: 10px; }

.why-list {
  margin-top: 0px; }
  .why-list li {
    line-height: 28px; }

a {
  cursor: pointer; }



.mainMenu ul, .mainFooter ul {
  display: inline-block;
  list-style: none;
  padding-left: 10px; }


ul {}

.nav-container {
  background-color:#285a9c;
  width: 100%;
  position: fixed;
  left: 0px;
  border-bottom:thin white solid;
  z-index:100;}
  
  .fuss-container {
background-color:#285a9c;
  width: 100%;
  position: fixed;
  left: 0px;
  bottom:0px;
  border-top:thin white solid;
  z-index:100;}

nav {
  text-align: center;
  width: 840px;
  margin: 0px auto;
 }
  nav ul {
    padding: 0px;
	margin: 10px 0px 10px 0px;}
  nav li {
    display: inline-block;
	padding: 0px 20px 0px 20px;}
	
  nav li.mobilMenu {
    display:none;}
    nav li a {
		text-decoration:none;
      font-size: 12pt;
	  padding:0px;
	  margin:0px;
      color: white; }
    nav li a.active {
      color: #c6e1fc; }

section {
  padding: 35px 0px 65px 0px;
  min-height: 110%;
  width: 100%;
  text-align:right;
	background-color: #F9F8F2;}
  
  section:nth-child(odd) {
  background-color: white; }
  
  @media screen and (max-width: 640px) {
    nav {
      width: 90%;}
      nav li {
	padding: 0px 10px 0px 10px;
      }
      nav li a {
        font-size: 13px; } 
	section {
		text-align:center;}
	
  } 
  section .content, section .startseite{
	text-align:left;
  	z-index:50;
    margin: 50px 50px 0px 50px;
	width:auto;
	padding:30px 100px 30px 100px;}
	
	 section .content a, section .startseite a {
    
  text-decoration: none;
  color: #285a9c;}

section .content a:hover, section .startseite a:hover {
  text-decoration:underline; 
  color: #000;}
	
  	section  iframe.karte{
		width:100%;
		height:350px; }
		
  		
	  
	section .startseite{
    position: relative;
	}
	
	.swiper-slide
	{
		text-align:center;
	}
	

	
    @media screen and (max-width: 640px) {
      section .content, section .startseite {
	  	padding-left:5px;
        max-width: 90%; } 
		
		section .startseite span.bild_startseite{
		z-index:60;
		position:relative;
		top:0px;
		right: 0px;
		margin: 0px;
		min-height: 100%;
		width:100%;
	}
		.bild_startseite{		
		background: #FFFFFF;
	}
		
		
		.start {
		position:relative;
		top:0px;
		right: 0px;
		margin: 0px;
		width: 100%;
		min-height: 100%;
		background-color: #FFFFFF;
					background-image:url(pix/bg_pellets.jpg);
		background-repeat: repeat-x;
		background-position: 0px 500px;
	}
		
		section.start{
	 		min-height: 100%;
		}
		
		
		section .startseite h1 {
			text-align: center;
			font-size: 18pt !important;
			color: #285a9c;
		}
		
		section .startseite p.wert {
			text-align: center;
			font-size: 24pt;
			font-weight: bold;	
		}

	
  
		}


@media screen and (min-width: 640px) {
   		
		section .startseite span.bild_startseite{
		z-index:60;
		position:relative;
		top:0px;
		right: 0px;
		margin: 0px;
		min-height: 100%;
		width:100%;
	}
		.bild_startseite{		
		background: #FFFFFF;
	}
		
		
		.start {
		position:relative;
		top:0px;
		right: 0px;
		margin: 0px;
		width: 100%;
		min-height: 100%;
		background-color: #FFFFFF;
		background-image:url(pix/bg_pellets.jpg);
		background-repeat: repeat-x;
		background-position: 0px 750px;
	}
		
		section.start{
			min-height: 100%;
		}
	
		section .startseite h1 {
		text-align: center;
		max-width: 100%;
		color: #285a9c;
		}

		section .startseite p {
			text-align: center;
			max-width: 100%;
		}
	
	
		section .startseite p.wert {
			text-align: center;
			font-size: 36pt;
			font-weight: bold;
		}

		
	}

	
	@media screen and (max-width: 900px) {
      section .content, section .startseite{
		margin: 20px 20px 0px 20px;
		width:auto;
		padding:20px 20px 20px 20px;
		}
		
		#button{
		display:none;
	}
    section .content h1, section .startseite h1 {
		font-size:20pt;}
	  
    section .content p, section .startseite p {
		font-size:12pt;
		max-width:800px;}
		
		img.logo {
			margin: 0px;
			margin-top: -60px;
			max-height: 30px;
			width: auto;
		}
		}
   
    @media screen and (min-width: 900px) {

	
   		section .content h1, section .startseite h1 {
		font-size:30pt;}
	  
    	section .content p, section .startseite p {
		font-size:16pt;
		max-width:900px;}
		
		img.logo {
			margin: 0px;
			margin-bottom: -10px;
			max-height: 30px;
			width: auto;
		}
	
	}
	
section .startseite {
	background-color: rgb(255,255,255,0.8);
	margin-bottom: 50px;
}

section .startseite h1 {
	text-align: center;
	max-width: 100%;
}

section .startseite p {
	text-align: center;
	max-width: 100%;
}

section .content form, section .startseite form {
	
	max-width:100%;
	font-size: 24pt;
	
}

section .startseite form {
	
	text-align: center;
	
}

section .content input, section .startseite input {
}

section .content input, section .content select{
	width: 250px;
	font-size: 16pt;
}

section .content select.kurz{
	width: 80px;
	font-size: 16pt;
}

section .content input.checkbox{
	width:20px;
	font-size: 16pt;
}

section .startseite input {
	
	width: 200px;
	text-align: center;
	font-size: 24pt;

}

section .content input:focus, section .startseite input:focus, section .content select:focus{
	box-shadow: 0 0 5px 5px #285a9c; 

}

section .content input.button, section .startseite input.button {
	width: 250px;
	margin-top: 20px;
	text-decoration: none;
	background-color: #285a9c;
	border: medium #FFF;
	color: #fff;
	font-size: 16pt;
	padding: 5px;

}


span.formular_pflicht {
	font-weight: bold;
}

span.formular_pflicht_fehler {
	color: red;
}


.bottom-link {
  margin-top: 80px;
  font-style: italic; }

.gist-meta {
  display: none; }

.file-data {
  font-size: 14px; }
  
  
  /*Menu mobile first CSS*/
body{ -webkit-animation: bugfix infinite 1s; }

/*This fixes a chrome/webkit bug for older Android Browsers */
@-webkit-keyframes bugfix { from {padding:0;} to {padding:0;} } 

/*Required functional CSS don't change this bit
CSS styles are at the end! */

	
	@media screen and (min-width: 640px) {
	
	.menuTitle {
	display:none;
	}
	#toggleMenu { 
	display: none;
	}
	}
	
	@media screen and (max-width: 640px) {
.mainMenu {
	display:block;
	position:relative;
	width:100%;
	margin:0;
	padding:0;
	margin-top:10px;
	float:left;
	}
	
	.mainFooter{
	display:none;
	}
	
    #toggleMenu { 
	display: none;
	}

    #toggleMenu:checked ~ ul {  
	max-height:100%; /*Make page height*/ 
	opacity:1;
	}
	
.mainMenu > ul {
	width:100%;
	margin:0;
	padding:0;
	list-style:none;
	float:left;
    overflow-y: hidden;
	max-height:0;
	}

.mainMenu li {
	margin:0;
	padding:0;
	white-space:nowrap;
	display:block;
	width:100%;
	float:left;
	}
	
    label.menuTitle {
	font-family: "Open Sans", sans-serif; 
	font-size:12pt;
	padding-top:0px;
	padding-bottom:12px;
	margin:0;
	display:block;
	cursor:pointer;
	height:30px;
	background: url('/pix/menu.png');
    background-image: url('/pix/menu.svg'), none; 
	background-repeat: no-repeat;
	background-position: 97% 10px;
	background-size: 24px 19px; /*Make same size as your menu.png*/
	}
	
	
    nav li a {
	display:block;
	width:100%;
	font-size:16pt;
	padding-top:2px;
	padding-bottom:2px;
	border-top:thin #FFFFFF solid;
	}
	
	
  nav li.mobilMenu {
    display:block;}
		}

p.hinweis_bestellung {
	color: red;
}

/*Cookie-hinweis*/
.cc_container .cc_btn {
background-color: #e4e4e4 !important; /* Farbe des Buttons */
color: #000 !important; /* Textfarbe des Buttons */
}
.cc_container {
background: #1f6888 !important; /* Hintergrundfarbe des gesamten Bereichs */
color: #fdfdfd !important; /* Schriftfarbe des gesamten Bereichs */
}
 
.cc_container a {
color: #fff !important; /* Textlink-Farbe "Mehr Infos" */
}