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

html {
  box-sizing: border-box;
	scroll-behavior: smooth;
}

*, *:before, *:after {
  box-sizing: inherit;
}

body {
	background-color: rgba(126,165,12,1);
	font-size: 15px;
	/*	color: rgba(51,51,51,1);
*/	color: rgba(51,51,51,1);
	margin: 0;
	padding: 0;
	word-wrap: break-word !important;
	font-family: 'Open Sans', sans-serif;
	 -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
	}
p {
   -moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto; 
}
.waben{
	display: block; 
	margin-left: auto; 
	margin-right: auto;  
	text-align: center;
	
	}
.hinterlegt{
	background-color:rgba(255,204,51,0.5)
}

.text{
	list-style-type: circle;
}
/*.text ul{
	margin-left: -23px;
}*/
.fest{
	position:fixed;
	width:100%;}
.kopf{
	margin:0px auto;
	padding:0 15px 15px 0;
	background-color:rgba(255,255,255,1);
	float:none;
	}

.kopf a, .mittig a{
	text-decoration:none;
	color:rgba(51,51,51,1);}
.kopf a:hover, .mittig a:hover{
	color:rgba(246,195,3,1);
	}
.singen {
	margin: 0 15%;
	background-color: hsla(9,79%,58%,1.00);
  color: #FFFFFF;
  padding: 10% 5%;
  font-size: 14px;
  line-height: 18px;
	border-left: hsla(0,10%,96%,1.00) 50px solid;
		border-right: hsla(0,10%,96%,1.00) 50px solid

}
.eingerueckt {
  margin-left: 80px;
}
h1{
	color:rgba(133,126,53,1);
	font-size:110%;
	}
h2{
		font-size:100%;
		}
h4{
		font-size:17px;
	font-weight: bold;
		}
h5{
	font-size: 15px;
}

.adresse{
	margin-top:-15px;}

.oben{
	padding: 20px 0 0 20px;
	width:100%;
	float:none;
	height:90px;
	}
.welle{
	margin: 5px 0px 0 5px;
	float: left;
	}
.welle2{
	display:none;}

.anchor{
	 top:-320px;}
	 
	 .drei{
	margin: 0 0% 0 40%;
}

nav {
	margin: 0px 0 0 0;
	padding: 0 10% 0 10%;
	background-color: rgba(255,204,51,1);
	border-top: solid 1px  rgba(204,204,204,1);
	border-bottom: solid 1px  rgba(204,204,204,1);
	font-size: 15px;
	display: block;
}
nav:after {
	content:"";
	display:table;
	clear:both;
}

/* Removing padding, margin and "list-style" from the "ul",
 * and adding "position:reltive" */
nav ul {
	padding:0;
	margin:0;
	list-style: none;
	position: relative;
	}
	
/* Positioning the navigation items inline */
nav ul li {
	margin: 0px;
	display: inline-block;
	float: left;
	/* [disabled]background-color: rgba(255,255,255,1); */
	}

/* Styling the links */
nav a {
	display: block;
	padding: 15px 25px 14px 10px;
	color: #666;
	font-size: 15px;
	text-decoration: none;
	background-color: rgba(255,204,51,1);
}


nav ul li ul li:hover {
	/*background-color: rgba(153,153,153,0.9);*/
} 

/* Background color change on Hover */
nav a:hover {
	background-color: rgba(255,204,51,1);
	color: rgba(153,153,153,1);
}

/* Hide Dropdowns by Default
 * and giving it a position of absolute */
nav ul ul {
	display: none;
	position: absolute;
	/* has to be the same number as the "line-height" of "nav a" */
	/* [disabled]top: 52px; */
}
	
/* Display Dropdowns on Hover */
nav ul li:hover > ul {
	display:inherit;
}
	
/* Fisrt Tier Dropdown */
nav ul ul li {
	min-width:170px;
	float:none;
	display:list-item;
	position: relative;
}

/* Second, Third and more Tiers	
 * We move the 2nd and 3rd etc tier dropdowns to the left
 * by the amount of the width of the first tier.
*/
nav ul ul ul li {
	position: relative;
	top:-60px;
	/* has to be the same number as the "width" of "nav ul ul li" */ 
	left:170px; 
}

.toggle,
[id^=drop] {
	display: none;
}

.striche{
	width: 40px;
	margin-bottom: 5px;
	margin-left: auto;
	margin-right: auto;
	background-color:rgba(253,153,51,1);
	height: 5px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
.css-arrow-2{
	position: relative;
	padding: 0rem 2.1rem 0rem 0rem;
	display: inline-block;
}

.css-arrow-2:after{
	content: "";
	width: 0;
	height: 0;
	position: absolute;
	right: 1rem;
	/*top: 50%;*/
	margin-top: 0.8rem;
  border: .4rem solid transparent;
	border-bottom: 0;
	border-top-color: #666;
/*	-moz-transform: scale(0.9999);
*/}
.sprung {
    visibility: hidden;
    height: 0px !important;
    position: absolute;
    margin: -280px;
}
.mittig{
	margin: 0 auto;
/*	border-top:#CCCCCC solid 1px;
*/	background-color:#fff;
	max-width: 910px;
	width:100%;
	height:auto;
	padding:200px 10% 90px 10%;
	}
.bildimtext {
	
	text-align: center;
}
.fett{
	font-weight:bold;}
.gelb{
	list-style-image: url("../images/punkt-gelb.gif");
}

 hr{
	border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(255, 204, 0, 0.75), rgba(0, 0, 0, 0));
	margin:50px 0 50px 0;
}
.einzug{
	text-indent:25px;}

.bildchen img{
	float:left;
	padding:30px  15px 0 0}
/*.bildright{
	float:right;
	padding:0 0 15px 15px;
	}
.bildleft{
	float:left;
	padding:0 15px 15px 0}
.center{
	margin-left:35%;
	margin-right:0}
.right{
		float:right;
		padding-leftt:15px;
		}*/

.pfeil{
		text-decoration:none; 
	    padding: 0px 0px 100px 0px;
		display: block; 
		z-index:500}
ul{
		margin-left:0px;}
		
/*button.accordion {
    background-color: #eee;
    color: #444;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    transition: 0.4s;
}

button.accordion.active, button.accordion:hover {
    background-color: #ddd;
}

div.panel {
	font-size:12px;
    padding: 0 18px;
    background-color: white;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}
.a {
	background-color: rgba(255,204,0,0.5);
	width:30%;
	height:250;
	float:left;
	padding:2% 2% 5% 2%;
	margin-bottom:1%;
	}
	.b {
	background-color: rgba(126,165,12,0.5);
	float:left;
	width:70%;
	height:250px;
	padding:2% 2% 5% 2%;
		margin-bottom:1%;

	}
*/
.brich{
display:none;}

footer{
	width: 100%;
	background-color: rgba(255,204,51,1);
	position: fixed;
	bottom: 0;
	font-size: 90%;
	text-align: center;
	padding: 15px 5px 15px 5px;
	line-height: 16px;
	color: rgba(51,51,51,1);
	border-top: solid   rgba(255,255,255,1) 1px;
	-moz-hyphens: auto;
	-o-hyphens: auto;
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
}

footer a{
	word-break: keep-all;
	padding:0 10px 0 0;
	text-decoration:none;
	color:rgba(51,51,51,1);
}
footer a:hover{
	text-decoration:none;
	color: rgba(0,0,0,1);
	} 
.punkt{ display:none} 

/*.unterpunkte{
	color: rgba(126,165,12,1)}
.gross{
	color:rgba(255,102,0,1);
	margin-left:-20px;}*/

@media all and (max-width : 1500px) {
	.singen {
  padding: 15% 5%;
	
}
	nav{
	padding:0 0 0 14px;
}
}
	
@media all and (max-width : 1050px) {
	nav{
	padding:0 0 0 10px;
}
	.singen {
  padding: 20% 5%;
	
}
.punkt{ display:none} 

}

@media all and (max-width : 900px) {
	nav a{
			padding: 15px 15px 14px 5px;
		font-size: 14px;
}
	h1{
		font-size:100%}
.punkt{ display:none} 



	/*
	.mittig{
			padding:250px 10% 90px 10%;

		
	}*/

.singen {
  padding: 30% 5%;
	
}
}



	
@media all and (min-width : 768px) {
	.pfeil{
		display:none;}
.punkt{ display:none} 
	.sprung {
    display: inherit;
}


}
@media all and (max-width : 768px) {
	body {
	word-wrap:normal;
	}
	.brich{
display: inherit;}
	.waben {
  width: 100%;
  height: auto;
  overflow: hidden;
}
	.waben img {
  width: 100%;
  height: auto;
}
	.map{
		width: 100%;
		margin: 0 auto;}
	
	.eingerueckt {
  margin-left: 20px;
}
	
	.singen {
	margin: 0 1%;
  padding: 5% 5%;
	border-left: none;
		border-right: none;
}

	nav a{
			padding: 5px 0 5px 0;
}
	.mob{
		margin-left: 0px;
		line-height: 40px;
	}
	.centre{
		}
	
	.nicht{
	display:none}

	.adresse{
	margin-top:-190px;
	font-size:90%}
	.welle{
		display:none;}
	.welle2{
		display:inherit;
		height:auto;
		padding-bottom:15px;
		padding-right:10px;}
	.anchor{
	 top:-180px;}
	 .abstand1{
	padding:0px 0 15px 0;}
	h1{
	padding-top:180px;
	font-size:95%}
	
	.mittig{
			width:100%;
		height: auto;
			padding-top:30px;
}
	
	#contact_text{
		width:100%}

	
	
	.center{
	margin-left:25%;
	}
	.right{
		float:none;
		margin-left:25%;
		margin-right:auto;
		
		}
	
	.none{
		float:none;}
		
	/*	.a, .b{
		float:inherit;
		height:auto;
		width:100%}*/
		
	.welle{
	max-width:330px;
	max-width: 100%;
	height:auto}
nav {
		margin:0px 0 0 0;
		padding:0;
	}
/* Hide the navigation menu by default */
	/* Also hide the  */
	.toggle + a,
	.menu {
		display: none;
	}

	/* Stylinf the toggle lable */
	.toggle {
	display: block;
	/*background-color: rgba(204,102,0,0.5);*/
	padding: 0px 20px 8px 20px;
	color: rgba(102,102,102,1);
	font-size: 15px;
	text-decoration: none;
	border: none;
	}

	.toggle:hover {
	background-color: rgba(255,204,51,1);
/*	border-bottom:solid 1px rgba(102,102,102,1);
*/	color:rgba(51,51,51,1);	
	}

	/* Display Dropdown when clicked on Parent Lable */
	[id^=drop]:checked + ul {
		display: block;
	}

	/* Change menu item's width to 100% */
	nav ul li {
		display: block;
		width: 100%;
		border-bottom:rgba(247,196,2,0.1) solid 1px;
		/*border-top:rgba(247,196,2,1) solid 1px;*/
		}

	nav ul ul .toggle,
	nav ul ul a {
		padding: 0 40px;
	}

	nav ul ul ul a {
/*		padding: 0 80px;
*/	}
	


	nav a:hover,
 	nav ul ul ul a {
						

	background-color: rgba(255,204,51,0.5);
	color: rgba(51,51,51,1);
}
  
	nav ul li ul li .toggle,
	nav ul ul a,
  nav ul ul ul a{
		color: rgba(153,153,153,1);
		background-color: rgba(255,255,255,1);
		font-size:15px; 
		
	}
  
  
	nav ul li ul li .toggle,
	nav ul ul a {
		background-color: rgba(253,152,2,0);
		border-top:solid rgba(253,153,51,0.1) 1px;
		
	}

	/* Hide Dropdowns by Default */
	nav ul ul {
	float: none;
	position: static;
	background-color: rgba(255,255,255,1);
	color:rgba(51,51,51,1);		/* has to be the same number as the "line-height" of "nav a" */
	}
		
	/* Hide menus on hover */
	nav ul ul li:hover > ul,
	nav ul li:hover > ul {
		display: none;
		color:rgba(51,51,51,1);
	}

		
	/* Fisrt Tier Dropdown */
	nav ul ul li {
/*		background-color:rgba(0,0,0,1);
*/		line-height:40px;
		height:40px;
		display: block;
		width: 100%;
	}

	nav ul ul ul li {
		position: static;

		/* has to be the same number as the "width" of "nav ul ul li" */ 

	}
	.fest{
	position: inherit;
	}
	.css-arrow-2:after{
	border-top-color: rgba(102,102,102,1);
	padding: 0 15px 0 0;

}

		.welle2{
			width:250px;
			height:auto;
			float:left;}
			body{
		background-color:inherit;}
.punkt{ display:none} 

}
@media (max-width: 650px) {
	
	nav{
		margin-top:20px;}
		.welle2{
			width:300px;
			height:auto;}
			body{
		background-color:inherit;}
  .column {
    width: 100%;
    display: block;
  }
  footer{
	  position:inherit;}

.punkt{ display:none} 

}
@media (max-width: 575px) {
	nav{
		margin-top:50px;}}
	
@media (max-width: 500px) {
	
	
	.welle2{
		float:none;
		}
		nav{
		margin-top:90px;}
.punkt{ display:none} 

}

@media (max-width: 480px) {
	h1{
	padding-top:170px;
	font-size:110%}
	
	nav{
		margin-top:120px;}
	ul{
		margin-left:-40px;}
	body{
		background-color:inherit;}

	.punkt{
		display:inherit;
		margin-left:-18px;
		float:left;
		 }
.right{
		margin-bottom:-25px;
		}
	.gross{
	margin-left:0;}
	
	
	
		}


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

	nav ul li {
		display:block;
		width: 100%;
	}
	

}

@media all and (min-width : 1800px) {
	body{
		max-width:1800px;
		/*background-color:rgba(255,255,51,1)}*/
	
}
		}