@charset "UTF-8";

html, body { margin:0; padding:0; width:100%; }
html { background-color:#FFFFFF;  height:100%; }
body { min-height:100%; height: auto; }
body, td { font-family:arial, sans-serif; font-size-adjust:0.46; color:#000000; font-size:0.9em; font-weight:100; line-height:1.5em; }

header, footer, nav { display:block; }
header { margin-top:40px; margin-left:4%; }

#logo_rechts { float:right; max-width:50%; margin-right:13%; }
#logo { clear:both; max-width:20%; min-width:200px; float:left; margin-bottom:10px; }
#logo .bild { margin-right:30px; }

#wundertuete { clear:both; width:14%;float:left; margin-top:-20px;padding:3% }
#slider { max-width:80%; float:right;  }
.flexslider { border:none; float:right; }
ul.slides { border-top:4px solid #BB9632; }

nav { clear:both; margin-top:-1px; min-height:32px; margin-left:4%; width:96%; background-color:#E1CEA3; }
.nav { padding-top:5px; text-align:center; font-size: 1.1vw; display: block; float:left; }
#nav_left { width:20%; float:left; min-width:200px; min-height:32px; background-color:#BB9632; }
#nav_left .nav { width:30%; position:relative; }
#nav_right { float:left; background-color:#E1CEA3; }
#nav_right .nav { min-width:7.4em; }
.long { width:12.5em; }
.nav .bild { width:50px; margin:0px auto; }
.nav .bild img { position:absolute; left:10px; bottom:40px; border:2px dotted #FFFFFF; }
a.nav:hover img { border:2px dotted #BB9632; }


#content { clear:both; margin-left:4%; width:95%; padding:0; font-size:1em; font-weight:300; line-height:1.25em; }
.content { font-size:1.3em; line-height:1.4em; }

#shop_left { width:41%; float:left; }
#shop_right {width:59%; float:right; }

#slogan { padding-left:20px; }
#slogan_shop { padding-left:65px; }

#main { clear:both; margin-left:20%; width:70%; font-size:1.4em; line-height:1.4em; }

#shop_bild { clear:both; margin:0 2% 0 22%; width:24%; float:left; font-size:1.2em; font-style:italic; }
.shop_bild { width:90%; display: inline-block; }
.shop_bild img { width:100%; border:2px solid #BB9632;}
#main_shop { float:left; width:40%; font-size:1.4em; line-height:1.4em}

#shop  { width:75%; float:left; margin-top:43px }
#nav_shop { margin:10px 10px 20px; padding-top:5px; display: inline-block; min-height:40px; width:95%; background-color:#BB9632; }
#nav_shop .nav { min-width:5.5em; font-size:1.37em; color:#FFFFFF; }
.lang { width:7.7em; }

.artikel { margin:8px; padding:0; width:21%; max-width:21%; display: inline-block; border:2px solid #BB9632; overflow:hidden; }
.artikel img { margin-bottom:-4px; width:100%; }
#warenkorb  { margin-top:50px; width:25%; float:left; }
.warenkorb  { margin:5px; padding:10px; background-color:#E1CEA3; min-height:350px; }
.warenkorb_head { background-color:#BB9632; }
.artikel_bild { float:left; width:152px; height:114px; margin-right:20px; padding:0px; overflow:hidden; border:2px solid #BB9632; }
.artikel_bild img, .bild_button { display: block; margin:0px auto; height:114px; }
.artikel_text { padding:5px; }
.artikel_bez { font-weight:bold; height:2.8em; overflow:hidden; }

#footer { clear:both; margin:0; width:100%; background-color:#BB9632; }
#footer_links { width:90%; height:1.6em; margin:0px 60px; }
#footer_links .nav { color:#000000; padding-top:0; display:inline-block; text-align:center; min-width:5.5em; color:#FFFFFF; }

a, a:link, a:visited { text-decoration:none; color:#000; }

a:hover, a.active, .bold {  font-weight:bold; }

a img {  border:0; }

header img { max-width:100%; vertical-align:top; }

ol, ul {list-style: none; }

h1 { font-size:4em; font-weight:300; line-height:1.25em;}

h2 {  color:#000; font-style:italic; }

.underline, .u { text-decoration:underline; }

p { margin:0 0 1em; }

td { padding:3px 12px; font-size:1.1em; font-weight:100; line-height:1.2em; }
#main td { padding:3px 12px; font-size:0.8em; font-weight:800; line-height:0.8em; }

.slides {margin:0; padding:0; list-style:none; }
.flexslider {margin:0; padding:0; }
.flexslider .slides > li {display:none; -webkit-backface-visibility:hidden; }
.flexslider .slides img {width:100%; display:block; }
.slides:after {content:"\0020"; display:block; clear:both; visibility:hidden; line-height:0; height:0; }
html[xmlns] .slides {display:block; }
* html .slides {height:1%; }
.no-js .slides > li:first-child {display:block; }
.flexslider { margin:0; position:relative; zoom:1; }
.flex-viewport { max-height:2000px; -webkit-transition:all 1s ease; -moz-transition:all 1s ease; -o-transition:all 1s ease; transition:all 1s ease; }
.loading .flex-viewport { max-height:300px; }
.flexslider .slides { zoom:1; }


#mobileMenu{position:fixed;top:0px;left:0px;width:100%;background-color:#FFFFFF;}
#mobileMenu, #news_mobile, .only_mob, a.only_mob{display:none}
#nojs #mobileMenu{position:relative;width:100%;display:none}
.toggleMobile{display:none}


@media all and (max-width: 1500px) {
#shop_left { width:38%}
#shop_right {width:62%}
#nav_shop { margin:10px; padding-top:5px; text-align:center; display: inline-block;
        min-height:40px; width:95%;  }
#nav_shop .nav { min-width:5.3em; font-size:1.2em; text-align:center; color:#FFFFFF;}
h1 { margin-top:48px; font-size:3em; font-weight:300; line-height:1em; }
p {font-size:0.95em; line-height:1.2em; padding-left:16px;}
#shop { width:95%}
}

@media all and (max-width: 1040px) {
#slider { max-width:79%;  }
#nav_left { width:21%; min-width:150px }
#nav_left .nav { width:30%; position:relative; }
         .nav { font-size: 1.3vw; }
#shop_left { width:100%; float:left; }
#shop_right {width:100%; float:right;  }
}

@media all and (max-width: 800px) {
#slider { max-width:99%;  }
nav,#logo_rechts,#wundertuete{ display:none; }
#shop_left { width:100%; float:left; }
#shop_right {width:100%; float:right;  }
.mobile_nav{padding:5px; }
.artikel { width:41%; max-width:41%;  }
#warenkorb  { margin-top:10px; width:75%; float:left; }

#mobileMenu ul{ background-color:#C0C0C0;margin:0;padding:0;border:10px solid #BB9632}
#mobileMenu ul li { margin:0px;}
#mobileMenu ul li a{display:block; padding:5px;
color:#000000;letter-spacing:0.1em;text-align:center;text-transform:uppercase;font-weight:bold;font-size:0.8rem;
border-bottom:1px solid #D54C46;transition:.1s ease-out;white-space:nowrap}
#mobileMenu ul li a.aktiv{background-color:#D0D0D0; }
#mobileMenu ul li a.sub{background-color:#E0E0E0;padding:3px 0px;font-weight:normal;border-bottom:1px dotted #D54C46; }
#mobileMenu ul li a:hover, #mobileMenu ul li a.aktiv{color:#E56038;box-shadow:0 8px 16px 0 rgba(0,0,0,0.2)}
@keyframes stylie-transform-keyframes{0%{transform:translateX(30px) translateY(46px) rotate(0deg) translate(-50%, -50%);animation-timing-function:cubic-bezier(0.4, 0.0, 0.5, 1.0)}
100%{transform:translateX(260px) translateY(-150px) rotate(0deg) translate(-50%, -50%)}}
@keyframes stylie-transform2-keyframes{0%{transform:translateX(40px) translateY(40px) rotate(0deg) translate(-50%, -50%);animation-timing-function:cubic-bezier(0.4, 0.0, 0.5, 1.0)}
100%{transform:translateX(50px) translateY(40px) rotate(0deg) translate(-50%, -50%)}}
ul.nav{list-style:none}
#js #mobileMenu{display:block;z-index:99}
#nojs #mobileMenu{display:block}

#js .toggleMobile {position:fixed;top:10px;right:20px;display:block;width:30px;height:30px;cursor:pointer;z-index:999}
.toggleMobile span.menu1,.toggleMobile span.menu2,.toggleMobile span.menu3{
display:block;position:absolute;width:30px;height:8px;left:0;background:rgba(187, 150, 50, 1);-webkit-transition:all 0.35s cubic-bezier(0.4, 0.0, 0.5, 1.0);
transition:all 0.35s cubic-bezier(0.4, 0.0, 0.5, 1.0)}
.toggleMobile span.menu1{top:0}
.toggleMobile span.menu2{top:12px}
.toggleMobile span.menu3{top:24px}
.toggleMobile.active span.menu1{top:12px;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);-webkit-transition:all 0.35s cubic-bezier(0.4, 0.0, 0.5, 1.0);transition:all 0.5s cubic-bezier(0.4, 0.0, 0.5, 1.0)}
.toggleMobile.active span.menu2{-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transition:all 0.35s cubic-bezier(0.4, 0.0, 0.5, 1.0);transition:all 0.5s cubic-bezier(0.4, 0.0, 0.5, 1.0)}
.toggleMobile.active span.menu3{opacity:0;-webkit-transition:opacity 0.35s cubic-bezier(0.4, 0.0, 0.5, 1.0);transition:opacity 0.35s cubic-bezier(0.4, 0.0, 0.5, 1.0)}
#footer .datensatz{margin-bottom:0px}
#footer_links .nav, #footer_links .nav:hover{font-weight:300;font-size:14px}
}