
/* font */

@import url(https://fonts.googleapis.com/css?family=Muli);
@import url(https://fonts.googleapis.com/css?family=Indie+Flower);
body, h5, h6, p, div, a, li, input, textarea, #main .mainoeffnungszeiten h3 {
	font-family:"Muli", sans-serif;
	}

h1, h2, h3, h4, .logo span, .stickylogo a {
	font-family: 'Indie Flower', cursive;
	}
h2, h3, h4 {
	font-size:24px;
	}
a, li, p, div, input, textarea, #navi li.stickylogo a, h5 {
	font-size:16px;
	}
#header ul li, #header ul li a, #navi a, #main figcaption, #image figcaption {
	font-size:12px;
	}

/* html5 */

header, nav, section, aside, main, article, figure, figcaption, footer, address {
	display: block;
	}

/* page */

* {
	box-sizing:border-box;
	margin:0;
	padding:0;
	}
body {
	font-size:100.1%;
	unicode-bidi:bidi-override;
	direction:ltr;
	background-color:#FFFFFF;
	}
h6 {
	position:absolute;
	left:-99999px;
	font-size:0;
	}
.clear {
	font-size:0;
	height:0;
	overflow:hidden;
	clear:both;
	}
#header div, #content section, #footer #info {
	width:96%;
	max-width:1280px;
	margin:auto;
}
#load {
	display:block;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	overflow:hidden;
	background-color:#FFFFFF;
	z-index:1000;
	}
.cur {
	cursor:text;
	}
.button {
	cursor:pointer;
	background:#FFFFFF;
	color:#336699;
	}
.error, aside #form .error {
	padding-top:20px;
	padding-right:20px;
	padding-bottom:20px;
	padding-left:0;
	display:none;
	color:#FF6600;
	}
.hidden, aside #form .hidden {
	display:none;
	}

/* header */

#header {
	background-color:#FFFFFF;
	}
#header div {
	position:relative;
	height:100%;
	}
#header .logo {
	display:block;
	position:absolute;
	left:0;
	text-decoration:none;
	text-align:center;
	font-weight:bold;
	letter-spacing:-0.3px;
	}
#header .logo:link, #header .logo:visited {
	left:0;
	}
#header .logo:hover, #header .logo:focus, #header .logo:active {
	left:0;
	}
.blue {
	color:#336699;
	}
.orange {
	color:#FF6600;
	}
.yellow {
	color:#FFCC00;
	}
.grey {
	color:#666666;
	}
#header .icon {
	position:absolute;
	width:110px;
	}
#header #access {
	left:-30px;
	}
#header #size {
	left:35px;
	}
#header #terminal {
	left:100px;
	}
#header ul li {
	height:0;
	width:100%;
	overflow:hidden;
	text-align:center;
	list-style-type:none;
	color:#FFFFFF;
	}
#header ul:hover li, #header ul:active li, #header ul:focus li {
	height:70px;
	}
#header ul li.access {
	height:70px;
	}
#header ul:hover li.access, #header ul:active li.access, #header ul:focus li.access {
	height:0;
	}
#header li a {
	display:block;
	white-space:nowrap;
	text-decoration:none;
	color:#FFFFFF;
	}
#header li img {
	width:45px;
	height:45px;
	margin-bottom:-5px;
	border-radius:30px;
	border-style:solid;
	border-width:1px;
	border-color:#666666;
	background-color:#FFFFFF;
	}
#header li:hover img, #header li:active img, #header li:focus img {
	border-color:#336699;
	}
#header li span {
	display:block;
	opacity:0;
	}
#header li:hover span, #header li:active span, #header li:focus span {
	opacity:1.0;
	text-shadow: 0px 0px 3px #000000, 0px 0px 2px #000000, 0px 0px 1px #000000;
	}
#header li, #header li span {
	transition:all 200ms linear;
	}

/* navigation */

.menu {
	position:relative; 
	width:100%;
	margin:auto;
	border-bottom-color:#FFCC00;
	z-index:800;
	}
.stickymenu {
	}
.menu, .stickymenu {
	border-bottom-style:solid;
	border-bottom-width:3px;
	}
.menu div, .stickymenu div {
	position:relative; 
	}
.key {
	position:absolute;
	left:-99999px;
}
#menu {
	position:absolute;
	top:0;
	right:0;
	z-index:810;
	}
#menu li {
	}
#menu li ul {
	display:none;
	top:auto;
	height:auto;
	}
#menu li:hover ul, #menu li:active ul, #menu li:focus ul {
	display:block;
	}
.menu li, .stickymenu li {
	list-style-type:none;
	}
.menu #menu li {
	border-top-left-radius:20px;
	border-top-right-radius:20px;
	}
.stickymenu #menu li, #menu li li {
	border-top-left-radius:0;
	border-top-right-radius:0;
	}
#menu li li {
	float:none;
	width:100%;
	}
#menu li a {
	display:block;
	padding-top:12px;
	padding-bottom:8px;
	text-decoration:none;
	font-weight:bold;
	color:#FFFFFF;
	}
#menu li a:link, #menu li a:visited {
	text-shadow: 0px 0px 2px #000000;
	background-color:transparent;
	color:#FFFFFF;
	}
#menu li a:hover, #menu li a:active, #menu li a:focus {
	text-shadow: 0px 0px 2px #FFFFFF;
	background-color:#FFCC00;
	color:#336699;
	}
#menu li a.cur, #menu li a.cur:link, #menu li a.cur:visited, #menu li a.cur:hover, #menu li a.cur:active, #menu li a.cur:focus {
	color:#FFCC00;
	text-shadow: 0px 0px 2px #000000;
	}
#menu li li a {
	padding-top:6px;
	padding-bottom:4px;
	border-top-left-radius:0;
	border-top-right-radius:0;
	font-weight:normal;
	overflow:hidden;
	}
.domothek, .domothek ul, #menu li.domothek a.cur {
	background-color:#FF6600;
	}
.collection, .collection ul, #menu li.collection a.cur {
	background-color:#336699;
	}
.spare,.spare ul, #menu li.spare a.cur {
	background-color:#666666;
	}
.playground, .playground ul, #menu li.playground a.cur {
	background-color:#FF6600;
	}
.nursery, .nursery ul, #menu li.nursery a.cur {
	background-color:#FF6600;
	}
#navi {
	display:block;
	position:relative;
	top:12px;
	}
#navi li {
	display:inline;
	}
#navi li a {
	display:inline;
	padding-left:5px;
	padding-right:5px;
	text-decoration:none;
	border-right-style:solid;
	border-right-width:1px;
	}
.menu #navi li a:link, .menu #navi li a:visited {
	}
.menu #navi li a:hover, .menu #navi li a:active, .menu #navi li a:focus {
	}
.stickymenu #navi li a {
	}
.stickymenu #navi li a:link, .stickymenu #navi li a:visited {
	}
.stickymenu #navi li a:hover, .stickymenu #navi li a:active, .stickymenu #navi li a:focus {
	}
#navi li:last-child a {
	border-right-style:none;
	}
#navi li.stickylogo a {
	padding-right:10px;
	font-weight:bold;
	border-right-style:none;
	}
#navi strong, #navi span {
	font-weight:normal;
	}

/* image */

#image {
	}
#image figure {
	position:relative;
	}
#image figcaption {
	position:absolute;
	right:20px;
	bottom:20px;
	text-shadow: 0px 0px 3px #000000, 0px 0px 2px #000000, 0px 0px 1px #000000;
	color:#FFFFFF;
	}
#image img {
	width:100%;
	height:auto;
	}

/* content */

#content {
	margin-top:50px;
	margin-bottom:40px;
	background-color:#FFFFFF;
	}
#content section {
	}
#content main, #content aside, #content article {
	vertical-align:top;
	}
#content main {
	}
#content aside {
	}
#content article {
	}
#content article:first-child  {
	}
#content article:last-child  {
	}

/* widget */

#producer {
	position:relative;
	top:8px;
	}
#producer ul {
	position:relative;
	display:block;
	width:100%;
	height:auto;
	border-bottom-left-radius:20px;
	border-bottom-right-radius:20px;
	background-position:0px 20px;
	background-repeat:no-repeat;
	background-image:url(producer.jpg);
	}
#producer li ul {
	display:block;
	position:absolute;
	top:auto;
	left:0;
	background-image:none;
	opacity:0;
	}
#producer li:hover ul, #producer li:active ul, #producer li:focus ul {
	opacity:1;
	}
#producer li {
	float:left;
	width:25%;
	text-align:center;
	list-style-type:none;
	border-top-left-radius:20px;
	border-top-right-radius:20px;
	}
#producer li li {
	float:none;
	width:100%;
	height:100%;
	padding:20px;
	text-align:left;
	border-top-left-radius:0;
	border-top-right-radius:0;
	border-bottom-left-radius:20px;
	border-bottom-right-radius:20px;
	}
#producer li.haba, #producer li.haba li {
	background-color:#888888;
	}
#producer li.haba:hover, #producer li.haba:active, #producer li.haba:focus, #producer li.haba:hover li, #producer li.haba:active li, #producer li.haba:focus li {
	background-color:rgb(255,220,0);
	color:rgb(190,0,25);
	}
#producer li.selecta, #producer li.selecta li {
	background-color:#999999;
	}
#producer li.selecta:hover, #producer li.selecta:active, #producer li.selecta:focus, #producer li.selecta:hover li, #producer li.selecta:active li, #producer li.selecta:focus li {
	background-color:rgb(5,70,150);
	color:rgb(120,150,210);
	}
#producer li.nic, #producer li.nic li {
	background-color:#AAAAAA;
	}
#producer li.nic:hover, #producer li.nic:active, #producer li.nic:focus, #producer li.nic:hover li, #producer li.nic:active li, #producer li.nic:focus li {
	background-color:rgb(0,100,170);
	color:rgb(10,185,165);
	}
#producer li.erzi, #producer li.erzi li {
	background-color:#BBBBBB;
	}
#producer li.erzi:hover, #producer li.erzi:active, #producer li.erzi:focus, #producer li.erzi:hover li, #producer li.erzi:active li, #producer li.erzi:focus li {
	background-color:rgb(245,215,10);
	color:rgb(40,155,60);
	}
#producer li.naef, #producer li.naef li {
	background-color:#CCCCCC;
	}
#producer li.naef:hover, #producer li.naef:active, #producer li.naef:focus, #producer li.naef:hover li, #producer li.naef:active li, #producer li.naef:focus li {
	background-color:rgb(0,0,0);
	color:rgb(255,255,255);
	}
#producer li a {
	position:relative;
	display:block;
	height:47px;
	padding-top:5px;
	text-decoration:none;
	font-weight:bold;
	color:#FFFFFF;
	}
#producer li img {
	width:80%;
	height:auto;
	opacity:0;
	}
#producer li:hover img, #producer li:active img, #producer li:focus img {
	opacity:1;
	}
#producer li span {
	position:absolute;
	top:15px;
	left:0;
	display:block;
	width:100%;
	text-align:center;
	}
#producer li:hover span, #producer li:active span, #producer li:focus span {
	display:none;
	}
aside article.cur {
	display:none;
	}
#form div {
	display:block;
	overflow:hidden;
	position:relative;
	padding-top:11px;
	padding-right:10px;
	padding-bottom:5px;
	padding-left:10px;
	border-radius:20px;
	background-color:#336699;
	color:#FFFFFF;
	transition:all 200ms linear;
	}
#form div:hover, #form div:active, #form div:focus {
	background-color:#FFCC00;
	color:#666666;
	}
#form div p.error {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	padding-top:15px;
	padding-right:0;
	padding-bottom:10px;
	padding-left:0;
	text-align:center;
	font-weight:bold;
	background-color:#336699;
	color:#FFFFFF;
	}
#form p {
	padding-left:5px;
	padding-right:5px;
	}
#form b {
	display:block;
	padding-top:10px;
	padding-bottom:15px;
	}
#form input, #form textarea {
	display:block;
	width:100%;
	padding-top:7px;
	padding-right:10px;
	padding-bottom:5px;
	padding-left:10px;
	border-radius:20px;
	border-style:none;
	border-width:0;
	background-color:#FF6600;
	color:#FFFFFF;
	}
#form input {
	margin-bottom:5px;
	}
#form input:hover, #form input:active, #form input:focus, #form textarea:hover, #form textarea:active, #form textarea:focus {
	background-color:#3366FF;
	}
#form .button {
	cursor:pointer;
	text-align:left;
	}

/* main */

#main {
	color:#555555;
	}
#main h1 {
	color:#FF6600;
	}
#main figure {
	position:relative;
	display:block;
	height:auto;
	}
#main figcaption {
	position:absolute;
	right:20px;
	bottom:20px;
	text-shadow: 0px 0px 3px #000000, 0px 0px 2px #000000, 0px 0px 1px #000000;
	color:#FFFFFF;
	}
#main img {
	width:100%;
	height:auto;
	border-style:solid;
	border-width:1px;
	border-color:#FF6600;
	border-radius:20px;
	}
#main a:link, #main a:visited {
	color:#FF6600;
	text-decoration:none;
	}
#main a:hover, #main a:active, #main a:focus {
	color:#3366FF;
	text-decoration:underline;
	}
#main a:before {
	content:"";
	}
#main a:after {
	content:"";
	}
#main h3 {
	color:#336699;
	}

/* footer */

#footer {
	background-color:#FF6600;
	color:#FFFFFF;
	}
#footer a {
	text-decoration:none;
	}
#footer h5, #footer address {
	display:inline;
	}
#footer section {
	position:relative;
	padding-top:16px;
	padding-bottom:13px;
	}
#footer section address {
	padding-left:5px;
	white-space:nowrap;
	font-style:normal;
	opacity:0;
	color:#FFDD00;
	transition:opacity 200ms linear;
	}
#footer section:hover address, #footer section:active address, #footer section:focus address {
	}
#footer strong {
	display:none;
	}
#footer nav {
	top:16px;
	right:0;
	padding-bottom:10px;
	}
#footer li {
	list-style-type:none;
	border-right-color:#FFDD00;
	}
#footer li:last-child {
	padding-right:0;
	border-right-style:none;
	}
#footer li a {
	font-weight:bold;
	}
#footer a:link, #footer a:visited {
	color:#FFFFFF;
	}
#footer a:hover, #footer a:active, #footer a:focus {
	color:#FFDD00;
	}
#footer a.cur {
	color:#FFCC00;
	}
#footer div {
	height:10px;
	width:100%;
	border-top-style:solid;
	border-top-width:1px;
	border-top-color:#FFFFFF;
	background-color:#336699;
	border-top-left-radius:0;
	border-top-right-radius:0;
	}

/* Blueberry Slider */

.blueberry { 
	display:block;
	width:100%;
	height:auto;
	margin:0; 
	float:none;
	clear:both;
	}
.blueberry .slides {
	display:block;
	position:relative;
	border-style:solid;
	border-width:1px;
	border-color:#FF6600;
	overflow:hidden;
	border-radius:20px;
	}
.blueberry .slides li {
	position:absolute;
	top:0;
	left:0;
	overflow:hidden;
	}
#main .blueberry li img { 
	border-style:none;
	border-width:0;
	}
.blueberry .slides li img {
	display:block;
	width:100%;
	max-width:none;
	border-width:0;
	}
.blueberry .slides li.active { 
	display:block; 
	position:relative;
	}
.blueberry .crop li img { 
	width:auto; 
	}
.blueberry .pager {
	height:40px;
	text-align:center;
}
.blueberry .pager li { 
	display:inline-block; 
	}
.blueberry .pager li a, .blueberry .pager li a span {
	display:block;
	height:20px;
	width:20px;
	border-radius:10px;
	}
.blueberry .pager li a {
	margin-top:10px;
	margin-right:10px;
	margin-left:10px;
	}
.blueberry .pager li a span {
	overflow:hidden;
	text-indent:-9999px;
	border-radius:10px;
	background-color:#666666;
	}
.blueberry .pager li a span:hover, .blueberry .pager li a span:active, .blueberry .pager li a span:focus {
	background-color:#336699;
	}
.blueberry .pager li.active a span { 
	background-color:#FF6600;
	}
.blueberry b {
	position:absolute;
	display:block;
	right:20px;
	bottom:20px;
	font-weight:normal;
	text-shadow: 0px 0px 3px #000000, 0px 0px 2px #000000, 0px 0px 1px #000000;
	color:#FFFFFF;
	}
.blueberry li i {
	position:absolute;
	left:0;
	bottom:0;
	display:block;
	width:100%;
	padding:20px;
	border-bottom-left-radius:20px;
	border-bottom-right-radius:20px;
	background-color:#FF6600;
	color:#FFFFFF;
	opacity:0;
	z-index:10;
	}
.blueberry li:hover i, .blueberry li:active i, .blueberry li:focus i {
	opacity:1;
	}
.blueberry li strong {
	display:block;
	}

/* Variable */

#main .mainstartseite {
	width:100%;
	height:auto;
	display:block;
	}
#main .mainstartseite li {
	float:left;
	width:17%;
	margin-right:3%;
	margin-bottom:20px;
	padding-top:2%;
	list-style-type:none;
	text-align:center;
	border-radius:20px;
	}
#main .mainstartseite li img {
	width:90%;
	height:auto;
	border-style:none;
	border-width:0;
	}
#main .mainstartseite li:nth-child(1) {
	width:18%;
	background:rgb(255,220,0);
	}
#main .mainstartseite li:nth-child(2) {
	width:18%;
	background:rgb(170,0,0);
	}
#main .mainstartseite li:nth-child(3) {
	width:18%;
	background:rgb(0,100,170);
	}
#main .mainstartseite li:nth-child(4) {
	width:18%;
	background:rgb(245,215,10);
	}
#main .mainstartseite li:nth-child(5) {
	width:18%;
	background:rgb(256,256,256);
	}
#main .maindomothek {
	font-weight:bold;
	color:#FF6600;
	}
#main .mainsortiment a {
	white-space:nowrap;
	}
#main .mainsortiment a:link, #main .mainsortiment a:visited {
	color:#666666;
	}
#main .mainsortiment a:hover, #main .mainsortiment a:active, #main .mainsortiment a:focus {
	color:#FF6600;
	}
#main .mainsortiment span {
	padding-left:5px;
	padding-right:5px;
	color:#336699;
	}
#main .mainoeffnungszeiten {
	min-height:auto;
	}
#main .mainoeffnungszeiten li i {
	color:#FFFFFF;
	color:transparent;
	}

#main span.mainoeffnungszeiten {
	display:block;
	width:45%;
	margin-bottom:20px;
	}
#main div.mainoeffnungszeiten {
	float:none;
	width:90%;
	margin-right:5%;
	margin-bottom:20px;
	}
#main .mainoeffnungszeiten li, #main .mainimpressum li {
	list-style-type:none;
	display:table;
	width:100%;
	}
#main .mainoeffnungszeiten li ul, #main .mainimpressum li ul {
	display:table-row;
	}
#main .mainoeffnungszeiten li ul li, #main .mainimpressum li ul li {
	display:table-cell;
	}
#main .mainoeffnungszeiten li ul li:first-child {
		width:32%;
		margin-right:5%;
		color:#336699;
	}
#main .mainimpressum li ul li {
	width:auto;
	padding-bottom:10px;
	}
#main .mainimpressum li ul li:first-child {
	width:180px;
	padding-right:10px;
	color:#336699;
	}
#main .mainimpressum li a:link, #main .mainimpressum li a:visited {
	color:#666666;
	}
#main .mainimpressum li a:hover, #main .mainimpressum li a:active, #main .mainimpressum li a:focus {
	color:#FF6600;
	}
#main .mainlageplan iframe {
	width:98%;
	height:450px;
	border-style:solid;
	border-width:1px;
	border-color:#336699;
	margin-top:20px;
	border-radius:20px;
	}
#main .mainlageplan span {
	display:inline-block;
	min-width:70px;
	margin-right:10px;
	}
#main .mainlageplan a {
	color:#666666;
	}
#main .mainlageplan input {
	width:98%;
	margin-top:20px;
	text-align:center;
	padding-top:10px;
	padding-bottom:8px;
	border-style:solid;
	border-width:1px;
	border-color:#336699;
	color:#666666;
	border-radius:20px;
	}
#main .mainlageplan input:hover, #main .mainlageplan input:active, #main .mainlageplan input:focus {
	border-color:#FF6600;
	}
#main .mainlageplan .printform {
	display:block;
	}
#main .mainkontakt {
	margin-top:20px;
	max-width:540px;
	}
#main .mainkontakt label, #main .mainkontakt label.printform {
	display:inline-block;
	width:55px;
	}
#main .mainkontakt .error {
	padding-left:11px;
	}
#main .mainkontakt input, #main .mainkontakt textarea {
	text-align:left;
	padding-top:10px;
	padding-right:2%;
	padding-bottom:8px;
	padding-left:2%;
	border-style:solid;
	border-width:1px;
	border-color:#336699;
	background-color:#FFFFFF;
	color:#666666;
	border-radius:20px;
	}	
#main .mainkontakt input.printform {
	display:inline-block;
	}
#main .mainkontakt input.button, #main .mainlageplan input.button {
	color:#336699;
	}
#main .mainkontakt input {
	width:230px;
	margin-right:10px;
	margin-top:10px;
	}	
#main .mainkontakt textarea, #main .mainkontakt input.button {
	width:470px;
	}	
#main .mainkontakt input:hover, #main .mainkontakt input:active, #main .mainkontakt input:focus, #main .mainkontakt textarea:hover, #main .mainkontakt textarea:active, #main .mainkontakt textarea:focus {
	border-color:#FF6600;
	background-color:#FF6600;
	color:#FFFFFF;
	}
@media only screen and (max-width:600px){
	#main .mainkontakt textarea, #main .mainkontakt label, #main .mainkontakt input, #main .mainkontakt input.button {
		width:98%;
	}	
	#main .mainkontakt label {
		padding-top:30px;
		padding-left:11px
	}
}
#main .formquickly, #main .formkontakt {
	padding-top:20px;
	display:none;
	}
#main #Schnellkontakt .formquickly, #main #Kontaktformular .formkontakt {
	display:block;
	}
#main .formquickly p, #main .formkontakt p {
	padding:0;
	margin:0;
	}
#main .mainimpressum li {
	list-style-type:none;
	}
#main .mainbedingungen p {
	padding-bottom:30px;
	text-align:justify;
	-moz-hyphens:auto;
	-o-hyphens:auto;
	-webkit-hyphens:auto;
	-ms-hyphens:auto;
	hyphens:auto; 
	}
#ersatzteile {
	margin-top:10px;
	}
#ersatzteile strong, #ersatzteile p {
	padding:10px;color:#FFFFFF;
	}
#ersatzteile strong {
	display:inline-block;
	border-top-left-radius:20px;
	border-top-right-radius:20px;
	background-color:#336699;
	}
#ersatzteile p {
	padding-top:15px;
	border-top-right-radius:20px;
	border-bottom-left-radius:20px;
	border-bottom-right-radius:20px;
	background-color:#336699;
	}



