@charset "UTF-8";

:root {
	--el-bg: #fff4ca;
}

html {
	font-family: 'Nunito', sans-serif;
}

@font-face {
	font-family: 'Material Icons';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/MaterialIcons-Regular.woff2');
}

.material-icons {
	font-family: 'Material Icons';
	font-weight: normal;
	font-style: normal;
	font-size: 1.5em;  /* Preferred icon size */
	display: inline-block;
	line-height: 1;
	text-transform: none;
	letter-spacing: normal;
	word-wrap: normal;
	white-space: nowrap;
	direction: ltr;
	vertical-align: text-bottom;

	/* Support for all WebKit browsers. */
	-webkit-font-smoothing: antialiased;
	/* Support for Safari and Chrome. */
	text-rendering: optimizeLegibility;

	/* Support for Firefox. */
	-moz-osx-font-smoothing: grayscale;

	/* Support for IE. */
	font-feature-settings: 'liga';
}

body {
	max-width:100%;
}


#container {
	max-width:1200px;
	margin: 0 auto;
	background:#FFF;
}

#demo_hinweis {
	display: none;
}

body#produkt #nav_kat_img, body#produkt #nav_aussen, body#produkt #nav_innen,
body#bestellen #nav_kat_img, body#bestellen #nav_aussen, body#bestellen #nav_innen,
body#bestellen-fertig #nav_kat_img, body#bestellen-fertig #nav_aussen, body#bestellen-fertig #nav_innen,
body#menue_auswahl #nav_kat_img, body#menue_auswahl #nav_aussen, body#menue_auswahl #nav_innen {
	 display:none;}

img {
	max-width:100%;
	height: auto;
}

a {
	color: #B60F0F;
	text-decoration: none;
}

a:hover {
	color: #ff1515;
}

select {
    padding: 0.2em;
}

.zentriert {
	text-align:center;
}

input[type="radio"] {
	margin: 0 0.5em 1em 0.5em;
}

.lass {
	display: none;
}

.button {
	display: block;
	float: left;
	margin: 1em 1em 1em 0;
	padding: 0.5em;
	text-decoration: none;
	background: #D51111;
	color: white;
}

.button_gross {
	float: right;
	width: 90%;
	text-align: center;
	margin: 1em 5%;
}

.button_deaktiviert {
	background: #AAAAAA;
}

.formbutton {
	background: #F00;
	color: #FFF;
}

.form-readonly {
	color: #999;
}

.form-alert {
	font-size: .9em;
	color: #F00;
	margin-top: .1em;
	display: none;
}

.hinweistext {
	color: red;
}

.hinweisbox {
	border: 2px solid #F00;
}

.kleineschrift {
    font-size:80%;
}

.titel, .hinweis_info {
	margin-left: 2%;
	padding:0;
}

.hinweis_info {
	color: red;
	border:1px solid #F00;
	padding:0.5em;
	margin-right: 5%;
}

.hinweis_zusatzstoffe {
	margin-left:2%;
	text-decoration:none;
}

.zusatzstoffe {
	font-size: 0.8em;
}

.warenkorb {
	color: red;
}

.badge {
	position: absolute;
	top: -5px;
	right: -10px;
	height: 1.2em;
	width: 1.2em;
	font-size: .8em;
	padding: 3px;
	text-align: center;
	border-radius: 100%;
	color: #FFF;
	background: #F00;
}

#ladebalken {
	position: fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:1000;
	background: #000;
	opacity: 0.7;
}

#ladebalken img {
	position: fixed;
	top: 48%;
	left: 45%;
}

/* ############ */

.content-box {
	width: 90%;
	padding: 2%;
	margin: 0.5em 3% 1em 3%;
	line-height:1.5em;
	text-align: center;
}

.content-box h2 {
	margin: 2em;
}


/* App ad begin */
#app-ad {
	background: var(--el-bg);
	display: flex; flex-direction: column; justify-content: center; align-items: center;
	width: 94%;
	padding: 0;
}

#app-ad h2 {
	margin: 1.5em 1em 1em 2em;
}

#app-ad-content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}


#app-ad-content .hinweistext {
	white-space: nowrap;
}

.badge-app {
	width: 25%;
	margin: 2em;
}

@media only screen and (min-width:600px) {
	.badge-app {
		width: 20%;
	}
}
#app-thumbnail {
	max-height: 220px;
	margin: 1em;
}


@media only screen and (min-width:800px) {
	#app-ad-content {
		flex-direction: row;
	}


	#app-ad-content div:first-child {
		flex: 70%;
		padding: 3em;
	}

	#app-ad-content div:last-child {
		flex: 30%;
	}

}
/* App ad end */

/* Kategorien Startseite begin */
/*#kategorien {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

#kategorien figure {
	flex: 28%;
	margin: 1em;
}

@media only screen and (min-width:1000px) {
	#kategorien figure {
		flex: 20%;
	}
}*/
#kategorien {
	width: 94%;
	padding: 0;
}

#kategorien figure {
	display: inline-block;
	width: 45%;
	margin: 2%;
}

#kategorien img {
	border-radius: 2px;
}
/*
#kategorien img {
	box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
}

#kategorien img:hover {
	box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
}*/

@media only screen and (min-width:600px) {
	#kategorien figure {
		width: 28%;
		margin: 1.5% 1%;
	}
}

@media only screen and (min-width:800px) {
	#kategorien figure {
		width: 22%;
	}
}

/* Kategorien Startseite end */

/* ############ */


#container {
	width: 100%;
}

header {
	background: #FFF;
	display:block;
}

.header {
	border-bottom: 1px solid #CCC;
	
}

#header_logo {
	padding:2%;
	max-height:3em;
}


#head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 1em;
}

#footer-cart, #footer-up {
	position: fixed;
	bottom: 1em;
	background: #f4f4f4;
	border: 1px solid #c6c5c5;
	border-radius: 100%;
	margin: 1em;
	padding: .5em;
	box-shadow: 0 0 0.5em 0 rgba(125, 125, 125, 0.75)
}

#footer-up{
	right:1em;
}

#logo-header {
	max-height: 60px;
	margin: 0 1.5em;
}

#nav-burger {
	font-size: 1.5em;
}

#nav-main {
	display: none;
	padding: 0 1em 0 0;
}

#nav-main ul li {
	display: inline;
	margin: 0 .5em;
}

#nav-mobile {
	display: none;
	text-align: center;
}

#nav-mobile-icons span {
	margin: 1em .5em;
}

.nav-mobile-link {
	margin: 1em;
	border: 1px solid lightgray;
	padding: .5em;
	border-radius: 5px;
}

#nav-mobile-categories {
	list-style: none;
	padding:0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.nav-img {
	width: 120px;
	margin: 2em 1.5em;
}

.nav-img img {
	width: 80px;
}

.header nav {
	white-space:nowrap;
	width:100%;
	-webkit-overflow-scrolling: touch;
	border-top: 1px solid #B60F0F;
}

#nav_aussen {
	height: 7em;
	overflow:hidden;
}

#nav_innen {
	height: 8em;
	overflow:auto;
	overflow-y:hidden;
}

#nav_innen:hover {
	height:7em;
}

#content {
	margin-bottom:4em;
	padding-bottom:2em;
}

footer {
	/*width:92%;
	padding:1%;
	margin: 0 2% 4em 2%;
	border: 1px dotted #7D7D7D;
	text-align:center;
	color: #666;*/
	background: #000;
	padding:1%;
	text-align:center;
	color: #FFF;
	display: flex;
	justify-content: space-around;
	align-items: center;
	padding-bottom: 3em;
}

footer div {
	padding: 2em;
	flex-basis: 50%;
}

footer p {
	font-size:.8em;
}

footer a {
	color: #FFF;
	text-decoration: underline;
}

.icon-sm {
	width: 28px;
	margin: .5em;
}
.smbuttons { display:inline-block;}
.smbuttons a {
	display: block;
	float: left;
	width:48px;
	height:48px;
	margin-left:1em;
	background-image: url(../images/sprite-sm-48.png);
	background-repeat: no-repeat;
	text-indent:-9999px;
}

.sm_button {
	display: inline-block;
	width:48px;
	height:48px;
	margin-left:1em;
	background-image: url(../images/sprite-sm-48.png);
	background-repeat: no-repeat;
	text-indent:-9999px;
}

.sm_facebook {
	background-position: -26px -14px;
}

.sm_googleplus {
	background-position: -26px -93px;
}

.sm_twitter {
	background-position: -26px -330px;
}

.sm_instagram {
	background-position: -26px -172px;
}

.sm_youtube {
	background-position: -26px -409px;
}

.sm_snapchat {
	background-position: -26px -488px;
}

.footer {
	position: fixed;
	bottom: 0;
	width:100%;
	background: #F6F6F7;
	height: 4em;
	font-size: 0.8em;
}

.footer li {
	list-style:none;
	width:32%;
	padding:0.4em 0 0 0;
	
	border-right: 1px solid #999;
	display:inline-block;
	text-align:center;
}

.footer li:last-child {
	border-right: none;
}


.footer li a {
	color: #333;
	text-decoration: none;
	text-align:center;
}

.footer li a:hover {
	color: #B60F0F;
}

.footer p {
	margin:0;
	padding:0;
}

.clear {
	clear: both;
}

/*ENDE GRUNDGERÜST*/

/*NAVI*/

#nav_forward { margin-top:-9999px;}

#header_menu {
	display:block;
	position:absolute;
	right:1em;
	top:10px;
	width:24px;
	padding: 2% 3%;
	cursor:pointer;
}

#header_menu a {
	color: #B60F0F;
}

#navMain {
	display:none;
	list-style: none;
	padding:2%;
	width:95%;
}

#navMain li a {
	background:#FF9;
	display:block;
	padding: 3% 0 3% 0;
	margin-bottom:2%;
	text-decoration:none;
	text-align:center;
	font-weight: bold;
	
	border-radius: 2px 2px 2px 2px;
	-moz-border-radius: 2px 2px 2px 2px;
	-webkit-border-radius: 2px 2px 2px 2px;
	border: 1px solid #F00;
}

#navMain_kat {
	list-style: none;
	width: 80%;
}

#navMain_kat li a {
	background: #F00;
	color: #FF9;
}

#nav_kat, #nav_kat_img, #nav_aussen, #nav_innen {
	display: none;
}


/*ENDE NAVI*/

/* Abfragebox */

#abfragebox_hintergrund {
	background-color: #000;
	background:rgba(0,0,0,.8);
	height: 100%;
	width: 100%;
	margin-top: 0;
	padding-top: 0;
	position: fixed;
	z-index: 1;
	display: flex;
	justify-content: center;
	align-items: center;
}

#abfragebox {
	color: #333;
	background-color: #FFF;
	width: 90%;
	max-width: 600px;
	height: auto;
	min-height:12em;
	max-height: 70%;
	left: 5%;
	top: 25%;
	padding:0;
	border: 1px solid #000;
	border-radius: 10px;
}

#abfragebox .vorbestellen {
	top: 5%;
	background: yellow;
}

#abfragebox_content {
	float: left;
	width: 94%;
	height: 70%;
	padding: 2%;
	overflow: auto;
}

#abfragebox h1 {
	font-size: 1.2em;
	padding: .5em 0;
	margin: 0;
	background: #ffeedf;
	border-top-right-radius: 10px;
	border-top-left-radius: 10px;
	border-bottom: 1px solid #e8d7c8;
	text-align: center;
}

#abfragebox .plzbutton {
	border: 0;
	background-color: transparent;
	cursor: pointer;
	font-size: 100%;
	color: #333;
	padding-left: 20px;
}

#plz_auswahl, #plz_select {
	width: 80%;
	text-align:center;
}

#abfragebox .button {
	display:inline;
	float:left;
}

#abfragebox img {
	max-width:15%;
	margin-top:1em;
}

#abfragebox p {
	width: 96%;
	padding: 0 2%;
	text-align: center;
}

/* PLZ neue Abfrage */
.liefer-gebiet-auswahl {
	display: flex;
	flex-wrap: wrap;
	width: 96%;
	justify-content: space-around;
	padding: 2%;
}

.plz-button {
	text-align: center;
	width: 45%;
}

.plz-button label {
	display: block;
	border: 1px solid #d3c3c3;
	border-radius: 15px;
	padding: 2em;
	cursor: pointer;
}

.plz-button-btn {
	flex-basis: 100%;
	margin: 2em 2%;
}

.plz-auswahl {
	display: none;
}

.plz-auswahl:checked + label {
	background: rgb(255, 228, 204);
	box-shadow: 6px 6px 10px hsla(300, 17.6%, 66.7%, 0.3) inset;
}

.plz-form {
	width: 96%;
	padding: 1%;
	margin: 2%;
}

.plz-icon {
	max-height: 5em;
	max-width: 5em;
}
/* Abfragebox Ende */

/*KATEGORIEN*/
.kat {
	padding-bottom: 3%;
	margin-bottom: 2%;
	min-height: 3em;
	border-top: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	float: left;
	width:100%;
}

.kat_titel {
	position: absolute;
	font-size: 1.2em;
	color: #000;
	padding: 4% 4%;
	margin: 1% 0 0 4%;
}

.katbild, .pr_katbild {
	min-height: 5em;
	margin:0 0 0.3em 0;
	padding:0;
	display: inline-block;
	max-width:100%;
}

.kat_bildtitel, .pr_kat_bildtitel {
	position: absolute;
	margin: 15% 0 0 5%;
	padding: 2% 4%;
	background: #FFF;
	opacity: 0.9;
	border-radius: 5%;
	font-size: 1.2em;
	color: #000;

}

.kat_bildtitel p {
	font-size: 0.6em;
	padding:0;
	margin:0;
}

.kat_freitext {
	background: var(--el-bg);
	border-bottom: 1px solid #999;
	margin: -0.3em 0 0 0;
	padding:0.5em;
}

.kat_beschreibung {
	padding: 2em;
	font-style: italic;
	line-height: 1.5em;
	font-weight: lighter;
}
/*ENDE KATEGORIEN*/


/*PRODUKTLISTE*/
.produkt {
	border-bottom: 1px solid #CCC;
	padding: 1em 0.5em;
}

.produktbild {
	width: 100%;
	max-width: 360px;
	text-align:center;
	margin-bottom: 1em;
	background: rgba(255,255,255,1);
	background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(237,237,237,1)));
	background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=0 );
}

.produktname, .menue_produktname {
	font-size:1em;
	font-weight: bold;
	margin-bottom: 0.3em;
	margin-top: 0.3em;
	display: inline-block;
}

.zusatzstoffe_deklaration p {
	display: inline-block;
	background:#FFFF76;
	padding:0.5em;
	font-size:0.8em;
	line-height:1.2em;
}

.zutaten_zusatzstoffe {
	font-size: 0.8em;
}

.produktbezeichnung {
	font-size:0.8em;
	margin:0 auto;
}

.produktpreise {
	float: right;
	width: 100%;
}

.produktpreisbox {
	float: left;
	margin: 2% 4% 2% 0;
	width: 25%;
	border: 1px solid #999;
	background: var(--el-bg);
}

.produktpreisbox:hover,
.produktpreisbox:active {
	background: #FF9;
}

.produktpreisbox .preiskategorie,
.produktpreisbox .grundpreis {
	text-align: center;
	padding-bottom: 0.8em;
	border-bottom: 1px solid #CCC;
	margin: 0;
	padding: 0.5em;
	font-size: 0.8em;
}
.produktpreisbox .grundpreis {
	font-size: 0.7em;
}
.produktpreisbox .preis {
	font-weight: bold;
	text-align: center;
	margin: 0;
	padding: 0.5em;
}

.streichpreis {
	font-size: 0.8em;
	-webkit-text-decoration-line: line-through;
	text-decoration: line-through;
}

/*ENDE PRODUKTLISTE*/

/*PRODUKT*/
.produkt_auswahl {
	background:#FFF;
	float: left;
	width: 92%;
	margin: 1em 3% 4em 3%;
	padding:0.5em;
}

.produkt_auswahlbox {
	float: left;
	background: #FF9;
	width: 92%;
	padding: 0 2% 2% 2%;
	margin-bottom: 1em;
}

#pr_anzahl {
	width:4em;
	margin-right:0.5em;
}

.produkt_btn_abbr {
	color: red;
	width: 2em;
	height: 2em;
	float: right;
	padding:0.2em;
}

.produkt_btn_ok, .btn_ok, .menue_btn_ok {
	color: green;
	width: 2em;
	height: 2em;
	float: right;
	margin: 0 1.5em 1em 1em;
	padding:0.2em;
}

.produkt_btn_abbr:hover,
.produkt_btn_abbr:active,
.produkt_btn_ok:hover {
	font-size:120%;
	padding:0;
}

.produkt_extras, .produkt_sorte, .produkt_sonderwunsch, .produkt_preis {
	font-size: 0.8em;
}

.sortenauswahl {
	font-size: 0.8em;
}

.zutatenlink {
	text-decoration: none;
	display: block;
	margin-bottom: 1.5em;
	font-size: 0.8em;
}

.zutatenlink:hover { font-weight: bold; }
.zutat_ausgewaehlt { font-weight: bold; font-style: italic; font-size:0.9em;}

#sonderwunschfeld { width:100%; height:5em;}

#kennz_inhalt { font-size: 0.8em; }
/*ENDE PRODUKT*/

/* SYMBOLE */
.symbol_vegetarisch {
	background: url('../images/sprite_symbole.png') no-repeat -6px -4px;
	width: 27px;
	height: 28px;
	display: inline-block;
}

.symbol_vegan {
	background: url('../images/sprite_symbole.png') no-repeat -52px -4px;
	width: 27px;
	height: 28px;
	display: inline-block;
}

.symbol_halal {
	background: url('../images/sprite_symbole.png') no-repeat -6px -41px;
	width: 27px;
	height: 28px;
	display: inline-block;
}

.symbol_koscher {
	background: url('../images/sprite_symbole.png') no-repeat -52px -41px;
	width: 27px;
	height: 28px;
	display: inline-block;
}

.symbol_neu {
	background: url('../images/sprite_symbole.png') no-repeat -7px -79px;
	width: 27px;
	height: 28px;
	display: inline-block;
}

.symbol_tipp {
	background: url('../images/sprite_symbole.png') no-repeat -52px -79px;
	width: 27px;
	height: 28px;
	display: inline-block;
}

.symbol_scharf {
	background: url('../images/sprite_symbole.png') no-repeat -7px -114px;
	width: 27px;
	height: 28px;
	display: inline-block;
}

.symbole_legende {
	margin-left: 2%;
}

/* ENDE SYMBOLE */

/* MENÜ */
.menue_titel {
	margin: 1em auto 0 2%;
	width:80%;
}
/*Ende Menü*/

/*Warenkorb*/
.warenkorb_box, .content_box, .content_app {
	background: #FFC;
	width: 90%;
	padding: 2%;
	margin: 0.5em 3% 1em 3%;
	font-size: 0.8em;
	line-height:1.5em;
}

.warenkorb_auswahl {
    padding: 0.5em;
    font-size: 1em;
	line-height:1.5em;
    border: #929292 2px solid;
}

.warenkorb_box:last-of-type,
.content_box:last-of-type,
.menue_speichern  {
	margin-bottom: 4em;
}

.warenkorb_button {
	background: #FF9;
	color: red;
	border: 1px solid red;
}

.tbl-warenkorb {
	width: 100%;
}

.tbl-warenkorb td {
	line-height: 1.4em;
}

.tbl-wk-inhalt {
	width: 85%;
}

.tbl-wk-preis {
	width: 15%;
	text-align: right;
	white-space: nowrap;
}

.tbl-kennzeichnung {
    margin-top: 2em;
    line-height: 1.4em;
}

.tbl-kennzeichnung td {
    padding: 0 1em 0 0;
    vertical-align: top;
}

.tbl-kennzeichnung .wert {
    text-align: right;
}

.bestell_button {
	float:right;
	width:90%;
	margin-right:5%;
	/*margin-top:-3em;*/
}

#paypal-buttons {
	/*display: flex;
	justify-content: center;*/
	font-size: 1em;
	text-align: center;
}

#paypal-button-container {
	max-width: 50%;
	margin: auto;
}

#loading {
	position: fixed;
	opacity: 0.5;
	top: 0;
	left: 0;width: 100%;
	height: 100%;
	z-index: 9999;
	background: grey;
	display: none;
}

.loader {
	border: 16px solid #f3f3f3;
	border-radius: 50%;
	border-top: 16px solid #3498db;
	width: 120px;
	height: 120px;
	-webkit-animation: spin 2s linear infinite; /* Safari */
	animation: spin 2s linear infinite;
	margin: 40%;
}
/* Safari */
@-webkit-keyframes spin {
	0% { -webkit-transform: rotate(0deg); }
	100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}
/*Ende Warenkorb*/

/*Bestellformular*/
.bestellformular {
	padding:2%;
}

fieldset {
    padding: 1em;
}

.legend_bestform {
    margin: 0 auto;
    text-align: center;
    padding:0.7em;
    border: 1px solid #c2c2c2;
    border-radius: 0.7em;
    font-weight: bold;
}

.textfeld label {
	float: left;
	width: 90%;
	margin-top: 1em;
}

.textfeld input, .textfeld textarea, #sonderwunschfeld, #gutscheincode {
	width: 90%;
	border-radius:5px;
	background: #F2F2F2;
	border: 1px solid #DADADA;
	line-height:1.5em;
	padding:0.5em;
	margin:0.2em 0 0.5em 0;
}

#gutscheincode { width: 50%;}

.textfeld textarea {
	width: 90%;
	height: 4em;	
}

.checkbox {
	margin-top:1em;
}

/*Ende Bestellformular*/

/* Bestellung Bestätigung */
#pp_best_text { display: none;}
/* Ende Bestellung Bestätigung */

/*Login*/
.daten_laden {
	border: 1px solid #FC6;
	padding: 0 1em 1em 1em;
}
/*Ende Login*/


/* App */
.content_app { border-bottom: 1px solid #E2E2E2; min-height: 10em;
		background-image: url(../images/iphone_oben.png); background-repeat: no-repeat; background-position: right; background-size: contain;
	}
#app_werbung .content_app {margin-bottom: -5em; }
.img_badge { max-width: 45%; float: left; margin-right: 1em; margin-top: 1em;}
.content_app h2 { display: inline-block; padding: 0.3em;}
.content_app p { width: 60%; font-weight: bold; font-size: 1em; line-height: 1.4em; padding: 0.3em;}


/* Ende App */





@media only screen and (min-width: 600px) {
	#header_logo { max-height:4em; }
	#content { padding-top:1em;}
	.katbild, .kat { width:45%; margin: 0.3em 2% 0.3em 2%; }
	.kat { height: 75%; }
	.kat_bildtitel { margin: 10% 0 0 3%; padding: 1% 2%;}
	
	#header_menu { display: none;}
	
	/*Navi Liste*/
	#nav_kat {
		list-style: none;
		display: inline-block;
		font-size:0.9em;
	}

	#nav_kat li {
		float: left;
		margin: 0 2em 1em 0;
		padding: 0.3em 0.3em 0.3em 0.5em;
		width: 17%;
		border-bottom: 1px solid #CCC;
		border-radius: 5px;
		display: block;
	}

	#nav_kat li:hover {
		background: #FFFF99;
	}
	/*Ende Navi LIste*/
	
	/*Navi Bilder*/
	#nav_aussen, #nav_innen { display:block;}
	#nav_kat_img {
		list-style: none;
		display:-webkit-inline-flex;
		display:inline-flex;
	}
	
	#nav_kat_img li {
		float: left;
		margin-right: 2em;
		text-align: center;
	}
	
	#nav_kat_img a {
		color: #666;
		text-decoration:none;
	}
	
	#nav_kat_img a:hover {
		color: #B60F0F;
	}
	

	#nav_kat_img li img {
		max-width:80px;
		-webkit-filter: grayscale(100%); filter: grayscale(100%);
	}
	
	#nav_kat_img li#nav_active {
		border-bottom: 1px solid #CCC;
		padding-bottom:0.5em;
	}
	#nav_kat_img li#nav_active img, 
	#nav_kat_img li:hover img {
		-webkit-filter: grayscale(0%); filter: grayscale(0%);		
	}
	#nav_kat_img li#nav_active {
		color: #B60F0F;
	}

	#nav_kat_img li span {
		display:block;
		text-align:center;
		text-transform:uppercase;
		font-size: 0.9em;
		padding-top:0.5em;
	}
	
	/*Scroll-Buttons*/
	#nav_back, #nav_forward { position: absolute; width:1em; height: 4.5em;background: #000; opacity:0.2; color:#999; padding: 2.5em 0.5em 0 1em; z-index:1000;cursor:pointer;}
	#nav_back:hover, #nav_forward:hover { opacity: 0.7; width:2em;}
	#nav_back {left:0; margin:0;}
	#nav_forward { right: 0; margin:0;}
	
	/*Ende Navi Bilder*/
	
	/*Produkte*/
	.pr_katbild { display:none;}
	.pr_kat_bildtitel { position:relative; margin:0 0 0 1em; background:none; opacity:1; padding:0.5em;text-transform:uppercase;font-size:1.5em;}
	.kat_freitext { padding:0.5em 0.5em 0.5em 2em;}
	
	/*Produkt*/
	.zutatenlink { display: inline-block;width:50%;}
	.produkt_btn_abbr, .produkt_btn_ok, .btn_ok, .menue_btn_ok { font-size:1.5em;}
	.produkt_btn_abbr:hover, .produkt_btn_abbr:active, .produkt_btn_ok:hover {font-size:1.7em;}
	
	/*Menü*/
	h2.titel {margin-left:0;}
	.menue_titel { margin: 1em auto 0 0;}
	
	/*Warenkorb*/
	.titel, .hinweis_info {margin-left: 1em; }
	
	.bestell_button { 	margin-right: 3em; width:auto;}
	.bestellformular { padding:3%;}
	.datenschutzhinweis { margin-left:1em;}
	
	/*App*/
	.img_badge { max-width: 25%; }
	.content_app p { width: 75%; }
}

@media only screen and (min-width: 800px) {
	#nav-burger { display: none; }
	#nav-main { display: unset; }

	.footer {
		position: absolute;
		top:0;
		right:0;
		width:35%;
		margin: 2em 3em 0 0;
		background: none;
		color: #333;
	}
	
    .produktbild { width: 60%; float:left; background: none;}
	.produkt_info {width:35%; float: left; margin:5% 0 0 2em; }
	.produkt_info_allein { width: 80%; float:left; margin: 1em 0 0 2em;}
	.produktname, .menue_produktname { text-transform: uppercase; border-bottom:1px solid #74B168; padding-bottom:0.3em; letter-spacing:2px; display:inline-block;}
	.menue_produktname { border-bottom:none;}
	.produktbezeichnung {padding:0.3em 0;}
	
	.zutatenlink { width:33%;}
	
	.textfeld input { width:45%;}
	.bestellbutton { float: right;}

	.datenschutzhinweis { margin-left:2em;}

	/*App*/
	.img_badge { max-width: 20%; }
}

@media only screen and (min-width: 1000px) {
	.kat_bildtitel { margin: 5% 0 0 2%; }
	.katbild, .kat { width: 29%; margin: 0.3em 2%; }
	.produkt_info {margin-top:4%;}
	.zutatenlink { width:25%;}
	
}

@media only screen and (min-width: 1200px) {
	body { background:url(../images/hg.jpg); background-size:cover; background-attachment:fixed; }
	#container { -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,1); -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,1); box-shadow: 0px 0px 10px 0px rgba(0,0,0,1);}
	.warenkorb_box, .content_box { font-size:0.9em;}
	.produkt_auswahl {	-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,1);	-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,1); box-shadow: 0px 0px 20px 0px rgba(0,0,0,1);}
	footer { border-left:none; border-right: none; border-bottom: none;}
	
	/*App*/
	.img_badge { max-width: 15%; }
}

@media only screen and (min-width: 1300px) {
	.footer {width:30%; right:10%;}
}

@media only screen and (min-width: 1300px) {
	.kat_bildtitel {margin:3.5em 1em; padding:0.5em 0.5em;}
}

@media only screen and (min-width: 1600px) {
	.produkt_info {margin-top:3%;}
	.footer {width:25%; right:15%;}
}

@media only screen and (min-width: 2000px) {
	.footer {right:25%; width:20%;}
}