@charset "utf-8";
/* CSS Document */
* 		{ margin:0; padding:0; box-sizing:border-box;}
		::-webkit-scrollbar {width:1px; height: 1px;} 
		::-webkit-scrollbar-thumb { -webkit-border-radius: 1ex;}
@font-face {font-family: "Armata-Regular";
		  src: url(fonts/Armata-Regular.woff2) format("woff2");
		  font-weight: normal;
		  font-style: normal;}	
@font-face {font-family: "SquadaOne-Regular";
		  src: url(fonts/SquadaOne-Regular.woff2) format("woff2"); 
		  font-weight: normal;
		  font-style: normal;}		  
		
body 	{background:black;
			 overflow-x:hidden;
			}			
/*MMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM*/
/*MMMMMMMMMMMMMM---Mini---MMMMMMMMMMMMMMMMMMMMMMMMMMMM*/
		
@media screen and (max-width:700px){
	
/*#########-----Markise (Header)---------------#######*/	

		header {position:fixed;
			display:block;
			top:0;
			height: 100px;
			width:100%;
			background:#1d2025;
			border:4px solid darkred;
			text-align: center;
			z-index:17;	
			}	
		
	.mm2  {	max-width:100%;
			margin-top:-5px;
			margin-left:-15px;}

	.Lamm	{position:absolute;
			cursor:url(img/favicon2.png),pointer;
			margin-top:15px;
			margin-left:30px;
			z-index:25;
			}
			
	.Lamm{position:relative;}
	
	.Lamm img#sichtbar2 {opacity:0;}

	.Lamm img#sichtbar2:hover {opacity:1;}

	.Lamm img {position: absolute; 
				cursor:url(img/favicon2.png),pointer;
				top:0; 
				left:0; 
				opacity:1;  
				transition:opacity 0.03s;}
				
	 #navigation3,		
	.mm, .red, .town, #Hand, #Fuss, #Sack, .Beine, .Beine2, .Beine3, 
	#sau , .Metzgerei, .muetze, .schnee, .weg, #saft2 {display:none;}
							
/*#########-----Ende Markise (Header)---------------#######*/			
			
/*#########-----Alles Weiter was nicht definiert ist#######*/
			
	#all 	{font-family: 'Armata-Regular';
				font-size:0.9em;
				margin-top:100px;}
				
/*#########-----Schaukasten---Aside---------#######*/
					
		aside {background-image:url(img/hgaside.jpg);
			background-repeat:repeat-y;
			box-shadow: 22px 0px 35px 0px rgba(0,0,0,0.18);
			position:fixed;
			top:0;
			text-align:left;
			right:0;
			margin-top:73px;
			width:180px;
			z-index:28;
			}

	.mu8 {color:#a3afc4;
			height:33px;
			padding-left:29px;
			margin-top:8px;
			font-family: 'SquadaOne-Regular' !important;
			font-size:1.5em;
			font-weight:normal;
			}
			
	.mu4 {margin-top:-32px;
			margin-left:24px;
			color:#AEB2C3;}	

	.mu3 {margin-top:-6px;}	
	
	.mu5 {font-size:1.2em;
		color:#AEB2C3;
		margin-left:94px;
		margin-top:-24px;
		font-weight:bold;}


	#bein8, .m1, .ab, .aa, input#menu {display:none !important;}
/*#########----Navi------###########################*/

	nav.m2 input, .m3 {display:none}
		
	nav.m2 ul {background-image:url(img/hgaside.jpg);
			list-style-type:none;
			max-width:180px;
			border-bottom:3px solid darkred;
			border-right:3px solid darkred;
			}
		
	nav.m2 h2 {padding-bottom:28px;
				font-size:0.9em;}
		
	nav.m2 ul:after {content:"";
				display:block;
				clear:both;}
					
	nav.m2 ul li {float:left;}

	nav.m2 ul li a {color:rgba(192,192,192,1);
				background:darkred;
				text-decoration:none;
				text-shadow:1px 1px 1px #333;
				border-bottom:2px solid black;
				border-right:1px solid black;
				padding-left:24px;
				margin-left:6px;
				line-height:31px;
				font-size:0.9em;
				font-weight:normal;
				display:block;
				width:170px;}
				
	nav.m2 ul li .akt {color:lightgray;
				background-image:url(img/hgaside.jpg);
				text-decoration:none;
				text-shadow:1px 1px 1px #333;			
				padding-left:24px;
				padding-top:12px;
				Padding-bottom:20px;
				line-height:28px;
				font-weight:normal;
				display:block;
				width:220px;}
				
	nav.m2 ul li ul {display:none;
				position:absolute;
				box-shadow:0 5px 30px black;}
				
	nav.m2 ul li:hover > ul  {display:block;}

	nav.m2 ul li ul li{float:none;}

	nav.m2 ul li ul li a:hover {background:rgba(157,51,53,0.8);
							color:#fff;}

	#quelle2 {text-decoration:none;
			font-size:0.8em;
			text-shadow:1px 1px 1px black ;
			}	
			
	#bein17 {margin-top:14px;
			font-size:0.8em;}
		
	/*#########----Angebote------#####################*/

	aside .tas, .aa2, .ko, .ta    {display:none;}
	
	aside .tas2 {width:150px;
			margin-left:14px;
			margin-top:1px;
			border:2px solid darkred;
			border-radius:12px;
			padding:3px;
			transition:all 1s;
			}		
				
/*###########---Adresse-----##########################################*/
						
	#adr2 	{color:#AEB2C3;
			font-size:14px;
			background-image:url(img/hgaside.jpg);
			padding-top:10px;
			text-align:center;
			}	

/*#######------Ende -- Aside-----####################################*/
/*###################################################################*/
/*#########-------Schaufenster---versteckte Boxen und Hs#############*/

		#ratgeber, #sortiment {display:block;
		background:#3b414f;
		border-top:1px solid #3a3e43;
		border-bottom:1px solid black;
		padding-left:2%;
		padding-right:2%;}
		
	 #team2, #kontakt2 {display:block;
		            background:#3b414f;
					border-bottom:1px solid black;}				
			
	 #team {display:block;
		 background:#3b414f;
		border-top:1px solid #616567;
				}	

	#weg1, #weg2, #weg3, #weg4, #weg5, #weg6, #weg7, #weg8, #weg9, #weg10, #weg11, #weg12 {display:none;}				
	
	/*########-------ganz oben-----------###################*/
	
	.bgimg0 {position:relative;
			  opacity: 1;
			  background-attachment: fixed;
			  background-position: 70%;
			  background-repeat: no-repeat;
			background-image:none;
			 height: 15px;}
			
	#anker1 {color:black;
			margin-top:-135px;
			text-align:left;
			}		
	
	/*########-------Dauersortiment-----------###################*/	
						
	.inhalt2 h3 {color:#AEB2C3;
		text-align:center;
		font-weight:normal;
		font-size:1.3em; 
		text-shadow:1px 1px 1px black;
		padding-top:2%;
		}		
				
	.rahm {width:100%;
		background:#3b414f;
		padding-top:10px;
		padding-bottom:17px;
		}	
	
	/*########-------Hintergrund Olga-----------###################*/

	.bgimg1 {position: relative;
			  background:black;
			  background-repeat: no-repeat;
			background-image:url(img/Olga.png);
			height: 530px;}
							 	 
	.uber {width:100%;
				margin-right:50%;
				text-align:center;
				color:orange;
				font-size:1.1em;
				
				text-shadow:1px 1px 1px black;
				padding:2%;
					}

	.herz 	{background:transparent;
		color:#AEB2C3;
		text-shadow:1px 1px 1px black;
		text-align:justify;
		width:100%;
		padding:3%;
		}
		
	.frei  {margin-top:-530px;
			position: absolute;
			background-color:transparent;
			width:100%;
			}	
			
				
	#anker2 {position:absolute;
			color:black;
			margin-top:405px;
			text-align:left;
			}	
	
	/*########-------Ratgeber Accordion-----------###################*/
	
	.inhalt7 {background:transparent;
			color:#ddd;
			padding:2%;
			text-align:justify;
			}	
		
	.inhalt7 h3 {text-shadow:1px 1px 1px black;
				text-align:right;
				font-weight:normal;
				padding-bottom:2%;
				}
				
/*########-------Inhalt Accordion-------------###################*/	
	
				
	.hier {color:darkred !important;
			text-decoration:none;
			font-style:italic;}			
					
	#kleinesKind, #anfaenger {float:right;
				padding-left:12px;
				-webkit-box-shadow: 8px 8px 22px -17px rgba(0,0,0,0.77);
				-moz-box-shadow: 8px 8px 22px -17px rgba(0,0,0,0.77);
				box-shadow: 13px 13px 22px -17px rgba(0,0,0,0.77);}
				
	#anfaenger{cursor:url(img/favicon2.png),pointer;}

	#card3 {		float:right;
				box-sizing:border-box;
				cursor:url(img/favicon2.png),pointer;
				padding-left:12px;
				max-width:180px;
				max-height:191px;
				}
					
	.Salat  {-webkit-box-shadow: 8px 8px 22px -17px rgba(0,0,0,0.77);
				-moz-box-shadow: 8px 8px 22px -17px rgba(0,0,0,0.77);
				box-shadow: 13px 13px 22px -17px rgba(0,0,0,0.77);}

	.salamiPos {position:absolute;
				margin-left:-230px;
				margin-top:-235px;
				}
				
	#kleinesFleisch, #Spass2 {float:left;
					padding-right:12px;
					}
					
	#kleinesFleisch2, #kleinesKind {width:180px}
						
	#Spass3		{ margin-left:-180px;
					transition: all 5.3s ease-in-out 0s; 
					z-index:3;}	

	#Spass3:hover{cursor:url(img/favicon2.png),pointer;
				transform: rotate(720deg);
				transition: all 5.4s ease-in-out 0s;
				}
							
	#kleinesFleisch2, #Spass {-webkit-box-shadow: 8px 8px 22px -17px rgba(0,0,0,0.77);
						-moz-box-shadow: 8px 8px 22px -17px rgba(0,0,0,0.77);
						box-shadow: 8px 8px 22px -12px rgba(0,0,0,0.77);
						}	

	#tundh2 {color:black;
			background-image:url(img/tundh.png);
			background-repeat: no-repeat;
			background-position:center;
			 }
			
	/*########-------Hintergrund Malcolm-----------###################*/

	.bgimg3 {position: relative;
			background-attachment: fixed;
			background-repeat: no-repeat;
			}
							
	.bgimg3 {background-image:url(img/malcom.png);
			 height: 535px;}
				
	.sale 	{margin-top:-535px;
			background:transparent;
			text-align:center;
			width:100%;
			z-index:1;
			}	
			
	.sale h3 {font-size:24px;	
			color:#c53146;
			margin-top:100px;
			z-index:999999;
			}	

	.sale img {width: 70%;
			margin: 10%;
			box-shadow: -12px 10px 38px 4px rgba(0,0,0,0.46);
			cursor:url(img/favicon2.png),pointer;
			}		

	#anker3 {position:absolute;
			color:black;
			margin-top:375px;
			left:0;
			}
			
	#anker6 {position:absolute;
			color:black;
			margin-top:-111px;
			left:0;
			}
	
	/*####################-------Team-----------###################*/		
		
	.inhalt {color:#AEB2C3;
			text-align:center;
			padding:2%;
			}

		.inhalt h3 {color:#AEB2C3;
		text-align:center;
		font-weight:normal;
		font-size:1.3em; 
		text-shadow:1px 1px 1px black;
		padding-top:1%;
		padding-bottom:2%;
		}		
			
	.son {color:darkred;
		text-shadow:1px 1px 1px black;
		font-weight:normal;
		margin-top:30px;
		padding-bottom:2%;
		text-align:center;
		font-size: 1.3em;
		}	
		   
	.inhalt img {width:47%;
			padding-left:5%;
			padding-right:1%;
			max-width:250px;}
			
		
	#unserteam2 {margin-left:3%;}		
			
				
	#unserteam {display:none;}
	/*########-------Hintergrund Knut----------###################*/

	.bgimg4 {position: relative;
			  background-attachment: fixed;
			  background-repeat: no-repeat;
			}	
			
	.bgimg4 {background-image:url(img/knut.png);
			 height: 420px;}
			 
	#anker4 {color:black;
			text-align:left;
			margin-top:00px;
			}
			
	#anker14 {color:black;
			}			

	.inhalt4 {margin-top:-420px;
		    max-width:100%;
			text-align:center;
			color:lightgray;
			text-shadow:1px 1px 1px black;
			padding:2%;
			}	
				
	.inhalt4 h3 {margin-top:1%;
			width:100%;
			text-align:center;
			color:#AEB2C3;
			text-shadow:1px 1px 1px black;
			padding:1%;
			}
	
	#card2 {position:relative;
			margin-left:20%;
			padding-bottom:2%;
			cursor:url(img/favicon2.png),pointer;
			width:60%;
				}

	#card2 img {	width:100%;}		
			
	/*####################-------Kontakt-----------###################*/

	.inhalt9 {color:#AEB2C3;
			text-shadow:1px 1px 1px black;
			margin-right:2%;
			padding:2%;
			}
			
	.inhalt9 h3 {font-weight:normal;
				padding-bottom:2%;
				text-align:right;
				font-size: 1.3em;
				}
	
	.Spam2 {text-align:right;
			margin-top:10px;
			padding-top:2%;}
			
	.wurst {	width:200px;
			margin-top:-114px;
			}	
			
	.blend {position:relative;}

	.blend img#sichtbar:hover {opacity:0;}

	.blend img {position: absolute; 
				cursor:url(img/favicon2.png),pointer;
				top:0; 
				right:0;
				opacity:1;  
				transition:opacity 3s;}
	
/*#### ----Kontaktformular-------#######################################*/

	#form {text-align:right;
			margin-top:80px;
			padding-bottom:30px;}

	input[type="text"], textarea {
				border:1px solid black;
				border-bottom:5px solid #3b414f;
				background:#aeb2c3;
				outline:none;
				width:200px;
				box-shadow:inset 3px 2px 5px #3b414f;
				font:16px Verdana, sans-serif;
				padding:3px;
				}
				
	.formfield * { vertical-align: top;}				

	input[type="text"]:active,
	input[type="text"]:focus,
	textarea:active,
	textarea:focus {background:lightgray;}

	input[type="submit"] {color:#aeb2c3;
						background:#282E34; 
						border-radius:1px;
						text-align:center;
						width:200px;
						margin-top:5px;
						}
							
	input[type="submit"]:hover {color:white;
								background:darkred; }
								
	input[type="reset"] {border-radius:1px;
						color:#aeb2c3;
						background:#282E34; 
						text-align:center;
						width:200px;
						margin-top:7px;
						}
						
	input[type="reset"]:hover {color:white;
							background:darkred;}	
		
	/*########-------Hintergrund Susi----------###################*/
	
	.bgimg5{position: relative;
		  background:black;
		  opacity: 1;
		  background-attachment: fixed;
		  background-position: 10% 620px;
		  background-repeat: no-repeat;
		}
						
	.bgimg5 {background-image:url(img/Susi.png);
		 min-height: 320px;
		}	
	
	.inhalt3 {margin:auto;
			padding:2%;
			padding-top:8%;
			color:lightgray;
			text-shadow:1px 1px 1px black;
			text-align:center;
			width:100%;
			}
			
	.inhalt3 h3 {text-align:center;		
			color:orange;
			font-weight:normal;
			padding:2%;
			text-shadow:1px 1px 1px black;
			}
			
	.inhalt3 h4 {color:lightgray;
	text-align:center;
		text-shadow:1px 1px 1px black;}			
			
	
	/*##########################################################*/
	/*##########---Rotes Ende ------############################*/
	
	#end {background:darkred;
			border-top:1px solid #d25d39;
			min-height:70px;
			color:lightgray;
			text-shadow:1px 1px 1px #3b414f;
			text-align:center;
			font-weight:normal;
			}
			
	#end h3 {padding-top:12px;
			font-weight:normal;}
		
			
	/*###### ---nach oben ----######################*/

	#back-top {position: fixed;
				bottom: 10px;
				left: 10px;
				box-shadow: 10px 3px 35px 0px rgba(0,0,0,0.3);
				z-index: 3;
				}
		
	#back-top a {width: 50px;
				height: 50px;
				display: block;
				text-align: center;
				font-size: 25px;
				text-shadow:1px 1px 1px rgba(31,27,27,1.00);
				color: #fff;
				background-color: darkred;
				opacity:0.5; 
				border: 1px solid #aeb2c3;
				border-radius: 5px;
				text-decoration: none;
				padding-top:8px;
				transition:all 3s ease;
				} 
		
	#back-top a:hover {opacity:0.8;
	cursor:url(img/favicon2.png),pointer;}

	/*#######-------Blut und Saege---------################################*/	
			
	#saft3 {width:100px;
	margin-left:10px;}
			
	figure.saft {position:fixed;
				top:0;
				left:14%;
				animation-name:go;
				animation-duration:35s;
				animation-fill-mode:forwards;
				z-index:10;
				transition-timing-function: ease-out;
			   }
			   
	@keyframes go {from {padding-top:0px;}
				to {padding-top:100px;}
				}	

			
	#saegebox {position:fixed;
			top:17%;
			left:-260px;
			z-index:7778;
			}	
}



/*MMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM*/			
/*MMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM*/
/*MMMMMMMMMMMMMM---Maxi---MMMMMMMMMMMMMMMMMMMMMMMMMMMM*/
/*MMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM*/

@media screen and (min-width:701px){
	
	/*#########-----Markise (Header)---------------#######*/	

	header {position:fixed;
			display:inline;
			border-top:1px solid black;
			border-bottom:1px solid darkred;
			box-shadow:0 0px 60px 7px rgba(15,9,9,0.7) inset;	
			top:0;
			height: 100px;
			padding-left:10%;
			font-family: 'SquadaOne-Regular';
				font-weight:bold;
				font-size: 150%;
			width:100%;
			background:rgba(208,95,97,1);
			text-align: center;
			z-index:17;	
			}	
			
	header h1 {line-height:36px;
			font-weight:bold;
			text-shadow:1px 1px 1px black;
			}
			
	.Beine3	{position:absolute;
			margin-top:101px;
			margin-left:-56%;
			z-index:23;
			}		
			
	#Sack	{position:absolute;
			margin-left:-56%;
			margin-top:112px;
			z-index:25;}	
			
	#Sack    {animation-name:Wackel;
			animation-duration:1.5s;
			animation-fill-mode:forwards;
			animation-iteration-count:30;  /*Anz. Durchläufe / infinite=loop*/
			animation-direction:alternate;/*normal(von 0% - 100%; standard); reverse (von 100% - 0%);alternate (0%-100%-0%);alternate-reverse(100%-0%-100%)*/
			animation-timing-function:ease-in-out;
			animation-delay:0s;
			}
			
			@keyframes Wackel {
			from {transform-origin: 50% 0; transform:rotate(2deg);}
			to {transform-origin: 50% 0; transform:rotate(-2deg);}
			}

	#Sack:hover {animation-name:WackelSack;
			animation-duration:0.5s;
			animation-fill-mode:forwards;
			animation-iteration-count:8;  /*Anz. Durchläufe / infinite=loop*/
			animation-direction:alternate;/*normal(von 0% - 100%; standard); reverse (von 100% - 0%);alternate (0%-100%-0%);alternate-reverse(100%-0%-100%)*/
			animation-timing-function:ease-in-out;
			animation-delay:0s;
			}
			
			@keyframes WackelSack {
			from {transform-origin: 50% 0; transform:rotate(2.5deg);}
			to {transform-origin: 50% 0; transform:rotate(-2.5deg);}
			}		
				
	.Lamm	{cursor:url(img/favicon2.png),pointer;
			margin-top:15px;
			padding-left:12px;
			float:left;
			z-index:25;
			}
			
	.Lamm{position:relative;}
	
	.Lamm img#sichtbar2 {opacity:0;}

	.Lamm img#sichtbar2:hover {opacity:1;
								}

	.Lamm img {position: absolute; 
				cursor:url(img/favicon2.png),pointer;
				top:0; 
				left:0; 
				opacity:1;  
				transition:opacity 0.01s;
				}		
							
	.Metzgerei	{text-align:center;
				margin-right:13%;
				color:lightgray;
				padding-top:20px;
				z-index:14;
				}
						
	.red	{color:darkred;
			padding-left:10px;}
							
	.town	{text-align:center;
			margin-right:13%;
			padding-top:5px;
			color:lightgray;
			font-size:20px;
			font-weight:normal;
			text-shadow:1px 1px 1px black;}
				
	.mm {display:none;}		
			
	.Beine	{position:absolute;
			margin-top:17px;
			margin-left:65px;
			z-index:23;
			}

	.Beine2	{position:absolute;
			margin-top:17px;
			margin-left:193px;
			z-index:23;
			}
			
	#Hand	{position:absolute;
			margin-left:35px;
			margin-top:32px;
			z-index:25;}	
			
	#Hand    {animation-name:Wackel;
			animation-duration:1.3s;
			animation-fill-mode:forwards;
			animation-iteration-count:34;  /*Anz. Durchläufe / infinite=loop*/
			animation-direction:alternate;/*normal(von 0% - 100%; standard); reverse (von 100% - 0%);alternate (0%-100%-0%);alternate-reverse(100%-0%-100%)*/
			animation-timing-function:ease-in-out;
			animation-delay:0s;
			}
			
			@keyframes Wackel {
			from {transform-origin: 50% 0; transform:rotate(2deg);}
			to {transform-origin: 50% 0; transform:rotate(-2deg);}
			}
			
	#Hand:hover {animation-name:WackelSack2;
			animation-duration:0.5s;
			animation-fill-mode:forwards;
			animation-iteration-count:8;  /*Anz. Durchläufe / infinite=loop*/
			animation-direction:alternate;/*normal(von 0% - 100%; standard); reverse (von 100% - 0%);alternate (0%-100%-0%);alternate-reverse(100%-0%-100%)*/
			animation-timing-function:ease-in-out;
			animation-delay:0s;
			}
			
			@keyframes WackelSack2 {
			from {transform-origin: 50% 0; transform:rotate(2.2deg);}
			to {transform-origin: 50% 0; transform:rotate(-2.2deg);}
			}		
	
	#Fuss 	{position:absolute;
			margin-left:126px;
			margin-top:31px;
			z-index:25;}	
			
	#Fuss    {animation-name:Wackel;
			animation-duration:2.4s;
			animation-fill-mode:forwards;
			animation-iteration-count:24;  /*Anz. Durchläufe / infinite=loop*/
			animation-direction:alternate;/*normal(von 0% - 100%; standard); reverse (von 100% - 0%);alternate (0%-100%-0%);alternate-reverse(100%-0%-100%)*/
			animation-timing-function:ease-in-out;
			animation-delay:0s;
			}
			@keyframes Wackel {
			from {transform-origin: 50% 0; transform:rotate(3deg);}
			to {transform-origin: 50% 0; transform:rotate(-3deg);}
			}
			
	#Fuss:hover {animation-name:WackelSack3;
			animation-duration:0.5s;
			animation-fill-mode:forwards;
			animation-iteration-count:8;  /*Anz. Durchläufe / infinite=loop*/
			animation-direction:alternate;/*normal(von 0% - 100%; standard); reverse (von 100% - 0%);alternate (0%-100%-0%);alternate-reverse(100%-0%-100%)*/
			animation-timing-function:ease-in-out;
			animation-delay:0s;
			}
			
			@keyframes WackelSack3 {
			from {transform-origin: 50% 0; transform:rotate(2.5deg);}
			to {transform-origin: 50% 0; transform:rotate(-2.5deg);}
			}	
				
	/*#########-----Ende Markise (Header)----######################*/			
	/*#############################################################*/			
	/*#########---Alles Weiter was nicht definiert ist------#######*/			
				
	#all 	{font-family: 'Armata-Regular';
				font-weight:normal;
				font-size:.95em;
			margin-top:100px;}
			
	/*#############################################################*/		
	/*################-----Schaukasten---Aside---------############*/		
			
	#sau	{position:fixed;
			width:185px;
			top:150px;
			padding-left:0px;
			right:3%;
			z-index:2;}
			
	#cursor {z-index:9990;}		
			
	aside {background-image:url(img/hgaside.jpg);
			background-repeat:repeat-y;
			box-shadow: 22px 0px 35px 0px rgba(0,0,0,0.4);
			position:fixed;
			top:45px;
			text-align:left;
			padding-left:0px;
			right:3%;
			height:100%;
			width:180px;
			font-weight:normal;
			font-size:.9em;
			border-top:9px solid darkred;
			z-index:228;
			}

	aside h2 {color:#AEB2C3;
			text-shadow:1px 1px 1px black;
			padding-left:26px;
			margin-top:-13px;
			}						
	
	.mu {padding-left:16px;
		padding-bottom:18px;
		padding-top:6px;
		margin-bottom:-40px;
		}

	.m2, .aa, input#menu {display:none;}
	.mm2 {display:none;}
	/*#########----Navi------##################*/

	nav ul {margin:auto;
			margin-top:25px;
			list-style-type:none;
			max-width:168px;
			padding-bottom:15px;
			}		

	nav ul li a {color:rgba(192,192,192,1);
			background:darkred;
			text-decoration:none;
			text-shadow:1px 1px 1px #333;
			line-height:38px;
			padding:0 20px;
			border-bottom:1px solid black;
			display:block;
			font-weight:normal;
			transition:all 0.6s;}
			
	.schnee {margin-top:-16px;
			margin-left:-5px;
			z-index:555555;}		
			
	#navigation3 {text-align:center;
			margin:auto;
			margin-top:-125px;
			list-style-type:none;
			max-width:168px;
			padding-bottom:12px;
			}

	#mh2{	font-family: 'SquadaOne-Regular' !important;
				font-size:2.0em;
				font-weight:normal;}	
			
	#navigation3 li a {
			color:#FFA500;
			background:darkred;
			text-decoration:none;
			text-shadow:1px 1px 1px #333;
			line-height:38px;
			padding:0 10px;
			border-bottom:1px solid black;
			display:block;
			font-weight:normal;
			transition:all 0.6s;}
			
	#navigation3 li a:hover,						
	nav ul li a:hover,
	nav ul li a:focus,
	nav ul li a:active {background:rgba(157,51,53,0.5);
					color:#fff;
					}

	/*##########################################*/
	/*##########################################*/
	/*#########----Angebote------###############*/

	.aa2 {margin-top:2px;
	margin-left:-5px;
		padding-bottom:12px;}	
	
	aside .tasche {width:150px;
				margin-left:8px;
				margin-top:9px;
				border:2px solid darkred;
				border-radius:12px;
				padding:3px;
				transition:all 1s;
				}
							
	aside .tasche:hover {-webkit-transform: translate(-315px,0px);
						-moz-transform: translate(-315px,0px);
						transform:translate(-315px,0px);
						width:465px;
						}		

	.ta   	{position:relative;
			width:147px;
			height:109px;
			transition:all 2s;
			-webkit-transition:all 2s;
			}		

	.ta p	{position:absolute;
			font-size:1px;
			color:red;
			top:20px;
			left:150px;
			opacity:0;
			background:transparent;
			transition: all 2s ease-out ;
			-webkit-transition: all 2s ease-out ;
			}
			
	.ta h4 {position:absolute;
			color:red;
			width:300px;
			bottom:80px;
			left:130px;
			opacity:0;
			font-size:1px;
			-webkit-transition:all 2s;
			transition:all 2s;
			}		

	.ta:hover p {top:31px;
				left:-215px;
				font-size:18px;
				color:blue;
				opacity:1;
				z-index:5;
				}	

	.ta:hover h4 {color:lightblue;
				font-size:17px;
				left:-250px;
				bottom:-222px;
				opacity:1;
				}			

	.koffer	{width:150px;
			margin-left:8px;
			margin-top:25px;
			border:2px solid darkred;
			border-radius:12px;
			padding:3px;
			transition:all 2s;
			-webkit-transition:all 2s;
			}
			
	.koffer:hover {-webkit-transform: translate(-315px, -128px);
				 -moz-transform: translate(-315px, -128px);
				transform:translate(-315px, -128px);
				width:465px;
					}
						
	.ko   	{position:relative;
			width:147px;
			height:109px;
			transition:all 2s;
			padding-bottom:20px;
			}							

	.ko p	{position:absolute;
			font-size:1px;
			color:red;
			top:20px;
			left:150px;
			opacity:0;
			background:transparent;
			transition: all 2s ease-out ;
			-webkit-transition: all 2s ease-out ;
			}
			
	.ko h4 {position:absolute;
			color:red;
			width:300px;
			bottom:80px;
			left:130px;
			opacity:0;
			font-size:1px;
			transition:all 2s;
			-webkit-transition:all 2s;
			}
					
	.ko:hover p {top:-74px;
				left:-270px;
				font-size:18px;
				color:blue;
				opacity:1;
				z-index:5;
				}	

	.ko:hover h4 {color:lightblue;
				font-size:17px;
				left:-260px;
				bottom:-111px;
				opacity:1;
				}

	#bein7, #quelle {text-decoration:none;
			font-size:0.95em;
			color:rgba(192,192,192,1);
			text-shadow:1px 1px 1px #333;
			}	
										
	/*###########---Adresse-----##########################*/
							
	#adr 	{color:#AEB2C3;
			text-shadow:1px 1px 1px black ;
			padding-top:48px;
			padding-bottom:22px;
			text-align:center;}	
			
	#adr3 	{color:#AEB2C3;
			text-shadow:1px 1px 1px black ;
			padding-top:2px;
			text-align:center;}			

	/*#######------Ende -- Aside-----######################*/
	/*#####################################################*/
	/*####-------Schaufenster-----------###################*/
			
	 #ratgeber2, #sortiment {background:#3b414f;
					border-bottom:1px solid black;}
					
	 #team2, #kontakt2 {background:#3b414f;
					border-bottom:1px solid black;}				
			
	 #kontakt, #team {background:#3b414f;
					border-top:1px solid transparent;}

	#unserteam2 {display:none;}				

	/*########-------ganz oben-----------###################*/	
		
	.bgimg0 {position: relative;
			margin-top:100px;
		    background-attachment: fixed;
		    background-repeat: no-repeat;
				}
								
	.bgimg0 {background-image:none;
			 height:16px;}
			
	#anker1 {color:black;
			margin-top:-135px;
			text-align:left;
			}		
	
	/*########-------Dauersortiment-----------###################*/


	#ratgeber2, #sortiment, #team2, #kontakt2 {background-image:url(img/schnee2.png);
				 background-repeat: repeat-x;
				 margin-top:-1px;
				 }
				 
	.inhalt2 {
		margin-right:230px;
			background:transparent;
			color:#ddd;
			}	
				
	.inhalt2 h3 {color:#AEB2C3;
				text-align:center;
				font-weight:normal;
				font-size:1.3em; 
				text-shadow:1px 1px 1px black;
				padding-top:2%;
				padding-bottom:12px;
				}
			
	.rahm {width:100%;
			background:#3b414f;
			padding-top:10px;
			padding-bottom:38px;
			border-left:33px solid #3b414f;
			border-right:33px solid #3b414f;
			}			
	
	/*########-------Hintergrund Olga-----------###################*/
	
	.bgimg9 {position: relative;
			  opacity: 0.8;
			  background-attachment: fixed;
			  background-repeat: no-repeat;
			}
							
	.bgimg9 {height: 530px;}	
			
	
	.bgimg1 {position: relative;
			margin-top:-530px;
			 background:transparent;
			  background-attachment: fixed;
			  background-repeat: no-repeat;
			  overflow:hidden;
				background-image:url(img/olga.png);
			 height: 530px;}	 
			 
	#weg3 {opacity:0.6;}		 
		 
	.uber{margin-right:50%;
			width:100%;
			text-align:center;
			color:orange;
			font-size:20px;
			text-shadow:1px 1px 1px black;
			padding:2%;
			font-weight:normal;
				}
				
	.herz 	{margin-left:10%;
			width:50%;
			color:lightgray;
			text-shadow:1px 1px 1px black;
			padding:2%;
			text-align:center;
			}
		
	.frei  {margin-top:-530px;
			position: absolute;
			background-color:transparent;
			width:100%;
			}
				
	#anker2 {position:absolute;
			color:black;
			margin-top:390px;
			text-align:left;
			}			
				
	/*########-------Ratgeber Accordion-----------###################*/
	
	#ratgeber {margin-right:230px;
				background:transparent;
				color:#ddd;
				padding:2%;
				text-align:justify;
				}	
			
	#ratgeber h3 {text-shadow:1px 1px 1px black;
				text-align:right;
				font-weight:normal;
				}		
				
	/*########-------Inhalt Accordion-----------###################*/			
				
	.hier {color:darkred !important;
			text-decoration:none;
			font-style:italic;}			
					
	#kleinesKind, #anfaenger {float:right;
				padding-left:12px;
				-webkit-box-shadow: 8px 8px 22px -17px rgba(0,0,0,0.77);
				-moz-box-shadow: 8px 8px 22px -17px rgba(0,0,0,0.77);
				box-shadow: 13px 13px 22px -17px rgba(0,0,0,0.77);}
				
	#anfaenger{cursor:url(img/favicon2.png),pointer;}

	#card3 {		float:right;
				box-sizing:border-box;
				cursor:url(img/favicon2.png),pointer;
				padding-left:12px;
				max-width:180px;
				max-height:191px;
				}
					
	.Salat  {-webkit-box-shadow: 8px 8px 22px -17px rgba(0,0,0,0.77);
				-moz-box-shadow: 8px 8px 22px -17px rgba(0,0,0,0.77);
				box-shadow: 13px 13px 22px -17px rgba(0,0,0,0.77);}

	.salamiPos {position:absolute;
				margin-left:-230px;
				margin-top:-235px;
				}
				
	#kleinesFleisch, #Spass2 {float:left;
					padding-right:12px;
					}
					
	#kleinesFleisch2, #kleinesKind {width:180px}
						
	#Spass3		{ margin-left:-180px;
					transition: all 5.3s ease-in-out 0s; 
					z-index:3;}	

	#Spass3:hover{cursor:url(img/favicon2.png),pointer;
				transform: rotate(720deg);
				transition: all 5.4s ease-in-out 0s;
				}
							
	#kleinesFleisch2, #Spass {-webkit-box-shadow: 8px 8px 22px -17px rgba(0,0,0,0.77);
						-moz-box-shadow: 8px 8px 22px -17px rgba(0,0,0,0.77);
						box-shadow: 8px 8px 22px -12px rgba(0,0,0,0.77);
						}	

	#tundh2 {color:black;
			background-image:url(img/tundh.png);
			background-repeat: no-repeat;
			background-position:center;
			 }

	/*########-------Hintergrund Malcolm-----------###################*/
	
	.bgimg9a {position: relative;
			height: 535px;
			  opacity: 0.8;
			  background-attachment: fixed;
			  background-repeat: no-repeat;
			}
	
	.bgimg3 {position: relative;
			margin-top:-535px;
			background-attachment: fixed;
			background-repeat: no-repeat;
			}
			
	#weg6 {opacity:0.5;}			
							
	.bgimg3 {background-image:url(img/malcom.png);
			 height: 535px;}
	
	.sale 	{margin-top:-535px;
			margin-right:200px;
			text-align:right;
			background:transparent;
			z-index:1;
			}
			
	.son {font-size:24px;	
			color:#c53146;
			margin-right:86px;
			margin-bottom:20px;
			padding-top:2%;
			padding-bottom:2%;
			font-weight:normal;
			}	
				
	.sale img {text-align:center;
			width: 70%;
			margin-right:86px;
			max-width: 540px;
			cursor:url(img/favicon2.png),pointer;
			box-shadow: -12px 10px 38px 4px rgba(0,0,0,0.46);
			}	

	#anker3 {position:absolute;
			color:black;
			margin-top:416px;
			left:0;
			}
			
	#anker6 {position:absolute;
			color:black;
			margin-top:-111px;
			left:0;
			}

/*####################-------Team-----------###################*/		
		
	.inhalt {margin-right:230px;
			background:transparent;
			text-align:center;
			padding:2%;}		
			
	#team2 h3 {color:#AEB2C3;
				text-shadow:1px 1px 1px black;  
				font-weight:normal;
				padding-bottom:2%;
				padding-top:5px;
				text-align:center;
				font-size: 1.3em;
				}	
		   
	.team img {width:24%;
			padding-left:2%;
			padding-right:2%;
			max-width:250px;}	
			
	/*########-------Hintergrund Knut----------###################*/
	
	.bgimg9b {position: relative;
			height: 450px;
			  opacity: 0.8;
			  background-attachment: fixed;
			  background-repeat: no-repeat;
			}
							
	.bgimg4 {position: relative;
			  margin-top:-757px;
			  background-attachment: fixed;
			  background-repeat: no-repeat;
			  background-image:url(img/knut.png);
			 height: 450px;
			}	
				 
	#weg9 {opacity:0.66;}
			
	#anker4 {color:black;
			text-align:left;
			margin-top:307px;
			}
			
	#anker14 {color:black;}	
			
	.inhalt4	{
				margin-top:-450px;
				margin-right:50%;
				text-align:left;
				background:transparent;
				color:lightgray;
				text-shadow:1px 1px 1px black;
				padding:2%;
				}	
				
	.inhalt4 h3 {padding-top:1%;
				padding-bottom:1%;
				color:#AEB2C3;
				text-align:center;		
				font-weight:normal;
				text-shadow:1px 1px 1px black;
				}
			
	#card2 {position:relative;
				box-sizing:border-box;
				cursor:url(img/favicon2.png),pointer;
				float:right;
				padding:2%;
				width:57%;
				max-width:340px;
				min-width:190px;
				}

	#card2 img {	padding-left:2%;
				width:100%;}		
			
/*####################-------Kontakt-----------###################*/

	.inhalt9 {color:#AEB2C3;
			text-shadow:1px 1px 1px black;
			margin-right:230px;
			background:transparent;
			padding:2%;
			text-align:center;
			}
			
	.spam {margin-right:230px;
			background:transparent;
			text-align:center;
			padding:2%;}		
			
	.inhalt9 h3 {
				font-weight:normal;
				padding-bottom:2%;
				text-align:right;
				font-size: 1.3em;
				}

	.Spam2 {padding-left:15%;
			text-align:right;}
			
	.wurst {	width:37%;
			max-width:420px;
			min-width:190px;
			margin-top:38px;
			margin-left:38px;
			}
	
/*#### ----Kontaktformular-------#######################################*/	 

	#form {text-align:right;
			margin-top:-34px;}

	.blend {position:relative;}

	.blend img#sichtbar:hover {opacity:0;}

	.blend img {position: absolute; 
				cursor:url(img/favicon2.png),pointer;
				top:0; 
				left:0; 
				opacity:1;  
				transition:opacity 3s;}

	input[type="text"], textarea {
				border:1px solid black;
				border-bottom:5px solid #3b414f;
				background:#aeb2c3;
				outline:none;
				width:200px;
				box-shadow:inset 3px 2px 5px #3b414f;
				font:16px Verdana, sans-serif;
				padding:3px;
				}
				
	.formfield * { vertical-align: top;}				

	input[type="text"]:active,
	input[type="text"]:focus,
	textarea:active,
	textarea:focus {background:lightgray;}

	input[type="submit"] {color:#aeb2c3;
						background:#282E34; 
						border-radius:1px;
						text-align:center;
						width:200px;
						margin-top:5px;
						}
							
	input[type="submit"]:hover {color:white;
								background:darkred;}
								
	input[type="reset"] {border-radius:1px;
						color:#aeb2c3;
						background:#282E34; 
						text-align:center;
						width:200px;
						margin-top:7px;
						}
						
	input[type="reset"]:hover {color:white;
							background:darkred;}	
							
	.inhalt:after{content:"";
				display:block;
				clear:both;}	
				
	/*########-------Hintergrund Susi----------###################*/			
				
	.bgimg5{margin-top:-450px;
			position: relative;
			opacity: 0.9;
			background-attachment: fixed;
			background-repeat: no-repeat;
			background-image:url(img/Susi.png);
			height: 450px;}	
			
	#weg12 {opacity:0.6;}		
	
	.bgimg6 {position: relative;
			height: 450px;
			opacity: 0.9;
			background-attachment: fixed;
			background-repeat: no-repeat;
			}
			
	#anker5 {color:black;
			text-align:left;
			}
			
	.inhalt3{margin-top:450px;
			margin-right:250px;
			padding:3%;
			margin-top:0px;
			color:lightgray;
			text-align:center;
			text-shadow:1px 1px 1px black;
			}		
				
	.inhalt3 h3 {text-align:center;		
				color:orange;
				font-weight:normal;
				padding:1%;
				text-shadow:1px 1px 1px black;
				}		
			
	/*##########################################################*/
	/*##########---Rotes Ende ------############################*/
	
	#end {background:darkred;
			border-top:0px solid #d25d39;
			min-height:70px;
			color:lightgray;
			text-align:center;
			text-shadow:1px 1px 1px #3b414f;
			background-image:url(img/schnee2.png);
			 background-repeat: repeat-x;
			}
		
	.endinhalt {margin-right:250px;
				font-weight:normal;}		
			
	#end h3 {padding-top:25px;
			margin-right:10px;
			font-weight:normal;}
		
	/*###### ---nach oben ----######################*/

	#back-top {position: fixed;
				bottom: 10px;
				left: 10px;
				box-shadow: 10px 3px 35px 0px rgba(0,0,0,0.3);
				z-index: 3;
				}
		
	#back-top a {width: 50px;
				height: 50px;
				display: block;
				text-align: center;
				font-size: 25px;
				text-shadow:1px 1px 1px rgba(31,27,27,1.00);
				color: #fff;
				background-color: darkred;
				opacity:0.5; 
				border: 1px solid #aeb2c3;
				border-radius: 5px;
				text-decoration: none;
				padding-top:8px;
				transition:all 3s ease;
				} 
		
	#back-top a:hover {opacity:0.8;
	cursor:url(img/favicon2.png),pointer;}

	/*#######-------Blut und Saege---------################################*/			
					
	figure.saft {position:fixed;
				top:0;
				left:14%;
				animation-name:go;
				animation-duration:1s;
				animation-fill-mode:forwards;
				width:176px;
				z-index:10;
				transition-timing-function: ease-out;
			   }
			   
	@keyframes go {from {padding-top:0px;}
				to {padding-top:100px;}
				}			
		
	.saft2 	{position:fixed;
			bottom:5px;
			opacity:0.6;
			right:210px;
			z-index:39;}
			
	.saft2 img{max-width:300px;}
	
	#saegebox {position:fixed;
			bottom:30%;
			left:-200px;
			z-index:9980;}
	
	#saege{-webkit-transition: all 6.2s ease-out;
			-moz-transition: all 6.2s ease-out;
			-o-transition: all 6.2s ease-out;
			transition: all 6.2s ease-out;
			}

	#saege.rotated {-webkit-transform : rotate(3600deg); 
				-moz-transform : rotate(3600deg); 
				-ms-transform : rotate(3600deg); 
				-o-transform : rotate(3600deg); 
				transform : rotate(3600deg); 
				}
						
	.drop {background:-webkit-gradient(linear,0% 0%,0% 100%, from(rgba(51,53,58,0.8) ), to(rgba(255,255,255,0.5))  );
			background: -moz-linear-gradient(top, rgba(51,53,58,0.8) 0%, rgba(255,255,255,.5) 100%);
			background: -ms-linear-gradient(top, rgba(51,53,58,0.8) 0%, rgba(255,255,255,.5) 100%);
			background: -webkit-linear-gradient(top, rgba(51,53,58,0.8) 0%, rgba(255,255,255,.5) 100%);
			background: -o-linear-gradient(top, rgba(51,53,58,0.8) 0%, rgba(255,255,255,.5) 100%);
			width:1.2px;
			height:15px;
			position: absolute;
			bottom:1900px;
			-webkit-animation: fall 6.3s linear infinite;
			-moz-animation: fall 6.3s linear infinite;
			-o-animation: fall 6.3s linear infinite;
			-ms-animation: fall 6.3s linear infinite;
			animation: fall 6.3s linear infinite;
			}
			
			@keyframes fall {
				to {margin-top:5500px;}
			}
			@-ms-keyframes fall {
				to {margin-top:5500px;}
			}
			@-o-keyframes fall {
				to {margin-top:5500px;}
			}

			@-webkit-keyframes fall {
				to {margin-top:5500px;}
			}
			@-moz-keyframes fall {
				to {margin-top:5500px;}
			}
			
	.drop2 {
			background:-webkit-gradient(linear,0% 0%,0% 100%, from(rgba(51,53,58,0.8) ), to(rgba(255,255,255,0.5))  );
			background: -moz-linear-gradient(top, rgba(51,53,58,0.8) 0%, rgba(255,255,255,.5) 100%);
			background: -ms-linear-gradient(top, rgba(51,53,58,0.8) 0%, rgba(255,255,255,.5) 100%);
			background: -webkit-linear-gradient(top, rgba(51,53,58,0.8) 0%, rgba(255,255,255,.5) 100%);
			background: -o-linear-gradient(top, rgba(51,53,58,0.8) 0%, rgba(255,255,255,.5) 100%);
			width:1px;
			height:28px;
			position: absolute;
			bottom:1900px;
			-webkit-animation: fall 6s linear infinite;
			-moz-animation: fall 6s linear infinite;
			-o-animation: fall 6.3s linear infinite;
			-ms-animation: fall 6.3s linear infinite;
			animation: fall 6.3s linear infinite;
			}

			@keyframes fall {
				to {margin-top:3500px;}
			}
			@-ms-keyframes fall {
				to {margin-top:3500px;}
			}
			@-o-keyframes fall {
				to {margin-top:3500px;}
			}

			@-webkit-keyframes fall {
				to {margin-top:3500px;}
			}
			@-moz-keyframes fall {
				to {margin-top:3500px;}
			}					
}
