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

Grün: 			#cba101
Dunkelgrün: 	#9b7b01
Grau: 			#5a5955
Dunkelgrau: 	#373634

*/

/**
 * @license
 * MyFonts Webfont Build ID 2856932, 2014-08-04T02:02:34-0400
 * 
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are 
 * explicitly restricted from using the Licensed Webfonts(s).
 * 
 * You may obtain a valid license at the URLs below.
 * 
 * Webfont: Toronto Gothic by E-phemera
 * URL: http://www.myfonts.com/fonts/ephemera/toronto-gothic/toronto-gothic/
 * Copyright: ©2002 by Andrew Leman. Digitized from vintage copies of the Toronto Star.
 * Licensed pageviews: 10,000
 * 
 * 
 * License: http://www.myfonts.com/viewlicense?type=web&buildid=2856932
 * 
 * © 2014 MyFonts Inc*/
 
 @import url("//hello.myfonts.net/count/2b97e4");




/* @import must be at top of file, otherwise CSS will not work */


@font-face {
	font-family: 'Toronto Gothic';
	src: url('fonts/2B97E4_0_0.eot');
	src: url('fonts/2B97E4_0_0.eot?#iefix') format('embedded-opentype'),
	url('fonts/2B97E4_0_0.woff') format('woff'),
	url('fonts/2B97E4_0_0.ttf') format('truetype');
	}

@font-face {
	font-family: 'Yanone Kaffeesatz';
	font-style: normal;
  	font-weight: 400;
	src: url('fonts/yanonekaffeesatz-regular-webfont.eot');
    src: url('fonts/yanonekaffeesatz-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/yanonekaffeesatz-regular-webfont.woff2') format('woff2'),
         url('fonts/yanonekaffeesatz-regular-webfont.woff') format('woff'),
         url('fonts/yanonekaffeesatz-regular-webfont.ttf') format('truetype');
	}

@font-face {
    font-family: 'Yanone Kaffeesatz';
	font-style: normal;
  	font-weight: 700;
    src: url('fonts/yanonekaffeesatz-bold-webfont.eot');
    src: url('fonts/yanonekaffeesatz-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/yanonekaffeesatz-bold-webfont.woff2') format('woff2'),
         url('fonts/yanonekaffeesatz-bold-webfont.woff') format('woff'),
         url('fonts/yanonekaffeesatz-bold-webfont.ttf') format('truetype');

}

@font-face {
  font-family: 'FontAwesome';
  src: url("fonts/fontawesome-webfont.woff") format("woff");
  font-display: auto;
}

/* Allgemeine Formatierungen (Screen und Print) */



body
	{
	background: #ddd;
	color: #353337;
	font-family: 'Yanone Kaffeesatz', Arial, Helvetica, sans-serif;
	font-size: 1.5em;
	line-height: 1.2em;
	}

header, footer, nav, article, section, aside
	{
	display: block;
	}


h3, p, ul, li, table, dl
	{
	margin: 0 0 1rem;
	padding: 0;
	}


h2, h3
	{
	font-family: "Toronto Gothic", Bebas, Arial, Helvetica, sans-serif;
	font-size: 3.5rem;
	font-weight: 400;
	line-height: 1em;
	margin: 1rem 0 0.15em;
	letter-spacing: 1px;
	}

h3
	{
	font-size: 3.5rem;
	}

h4, h5
	{
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.25em;
	margin: 0 0 0.5em;
	}



p:last-child, ul:last-child
	{
	margin-bottom: 0;
	}

a
	{
	color: #cba101;
	}

a:hover
	{
	color: #cba101;
	text-decoration: none;
	}

img
	{
	border: none;
	}

ul
	{
	margin: 1em 1em 1.5em 1.5em;
	}

li
	{
	margin: 0.7em 0;
	}

figure, figcaption
	{
	margin: 0;
	padding: 0;
	}



html
	{
	height: auto;
	}

.box
	{
	background: #5a5955;
	box-shadow: none !important;
	color: #fff;
	display: inline-block;
	position: relative;
	}

.box:before
	{
	background: #373634;
	content: "";
	display: inline-block;
	height: 100%;
	position: absolute;
	top: 7px;
	left: 10px;
	width: 100%;
	z-index: -1;
	}

.gruen, .button.grau:hover, input[type=submit].grau:hover
	{
	background: #bca914;
	text-shadow: 1px 1px 1px #93840c;
	box-shadow: 5px 5px 0 #93840c;
	}

.grau, .button.gruen:hover, input[type=submit].gruen:hover
	{
	background: #5a5955;
	text-shadow: 1px 1px 1px #373634;
	box-shadow: 5px 5px 0 #373634;
	}

.blau, .button.blau:hover, input[type=submit].blau:hover
	{
	background: #008598;
	text-shadow: 1px 1px 1px #0b4c55;
	box-shadow: 5px 5px 0 #0b4c55;
	}

.rot, .button.rot:hover, input[type=submit].rot:hover
	{
	background: #b40200;
	text-shadow: 1px 1px 1px #790503;
	box-shadow: 5px 5px 0 #790503;
	}


.button.gruen:hover, input[type=submit].gruen:hover
	{
	color: #cba101;
	}


.gruen:before { background: #93840c; }
.gruen object { filter: drop-shadow( 1px 1px 1px #93840c ); }

.blau:before { background: #0b4c55; }
.blau object { filter: drop-shadow( 1px 1px 1px #0b4c55 ); }

.rot:before { background: #790503; }
.rot object { filter: drop-shadow( 1px 1px 1px #790503 ); }


#dunkel, .darkbox
	{
	color: #ccc;
	}

.text-gruen
	 {
	 color: #bca914;
	 }

.text-blau
	 {
	 color: #008598;
	 }

.text-rot
	 {
	 color: #b40200;
	 }

.center
	{
	text-align: center;
	}

.bildlinks
	{
	float: left;
	margin-right: 10px;
	}

.gedreht
	{
	transform: rotate(-5deg);
	margin-left: 5px;
	margin-right: 15px;
	}

article
	{
	position: relative;
	margin-bottom: 2rem;
	overflow: hidden;
	width: 100%;
	height: auto;
	}

h3
	{
	margin: 0 0 1rem;
	}

h3.box, h4.box
	{
	padding: 0.1em 0.5em 0.175em;
	margin-bottom: 1rem;
	margin-left: -1.5rem;
	}





.inner
	{
	padding: 1rem;
	}

.text
	{
	padding: 0.5rem 0.5rem 1rem;
	overflow: hidden;
	}

.text img
	{
	width: auto;
	max-width: 100%;
	}

.sidebox
	{
	float: right;
	width: 26% !important;
	margin-right: 1% !important;
	}

.sidebox h3
	{
	display: block;
	margin: 0.5rem auto 1rem;
	text-align: center;
	}

.box a
	{
	font-weight: 400 !important;
	margin: 0 auto;
	position: relative;
	bottom: -2.0rem;

	}

.button, input[type=submit]
	{
	background: #353337;
	border: none;
	color: #fff;
	display: inline-block;
	font-family: "Toronto Gothic";
	font-size: 2.25rem;
	letter-spacing: 1px;
	line-height: 1.2em;
	padding: 0.125rem 1rem 0.375rem;
	text-decoration: none;
	margin: 1rem auto;
	text-shadow: 2px 2px 1px #000;
	}

.button.dunkelgruen
	{
	background: #93840c;
	text-shadow: 2px 2px 1px #93840C;
	}

.button:before
	{
	content: url(gfx/Pfeil2-Gruen.svg);
	position: relative;
	top: -2px;
	left: -4px;
	margin-right: 0.25rem;
	}

.button.dunkelgruen:before
	{
	content: url(gfx/Pfeil2-Weiss.svg);
	}

.button:hover
	{
	background: #5A5955;
	color: #fff;
	text-shadow: 1px 1px 1px #373634;
	}

.mehr:after
	{
	background: url(gfx/pfeil.svg) no-repeat center right;
	display: inline-block;
	content: "";
	width: 2rem;
	height: 1.5rem;
	filter: drop-shadow( 1px 1px 1px #9b7b01 );
	position: relative;
	right: -0.5rem;
	}

.mehr:hover:after
	{
	filter: drop-shadow( 1px 1px 1px #373634 );
	}



body
	{
	background: #efebe7;
	margin: 0;
	padding: 0;
	height: auto;
	}

.breite
	{
	margin: 0 auto;
	max-width: 62.5rem;
	padding: 0 1.5%;
	position: relative;
	width: 97%;
	}

.hidden
	{
	overflow: hidden;
	}

.breite.spalten
	{
	display: flex;
	}



header
	 {
	 background-color: #fff;
	 background: linear-gradient(#f5f5f4, #fff);
	 box-shadow: 0 4px 4px rgba(0,0,0,0.3);
	 position: relative;
	 overflow: hidden;
	 z-index: 95;		 
	 }

header nav
	{
	background-color: #2e2e2e;
	background: linear-gradient(#2e2e2e, #3b3b3b);
	width: 100%;
	position: fixed;
	z-index: 999;
	border-bottom: solid 1px #555;
	}

#mobilenav
	{
	display: none;
	}

#nav
	{
	display: inline-block;
	margin: 0;
	padding: 0;
	text-align: center;
	width: 100%;
	}

#nav li
	{
	display: inline-block;
	margin: 0;
	padding: 0;
	}
	
#nav li a
	{
	color: #fff;
	display: block;
	font-family: "Toronto Gothic";
	font-size: 1.5rem;
	text-decoration: none;
	line-height: 1em;
	letter-spacing: 1px;
	padding: 0.5em 1rem;
	}


#nav li a.aktiv, #nav li a:hover
	{
	color: #bca914;
	}



#logo
	{
	padding: 70px 0 20px;
	text-align: center;
	width: 100%;
	}

h1
	{	
	display: block;
	margin: 0 auto;

	}

h1 img
	{
	width: 100%;
	max-width: 21.25rem;
	}



#buehne
	{
	background: url(gfx/mauer.jpg) center -3px;
	background-size: auto;
	position: relative;
	z-index: 90;
	height: 360px;
	border-bottom: solid 5px #fff;
	}

#buehne .breite
	{
	height: 100%;
	position: relative;
	padding: 0;
	z-index: -2;
	width: auto;
	background-size: auto 100%;
	background-position: right bottom;
	background-repeat: no-repeat;
	overflow: hidden;
	}


#links
	{
	display: inline-block;
	padding-bottom: 0.5rem;
	vertical-align: top;
	width: 63%;
	}

#buehnenbild
	{
	display: inline-block;
	position: relative;
	vertical-align: bottom;
	width: auto;
	}


h2 .box
	{	
	padding: 0.1em 0.3em 0.17em;
	margin: 0 0 0.25em;
	line-height: 1em;	
	}

h2 .box:nth-child(1)
	{
	margin-top: 30px;
	}

h2 .box:nth-child(2)
	{
	margin-left: 0.65em;
	}

h2 .box:nth-child(3)
	{
	margin-left: 0.35em;
	}

h2 .box:before
	{
	top: 8px;
	left: 12px;
	transform: rotate(-0.7deg);
	}

h2 .box:nth-child(2):before
	{
	top: 10px;
	left: -4px;
	transform: rotate(0.7deg);
	}

h2 .box:nth-child(3):before
	{
	top: 7px;
	left: 11px;
	transform: rotate(0.5deg);
	}

#dunkel .text, .darkbox
	{
	text-shadow: 2px 2px 1px rgba(0,0,0,0.5);
	}

#dunkel
	{
	background: linear-gradient(#2a2a2a, #3d3d3d);
	padding: 0;
	z-index: 5;
	position: relative;
	overflow: hidden;
	}

#dunkel .text
	{
	float: left;
	width: 45%;
	padding: 1rem 4% 1rem 0;
	}

#dunkel .text:nth-child(2)
	{
	border-left: 1px solid #817412;
	padding: 1rem 0 1rem 4%;
	}

#dunkel .text h2
	{
	color: #fff;
	font-size: 2.625rem;
	letter-spacing: 1px;
	margin: 1rem 0 1.75rem;
	}

#dunkel ul, #dunkel li
	{
	line-height: 1em;
	margin: 0;
	padding: 0;
	}

#dunkel li
	{
	clear: left;
	color: #ccc;
	font-size: 1.625rem;
	list-style-type: none;
	margin: 0 0 1.25rem;
	padding: 0 0 0 2rem;
	min-height: 2em;
	}

#dunkel li:before
	{
	content: url(gfx/Pfeil-Gruen.svg);
	float: left;
	margin-right: 1rem;
	margin-left: -2rem;
	margin-top: 2px;
	}

.patch
	{
	border: dashed 3px #888;
	padding: 1rem;
	border-radius: 1rem;
	}

.spalte, .infobox
	{
	background: #fff;
	box-shadow: 0 0 4px #999;
	display: inline-block;
	float: left;
	font-size: 1.5rem;
	line-height: 1em;
	width: 32.3%;
	margin-right: 0.4%;
	padding: 0.3%;
	position: relative;
	z-index: 89;
	text-align: center;
	}

.spalte img
	{
	width: 100%;
	position: relative;
	z-index: -1;
	}

.spalte:last-child
	{
	margin-right: 0;
	}

.spalte .box
	{
	margin: 0;
	top: -4rem;
	}

.spalte .box:before
	{
	transform: rotate(1.25deg);
	left: -3px;
	top: 10px;
	}

.spalte p
	{
	line-height: 1.125em;
	text-align: left;
	padding: 0 0.5rem 0.5rem;
	margin: -2.5rem 0 0;
	}


.infobox
	{
	width: 49%;
	margin: 1rem 0 1rem;
	margin-right: 1%;
	padding: 0;
	}

.infobox h3
	{
	margin-top: -1rem;
	}

.infobox div
	{
	line-height: 1.125em;
	text-align: left;
	padding: 0 1rem 1rem;
	margin: 0;
	}

.normal .box:before
	{
	transform: rotate(-1.25deg);
	left: 10px;
	top: 5px;
	}

.normal
	{
	background: #fff;
	box-shadow: 0 0 5px rgba(0,0,0,0.3);
	margin: 1rem 0;
	position: relative;
	z-index: -10;
	}

.normal h3
	{
	position: absolute;
	top: -0.5rem;
	left: 0;
	}

.normal img
	{
	position: relative;
	z-index: -10;
	max-width: 400px;
	margin-bottom: 0.5rem;
	}

.normal div
	{
	line-height: 1.2em;
	padding-bottom: 0.5rem;
	}

.normal p
	{
	margin-top: 0.5rem;
	}


.holz
	{
	background: url(gfx/holz.jpg) center 0;
	color: #fff;
	padding: 1rem 0 0;
	margin-top: 5px;
	}

.holz h2
	{
	color: #bca914;
	font-size: 4rem;
	margin: 0 0 1rem;
	}

.transpblack
	{
	background: rgba(0,0,0,0.5);
	padding: 1rem 0;
	overflow: hidden;
	}

.einleitung, .einleitung p
	{
	max-width: 900px;
	padding: 0 0 1rem;
	margin: 0 auto;
	text-align: center;
	font-size: 1.875rem;
	line-height: 1.125em;
	font-weight: 700;
	color: #d7d7d7;
	}

.einleitung p
	{
	padding-bottom: 0;
	}

.einleitung
	{
	margin-bottom: 0.75em;
	}

.einleitung.light, .einleitung.light p
	{
	color: #353337;
	}

.geschenkartikel, .geschenkartikel li
	{
	padding: 0;
	margin: 0;
	list-style-type: none;

	}

ul.geschenkartikel
	{
	padding: 0.75rem;
	z-index: -10;
	text-align: center;
	margin-bottom: -2.5rem;
	}

.geschenkartikel li
	{
	display: inline-block;
	margin: 0.75% 1% 2rem;
	position: relative;
	text-align: left;
	width: 31.0%;
	text-align: center;
	vertical-align: top;
	z-index: 1;
	}

.geschenkartikel img
	{
	border: 3px solid #c4af83;
	display: block;
	position: relative;
	float: left;
	z-index: -10;
	max-width: 100%;
	width: auto;
	box-shadow: 0 0 5px #000;
	}

.geschenkartikel li div:before {
    content: "";
		position: absolute;
		top: 3px;
		bottom: 3px;
		left: 3px;
		right: 0;
		z-index: -1;
}


.geschenkartikel li div {
	position: relative;
	max-width: 100%;
	float: left;
	}

.geschenkartikel h4.box
	{
	font-family: "Toronto Gothic";
	font-size: 2.625rem;
	font-weight: 400;
	margin: -5rem 0 0;
	position: relative;
	top: -1rem;
	}

.geschenkartikel h4.box:before
	{
	top: 5px;
	left: 7px;
	}

.geschenkartikel .info span
	{
	display: inline-block;
	margin-right: 6rem;
	}

.geschenkartikel .preis
	{
	text-align: center;
	font-family: "Toronto Gothic";
	font-size: 32px;
	float: none;
	}

.darkbox
	{
	background: linear-gradient(#2a2a2a, #3d3d3d);
	border: solid 4px #5e5e5e;
	width: 49%;
	margin-right: 2%;
	}

.darkbox:nth-child(even)
	{
	margin-right: 0;
	}

.darkbox div
	{
	padding: 0.75rem;
	overflow: hidden;
	}

.darkbox img
	{
	float: left;
	width: 50%;
	margin-right: 0.5rem;
	}

.produkt
	{
	display: inline-block;
	background: linear-gradient(#e9e9e9, #fff);
	color: #333;
	margin: 0 auto 3rem;
	box-shadow: 0 0 5px rgba(0,0,0,0.5);
	position: relative;
	z-index: -1;
	width: 80%;
	vertical-align: top;
	text-align: center;
	border: solid 1px #fff;
	}

.produkt:nth-child(even)
	{
	margin-right: 0;
	}



.produkt .beschreibung
	{
	padding: 0.75rem;
	margin-top: -2.5rem;
	overflow: hidden;
	}

.produkt img
	{
	float: left;
	width: 140px;
	}

.produkt > div > div
	{
	float: left;
	}

.produkt h3
	{
	clear: both;
	top: -2rem;
	}

.produkt p
	{
	text-align: left;
	}

.galerie
	{
	background: #fff;
	padding: 1rem 0;
	text-align: center;
	}

.beschreibung p
	{
	margin-left: 150px;
	}


#specials
	{
	background: url(gfx/papier.jpg);
	border-top: solid 3px #333;
	border-bottom: solid 3px #333;
	padding: 1rem 0;

	}

#specials img
	{
	width: 32%;
	margin-right: 1%;
	vertical-align: middle;
	max-height: 240px;
	}

#deals
	{
	padding-bottom: 1rem;
	overflow: hidden;
	}

.deal
	{
	background: #F6F3E7;
	float: left;
	font-size: 1.5rem;
	width: 32.3%;
	margin-right: 1%;
	
	}

.deal .inner
	{
	overflow: hidden;
	border: solid 3px #373739;
	box-shadow: 4px 4px 0 #373739;
	}

.deal h3
	{
	color: #B40200;
	font-size: 3rem;
	text-align: center;
	}

.deal h3 span
	{
	color: #333;
	font-family: 'Yanone Kaffeesatz', Arial;
	font-size: 1.75rem;
	font-weight: 700;
	line-height: 1.2em;
	display: block;
	}

.deal img
	{
	float: left;
	max-width: 250px;
	width: 55%;
	}

.deal .text
	{
	padding-bottom: 0;
	}

.deal ul
	{
	text-align: right;
	list-style-type: none;
	margin: 0;
	}

.deal ul li
	{
	margin: 0 0 0.25rem;
	}

.deal ul li b
	{
	font-size: 2.0rem;
	padding-left: 0.25rem;
	}



#inh
	{
	margin: 0 auto 1rem;
	overflow: hidden;
	}



aside
	{
	display: inline-block;
	vertical-align: top;
	width: 37.5%;
	}




/* Kontakt */

form
	{
	padding: 1em;
	}

form dl
	{
	overflow: hidden;
	}

form dt
	{
	clear: left;
	float: left;
	padding: 0.25rem 0 1.5rem;
	width: 20%;
	}

form dd
	{
	float: left;
	margin: 0;
	padding: 0;
	width: 79%;
	}

label
	{
	font-weight: 700;
	}

input[type=text], textarea, input[type=file]
	{
	background: #eee;
	border: none;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1rem;
	padding: 0.5rem 1rem;
	width: 90%;
	box-shadow: inset 1px 1px 2px #999;
	border-radius: 5px;
	}

textarea
	{
	width: 90%;
	}

input[type=file]
	{
	padding: 0.25rem;
	width: 97%;
	}

.ce div
	{
	overflow: hidden;
	}

.ausr0
	{
	float: left;
	margin-right: 1rem;
	margin-bottom: 1rem;
	max-width: 50%;
	}

.ausr1
	{
	float: right;
	margin-left: 1rem;
	margin-bottom: 1rem;
	max-width: 50%;
	}

.ausr2
	{
	margin-bottom: 0.25rem;
	width: 100%;
	}

.fehler
	{
	background: url(gfx/dialog-warning.png) no-repeat 3px 2px #fde2c8;
	border: solid 1px #eb8355;
	display: inline-block;
	margin: 0 0 8px;
	padding: 5px 14px 6px 32px;
	line-height: 19px;
	border-radius: 7px;
	}


footer
	{
	background-color: #2e2e2e;
	background: linear-gradient(#2e2e2e, #3b3b3b);
	color: #eee;
	font-size: 1em;
	overflow: hidden;
	margin-top: 1em;
	padding: 0.5em;
	}

footer nav
	{
	display: inline-block;
	}

footer ul
	{
	display: inline-block;
	margin: 0;
	padding: 0;
	}

footer ul li
	{
	display: inline-block;
	margin: 0 1em 0 0;
	}

footer a
	{
	color: #888;
	text-decoration: none;
	}

footer a:hover
	{
	
	}

#copyright
	{
	display: inline-block;
	float: right;
	}


.shop h3
	{
	margin: 1rem 0;
	text-align: center;
	font-family: "Yanone Kaffeesatz";
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1em;
	}

.shop h3 span
	{
	background: #333;
	color: #BCA914;
	display: inline-block;
	border-radius: 50%;
	width: 1em;
	height: 1em;
	padding: 0 0.0675em 0.125em 0.0675em;
	}

.produktauswahl ul, .produktauswahl li
	{
	list-style-type: none;
	padding: 0;
	margin: 0;
	}

.produktauswahl a
	{
	display: block;
	padding: 1rem;
	text-decoration: 0;
	color: #353337;
	-background: #fff;
	border-radius: 1em;
	border: dotted 1px #333;
	-box-shadow: 0 0 4px rgba(0,0,0,0.5);
	}

.produktauswahl a:hover
	{
	background: #333;
	border: solid 1px #333;
	color: #fff;
	}

.produktauswahl li
	{

	display: inline-block;
	text-align: center;
	width: 24%;
	margin-right: 1%;
	margin-bottom: 1em;
	float: left;
	}

.produktauswahl li:hover
	{
	
	}

.produktauswahl li .bild
	{
	height: 140px;
	overflow: hidden;
	}

.produktauswahl li .bild svg
	{
	width: 100%;
	height: 100%;
	}

.produktauswahl a:hover path
	{
	fill: #ffffff;
	}

#gestaltungsflaeche
	{
	background: #fff;
	border: solid 10px #fff;
	position: relative;
	z-index: 96;
	width: 500px;
	height: 500px;
	float: left;
	}


.vorschaubereich
	{	
	display: none;
	width: 500px;
	height: 500px;
	position: absolute;
	z-index: 96;
	}

.produktbild
	{
	background: #fff;
	background-repeat: no-repeat;
	background-position: center;
	width: 100%;
	height: 100%;
	background-size: contain;
	position: relative;
	z-index: 97;
	}

.canvasPosition
	{
	position: absolute;
	}

.canvas-container
	{
	position: relative !important;
	top: 0;
	left: 0;

	}

.shop canvas, .upper-canvas
	{
	border: dashed 1px #555;
	display: block;
	hwidth: 40%;
	hheight: 65%;
	position: absolute;
	z-index: 98;
	left: 30.5%;
	top: 16%;
	}

.upper-canvas
	{

	}

.lower-canvas
	{

	}

.vorschaubereich.rechts canvas, .vorschaubereich.links canvas
	{
	width: 16%;
	height: 8%;
	left: 42%;
	top: 24%;
	}

#konfiguration
	{
	background: #333;
	color: #fff;
	height: 520px;
	float: left;
	width: 450px;
	}

#konfigurationsoptionen
	{
	padding: 15px;
	clear: both;
	}

.farbauswahl, .farbauswahl li, .textfarbeauswahl, .textfarbeauswahl li
	{
	list-style-type: none;
	margin: 0;
	padding: 0;
	line-height: 1em;
	}

.farbauswahl, .textfarbeauswahl
	{

	padding: 5px;
	margin: 5px 0;
	}

.farbauswahl li, .textfarbeauswahl li
	{
	display: inline-block;
	margin: 0 5px 0 0;
	}

.farbe, .textfarbe
	{
	border-radius: 17px;
	border: solid 2px #fff;
	display: inline-block;
	height: 30px;
	width: 30px;
	box-shadow: 2px 2px 3px rgba(0,0,0,0.5);
	position: relative;
	}

.textfarbe
	{
	border-radius: 0;
	border: 1px solid rgba(255,255,255,0.1);
	display: inline-block;
	height: 30px;
	width: 30px;
	box-shadow: 2px 2px 3px rgba(0,0,0,0.5);

	margin: 1px;
	}

.farbe:hover, .textfarbe:hover
	{
	border-color: transparent;
	}

.textfarbe:hover
	{
	border: solid 2px #fff;
	margin: 0;
	}

.farbauswahl .aktiv, .textfarbeauswahl .aktiv
	{
	border-color: transparent;
	border-radius: 3px;
	}

.farbauswahl .aktiv:after, .textfarbe .aktiv:after
	{
	content: "";
	color: #fff;
	font-family: "FontAwesome";
	position: absolute;
	top: 3px;
	left: 7px;
	font-size: 16px;
	text-shadow: 0 0 4px rgba(0,0,0,0.6);
	}

.shop dt
	{
	font-weight: 700;
	padding: 0;
	margin: 5px 0;
	}

.shop dd
	{
	color: #333;
	padding: 0;
	margin: 0;
	border-radius: 5px;
	}

.auswahlfeld
	{
	background: #fff;
	display: block;
	padding: 5px;
	border-radius: 5px;
	}

#ansichten
	{
	overflow: hidden;
	width: 100%;
	}

#ansichten a
	{
	display: inline-block;
	background: #444;
	color: #fff;
	margin-right: 1px;
	padding: 20px;
	float: left;
	text-decoration: none;
	width: auto;
	text-transform: uppercase;
	}

#ansichten a.aktiv, #konfigurationsbereiche a.aktiv
	{
	color: #BCA914;
	}

#konfigurationsbereiche a
	{
	display: inline-block;
	background: #444;
	color: #fff;
	margin-right: 1px;
	padding: 20px;
	float: left;
	text-decoration: none;
	width: auto;
	}

.funktionen
	{
	position: absolute;
	top: 5px;
	left: 5px;
	width: 40px;
	z-index: 99;
	}

.funktionen a
	{
	background: #333;
	border-radius: 5px;
	font-family: "FontAwesome";
	display: inline-block;
	padding: 5px 0;
	margin-bottom: 5px;
	text-align: center;
	text-decoration: none;
	text-shadow: 1px 1px 1px #000;
	width: 40px;
	}

.bildHinzufuegen, .textHinzufuegen
	{
	background: #333;
	padding: 10px;
	color: #fff;
	display: none;
	position: absolute;
	width: 320px;
	top: 0;
	left: 45px;
	}

.bildHinzufuegen input
	{
	color: #333;
	}

.bildHinzufuegen a
	{
	display: inline-block;
	cursor: pointer;
	position: absolute;
	top: 3px;
	right: 3px;
	}




@media screen and (max-width: 940px) {

#slogan
	{
	display: none;
	}

h1
	{
	margin-top: 0.25em;
	transform: none;
	}

#nav li
	{
	}

h2
	{
	font-size: 6vw;
	}

#status
	{
	font-size: 1.7vw;
	right: 25vw;
	}

#band
	{
	text-align: center;
	}

#band .box
	{
	width: 43%;
	text-align: left;
	}

#specials .special
	{
	border: 0.5vw solid #20201e;
	box-shadow: 0.5vw 0.5vw 0 #20201e;
	}

#specials .kleingedrucktes
	{
	margin-top: 1rem !important;
	}

}


@media screen and (max-width: 860px) {

.breite.spalten
	{
	display: block;
	}

.breite.spalten .darkbox
	{
	width: 100%;
	margin: 0 0 0.5em;
	}

#nav li a
	{
	padding: 0.5rem 0.75rem;
	}

#inhlinks
	{
	margin-right: 0;
	width: 100%;
	}

aside
	{
	width: 100%;
	}

h3.box
	{
	font-size: 5.5vw;
	}

.preisliste
	{
	width: 18rem;
	}

.kopflinks
	{
	width: 38%; 
	}

.kopfrechts
	{
	width: 61%; 
	}

h2
	{
	font-size: 3.25rem;
	}

#status
	{
	padding: 0.5rem;
	}

.geschenkartikel li
	{
	width: 33.0%;
	margin-left: 8%;
	margin-right: 8%;
	}

}

@media screen and (max-width: 680px) {

#buehne .breite, #buehne
{
height: auto;

}

#rechts
	{
	display: none;
	}

#nav li
	{

	}
	
#nav li a
	{

	}



#links
	{
	width: 100%;
	}

h2
	{
	font-size: 9.5vw;
	}

h3.box
	{
	font-size: 7.5vw;
	}

#dunkel .text, #dunkel .text:nth-child(2)
	{
	border-left: none;
	float: none;
	margin: 0;
	width: 96%;
	padding: 0 2%;
	}

#band .box
	{
	width: 95%;
	}

.textbox p
	{
	font-size: 0.916rem;
	padding: 0.5rem;
	}

.textbox object
	{
	margin-top: 0.5rem;
	margin-left: 1rem;
	}

article
	{
	padding: 0.5rem;
	position: relative;
	}

.sidebox
	{
	width: auto !important;
	margin-right: 0 !important;
	margin-bottom: 2rem; 
	float: none;
	}

.auswahl
	{
	width: 39%;
	}

.deal
	{
	width: 60%;
	}

.dealbox img
	{
	width: 100%;
	}

#specials .special, #specials > div
	{
	display: block;
	float: none;
	width: 95%;
	margin: 0 auto 1rem;
	max-width: 300px;
	}

#specials img
	{
	width: 100% !important;
	
	}

#specials .zusatz
	{
	display: none;
	}

#upgrades div.upgrade
	{
	display: inline-block;
	width: 90%;
	padding: 4% 0;
	border-bottom: solid 3px #F6F3E8;
	border-right: none;
	}

#upgrades p
	{
	width: 95%;
	}

.kopflinks
	{
	width: 36%; 
	}

.kopfrechts
	{
	display: block;
	width: 90%; 
	}

.einleitung
	{
	padding-top: 1rem;
	}

.geschenkartikel li
	{
	width: 300px;
	}

.geschenkartikel li h4
	{
	font-size: 5vw;
	}

.preisliste
	{
	float: none;
	margin-bottom: 1.5rem;
	width: 18rem;
	}

}


@media screen and (max-width: 580px) {

#mobilenav
	{
	background: #3A3A3A;
	display: block;
	margin: 0;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	overflow: hidden;
	z-index: 100;
	}

#mobilenav ul, #mobilenav li
	{
	margin: 0;
	padding: 0;
	text-align: right;
	}

#mobilenav li a
	{
	display: inline-block;
	padding: 0.5rem;
	font-size: 24px;
	text-decoration: none;
	}

header nav, #nav
	{
	display: block;
	width: 100%;
	float: none;
	}

#nav
	{
	background: #3A3A3A;
	text-align: left;
	display: none;
	}

#nav ul
	{
	margin: 0;
	padding: 0;
	}

#nav li
	{
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	}
	
#nav li a
	{
	border-top: solid 1px #555;
	padding: 0.75rem 1rem;
	}

#nav img
	{
	margin-bottom: 2.5vw;
	}

.fa
	{
	color: #fff;
	font-family: FontAwesome;
	font-size: 24px;
	}

#haupt, #band
	{
	background: #fff;
	}

#deckel
	{
	display: none;
	}

header
	{
	padding: 40px 0 0;
	}

header .breite
	{
	display: block;
	padding: 0;
	width: 100%;
	}

#status
	{
	display: none;
	}

h1
	{
	display: block;
	width: 100%;
	margin: 0;
	float: none;
	text-align: center;
	}

h1 img
	{
	width: 70vw;
	}



h2
	{
	font-size: 2.3rem;
	}

h3.box
	{
	font-size: 11vw;
	}

h4, h5, aside h4
	{
	
	}

article
	{
	box-shadow: none;
	}

.produkt, .spalte, .darkbox, #dunkel .text, .deal, .infobox
	{
	width: 100%;
	margin: 0 0 1rem;
	
	}

.inner
	{
	padding: 0.5rem;
	}

.produkt
	{
	margin-bottom: 3rem;
	}


.produkt img
	{
	float: none;
	width: 80%;
	max-width: 260px;
	margin: 0 auto 1rem;
	}

.produkt .beschreibung p
	{
	margin: 0;
	padding: 0;
	}

.deal .inner
	{
	padding: 0.5rem;
	}

.deal img
	{
	max-width: 50%;
	}

.normal
	{
	text-align: center;
	}

.normal img
	{
	max-width: 100%;
	}

.normal h3
	{
	position: relative;

	}

.normal .text
	{
	margin-top: -3.8rem;
	text-align: left;
	}

footer nav, #copyright
	{
	float: none;
	width: 100%;
	display: block;
	text-align: center;
	}

footer nav li
	{
	display: none;
	}

footer nav li:last-child
	{
	display: inline-block;
	margin-right: 0;
	}
	
footer nav li:nth-last-child(+2)
	{
	display: inline-block;
	}

#copyright
	{
	font-size: 0.75rem;
	}

}