body {overflow-x: hidden;}
a {color:#c80000; cursor:pointer; text-decoration:none;}
a:hover, a:focus {color:black; text-decoration:underline;}
* {margin:0;}
html {font-size: 16px; font-family:Arial;}
.contentspalte {max-width:320px; margin-left:auto; margin-right:auto;}
header {width:100%;}
.motto {text-align:center; width:100%; height:2rem; margin-bottom:10px;}
#logozeile {margin-bottom:10px;}
#logozeile .slogan {float:left; font-size:0.9em}
#logozeile .logo-div {float:left; width:50%;}
#logozeile .wk-pic {float:left; width:50%; text-align:right;}
#logozeile .wk-pic img {width:40px; height:30px;}
.slogan {margin-bottom:10px; text-align:center; width:100%}

#meny {position:absolute; top:110px; background:#12274a; width:320px; margin-left:auto; margin-right:auto; display:none; height:auto; z-index:30;}
#menyAvPaa {display:none; float:left; margin-right:50px;}
#menyAvPaa:checked ~ #meny {display:block;}
#burger {position:relative; cursor:pointer; width:2rem; height:2rem; display:flex; justify-content:space-between; flex-direction:column;}
#burger > div {height: 2px; background-color: #000; transition: 0.5s; z-index:31;}
#menyAvPaa:checked ~ #burger > div {background-color: #fff;}
#menyAvPaa:checked ~ #burger > div:nth-child(1) {transform: translateY(15px) rotate(45deg);}
#menyAvPaa:checked ~ #burger > div:nth-child(2) {opacity: 0;}
#menyAvPaa:checked ~ #burger > div:nth-child(3) {transform: translateY(-15px) rotate(-45deg);}

/*Akkordeon*/
.acc {margin-top:20px;}
.acc a, .acc a:hover, .acc a:focus {-webkit-transition-duration: 500ms; transition-duration: 500ms; text-decoration: none; outline: 0 solid transparent; color:#FFFFFF; font-weight:500; cursor:pointer;}
.acc .choice {display:grid; grid-template-columns:9fr 1fr; grid-template-areas: "name action" "panel panel";}
.acc label:nth-child(odd) {grid-area:name;}
.acc label:nth-child(even) {grid-area:action;}
.acc .panel {grid-area:panel;}
.acc input[name="ac"] {display:none}
.acc input[name="zweite"] {display:none}
.acc .panel {margin:0; height:0; overflow:hidden; line-height:2; box-sizing:border-box; transition: 0.5s; list-style:none;}
.acc .panel p { margin-top:0 }
.acc input.open:checked~.panel {background-color:#1d3863; height:auto; padding:1rem; transition:0.5s;}
.acc label {cursor:pointer; padding:1em; width:100%; font-weight:400; font-size:1.2em; box-sizing:border-box; z-index:100; color:white;}
.acc input.open:checked ~ label {background-color:#1d3863;}
.acc label:nth-child(odd)::after {content:"+"; color:white; float:right; font-size:1.2em; margin-top:0;}
.acc input.open:checked ~ label:nth-child(odd)::after { content:""; }
.acc input.open:checked ~ label.close::after { content:"\2212"; font-size:1.2em; }

h1 {text-align:center; font-size:1.1em; font-weight:bold; line-height:1.2em; margin-bottom:20px;}

h2 {color:#191919; line-height:1.2em; font-size:1em; font-weight:bold; margin-bottom:20px;}
h3, h4, h5, h6 {color:#191919; font-size:1em; font-weight:bold; margin-bottom:20px;}
.h-nav {color:#191919; font-size:1em; font-weight:bold; margin-bottom:20px;}
main {margin-top:20px;}

.share {width:100%; text-align:center; padding-top:20px;}
.share > div {width:100%; text-align:left; margin-bottom:10px; font-size:0.9em; font-style:italic; color:#666666}
.share .box {width:70px; height:50px; float:left; margin-right:10px; font-size:0.7em}
.share .box svg {width:20px; height:20px;}

.themenwelt {}

footer {font-size:0.9em; margin-bottom:30px; border-top:2px #000000 solid; text-align:center;}
footer > p {padding-top:10px; padding-bottom:10px;}
.login-box {font-size:0.8em; margin-bottom:20px; padding-top:20px;}
.login-submit {float:left; width:35%; text-align:right; padding-top:20px;}
.form-do {line-height:30px; background-color:#999999; padding-left:10px; margin-bottom:20px; font-size:0.8em;}
.form-feld {margin-bottom:20px; font-size:0.8em;}
.kasse-submit-button {background-color:#037825; color:white; padding:10px; text-decoration:none; cursor:pointer; border-radius:15px; box-shadow:5px 5px 5px grey; cursor:pointer;}

/*Ebene 4*/
.anzahl {text-align:right; margin-bottom:10px; font-size:0.8em}
.teaser {margin-bottom:20px; font-size:0.9em;}
.infotext p {margin-bottom:20px;}
.artikel {margin-top:40px;}
.artikel p {margin-bottom:20px;}
.artikel-info {font-weight:bold; font-size:0.8em; margin-top:20px; margin-bottom:10px}
.blockliste h2 {font-size:0.9em;}
.art-block {position:relative; width:150px; float:left; text-align:center; margin-left:5px; margin-right:5px; margin-bottom:30px;}
.art-block div {font-size:0.8em}
.art-block a {text-decoration:none;}
.art-block .block-img {width:150px; height:225px;}
.art-block .sub {color:#666666; font-size:11px;}
.art-block h3 {font-size:0.8em;}
.art-block .paras {font-size:11px;}
.art-block .col {font-size:11px; margin-top:20px;}
.art-block .col .dot {height:23px; width:23px; border:solid 1px #000000; float:left; margin-right:5px; margin-bottom:5px;}
.preispunkt4 {position:absolute; z-index:10; width:75px; height:75px; border:2px solid black; text-align:center; border-radius:50px; margin-left:0px; margin-top:-80px; background-color:#f5d742; line-height:80px;}
.preis-rot {background-color:#9e0803; line-height:18px; color:#FFFFFF;}

/*Ebene 5*/
#preisinfo {margin-bottom:20px; margin-top:-10px; font-size:1em;}
#preisinfo button {border:none; cursor:pointer;}
.brand-div {float:left; width:150px; margin-left:5px; margin-right:5px;}
.top-div {margin-bottom:20px;}
.bread-div {margin-bottom:20px; line-height:22px;}
.div-li {margin-top:30px;}
.ul-css {font-size:16px;}
.ul-high {line-height:180%}
.h2-ar {font-size:1em; font-weight:bold; line-height:1.1em;}

article {}
article nav {padding-bottom:20px;}
article p {padding-bottom:20px;}
article ul {margin-left:20px; padding:0;}
article ul > li {margin-bottom:10px;}
#weitere {width:100%; height:300px; overflow:hidden; margin-top:30px;}
#weitere > div {color:#666666; font-size:1.1em; text-align:center; margin-bottom:10px;}
#weitere .pfeil {width:40px; z-index:2; position:absolute; font-size:40pt; text-align:center; line-height:200px; font-family:"Arial",sans-serif; cursor:pointer}
#weitere a {text-decoration:none; color:#000000}
#bildleiste {width:100%; float:left; list-style:none; overflow:hidden; white-space:nowrap; scroll-behavior:smooth;}
#bildleiste li {width:150px; height:200px; display:inline-block; margin-left:10px; margin-right:10px; position:relative}
#bildleiste div {background-color:silver; position:absolute; bottom:0px; text-align:center; font-size:11px; width:100%; color:#000000; white-space:normal;}
#bildleiste img {object-fit:cover; width:100%; height:100%; display:block}

.filter-rub {margin-bottom:20px; width:100%}
.filter-rub a {font-weight:bold;}
.marke-filter {width:100%; margin-top:20px;}
.marke-filter-logo {width:150px; float:left; text-align:right;}
#filter-head {margin-bottom:20px; width:170px; float:left}
#filter-head > div {float:left; max-width:160px; margin-top:10px; margin-bottom:20px;}
#filter {position:absolute; z-index:11; width:320px; display:none; background-color:#333333;}
#filter a, #filter a:hover, #filter a:focus {-webkit-transition-duration: 500ms; transition-duration: 500ms; text-decoration: none; outline: 0 solid transparent; color:#FFFFFF; font-weight:500; cursor:pointer;}
#filter .choice {display:grid; grid-template-columns:9fr 1fr; grid-template-areas: "name action" "panel panel";}
#filter button {border:none; cursor:pointer; font-size:1.2em; font-weight:bold; background-color:transparent; color:white; margin-top:10px; margin-left:10px;}
#filter label:nth-child(odd) {grid-area:name;}
#filter label:nth-child(even) {grid-area:action;}
#filter .panel {grid-area:panel;}
#filter input[name="fil"] {display:none}
#filter .panel {margin:0; height:0; overflow:hidden; line-height:2; box-sizing: border-box; transition: 0.5s; list-style:none;}
#filter .panel p { margin-top:0 }
#filter input.open:checked~.panel {background-color:#666666; height:auto; padding:1rem; transition:0.5s;}
#filter label {cursor:pointer; padding:1em; width:100%; font-weight:400; font-size:1.2em; box-sizing:border-box; z-index:100; color:white;}
#filter input.open:checked ~ label {background-color:#666666;}
#filter label:nth-child(odd)::after {content:"+"; color:white; float:right; font-size:1.2em; margin-top:0;}
#filter input.open:checked ~ label:nth-child(odd)::after { content:""; }
#filter input.open:checked ~ label.close::after { content:"\2212"; font-size:1.2em; }
#filter-single {position:absolute; z-index:11; width:320px; display:none; background-color:#333333;}
#filter-single a, #filter-single a:hover, #filter-single a:focus {-webkit-transition-duration: 500ms; transition-duration: 500ms; text-decoration: none; outline: 0 solid transparent; color:#FFFFFF; font-weight:500; cursor:pointer;}
#filter-single ul {margin-top:20px; list-style:none;}
#filter-single button {border:none; cursor:pointer; font-size:1.2em; font-weight:bold; background-color:transparent; color:white; margin-top:10px; margin-left:10px;}

/*Produktbilder*/
#bildcontainer {max-width:320px;}
.buttonleiste {margin-top:20px; margin-bottom:30px; text-align:center;}
.bildbutton {width:30px; height:30px; cursor:pointer}
#farbe-text {height:69px; display:none; padding-top:25px;}
#farbe_back {width:60px; float:left; text-align:center; font-size:1.2em}
#farbe_jetzt {width:200px; float:left; text-align:center}
#farbe_vor {width:60px; float:left; text-align:center; font-size:1.2em}
#kl-bild {width:320px; height:480px;}
#bildbox-large {position:absolute; top:200px; z-index:101; display:none; width:600px; height:900px;}
#bild-large {width:600px; height:900px; cursor:pointer;}

.shipping-button {cursor:pointer; font-size:1em; border:none; color:#c80000}
#versand-mwst {font-size:0.9em}
.fi-spa-li {float:left; text-align:left; width:50%;}
.fi-spa-re {float:left; width:50%; text-align:right;}

/*Orderblock*/
.farbbild {width:322px; height:500px; background-color:white;}
.farbbild button {cursor:pointer; border:none; font-size:1.5em; font-weight:bold;}
.farbbild > div {text-align:right; padding-right:20px; width:100%; background-color:white;}
.farbe-klecks {float:left; margin-right:5px; border:none; width:32px;}
.farbe-klecks > img {width:30px; height:39px; border:solid 1px #000000; cursor:pointer;}
.groesse-waehlen {margin-bottom:25px; clear:both; width:320px; height:auto; position:relative; font-size:0.8em; display:none;}
.groesse-waehlen .groesse-werte {font-size:0.8em; padding-bottom:20px; text-align:center;}
.anzahl-aendern {width:150px; float:left; padding-left:20px;}
.anzahl-aendern > div {float:left;}
.anzahl-aendern button {border:none; float:left; cursor:pointer}
.groesse-waehlen input[type=text] {width:50px; margin-top:2px; text-align:center; font-size:1em;}
.groesse-waehlen .anfragen {float:left; width:150px; text-align:right;}
.groesse-waehlen input[type=submit] {background-color:green; color:white; height:25px; width:200px; cursor:pointer;}
.groesse-waehlen .size-spalte {float:left; width:50px;}
.groesse-waehlen .lager-spalte {float:left; width:50px; text-align:center;}
#auswahl-farben {margin-bottom:20px; font-weight:bold; font-size:1.2em}
#auswahl-farben > div {margin-bottom:20px; line-height:50px;}
.groesse-waehlen .farbbalken {width:318px; padding:5px; line-height:25px; text-shadow:2px 2px 3px black; color:white; margin-bottom:20px; margin-top:20px; border:solid 1px black;}
.groesse-waehlen .lager-punkt {width:10px; height:10px; float:left;}
.content-text {width:320px; margin-top:30px; margin-bottom:20px; font-size:0.9em}


/*allgemein*/
#wkzeigen {color:#000000; display:none; z-index:32; background-color:#fcf69f; position:absolute; width:320px; padding:5px;}
#wkzeigen button {font-size:1.2em; font-weight:bold; border:none; cursor:pointer;}
#wkzeigen .wk-head {font-weight:bold; font-size:1em; margin-bottom:30px;}
#wkzeigen .mindest {margin-top:10px; margin-bottom:10px; padding:10px; text-align:center; background-color:#666666; color:#FFFFFF;}
#wkzeigen > div {margin-bottom:40px; font-size:0.8em; width:100%;}
#wkzeigen input[type=text] {width:50px; margin-top:2px; text-align:center; font-size:1em;}
#wkzeigen .wk-submit {text-align:center; clear:both; margin-top:20px;}
#wkzeigen-kasse {width:360px; padding:5px; font-size:0.9em}
#wkzeigen-kasse button {font-size:1.2em; font-weight:bold; border:none; cursor:pointer;}
#wkzeigen-kasse .wk-head {font-weight:bold; font-size:1em; margin-bottom:30px;}
#wkzeigen-kasse .mindest {margin-top:10px; margin-bottom:10px; padding:10px; text-align:center; background-color:#666666; color:#FFFFFF;}
#wkzeigen-kasse > div {margin-bottom:40px; font-size:0.9em; width:100%;}
#wkzeigen-kasse input[type=text] {width:50px; margin-top:2px; text-align:center; font-size:1em;}
#wkzeigen-kasse .wk-submit {text-align:center; clear:both; margin-top:20px;}
#wk-versandinfo {margin-top:20px; font-size:0.9em}
.kasse-button {font-weight:bold; font-size:1em; padding:1px 6px; border:1px outset black; border-radius:3px; color:black; background-color:#CCCCCC; text-decoration:none;}
.wk-strich {clear:both; border-top:solid 2px black}
#gesamtpreis {width:100%; text-align:right;}
#shop-versand-info {display:none; width:318px; padding:5px; position:absolute; height:auto; border:solid 2px #000000; font-size:0.8em; z-index:32; background-color:#fcf69f;}
#shop-versand-info .x-zu {text-align:right; width:100%; margin-bottom:20px;}
#shop-versand-info button {font-size:1.2em; font-weight:bold; border:none; cursor:pointer;}
#rabatt-stern {position:absolute; z-index:10; margin-top:5px; margin-left:5px; width:0; height:0; border-left:35px solid transparent; border-right:35px solid transparent; border-bottom:70px solid #9e0803;}
#rabatt-stern > div {position:absolute; top:25px; left:-35px; width:0; height:0; border-left:35px solid transparent; border-right: 35px solid transparent; border-top: 70px solid #9e0803; content: "";}
#rabatt-stern > div > div {margin-top:-65px; margin-left:-20px; color:#FFFFFF; font-size:14px;}
#versand-mwst {font-size:0.8em; margin-bottom:20px;}