/* maatwerk.css - fibreconcepts.com
   Gegenereerd uit de oude CSS-fork tegen skin_default (zie --migratie/LEESMIJ.md).
   Handwerk hoort in --migratie/hand.css; dat staat onderaan. */

@import url("https://use.typekit.net/umo0xzj.css");
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;700&display=swap");

:root {
  --color1: #000000;
  --fontColor1: #666666;
  --borderColor1: #dddddd;
  --fontFamily1: "futura-pt", Helvetica, Arial, Sans-Serif;
}

/* basis */
blockquote p {margin: 0 0 1em; color: var(--fontColor1); font-family: Georgia, Garamond, Helvetica, Arial, Sans-Serif; font-size: 16px; font-style: normal; font-weight: normal; line-height: 1.2em;}
table.lijst tr td {padding: 10px;}
table.lijst tr td.id, table.lijst td.id {width: 30px;}
table.lijst tr td.omschrijving .online {background: #ededed; border-radius: 3px; display: inline-block; font-size: 12px; line-height: 1; margin-left: 10px; padding: 6px 8px 4px;}
table.lijst tr td.omschrijving .online:empty, table.lijst td.omschrijving .online:empty {display: none;}
table.lijst tr td.omschrijving a, table.lijst td.omschrijving a {text-decoration: none;}
table.lijst tr th {border-bottom: 1px solid #eee; padding: 5px 10px; text-align: left;}
table.lijst tr:nth-child(even) td {background: #fff;}
body {line-height: 1.85em; overflow-y: scroll; color: var(--fontColor1); font-family: var(--fontFamily1); background-color: #ddd; height: auto !important;}
body > .laadtijd {background-color: var(--color1); border-radius: 3px; bottom: 5px; color: #fff; cursor: default; display: block; font-size: 11px; font-style: normal; line-height: 1.25em; opacity: 0.9; padding: 4px 7px; position: fixed; right: 5px; z-index: 10; text-align: right; margin: 0;}
body > .sessienr {border-radius: 3px; cursor: default; display: block; font-size: 11px; font-style: normal; line-height: 1.25em; opacity: 0.9; padding: 4px 7px; position: fixed; right: 5px; z-index: 10; text-align: right; margin: 0; background-color: #f1f1f1; bottom: 29px; color: var(--color1);}
body > .versie {border-radius: 3px; cursor: default; display: block; font-size: 11px; font-style: normal; line-height: 1.25em; opacity: 0.9; padding: 4px 7px; position: fixed; right: 5px; z-index: 10; text-align: right; margin: 0; background-color: #f1f1f1; bottom: 53px; color: var(--color1);}
a:link, a:visited {color: var(--fontColor1); font-family: inherit; transition: none;}
blockquote {border-left: 5px solid #eee; margin: 0; padding: 10px 15px;}
table.lijst {margin-bottom: 20px;}
table.lijst th {text-align: left; border-bottom: 1px solid #eee; padding: 5px 10px; text-transform: uppercase; font-size: 12px; font-weight: bold; color: #888;}
table.lijst tr.inactief td.omschrijving {text-decoration: line-through; color: #f00;}
table.lijst td {border-bottom: 1px solid #eee; padding: 10px; background: #fff; white-space: nowrap;}
table.lijst td > .titel {font-weight: bold;}
table.lijst td > .subtitel {color: #aaa;}
table.lijst tr:hover td {background: #edf4fc;}
table.lijst tr.inactief:hover td {background: #f1f1f1;}
table.lijst td.omschrijving .online {display: inline-block; background: #ededed; border-radius: 3px; line-height: 1; padding: 6px 8px 4px; margin-left: 10px; font-size: 12px;}
div[class*="grid"] {hyphens: auto; -webkit-hyphens: auto;}
a {font-family: inherit; color: inherit; text-decoration: revert; transition: none;}
a:hover {font-family: inherit; transition: none;}
img {object-fit: fill;}
table {width: auto;}

/* formulieren */
.meldingHouder .melding .formulierArtikelToevoegen select {margin-bottom: 0;}
.telefoonLandcodeHouder > select.telefoonLandcode {box-sizing: border-box; margin: 0;}
textarea, input[type="email"], input[type="tel"], input[type="number"] {border-color: #c4c4c4; line-height: 1.5em;}
input[type="text"] {border-color: #c4c4c4; line-height: 1.5em; width: auto;}
input[type="password"] {border-color: #c4c4c4; line-height: 1.5em; font-family: "Arial";}
input:focus {border: 1px solid var(--color1);}
textarea:focus, select:focus {border-color: var(--color1);}
input.verplicht, textarea.verplicht {background-position-x: right 5px; background-position-y: top 5px;}
input.nietMeerVerplicht {background-color: #fff;}
select {border-color: #cccccc; line-height: 1.5em; cursor: default;}
button {background-color: transparent; border: 1px solid var(--color1); color: var(--color1); padding: 7px 15px; border-radius: 0; font-family: revert; font-size: revert; line-height: revert; text-align: center; cursor: inherit;}
button:hover {color: #FFF; background-color: var(--color1);}
input[type="radio"]:checked::before {font-weight: normal;}
input[type="text"].formulier_text {width: 100%;}

/* koppen */
#extraSchermWinkelmand .schermWinkelMandje .melding .h3 {margin: 0 0 .25em;}
.samengesteldeArtikelen .h3 {font-size: 14px; line-height: 1.35em; margin-bottom: .25em;}
h1, h1 a, h1 a:hover, h1 a:visited {margin-bottom: .5em; font-family: var(--fontFamily1); font-size: 26px; font-weight: normal; letter-spacing: 0.1em; text-transform: uppercase;}
h2 {margin-bottom: .5em; color: var(--color1); font-family: var(--fontFamily1); font-size: 17px; letter-spacing: 0.1em; text-transform: uppercase;}
h4, h4 a, h4 a:hover, h4 a:visited {margin-bottom: .5em; color: var(--color1); font-family: var(--fontFamily1); font-size: 14px; font-weight: normal; letter-spacing: 0.1em; text-transform: uppercase;}
h5, h5 a, h5 a:hover, h5 a:visited {margin-bottom: .5em; font-family: var(--fontFamily1); font-size: 16px; letter-spacing: 0.1em; text-transform: uppercase;}
h6, h6 a, h6 a:hover, h6 a:visited {margin-bottom: .5em; font-family: var(--fontFamily1); letter-spacing: 0.1em; text-transform: uppercase;}
h1 a:link {font-family: var(--fontFamily1); font-size: 26px; font-style: normal; font-weight: normal; letter-spacing: 0.1em; text-transform: uppercase;}
h2 a:link, h2 a:visited, h2 a:hover {color: var(--color1); font-family: var(--fontFamily1);}
.h2 {color: var(--color1); font-size: 17px; letter-spacing: 0.1em; text-transform: uppercase; line-height: inherit; margin-bottom: 0; text-decoration: revert;}
h3, .h3, h3 a, h3 a:visited, h3 a:hover {margin-bottom: .25em; color: var(--color1); font-family: var(--fontFamily1); font-size: 14px; font-weight: normal; letter-spacing: 0.1em; text-transform: uppercase;}
h3 a:link {margin-bottom: .25em; color: var(--color1); font-family: var(--fontFamily1); font-size: 14px; font-style: normal; font-weight: normal; letter-spacing: 0.1em; text-transform: uppercase;}
h4 a:link {color: var(--color1); font-family: var(--fontFamily1); font-size: 14px; font-style: normal; font-weight: normal; letter-spacing: 0.1em; text-transform: uppercase;}
h5 a:link {font-family: var(--fontFamily1); font-size: 16px; font-style: normal; font-weight: normal; letter-spacing: 0.1em; text-transform: uppercase;}
h6 a:link {font-family: var(--fontFamily1); font-style: normal; font-weight: normal; letter-spacing: 0.1em; text-transform: uppercase;}
#extraSchermWinkelmand .schermWinkelMandje .melding h2 {margin: 0; font-size: inherit; font-weight: normal;}

/* knoppen */
#extraSchermWinkelmand .schermWinkelMandje .knoppen a.bevestigen {color: #fff; background-color: #e45c46;}
.configuratieDelenPopup a.knop {margin-top: 0;}
.knoppen.metTekst > a:hover, .privacyMelding .knoppen a.knop.akkoord, table.lijst tr td.knoppenHouder .knoppen.metTekst > a:hover {color: var(--color1);}
.nogNietGeladen a.button {background-color: transparent;}
table.lijst tr td.knoppenHouder {font-size: 16px; white-space: nowrap;}
table.lijst tr td.knoppenHouder .knoppen.metTekst > a {font-size: inherit; padding: 0 5px;}
table.lijst tr td.knoppenHouder .knoppen.metTekst > a .tekst {background: #415e81; border-radius: 3px; color: #fff; font-size: 11px; line-height: 1.25em; opacity: 0; padding: 5px 9px; pointer-events: none; position: absolute; transform: translateX(-50%);}
table.lijst tr td.knoppenHouder a, table.lijst td.knoppenHouder a {font-size: inherit; padding: 0 5px; position: relative;}
table.lijst tr td.knoppenHouder a .tekst {background: #415e81; border-radius: 3px; color: #fff; font-size: 11px; font-weight: normal; left: 50%; line-height: 1.25em; opacity: 0; padding: 5px 9px; pointer-events: none; position: absolute; top: -125%; transform: translateX(-50%); transition: .3s all ease; white-space: nowrap;}
table.lijst tr td.knoppenHouder a .tekst::before {border-width: 6px 6px 0; border-style: solid; border-color: #415e81 transparent; bottom: -4px; content: ""; left: 50%; position: absolute; transform: translateX(-50%); transition: .3s all ease;}
table.lijst tr td.knoppenHouder a:hover .tekst, table.lijst td.knoppenHouder a:hover .tekst {opacity: 1; pointer-events: all;}
table.lijst tr td.knoppenHouder:has(.knoppen.metTekst) {white-space: nowrap;}
.speedSearch .resultaat a.knopAlles {background-color: #383838; color: #fff; border-radius: 3px; bottom: 12px; font-size: 12px; font-weight: normal; padding: 3px 10px; position: absolute; right: 10px; display: none;}
.knopAllesOnder a {font-size: 15px;}
.knopAllesOnder::before {clear: both; content: ""; display: block;}
#extraSchermWinkelmand .schermWinkelMandje .knoppen {text-align: right; padding-bottom: 15px; padding-top: 15px;}
#extraSchermWinkelmand .schermWinkelMandje .knoppen a {background: #bcbcbc; border-radius: 3px; color: #fff; display: inline-block; line-height: 1.25em; margin-bottom: 5px; margin-top: 5px; padding: 7px 10px; text-decoration: none; transition: all 0.3s ease 0s;}
#extraSchermWinkelmand .schermWinkelMandje .knoppen a:hover, .meldingHouder .melding .knoppen a:hover {background: var(--color1); color: #fff; transition: all .3s ease;}
table.lijst td.knoppenHouder {font-size: 16px; line-height: 0; vertical-align: middle;}
table.lijst td.knoppenHouder a .tekst {background: #415e81; border-radius: 3px; top: -125%; color: #fff; line-height: 1.25em; white-space: nowrap; padding: 5px 9px; position: absolute; transition: .3s all ease; left: 50%; font-size: 11px; transform: translateX(-50%); opacity: 0; pointer-events: none; font-weight: normal;}
table.lijst td.knoppenHouder a .tekst::before {border-width: 6px 6px 0; border-style: solid; border-color: #415e81 transparent; bottom: -4px; content: ""; position: absolute; transition: .3s all ease; left: 50%; transform: translateX(-50%);}
.formulierVersturen a.button {float: right;}
.button, a.button {background-color: transparent; border: 1px solid var(--color1); color: var(--color1); padding: 7px 15px; border-radius: 0; cursor: revert; font-family: inherit; font-size: revert; line-height: revert; text-align: revert;}
a.button:hover {color: #FFF; background-color: var(--color1);}
a.knop {background-color: transparent; border-width: 1px; border-style: solid; border-right: 1px solid var(--color1); border-bottom: 1px solid var(--color1); border-left: 1px solid var(--color1); color: var(--color1); padding: 7px 15px; border-radius: 0; font-family: inherit; font-size: inherit; line-height: inherit; text-align: inherit;}
a.knop:hover {color: #FFF; background: var(--color1);}
a.knop::after {content: "\f105"; font-family: "Font Awesome 5 Pro"; margin-left: 10px; font-weight: 100; font-size: 15px; top: 1px; position: relative;}
a.knop.grijs {background-color: #eee; color: #888;}
.meldingHouder .melding .knoppen a {background: #636363; color: #fff; display: inline-block; line-height: 1.25em; margin-left: 5px; margin-right: 5px; padding: 7px 10px; text-decoration: none; transition: all 0.3s ease 0s;}
.meldingHouder .melding .knoppen a.bevestigen {background: var(--color1);}
.privacyMelding .knoppen a.knop {background: #aaa;}
a:hover.button, a:hover.knop, a:link.button, a:link.knop, a:visited.button, a:visited.knop {transition: all 0.3s ease 0s;}

/* paginaframe */
#art-main {background: #FFF;}
.art-Sheet {background: #fff; max-width: 1500px; min-width: 1px; padding: 0 20px; display: block;}
.art-Block {padding-bottom: 0; padding-left: 0; margin: 0 auto; z-index: 0; padding-top: 20px;}
.art-BlockHeader {z-index: 0;}
.art-content img {max-width: 100%; height: auto !important;}
.art-sidebar1 .art-Block {padding-right: 20px;}
.art-sidebar2 .art-Block {padding-left: 20px;}
.catMenuLink0li, .catMenuLink0liSel, .CMSMenuLink1li, .CMSMenuLink1liSel {font-size: 13px; text-transform: uppercase; letter-spacing: 0.2em;}
.breadcrumbs {line-height: 1.75em; z-index: 10; font-size: inherit;}
.crumbSpace {font-weight: bold; padding-right: 7px; padding-left: 7px;}
.breadcrumbs ol li.crumbSpace {border-color: var(--fontColor1); border-style: none; content: normal; height: 24.5px; left: auto; margin-left: 0; margin-right: 0; overflow: visible; position: static; top: auto; width: 7px;}
.art-Sheet .art-sidebar1 {box-sizing: content-box; padding-right: 0; position: static;}
.art-Sheet .art-content {overflow: visible; position: static;}
.breadcrumbs ol {list-style-type: decimal;}

/* header */
#extraSchermWinkelmand .schermWinkelMandje .melding .meldingBoven {padding: 20px;}
#extraSchermWinkelmand .schermWinkelMandje .melding .meldingBoven .afbeeldingHouder {margin-right: 20px; position: relative;}
#extraSchermWinkelmand .schermWinkelMandje .melding .meldingBoven .icoon {background-color: #64a43a; border-radius: 50px; color: #fff; font-size: 13px; padding: 5px; position: absolute;}
#extraSchermWinkelmand .schermWinkelMandje .melding .meldingBoven .inhoud  .h3, .art-menu li a .t.action, .art-menu li a .t:hover, .zoeken .knop:hover {color: var(--color1);}
#extraSchermWinkelmand .schermWinkelMandje .melding .meldingBoven .inhoud p {margin: 0 0 1em;}
.art-menu li a .t.action::before {content: " ";}
.bovenkantHolder .winkelmenu:empty, .shopCompact .artikel .favorieten, .account .welkom .bericht, .winkelwagenHouder .winkelwagen .inhoud.artikelen .kassaArtikel td.verwijderKnop, .winkelwagenHouder .winkelwagen .inhoud.artikelen .kassaArtikel td.verwijderKnop .verwijderen.verborgen, .winkelwagenHouder .kassaArtikel .regelStuk, .speedsearchLoader {display: none;}
.extrabovenkantHolder .valuta {margin-right: 0.25em;}
.extrabovenkantHolder .valuta ul {list-style-position: outside;}
.extrabovenkantHolder .valuta ul li {padding: 0;}
.hoverMenu .kolommen .kolom > ul {font-size: inherit; display: none;}
.ordersFilters .zoekenOrders {margin: 0 0 15px;}
.winkelwagenHouder .winkelwagen .inhoud.totaal .prijzen .prijs {color: var(--color1); font-size: 16px; font-weight: bold; line-height: 1em;}
.winkelwagenHouder .winkelwagen .inhoud.totaal .prijzen .relatieBtwPrijs {color: var(--fontColor1); display: block; font-size: 11px; font-weight: normal; white-space: nowrap;}
.winkelwagenHouder .winkelwagen .inhoud.totaal .winkelmandjeKnoppen a {margin-right: 5px;}
.winkelwagenHouder .winkelwagen .inhoud.totaal .winkelmandjeKnoppen a.winkelmandjeKnopKassa {background: var(--color1); color: #fff;}
.winkelwagenHouder.openGeklapt .winkelwagen {top: 0; transform: translateX(0%);}
.art-nav {position: relative; width: 100%; text-align: center; background-color: #f5f5f5;}
.art-menu li {margin: 8px 10px 0;}
.art-menu li a {font-family: var(--fontFamily1);}
.art-menu li a .t {font-size: 16px; padding: 0 0 8px; line-height: 30px; font-family: var(--fontFamily1); letter-spacing: 0em;}
.art-menu li a.active .t {color: var(--color1) !important;}
.art-menu li a .t::before {position: absolute; bottom: 11px; height: 2px; width: 0; background: var(--color1); content: " "; display: block; transition: all .3s ease;}
.art-menu li a:hover .t::before, .art-menu li a.active .t::before {width: 100%; box-sizing: border-box;}
.art-menu ul {z-index: 10; box-shadow: 0 5px 119px -17px rgba(0,0,0,.15);}
.winkelmenu .art-nav {box-sizing: border-box; margin: 0 auto; max-width: 1200px; padding: 0 20px; position: relative; top: 0;}
.winkelmenu .art-nav li.separatorHouder {display: inline-block; line-height: 0;}
.artikel .favorieten {clear: both; margin-bottom: 0; margin-top: 0.25em; position: static;}
.shopTegel .artikel .favorieten {position: absolute; right: 20px; top: 20px; z-index: 2; color: #ddd;}
.shopTegel .artikel .favorieten .toelichting {background-color: var(--fontColor1); border-radius: 3px; top: 0; color: #fff; line-height: 1.25em; white-space: nowrap; padding: 5px 9px; position: absolute; transition: .3s all ease; font-size: 12px; opacity: 0; pointer-events: none; right: 165%;}
.shopTegel .artikel .favorieten .toelichting::before {border-width: 6px 0 6px 6px; border-style: solid; border-color: transparent var(--fontColor1); top: 6px; content: ""; position: absolute; transition: .3s all ease; right: -8px; transform: translateX(-50%);}
.shopTegel .artikel .favorieten:hover .toelichting, .account .inloggen.openGeklapt .inloggenHolder, .account .mijnAccount.openGeklapt .inloggenHolder {opacity: 1; pointer-events: all;}
.artikel.detail .favorieten {margin-top: 0;}
.zoekenOrders {z-index: 13;}
.zoekenOrders .veld, .zoekenOrders .knop {z-index: 10;}
.zoekenOrders .veld input {width: 150px;}
.account {list-style-image: none; margin-bottom: 0; margin-left: 0; margin-top: 0; display: inline-block; position: relative; vertical-align: middle;}
.account li {float: left; margin: 0 10px 0 0; border-right: none; line-height: inherit; padding: 0;}
.account .seperator {border-right: 1px solid var(--borderColor1); height: 18px; top: 4px; width: 0;}
.account .inloggen .inloggenHolder, .account .mijnAccount .inloggenHolder {z-index: 20; opacity: 0; pointer-events: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: table;}
.account .inloggen .inloggenHolder .inloggenHolderCell, .account .mijnAccount .inloggenHolder .inloggenHolderCell {display: table-cell; vertical-align: middle; text-align: center;}
.account .inloggen .inloggenHolder .houder {text-align: left; box-shadow: 0 33px 40px -16px rgba(0,0,0,.2); width: 100%; max-width: 310px; display: inline-block; border-radius: 3px; overflow: hidden; transition: .3s all ease;}
.account .mijnAccount .inloggenHolder .houder {text-align: left; background-color: #fff; box-shadow: 0 33px 40px -16px rgba(0,0,0,.2); width: 100%; max-width: 310px; display: inline-block; border-radius: 3px; overflow: hidden; transform: translateY(-10px); transition: .3s all ease;}
.account h2 {font-size: 17px; margin-bottom: 10px; padding-bottom: 5px;}
.account .accountKop {padding-bottom: 5px; font-weight: bold; text-transform: uppercase;}
.account .welkom {font-family: var(--fontFamily1); transition: .3s all ease;}
.account .inloggenKnop, .account .favorietenKnop {transition: .3s all ease;}
.account .mijnAccountKnop {transition: .3s all ease; font-family: var(--fontFamily1);}
.account .inloggenKnop:hover, .account .mijnAccountKnop:hover, .winkelwagenHouder .winkelknop:hover {color: #aaa;}
.account .favorietenKnop:hover {color: #aaa; text-decoration: none;}
.account .favorietenKnop::before {content: "\f004"; font-family: "Font Awesome 5 Pro"; margin-right: 5px; color: var(--color1);}
.account .inloggen input:-webkit-autofill, .account .inloggen input:-webkit-autofill:hover, .account .inloggen input:-webkit-autofill:focus input:-webkit-autofill, .account .inloggen textarea:-webkit-autofill, .account .inloggen textarea:-webkit-autofill:hover textarea:-webkit-autofill:focus, .account .inloggen select:-webkit-autofill, .account .inloggen select:-webkit-autofill:hover, .account .inloggen select:-webkit-autofill:focus {-webkit-box-shadow: 0 0 0 1000px #eee inset; transition: background-color 5000s ease-in-out 0s;}
.account .inloggen .inlogKnop {padding-top: 3px; display: block;}
.account .inloggen .wachtwoordKwijt {text-align: center;}
.account .inloggen .inlogKnop .inlogKnop2 {display: block; width: 100%; padding: 12px; line-height: 1; font-weight: bold; font-size: 12px; font-family: var(--fontFamily1); text-transform: uppercase; background: #636363; border-color: #636363; color: #fff; margin-top: 10px; margin-bottom: 5px; box-sizing: border-box; text-align: center;}
.winkelwagenHouder {display: inline-block;}
.winkelwagenHouder .winkelknop {border-right: 1px solid var(--borderColor1); display: inline-block; padding: 0 10px 0 0; margin: 0 10px 0 0; line-height: 1; border-radius: 0; font-family: var(--fontFamily1); transition: .3s all ease;}
.winkelwagenHouder .winkelknop:hover .aantal {background-color: #aaa;}
.winkelwagenHouder .winkelknop .icoon, .winkelwagenHouder .winkelknop .titel {display: inline-block; vertical-align: middle;}
.winkelwagenHouder .winkelknop .aantal {margin-right: 5px; padding: 3px 5px; transition: .3s all ease; vertical-align: middle; display: inline-block; font-family: var(--fontFamily1); min-width: 9px;}
.winkelwagenHouder .winkelwagen {position: fixed; top: 0; width: 100%; background-color: #fff; box-shadow: 0 33px 40px -16px rgba(0,0,0,.2); height: 100vh; vertical-align: bottom; transform: translateX(50%); max-width: 500px;}
.winkelwagenHouder .winkelwagen .inhoud.artikelen .winkelTitel {font-size: 17px; font-weight: bold; margin: 0 0 15px; color: var(--color1);}
.winkelwagenHouder .winkelwagen .inhoud.artikelen {height: calc(100vh - 120px);}
.winkelwagenHouder .winkelwagen .inhoud.artikelen .kassaArtikel td {border-bottom: 1px dashed #eee; padding: 20px 5px; vertical-align: middle; line-height: 1.5em;}
.winkelwagenHouder .winkelwagen .inhoud.artikelen .kassaArtikel td.verwijderKnop .verwijderen {color: #e10101; display: inline-block; position: relative; line-height: 0; cursor: pointer; opacity: 0;}
.winkelwagenHouder .winkelwagen .inhoud.artikelen .kassaArtikel td.verwijderKnop .verwijderen a, #speedsearchResult .houder .speedSearch.artikelen ul li .artikelNr {color: inherit;}
.winkelwagenHouder .winkelwagen .inhoud.artikelen .kassaArtikel:hover td .verwijderen {opacity: 1;}
.winkelwagenHouder .winkelwagen .inhoud .prijs {float: right; font-weight: bold; font-size: 16px; color: var(--color1); text-align: center; line-height: 1em; padding: 6px 0 15px;}
.winkelwagenHouder .kassaArtikel .kassaArtikelAfbeeldingHolder {width: 50px; padding-right: 10px;}
.winkelwagenHouder .winkelwagen .inhoud.totaal {background: #f5f5f5; position: relative; padding: 20px;}
.winkelwagenHouder .winkelwagen .inhoud.totaal::before {content: ""; height: 100px; position: absolute; display: block; width: 100%; top: -100px; left: 0; background: linear-gradient(transparent, #fff); pointer-events: none;}
.winkelwagenHouder .winkelwagen .inhoud .relatieBtwPrijs {display: block; white-space: nowrap;}
.winkelwagenHouder .winkelwagen .inhoud .relatieBtwPrijs .valuta {padding-right: .25em;}
.zoeken {display: table; border-radius: 0; transition: .3s all ease; margin: auto; min-width: auto; background-color: rgba(0, 0, 0, 0);}
.zoeken.open, .zoeken:hover {background-color: #fff;}
.zoeken .veld {display: table-cell; position: relative;}
.zoeken .veld #zoekWoordID {padding-top: 10px; padding-bottom: 10px; font-size: 14px; border-radius: 0; margin: 0; width: 260px; line-height: 1.1em; background-attachment: scroll; background-image: none; background-position-x: 0%; background-position-y: 0%; background-repeat: repeat; background-size: auto;}
.zoeken .knop {display: table-cell; color: #999; position: relative; padding: 5px 12px; z-index: 10; line-height: inherit;}
#speedsearchResult {clear: both; top: 50px; left: 0; right: -700px;}
#speedsearchResult .houder {overflow: hidden; box-shadow: 0 24px 120px -10px rgba(0,0,0,.3); border-color: var(--fontColor1); border-style: none; font-size: inherit; line-height: inherit; max-height: none; width: 1000px;}
.speedsearchLoader i {color: #383838;}
.supermenuTrigger i {margin: 0 5px 0 0;}
.supermenuInhoud.open {box-shadow: 0 25px 70px 14px rgba(0, 0, 0, 0.25);}
#extraSchermWinkelmand .schermWinkelMandje .melding .meldingBoven td {vertical-align: middle;}
#extraSchermWinkelmand .schermWinkelMandje .melding .meldingBoven td .knoppen {width: 135px;}
#extraSchermWinkelmand .schermWinkelMandje .melding .meldingBoven td .knoppen a {vertical-align: middle; width: 100%; text-align: center; box-sizing: border-box;}
.meldingBoven {background-color: #eee; border-bottom: 1px solid #dfdfdf; padding: 20px;}
.art-menu li .t.hoverMenuActief::after {position: relative; bottom: 2px; display: none;}
.hoverMenu {margin-left: 0; width: 200px; box-shadow: 0 10px 50px rgba(0, 0, 0, 0.3); height: 0; top: 38px; border-radius: 0; transform: none;}
ul.art-menu > li:nth-child(n+10) .hoverMenu {left: auto; right: 0;}
.hoverMenu.open {height: auto; transform: none;}
.hoverMenu .categorie {padding-bottom: 13px; padding-top: 13px; background-color: #eee; display: none;}
.hoverMenu .categorie .kop {color: #fff; font-family: "Open Sans", Helvetica, Arial, Sans-Serif; font-size: 17px; line-height: inherit;}
.hoverMenu .kolommen {padding-bottom: 10px; padding-top: 20px; display: block; flex-wrap: nowrap;}
.hoverMenu .kolommen .kolom .titel a {margin-bottom: 12px; color: var(--fontColor1);}
.inloggen_holder .inloggen_content {background-color: #f2f2f2;}
.inloggen_holder .inloggen_content input {width: 100%; margin-right: 0; margin-bottom: 10px;}
a.logo, .bovenkant {position: relative;}
a.logo img {width: 100%;}
.resMenubalk {position: sticky; top: 0; width: 100%; z-index: 100;}
.resMenubalkinhoud {background-color: #FFF; top: 0; left: 0; right: 0; padding: 10px 15px 10px 10px; z-index: 50; position: relative; border-bottom: 1px solid var(--borderColor1);}
.resMenubalkinhoud a {padding: 5px;}
.resMenubalkinhoud img {width: 20px; height: 20px;}
.resMenubalkinhoud .resMenuwinkelmandje, .resMenubalkinhoud .resMenuZoekenKnop {float: right; font-size: 21px; color: var(--color1);}
.resMenubalkinhoud .resZoeken.open {padding-top: 5px; padding-bottom: 5px;}
.resMenuHolder {box-shadow: 10px 0 10px 0 rgba(0, 0, 0, 0.2); height: calc(100vh - 53px); text-align: center; top: 53px; overflow-y: scroll; max-width: none;}
.resMenubloktitel {padding-bottom: 7px; padding-top: 7px;}
.resMenublokinhoud .resMenuItem a {padding-bottom: 8px; padding-top: 8px; color: #333; font-size: 12px; transition: background-color .3s ease; text-transform: uppercase; letter-spacing: 0.1em; border-bottom-color: #333; border-bottom-style: none;}
.resMenublokinhoud .resMenuItem.active > a {font-weight: bold;}
.resMenuItem .laag1 a, .resMenuItem .laag2 a, .resMenuItem .laag3 a {font-size: 11px;}
.resMenuwinkelmandje #reswinkelMandjeAantal {font-size: 9px; height: 15px; width: 15px; background: var(--color1); border-radius: 3px;}
.resMenuItemHolder {transition: .6s all ease;}
.account .inloggen .email input, .account .inloggen .wachtwoord input, #speedsearchResult .houder .speedSearch ul li:last-child, .shopTegel .artikel .inner .favorieten {margin-bottom: 0;}
#speedsearchResult .houder .speedSearch ul li a {background-color: rgba(0, 0, 0, 0); border-color: #383838; border-style: none; padding: 10px 20px;}
.resMenublokinhoud .resMenuItem.active > a:hover, .resMenublokinhoud .resMenuItem.active > a:link, .resMenublokinhoud .resMenuItem.active > a:visited {color: #333;}
.bovenkantHolder .bovenkant .resMenubalkinhoud a {font-size: inherit; vertical-align: baseline;}
.bovenkantHolder .bovenkant .resMenubalkinhoud a.resMenucategorieknop {margin-left: 0;}
.account .inloggen .inloggenKnop {text-decoration: none;}
.artikel .favorieten a {transition: none;}
.account a.favorietenKnop:link, .account a.favorietenKnop:visited {color: var(--fontColor1);}
.resMenuItem.favorieten a span {background-color: rgba(0, 0, 0, 0); border-color: #333; border-radius: 0; border-style: none; box-sizing: content-box; line-height: inherit; margin-bottom: 0; margin-left: 0; margin-top: 0; min-width: 0; padding: 0;}
.resMenuHolderBg {background-image: none; left: auto; position: static; right: auto; top: auto; transition: none; z-index: auto;}
#speedsearchResult .houder .speedSearch ul li a strong {border-bottom-color: #383838; border-bottom-style: none; line-height: inherit; position: static;}
.account .houder .houder2 {border-top-color: var(--fontColor1); border-top-style: none; padding: 25px 35px;}
#speedsearchResult .houder .speedSearch.artikelen ul li .thumbnail img {bottom: auto; height: 50px !important; left: auto; max-height: none; max-width: none; position: static; right: auto; top: auto;}
.resMenuHolderBg.open {bottom: auto;}
.bovenkantHolder .winkelmenu {box-sizing: content-box;}
.hoverMenu .kolommen .kolom {box-sizing: content-box; hyphens: inherit; padding-bottom: 0; padding-top: 0; width: 160px;}
#speedsearchResult .houder .speedSearch.artikelen ul li a .categorie {color: #aaa; font-size: inherit;}
.resMenuItem.favorieten a {display: block;}
#speedsearchResult .houder .speedSearch.artikelen ul li .thumbnail {float: right; margin-right: 0; position: static;}
.account .houder .accountKop {font-size: 16px; line-height: inherit;}
.shopTegel .artikel .inner .rechtsboven div.favorieten {font-size: 18px; margin-left: 0; margin-right: 0; margin-top: 0;}
#speedsearchResult .houder .knopAllesOnder a {font-weight: normal; padding: 15px;}
.bovenkantHolder .bovenkant .resMenubalkinhoud {line-height: 1em; white-space: revert;}
.resMenublokinhoud 	ul, .account li .houder {line-height: inherit;}
.account .inloggen .inlogKnop .wachtwoordKwijt {line-height: inherit; margin: 0;}
#speedsearchResult .houder .speedSearch ul li {margin-bottom: 0; margin-left: 0; margin-right: 0;}
.bovenkantHolder .winkelmenu.art-menu {margin-left: 0; margin-right: 0;}
.account .houder {opacity: 1; position: static; right: auto; top: auto; z-index: auto;}
.account .openGeklapt .houder {top: auto;}
.account .houder .houder1 {padding: 25px 35px;}
#speedsearchResult .houder .speedSearch .resultaat {padding-left: 40px; padding-right: 40px; padding-top: 45px;}
#speedsearchResult .houder .speedSearch.artikelen ul li .artikelNr .nummer {text-transform: inherit;}
.resMenuItem.open > .openklapper {width: 39px;}
.bovenkantHolder .winkelmenu::-webkit-scrollbar, .resMenuHolder::-webkit-scrollbar {display: revert;}
#speedsearchResult .houder .speedSearch ul li a::after, #speedsearchResult .houder .speedSearch.artikelen ul li .thumbnail::after {content: none;}
.winkelmenu.art-menu li .t.hoverMenuActief::after {color: inherit; font-weight: normal; margin: 0 0 0 10px;}
.account .inloggen.openGeklapt .inloggenKnop {text-decoration: underline;}
.artikel.detail .rechts .favorieten {margin-bottom: 10px;}

/* usps */
.stap.vier .totalen .vwHolder {margin-top: 10px;}
.stap.vier .totalen .vwHolder .vwTonen input[type="checkbox"] {margin-top: 0;}
.stap.vier .gegevens {background: #eee; padding: 20px; border-radius: 3px;}
.stap.vier .vwHolder {margin-top: 10px; line-height: 1.5em; position: relative; padding-left: 30px;}
.stap.vier .vwHolder input#algemeneVoorwaarden {position: absolute; left: 0; top: 4px;}

/* bouwblokken */
.bannerHouder .banner p {margin-bottom: 1em;}
.liquid-slide-sjabloon .inhoud p:last-child {margin: 0 0 1em;}
.vak .inhoud.smal {max-width: 1500px;}
.art-sidebar1 .FCK2kolTd, .art-sidebar1 .FCK4kolTd, .art-sidebar2 .FCK2kolTd, .art-sidebar2 .FCK4kolTd {width: 100%; display: block; margin-bottom: 15px;}
.art-sidebar1 .FCK2kolTdS, .art-sidebar1 .FCK4kolTdS, .art-sidebar2 .FCK2kolTdS, .art-sidebar2 .FCK4kolTdS {display: none;}
.productCarrousel li .inhoud {padding: 10px;}
.productCarrousel li .inhoud h2.titel {font-size: 14px; height: 55px; margin: 0 0 5px; overflow: hidden;}
.liquid-slide-sjabloon .inhoud {max-width: 400px; padding: 10px 20px; left: 70px; top: 25%;}
.liquid-slide-sjabloon .inhoud h2 {text-shadow: 0 1px 5px rgba(0,0,0,.5);}
.privacyMelding .inhoud .titel {font-family: var(--fontFamily1);}
.vak .inhoud {max-width: 1500px; position: relative; padding: 65px 20px;}
.blok {position: relative; display: flex;}
.blok .linksVak {padding: 50px; box-sizing: border-box; flex: 1;}
.blok .rechtsVak {display: inline-block; padding: 50px; box-sizing: border-box; background: #f5f5f5; flex: 1;}
.blok .rechtsVak .rechtsVakInhoud {display: table-cell; vertical-align: middle;}
.blok .foto {background: url(images/never-out-stock.jpg) no-repeat center center / cover; z-index: 0;}
.blok .foto2 {background: url(images/private-label.jpg) no-repeat center center / cover; z-index: 0;}
.fixedBlok.achtergrond .inhoud {max-width: 650px; margin: 0 auto; position: relative; padding: 150px 0; box-sizing: border-box; text-align: center; color: #FFF;}
.fixedBlok.achtergrond .inhoud h2, .fixedBlok.achtergrond .inhoud h5 {color: #FFF;}
.fixedBlok.achtergrond .inhoud a.knop {border-color: #FFF; color: #FFF;}
.fixedBlok.achtergrond .inhoud a.knop:hover {border-color: var(--color1); color: #FFF; background-color: var(--color1);}

/* webshop */
#extraSchermWinkelmand .schermWinkelMandje .melding .meeBestellenTekst, .meeBestellenTekst {padding: 20px;}
#extraSchermWinkelmand .schermWinkelMandje .melding .meeBestellenTekst p {margin: 0 0 1em;}
#extraSchermWinkelmand .schermWinkelMandje .shopTegel .artikel {width: 25%;}
#tabSerieInhoud .artikel .artikelGroepPrijs, .kenmerkMobielHouder.standaard .filters.open, ul.stappenBalk li.stap:first-child::before, .tabsV2 .inhoud > div.actief, .mijnAccountOrderHolder .item a.link, .kassaArtikel .artikelPrijsEenheid, .filtersLinks .kenmerkgroep a.titel {display: block;}
#tabSerieInhoud .shopLijst .artikel {padding: 5px 0;}
#tabSerieInhoud .shopLijst .artikel .inner .col1 {padding-right: 10px; width: 150px;}
#tabSerieInhoud .shopLijst .artikel .inner .col3, #tabSerieInhoud .shopTegel .artikel .voorraad .status .toelichting.negatief, .Gv3, #tabSerieInhoud .shopTegel .artikel .voorraad .status .toelichting.positief {display: table-cell;}
#tabSerieInhoud .shopLijst .artikel .omschrijving {margin: 0 0 10px;}
.Gv3 .Gv3Thumb {margin: 7px; position: relative;}
.artikel .prijzen .valuta {margin-right: 0.25em; padding-right: 0.25em;}
.artikel .relatieBtwPrijs, .relatieBtwPrijs {color: var(--fontColor1); display: block; font-size: 11px; font-weight: normal;}
.artikel .verlang.aan .image i, .presentatieWijze a i, ul.stappenBalk li.stap.bezig .naam, .presentatieWijze i, .artikel .verlang.aan i, .stappenbalk .klaar a::before, .stap.drie .regel > .omschrijving {font-weight: bold;}
.artikel.detail .detailinkollommen .links {width: 65%;}
.artikel.detail .detailinkollommen .rechts {width: 30%;}
.artikel.detail .rechts .bestellen .bestelknop .aantalMinPlus input {margin-right: 0; width: 60px;}
.artikel.detail .rechts .bestellen .bestelknop input {width: 60px;}
.couponcodeHouder .blok:empty, .kassainkollommen > .rechts .blok, .kassainkollommen > .rechts .blok:empty, .winkelmandjeKnoppen {display: flex;}
.dropdown ul li.active a {font-weight: bold; color: #fff; background: var(--color1); border-color: var(--color1);}
.dropdown.openGeklapt ul, #tabSerieInhoud .shopHolder {margin-bottom: 0;}
.fotoAlbum .volledigGallery .carousel-cell-groot .verhouding {padding-bottom: 100%;}
.kassaArtikelen .artikel .tekst .variatie, .artikel .variatie {margin: 10px 0;}
.kassaArtikelen .artikel .tekst .voorraad .opVoorraad, .kassaArtikel .tekst .voorraad .opVoorraad {margin-left: .25em;}
.kassaArtikelen .artikel td, .kenmerkMobielHouder.accordion .filters .kenmerkgroep, .kenmerkMobielHouder.accordion .filters .kenmerkgroepHouder, .kenmerkMobielHouder.slide .filters .kenmerkgroepHouder .kenmerkgroep, .prijsafspraakLos td, .tooltip.btwGrondslag .btwGrondslagTabel td, .tooltip.btwGrondslag .btwGrondslagTabel th {padding: 0;}
.kassaArtikelen .artikel td.regelStuk, .kassaArtikelen th.regelStuk, .shopTegel .voorraad {text-align: center;}
.kassaArtikelen .artikel td.regelTotaal, .kassaArtikelen th.regelTotaal, table.lijst tr th.bedrag, .shopSortOptie2, .kassaArtikelen .regelTotaal {text-align: right;}
.kassaArtikelen .artikel.nietMeerLeverbaar > td:first-child {padding-left: 0;}
.kassaArtikelen .artikel.nietMeerLeverbaar > td:last-child {padding-right: 0;}
.kassaArtikelen .gratisSetKeuzeRegel td {padding-top: 0;}
.kassaArtikelen .nietMeerLeverbaarTitel a.knop {margin-left: 0;}
.kenmerkMobielHouder .filters .kenmerkgroep .prijsFilterHolder .noUi-target {margin-top: 15px;}
.kenmerkMobielHouder .filters .kenmerkgroep .prijsFilterHolder .prijsfilterVelden input {font-size: inherit;}
.kenmerkMobielHouder.accordion .filters, .kenmerkMobielHouder.slide .filters {background-color: #eee; border: 1px solid #dfdfdf; margin: 10px 0; padding: 10px 5px; position: relative;}
.kenmerkMobielHouder.accordion .filters .kenmerkgroep .kenmerken {background-color: #fff; margin-top: 0; overflow: hidden; position: absolute; transition: all .2s ease; z-index: 10;}
.kenmerkMobielHouder.accordion .filters .kenmerkgroep.open .kenmerken {padding: 0 10px;}
.kenmerkMobielHouder.slide .filters .kenmerkgroepHouder .kenmerkgroep .kenmerken {max-height: 0; overflow: hidden; padding: 0 10px; position: absolute;}
.kenmerkMobielHouder.slide .filters .kenmerkgroepHouder .kenmerkgroep.open, .variatieKeuzePopup .dropdown ul {position: relative;}
.meebestellenSelectie .meebestellenSelectieArtikel input[type="checkbox"] {margin: 0 5px 0 0;}
.nieuwAdres.postcodechecker .postPlaats .plaats:only-child {width: 70%;}
.nieuwAdres.postcodechecker .straat .straatnaam:only-child, .shopLijst .artikel .inner .afbeeldingHouder {margin-right: 0; width: 100%;}
.ordersFilters .filterVeld > select {-moz-appearance: none; -webkit-appearance: none; appearance: none; background: #fff url('data:image/svg+xml;utf8,<svg fill="%23666666" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/><path d="M0 0h24v24H0z" fill="none"/></svg>') no-repeat right center; border: 1px solid #cccccc; border-radius: 3px; color: var(--fontColor1); font-size: inherit; padding: 8px 25px 8px 10px;}
.popupHolder .popup .titel .sluiten {background: #eee; border-radius: 50px; box-sizing: border-box; color: var(--color1); cursor: pointer; font-size: 18px; height: 32px; line-height: 10px; padding: 7px; text-align: center; width: 32px;}
.presentatieWijze a .titel, .shopCompact .artikel .bestellen a.wButBestel.knopMoederArtikel span, .shopCompact .artikel .omschrijving .voorraad, .stap.drie .regel .select:empty, .variatieKeuzePopup .dropdown .keuze, .variatieKeuzePopup .dropdown ul li:first-child, ul.stappenBalk li.stap:last-child::after, .presentatieWijze .titel, .shopTegel .artikel .omschrijving .artikelnr .titel, .shopTegel .artikel .formuleHolder.reset, .shopCompact .artikel .inner .merk, .shopCompact .artikel .bestellen a.wButBestel span, .shopCompact .artikel .voorraad, .shopCompact .artikel .artikelEenheid, .tabsV2 .inhoud > div, .kassaArtikel .tekst .artikelnr .titel, .stap.twee .stap2_naw .keuze, .productCarrousel li .inner .artikelgroep, .productCarrousel li .inhoud .artikelnr, .productCarrousel li .inhoud .artikelGroepPrijs, .dropdown .keuze, .dropdown ul li:first-child {display: none;}
.productCarousel .flickity-button {background: hsla(0, 0%, 100%, 0.75); height: 35px; opacity: 0; width: 35px;}
.productCarousel .flickity-button:hover {background: white;}
.productCarousel .flickity-page-dots {margin: 0; position: absolute;}
.shopCompact .artikel .bestellen, .artikel .bestellen {z-index: 2;}
.shopCompact .artikel .bestellen a.wButBestel.knopMoederArtikel {border-radius: 0 3px 3px 0;}
.shopCompact .artikel .btwinfo {display: block; font-size: 12px; font-weight: normal;}
.shopCompact .artikel h2.titel {font-size: 17px; font-weight: normal; line-height: 1.35em; margin: 0 0 .5em;}
.shopCompact .artikel h2.titel a {font-size: 14px; font-weight: normal; line-height: 1.35em; margin: 0 0 .5em;}
.shopLijst .artikel .inner .afbeeldingHouder .labels img, .shopTegel .artikel .inner .afbeeldingHouder .labels img {height: auto; width: auto;}
.shopLijst .artikel .prijzen .btwinfo, .artikel .artikelEenheid, .artikel .artikelBestelEenheid {font-size: 12px;}
.stap .totaalExclBtw td, .totaalExclBtw td {border-top: 1px solid #ccc; color: var(--color1); font-weight: bold; padding: 5px 0;}
.stap input[type="email"], .stap input[type="number"], .stap input[type="password"], .stap input[type="tel"], .stap input[type="text"], .stap textarea {background-color: #fff;}
.stap.drie .regel.actief {background: #fff; border-color: #41ae28;}
.uploadHolder ul {list-style-position: outside;}
.variatieKeuzePopup .dropdown {cursor: pointer;}
.variatieKeuzePopup .dropdown ul li {margin: 0 5px 5px 0;}
.variatieKeuzePopup .dropdown ul li a {background-color: #fff; border: 1px solid var(--color1); font-weight: bold; padding: 6px;}
.variatieKeuzePopup .dropdown ul li.active a {background-color: var(--color1); border-color: var(--color1); font-weight: bold;}
.variatieKeuzePopup .keuzePopupArtikel .h3 {font-size: 14px; line-height: 1.35em; margin: 0 0 .25em;}
.variatieKeuzePopup input[type="text"], .variatieKeuzePopup textarea {box-sizing: border-box;}
table.lijst tr td.bedrag {text-align: right; white-space: nowrap;}
ul.stappenBalk {margin-bottom: 30px;}
ul.stappenBalk li.stap {display: block; padding: 0; position: relative;}
ul.stappenBalk li.stap.klaar::after {border-color: #41ae28;}
ul.stappenBalk li.stap::after {border-top: 2px solid var(--borderColor1); content: ""; left: 50%; position: absolute; top: 12px; width: 100%; z-index: -1;}
ul.stappenBalk li.stap::before {content: ""; position: relative; width: 25px;}
.aantalPerPagina select {padding-top: 5px; padding-bottom: 5px;}
.aantalPerPagina span {line-height: 31px; padding-right: 5px;}
.presentatieWijze {vertical-align: middle; border-radius: 4px; overflow: hidden; background-color: rgba(0, 0, 0, 0); border-color: var(--fontColor1); border-style: none; box-sizing: content-box;}
.sorteerKnoppen {display: inline-block; vertical-align: middle; padding: 0; border-radius: 4px; overflow: hidden;}
.presentatieWijze a {padding: 5px; display: inline-block; line-height: 1.5em; color: var(--fontColor1);}
.sorteerKnoppen a {display: inline-block; line-height: 1.5em; color: var(--fontColor1); padding: 5px 10px;}
.shopCategorieHolder .categorie {width: 33.3333%; float: left; border-color: var(--fontColor1); border-style: none; box-sizing: content-box;}
.shopCategorieHolder .categorie .inner {position: relative; border-right: 1px solid #eee; border-bottom: 1px solid #eee; transition: all .3s ease;}
.shopCategorieHolder .categorie:nth-of-type(3n+0) .inner, .shopTegel .artikel:nth-of-type(4n+0) .inner {border-right: 0;}
.shopCategorieHolder .categorie .inner:hover {box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.2);}
.shopCategorieHolder .categorie a {z-index: 100; background-image: url("images/spacer.gif"); overflow: visible;}
.shopCategorieHolder .categorie .titel {z-index: -1; text-align: inherit;}
.artikel .labels {z-index: 3;}
.artikel .artikelnr > .titel {padding-right: 0.3em; margin-right: 0;}
.artikel .artikelnr > .nummer {white-space: nowrap;}
.artikel .voorraad, .artikel .extraUitleg {margin-bottom: 0.25em; margin-top: 0.25em;}
.artikel .voorraad .status {border-spacing: 0;}
.artikel .voorraad .status .image {vertical-align: middle; width: auto;}
.artikel .voorraad .status .toelichting {display: table-cell; vertical-align: middle; font-weight: normal; width: auto;}
.artikel .prijzen {margin: 0.25em 0; color: var(--color1);}
.artikel .btwinfo, .artikel .artikelGroepPrijs {font-size: 12px; font-weight: normal; display: block;}
.artikel .bestellen .bestelknop input {width: 24px;}
.artikel .verlang {clear: both; font-size: 12px;}
.artikel .variatie .mArt_holder {margin: 0 0 5px;}
.artikel .project {border-radius: 3px;}
.artikel #extraVrachtkosten {display: inline-block; padding: 5px 10px; margin: 0.5em 0; background-color: #eee; border-radius: 5px;}
.artikel #extraVrachtkosten a {text-decoration: none;}
.relatieBtwPrijs .valuta {padding-right: .25em;}
.relatieBtwPrijs .exBtwToelichting {padding-left: 0.25em;}
.shopLijst .artikel {border-color: #eee; padding: 5px 0;}
.shopLijst .artikel > a {z-index: 0;}
.shopLijst .artikel .inner {display: table; width: 100%; border-spacing: 5px;}
.shopLijst .artikel .inner .col1 {display: table-cell; vertical-align: middle; width: 150px; padding-right: 10px;}
.shopLijst .artikel .inner .col2 {display: table-cell; vertical-align: middle; width: auto; padding: 0;}
.shopLijst .artikel .inner .col3 {display: table-cell; width: 170px; vertical-align: middle; text-align: right; padding: 20px; background: #f5f5f5;}
.shopLijst .artikel .afbeeldingHouder .labels img, .shopTegel .artikel .afbeeldingHouder .labels img, .shopCompact .artikel .afbeeldingHouder .labels img {width: 50px; height: auto;}
.shopLijst .artikel .omschrijving {margin-bottom: 10px; margin-right: 0; margin-top: 0;}
.shopLijst .artikel .prijzen {font-size: 18px; margin-bottom: 10px; margin-left: 0; margin-top: 0; width: auto;}
.shopLijst .bestellen .bestelknop, .shopTegel .artikel .bestellen .bestelknop {display: table;}
.shopLijst .bestellen .bestelknop input, .artikel.detail .bestellen .bestelknop input {display: table-cell; vertical-align: middle; border-radius: 0; height: 44px; position: relative; text-align: center; width: 60px; margin: 0; border-width: medium 0 medium medium; border-style: none; border-color: currentcolor; background: #FFF; font-weight: bold; font-size: 16px;}
.shopLijst .bestellen .bestelknop .wButBestel, .artikel.detail .bestellen .bestelknop .wButBestel {font-size: 14px; display: table-cell; vertical-align: middle; border-radius: 0; padding: 8px 20px; text-align: center; transition: .3s all ease; border: 1px solid var(--color1); background-color: var(--color1); color: #fff;}
.shopLijst .bestellen .bestelknop .wButBestel::before {content: "\f15c"; font-family: "Font Awesome 5 Pro"; margin: 0 10px 0 0; font-weight: normal;}
.shopTegel .artikel {display: block; width: 25%; float: left;}
.shopTegel .artikel:nth-of-type(4n+1), .filters #actieveKenmerken {clear: both;}
.shopTegel .artikel .inner {border-color: currentcolor #eee #eee currentcolor; margin: 0; border-left: none; border-top: none; box-sizing: content-box; display: block; flex-direction: row; height: auto; width: auto;}
.shopTegel .artikel .inner:hover {z-index: 10; border-color: #fff;}
.shopTegel .artikel .inner > a {z-index: 1;}
.shopTegel .artikel .omschrijving h2.titel {height: 2.5em; text-transform: unset; text-align: center; -webkit-box-orient: horizontal; -webkit-line-clamp: none; font-size: 17px; font-weight: normal; margin-bottom: .5em;}
.shopTegel .artikel .omschrijving h2.titel a {font-size: 16px; margin-bottom: 0; letter-spacing: normal;}
.shopTegel .artikel .omschrijving .artikelnr {font-size: 11px; color: #999; text-align: center;}
.shopTegel .artikel .prijzen {text-align: center; margin: 10px;}
.shopTegel .artikel .bestellen .bestelknop input {display: table-cell; height: 42px; vertical-align: top; border-bottom-left-radius: 0; border-top-left-radius: 0; border-style: solid none solid solid; border-width: 1px 0 1px 1px; width: 36px; border-right: 0; background: #fff;}
.shopTegel .artikel .bestellen .bestelknop a.wButBestel {display: table-cell; vertical-align: top; border: 1px solid var(--borderColor1);}
.shopTegel .artikel .opDeHoogteHoudenKnop, .adresHolder .kop, .mijnAccountOrderHolder .item .inhoud .omschrijving {font-family: "Open Sans", Helvetica, Arial, Sans-Serif;}
.shopCompact .artikel > a {display: none; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 0; text-indent: -9999px;}
.shopCompact .artikel .inner {border-spacing: 0; display: table; padding: 5px 0; table-layout: fixed; width: 100%;}
.shopCompact .artikel .inner .col1 {display: table-cell; vertical-align: top; padding: 0 10px 0 0; width: 100px;}
.shopCompact .artikel .inner .col2 {display: table-cell; vertical-align: top; padding: 0 10px 0 0; width: auto;}
.shopCompact .artikel .inner .col3 {display: table-cell; vertical-align: top; padding: 0 10px 0 0; width: 170px; white-space: nowrap;}
.shopCompact .artikel .inner .col4 {display: table-cell; vertical-align: top; width: 55px; padding: 0 0 0 10px; line-height: 1em;}
.shopCompact .artikel .inner h2.titel, .shopCompact .artikel .inner h2.titel a {font-size: 13px; font-weight: normal; margin: 0; line-height: inherit;}
.shopCompact .artikel .afbeeldingHouder {display: block; height: 0; margin-bottom: 0; margin-right: 0; margin-top: 0; opacity: 0; pointer-events: none; position: absolute; visibility: hidden; width: 0; top: 0; left: 0;}
.shopCompact h2.titel a {font-size: 14px;}
.shopCompact .artikel .prijzen, #tooltip div, .kassaArtikel .tekst .variatie .eenheid:last-child {margin: 0;}
.shopCompact .artikel .bestellen input {line-height: 1em; padding: 4px; margin: 0; float: left; border-radius: 3px 0 0 3px; height: 22px; width: 34px;}
.shopCompact .artikel .bestellen a.wButBestel {border-radius: 0 3px 3px 0; box-sizing: border-box; line-height: 0; padding: 10px 6px; top: 0 !important;}
.shopCompact .artikel .bestellen a.wButBestel:before {content: "+";}
.shopCompact .artikel .artikelnr {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%;}
.artikel.detail .linksenrechts {display: flex; width: 100%;}
.artikel.detail .links {width: 65%; padding-right: 35px; box-sizing: border-box;}
.artikel.detail .rechts {background: #f5f5f5; border-radius: 3px; padding: 35px; width: 30%; box-sizing: border-box;}
.artikel.detail h1 {font-weight: bold; line-height: 1.35em; margin-bottom: .5em;}
.artikel.detail .rechts .bestellen {margin-bottom: 20px;}
.artikel.detail .bestelknop {display: inline-table; position: relative; border-spacing: 0;}
.artikel.detail .bestellen .bestelknop .wButBestel::before {content: "\f07a";}
.artikel.detail .gekoppeldeCategorie {border-top: 1px dashed #dcdcdc; padding-bottom: 0; padding-top: 20px; border-bottom-color: var(--fontColor1); border-bottom-style: none; margin-bottom: 0;}
.thumbnailGallery .carousel-cell.is-selected img, .thumbnailGallery .carousel-cell-yt.is-selected img {border-color: #365376;}
.shopNavigatie {margin-bottom: 20px; margin-top: 0;}
.shopNavigatie .button {border-style: none; background-color: #f5f5f5; padding: 8px; line-height: 1; font-size: 13px;}
.tabsV2, .stappenKnop {margin-top: 10px;}
.tabsV2 .titels > div {padding: 10px 20px; border-top-left-radius: 0; border-top-right-radius: 0;}
.tabsV2 .inhoud {clear: both; border: 1px solid #eee; padding: 20px; box-sizing: border-box; background: #fff; position: relative;}
#tooltip {background-color: #fff; border: 1px solid #ccc; border-radius: 5px; opacity: 1; padding: 10px; position: absolute; z-index: 3000; box-shadow: 1px 1px 3px #ccc;}
#tooltip h3 {color: #7F7F7F; font-weight: bold; font-size: 1px; position: absolute; visibility: hidden;}
.bedrijfsGegevens.zakelijkTonen {max-height: 300px;}
.vatGegevens .btwGegevens {padding: 10px; line-height: 1.25em; background: #fff; border-radius: 3px; margin: 5px 0 0 10px; font-size: 12px; display: block; border: 1px solid #ccc; color: var(--color1);}
.adresHolder .adressen .item.open {z-index: 100; box-shadow: 0 0 50px -8px rgba(0,0,0,.25);}
.mijnAccountOrderHolder .knoppen a {background-color: rgba(54, 82, 95, .1); color: #365276; border-radius: 3px; display: inline-block; font-size: 12px; padding: 5px 8px; position: relative; text-decoration: none; transition: all 0.3s ease 0s; line-height: normal; margin-right: 5px; margin-top: 5px;}
.mijnAccountOrderHolder .knoppen a.activeren {background-color: #365276; color: #fff;}
.mijnAccountOrderHolder .knoppen a.verwijderen:hover {background-color: rgba(239, 104, 104, .1); color: #ef6868;}
.mijnAccountOrderHolder .item .artikelen {margin: auto 0 auto auto;}
.mijnAccountOrderHolder .item .artikelen .afbeeldingHouder {margin-bottom: 5px; margin-top: 5px;}
.mijnAccountOrderHolder .item .artikelen .afbeeldingHouder.plusje .meeraantal {background-color: #365276;}
.mijnAccountOrderHolder.detail .omschrijving .titel {color: #365376;}
.mijnAccountOrderHolder.detail .omschrijving .knoppen a {margin-left: 5px;}
.taf1 {width: 150px;}
#taf10, .uploadFilename {width: 250px;}
.tafHolder .kop {font-family: var(--fontFamily1);}
.VOVIP {border: 1px solid var(--borderColor1); color: #555; display: block; margin: 5px 0;}
.VOVTA {border: 1px solid var(--borderColor1); height: 40px; color: #555; display: block; margin-top: 10px;}
.vrijveldVeldA, .vrijveldVeldB {width: 202px;}
.stappenKnop a.volgendeStap {width: 100%; display: block; text-align: center; padding: 10px; box-sizing: border-box; font-size: 15px; font-weight: bold;}
.volgendeStap.disabled {opacity: .5; pointer-events: none;}
.pdfKnop, .stap.twee > .blokholder.algemeneGegevens, .stap.drie .blokholder:first-of-type {float: left;}
.stap .blokholder > .titel {background: #eee; padding: 10px 15px; border-radius: 5px 5px 0 0;}
.stap .blokholder > .content {padding: 15px; background: #f5f5f5; border-radius: 0 0 5px 5px;}
.stap .kassaArtikelen {margin-bottom: 20px; border-bottom: 2px solid var(--borderColor1);}
.kassaArtikelen th {font-size: 90%; border-bottom-width: 2px;}
.kassaArtikel td {border-bottom: 1px solid #eee; padding: 10px 0;}
.kassaArtikel:last-child td {border-bottom: 0;}
.kassaArtikel .regelTotaal {text-align: right; max-width: 100px; white-space: nowrap;}
.kassaArtikel .regelTotaal .prijs {font-weight: bold; font-size: 14px; color: var(--color1); line-height: 1.4em;}
.kassaArtikel .aantallen {text-align: center; padding-left: 10px; padding-right: 10px;}
.kassaArtikel .aantallen input, .kassaArtikelen .kassaArtikel .regelVolgorde input {width: 54px; text-align: center;}
.kassaArtikel .aantallen .eenheid, .kassaArtikel .tekst .variatie .eenheid, .kassaArtikelen .kassaArtikel .regelVolgorde .eenheid {display: block; margin: 0 0 5px;}
.kassaArtikel .aantallen .verwijderen:hover a, .shopTegel .artikel .inner .rechtsboven div a:link, .shopTegel .artikel .inner .rechtsboven div a:visited {color: var(--fontColor1);}
.kassaArtikel .tekst {vertical-align: middle; hyphens: auto;}
.kassaArtikel .tekst a.kassaArtikelTitel {text-decoration: none; color: var(--color1); display: block; line-height: 1.25em;}
.kassaArtikel .tekst .artikelnr {text-transform: uppercase;}
.kassaArtikel .verwijderKnop {padding-left: 10px;}
.kassaArtikel.gratis, .kassaArtikel.gratis a.kassaArtikelTitel {color: #41ae28;}
.kassaArtikel.gratis input {border: 0;}
.kassaArtikel .kassaArtikelAfbeeldingHolder {vertical-align: middle; width: 100px; text-align: center; padding-right: 20px;}
.kassaArtikel .kassaArtikelAfbeeldingHolder .afbeeldingHouder img {width: auto !important; height: auto !important; max-width: 100%;}
.kassaArtikel .tekst .opmerkingHolder {margin: 5px 0;}
.kassaArtikel .tekst .variatie {line-height: 1.5em; font-size: 12px; margin: 10px 0; background: #eee; display: inline-block; padding: 15px; border-radius: 3px; min-width: 150px;}
.kassaArtikel .tekst .variatie .titel {font-weight: bold; color: var(--color1); display: block;}
.kassaArtikel .kortingsbon .titel {margin-top: 7px; display: inline-block;}
.kassaArtikelen .kassaArtikel .regelVolgorde .aantalVolgorde {display: flex; background: #ddd; width: 90px; margin: 0 auto;}
.kassaArtikelen .kassaArtikel .regelVolgorde .aantalVolgorde > * {width: 33.333% !important; padding: 5px !important; box-sizing: border-box !important; margin: 0 !important; line-height: 1; display: flex; border-radius: 0 !important; transition: .3s all ease; color: var(--color1); border-color: var(--borderColor1) !important;}
.kassaArtikelen .kassaArtikel .regelVolgorde .aantalVolgorde .down:hover, .kassaArtikelen .kassaArtikel .regelVolgorde .aantalVolgorde .up:hover {cursor: pointer; background: #d0d0d0;}
.kassaArtikelen .kassaArtikel .regelVolgorde .aantalVolgorde > * > i {margin: auto;}
.stap .totalen {background: #eee; width: 48%; float: right; z-index: 1; padding: 30px; box-sizing: border-box; border-radius: 5px;}
.stap .totalen .stappenKnop {padding: 0; background: none; border: 0;}
.stap .couponcode {display: inline-table; width: 100%; margin: 10px 0; background: #f5f5f5; box-sizing: border-box;}
.stap .couponcode #CouponCodeV {display: table-cell; vertical-align: middle; margin: 0; border-radius: 3px 0 0 3px; text-transform: uppercase;}
.stap .couponcode #CouponCodeV::placeholder {text-transform: none;}
.stap .couponcode a.wButControleer {display: table-cell; vertical-align: middle; border-radius: 0 3px 3px 0; padding: 5px 12px; line-height: 1em; text-align: center;}
.stap.twee .tekstNieuwAdres {padding: 5px; position: relative; z-index: 1;}
.nieuwAdres.postcodechecker .postPlaats .postcode, .nieuwAdres.postcodechecker .postPlaats .huisnummer {width: 50%;}
.nieuwAdres.postcodechecker .straat .straatnaam {width: 100%; margin-right: 0;}
.stap.twee > .blokholder, #stap2_factuuruitklap, #stap2_bewaaraccount {float: right; width: 48%; clear: right;}
.stap.drie .blokholder {width: 48%; float: right;}
.stap.drie .regel .select, .inhoud.totaal .prijs, body:has(.stappenbalk) .art-sidebar1, body:has(.stappenbalk) .art-sidebar2, body:has(.stappenbalk) .breadcrumbs {display: none !important;}
.stap.drie .regel {padding: 10px 15px;}
.stap.drie .regel:before {opacity: 0; content: "\f00c"; position: absolute; right: 0; top: 0; padding: 4px; font-size: 12px; background: #41ae28; color: #fff; font-family: "Font Awesome 5 Pro"; line-height: 1em; border-bottom-left-radius: 3px;}
.stap.drie .regel.actief:before {opacity: 1;}
.stap.drie .regel .label {float: right; padding: 10px;}
.winkelmandjeKnoppen a {width: 50%; margin: 0 5px; text-align: center;}
.winkelmandjeKnoppen a.winkelmandjeKnopKassa, .winkelmandjeKnoppen a.winkelmandjeKnopOfferte {background: var(--color1); color: #fff;}
.winkelmandjeLeeg {text-align: center; padding: 50px;}
.winkelmandje4 {color: var(--color1); font-size: 16px; font-weight: bold; padding: 10px 20px; text-align: right;}
.speedSearch.artikelen {width: 50%; float: left; border-right: 1px dashed #eee; box-sizing: border-box;}
.speedSearch.categorie {width: 50%; float: right;}
.speedSearch ul li .thumbnail {float: right; height: 50px; width: 50px; margin-left: 10px; text-align: center; overflow: hidden;}
.speedSearch ul li .thumbnail img {height: 50px; border-radius: 3px;}
.speedSearch ul li .artikelNr, .speedSearch .categorie {line-height: 1.5em;}
.speedSearch .resultaat .aantal {font-size: 24px; display: inline-block; margin-right: 3px;}
.filters {-moz-user-select: none; background-color: #eee; border-color: #dfdfdf; margin-top: 10px; margin-bottom: 10px; padding: 10px 5px; position: relative;}
.filters .kenmerkgroep {padding: 0; float: left; margin: 5px; height: 32px; border-top-color: var(--fontColor1); border-top-style: none;}
.filters .kenmerkgroep a.titel {padding: 5px 10px; min-width: 90px; border-radius: 3px; background-color: #fff; box-shadow: 0 1px 1px rgba(0,0,0,.3); transition: all .2s ease; display: inline-block; cursor: pointer; font-size: inherit; line-height: inherit; margin-bottom: 0;}
.filters .kenmerkgroep a.titel img, .filters .kenmerkAfbeelding {position: relative; top: 3px; margin-right: 3px; opacity: .5;}
.filters .kenmerkgroep .kenmerken {max-height: 0; transition: all .2s ease; padding-left: 10px; padding-right: 10px; background-color: #fff; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; position: absolute; min-width: 150px; box-shadow: 0 1px 5px rgba(0,0,0,.0); z-index: 10;}
.filters .kenmerkgroep:hover .titel {box-shadow: 0 1px 5px rgba(0,0,0,.2); border-bottom-right-radius: 0; border-bottom-left-radius: 0;}
.filters .kenmerkgroep:hover .kenmerken {max-height: 500px; padding-top: 10px; padding-bottom: 10px; border-top: 0; box-shadow: 0 3px 3px rgba(0,0,0,.2); z-index: 5;}
.filters .filterCheck label .aantal {background-color: #eee; border-radius: 10px; font-weight: bold; min-width: 10px; padding: 3px 6px; text-align: center;}
.filters .toelichting {float: left; margin-left: 5px; color: inherit; display: block; font-size: inherit; font-weight: inherit; margin-top: 0;}
.filters .toelichting h2 {font-size: 15px;}
.filters .beschikbaar {position: relative; color: inherit; display: block; font-size: inherit; font-weight: inherit; margin-top: 0;}
.filters a.wButFilter {position: relative; float: right; font-weight: bold; padding: 5px 10px; border-radius: 6px; border: 0 solid #ccc; box-shadow: 0 1px 5px rgba(0,0,0,.0); transition: all .2s ease; margin: 5px; text-decoration: none; background-color: var(--color1); color: #fff;}
.filters a.wButFilter:hover {box-shadow: 0 1px 5px rgba(0,0,0,.3);}
.filters a.wButFilter:active {top: 1px; box-shadow: inset 0 1px 5px rgba(0,0,0,.3);}
.filters .glow {animation: glow 0.4s alternate; animation-iteration-count: 2; -webkit-animation: glow 0.4s alternate; -webkit-animation-iteration-count: 2;}
.filters .actieveKenmerkenLijst {padding-left: 5px; padding-right: 5px;}
.filters .actiefKenmerk {background-color: #fff; padding: 3px 8px; float: left; margin-top: 5px; margin-right: 10px; border-radius: 4px;}
.kenmerkArt {padding-bottom: 0; padding-top: 0; clear: both; border-bottom-color: var(--fontColor1); border-bottom-style: none; box-sizing: content-box; display: block; transition: none;}
.kenmerkArt .groep {color: var(--color1); float: left; font-weight: bold; width: 95px; min-width: 0;}
.kenmerkArt .kenmerk {height: 1.65em; overflow: hidden; padding-right: 5px;}
.kenmerkArt .toevoeging {font-style: italic;}
.kenmerkArt .toevoeging.ja {background: url("images/vinkje.png") no-repeat; padding-left: 20px; float: left; height: 16px;}
.kenmerkArt .toevoeging.nee {background: url("images/red_x.gif") no-repeat; padding-left: 20px; float: left; height: 16px;}
.filtersLinks .kenmerkgroep {display: block; float: none;}
.filtersLinks .kenmerkgroep .kenmerken {border-radius: 0 0 5px 5px; max-width: 400px; width: 168px;}
.prijsFilterHolder .prijsfilterKnop, .prijsFilterHolder .noUi-target .noUi-base .noUi-connect {background-color: #365376;}
.dropdown ul {position: relative; line-height: 1;}
.dochters .dropdown ul li:first-child {display: inline-block;}
.dropdown ul li {margin-bottom: 5px; margin-right: 5px; display: inline-block;}
.dropdown ul li	a {padding: 6px; clear: both; font-weight: bold; background-attachment: scroll; background-image: none; background-position-x: 0%; background-position-y: 0%; background-repeat: repeat; background-size: auto; border: 1px solid var(--color1);}
.dropdown ul li.active a::before {content: "\f00c"; margin-right: 3px; font-family: "Font Awesome 5 Pro";}
.dropdown.focus, .shopCategorieHolder .categorie:hover {box-shadow: none;}
.dropdown.focus::before {content: "\f054"; font-family: "Font Awesome 5 Pro"; position: absolute; left: -20px; top: 2px; display: block; cursor: default; color: var(--color1);}
.leverdagSelectie .dropdown ul li a {border-width: 1px;}
.leverdagSelectie .dropdown ul li.active a:hover {border: 2px solid var(--color1); background-color: #fff;}
.schermWinkelMandje.meebestellenActief .melding .shopTegel .artikel {display: block; float: left; position: relative; width: 33.3333%;}
#extraSchermWinkelmand .schermWinkelMandje .artikel {box-shadow: none !important; margin: 0; border-width: medium medium 1px; border-style: none none solid; border-color: currentcolor currentcolor #eee; border-radius: 0;}
.formuleHolder .titel {background-color: #ddd; padding: 10px 15px;}
table.lijst .bedrag {text-align: right; padding-right: 30px;}
.blader_holder {font-family: "futura-pt",Helvetica Neue,Helvetica,Arial,sans-serif;}
.blader_tabel1_s {border-color: var(--color1); border-radius: 0;}
.Gv3Thumb {background-color: #fff; box-shadow: 0 2px 3px #ccc; display: table-cell; float: left; line-height: 0; margin: 7px; padding: 2px; position: relative; text-align: center;}
.Gv3ThumbImg {background-color: #fff; display: table-cell; vertical-align: middle;}
.Gv3Thumb .desc {font-size: 13px; font-weight: normal; color: var(--color1);}
.Gv3Thumb .desc2 {position: absolute; bottom: 5px; left: 5px; background-color: #f5f5f5; border: 1px solid #ccc; box-shadow: 1px 1px 3px #ccc; padding: 2px 5px;}
.relatieItem {display: table; float: left; height: 200px; margin: 10px 0 0; width: calc(50% - 5px);}
.relatieItem:nth-child(2n+1) {margin: 10px 10px 0 0;}
.relatieItem .afbeelding {display: table-cell; vertical-align: top; width: 100px !important;}
.relatieItem .relinfo {box-sizing: border-box; padding: 0 10px; display: table-cell; vertical-align: top;}
.popupHolder .popup {box-shadow: 0 2px 30px rgba(0, 0, 0, 0.3); padding: 40px; max-height: 100%; overflow: auto;}
.popupHolder .popup .sluiten {position: absolute; top: 10px; right: 10px; color: var(--color1); padding: 7px; font-size: 18px; border-radius: 50px; background: #eee; height: 32px; width: 32px; line-height: 10px; text-align: center; box-sizing: border-box; cursor: pointer;}
.vak .inhoud.home-slider {display: grid; grid-template-columns: 3fr 2fr; gap: 30px;}
#aantal {background-attachment: scroll; background-image: none; background-position-x: 0%; background-position-y: 0%; background-repeat: repeat; background-size: auto; font-weight: bold; border-radius: 3px;}
body:has(.stappenbalk) .art-content {width: 100% !important;}
.kenmerkMobielHouder .filters .filterknop a {box-sizing: content-box; text-align: inherit; width: auto; z-index: auto;}
.filters .kenmerkgroep .kenmerken .kenmerk input[type="checkbox"] {position: static; top: auto;}
.shopTegel .artikel .inner .rechtsboven div a {background: none; border-radius: 0; display: inline; padding: 0; color: inherit;}
.filters .kenmerkgroep .kenmerken .kenmerk:hover {background-color: transparent;}
#tabSerieInhoud .shopTegel .artikel.artikelSerieActief .inner:hover {border-color: #fff;}
#tabSerieInhoud .shopTegel .artikel .inner:hover {border-color: #fff; box-shadow: 0 0 60px 5px rgba(0, 0, 0, 0.1) !important;}
#tabSerieInhoud .shopTegel .artikel .inner {border-radius: 0; border-right-width: 1px; border-bottom-width: 1px; padding: 15px;}
.blader_tabel1_n {border-radius: 0;}
.filters .kenmerkgroep .kenmerken .kenmerk {border-radius: 0; margin-left: 0; margin-right: 0;}
.shopTegel .artikel .inner .rechtsboven div a:hover, .shopTegel .artikel .inner .rechtsboven div.aan a {color: var(--color1);}
.shopLijst .artikel .detailKnop, .shopTegel .artikel .inner .rechtsboven div .toelichting, #tabSerieInhoud .artikel .bestellen, #tabSerieInhoud .artikel .prijzen, #tabSerieInhoud .shopTegel .artikel .omschrijving, .kenmerkArt .kenmerken .kenmerk .toevoeging:empty, .kenmerkArt .kenmerken .kenmerk, .kenmerkArt .kenmerken .kenmerk:last-child::after {display: revert;}
table .blader_tabel1_n a {color: #737373; transition: all 0.3s ease 0s;}
.shopCategorieHolder a:link, .shopCategorieHolder a:visited {text-decoration: underline;}
#tabSerieInhoud .shopTegel .artikel .voorraad .status .toelichting {background-color: rgba(0, 0, 0, 0); border-bottom-color: var(--fontColor1); border-bottom-style: none; border-top-color: var(--fontColor1); border-top-style: none; color: inherit; line-height: inherit; padding-bottom: 0; padding-top: 0;}
.kenmerkMobielHouder.standaard .filters {border-color: #dfdfdf; border-radius: 0; box-sizing: content-box; display: block; overflow: visible; padding: 10px 5px; transition: none;}
#tabSerieInhoud .shopTegel .artikel.artikelSerieActief .inner {border-color: var(--fontColor1) #eee #eee var(--fontColor1);}
.presentatieWijze select {border: 1px solid #cccccc;}
.shopSortOptie {border-color: var(--fontColor1); border-radius: 0; border-style: none; padding: 0;}
.kenmerkMobielHouder .filters .filterknop a.wButFilter {border-radius: 6px; margin: 5px; padding-bottom: 5px; padding-top: 5px; transition: all .2s ease;}
.filters .actieveKenmerken {border-top-color: var(--fontColor1); border-top-style: none; box-sizing: content-box; color: inherit; line-height: inherit; padding: 0;}
#tabSerieInhoud .shopTegel .artikel .voorraad {bottom: auto; left: auto; position: static; right: auto; top: auto;}
.artikel .artikelnr {color: inherit; font-size: inherit;}
.filters .kenmerkgroep .kenmerken label .aantal {font-size: 11px; margin-top: 2px;}
.formuleHolder > .titel {color: inherit; font-size: inherit; line-height: inherit; margin-bottom: 0; text-decoration: revert;}
.kenmerkArt .kenmerken .kenmerk .toevoeging {color: inherit;}
.shopLijst .artikel .prijzen .artikelEenheid {color: inherit; display: inline; font-size: 12px; line-height: inherit; white-space: revert;}
.shopCategorieHolder, .shopTegel {gap: normal; display: block; grid-template-columns: none;}
.filters .kenmerkgroep .kenmerken label {cursor: default; overflow: visible; padding: 2px;}
.shopLijst .artikel .inner .inhoud {display: block; width: auto;}
.kenmerkMobielHouder .filters .filterBovenkant .toelichting {flex: revert;}
.shopLijst .artikel .meerinfo {font-size: inherit; line-height: inherit;}
.shopTegel .artikel .inner .rechtsboven div a i.far {font-weight: 400;}
#tabSerieInhoud .shopTegel .artikel .inner .afbeeldingHouder, #tabSerieInhoud .shopTegel .artikel .meerinfo, .artikel.detail .shopDetailModernKenmerken, .shopLijst .artikel .bestellen, .shopTegel .artikel .bestellen, .shopTegel .artikel .inner .afbeeldingHouder {margin-bottom: 0; margin-top: 0;}
#tabSerieInhoud .shopTegel .artikel .voorraad .status {margin: 0; width: auto;}
.filters .kenmerkgroep ul.kenmerken {margin-left: 0; margin-right: 0;}
.artikel .afbeeldingHouder img, .volledigGallery .carousel-cell-groot img {object-fit: fill;}
.filters .kenmerkgroep .kenmerken li.kenmerk {padding-left: 0; padding-right: 0;}
.formuleHolder {position: static; z-index: auto;}
.blader_tabel1 {width: auto;}
.filters .kenmerkgroep .kenmerken label .aantal::after, .kenmerkArt .kenmerken .kenmerk .toevoeging::after, .kenmerkArt .kenmerken .kenmerk::after, .filters .kenmerkgroep .kenmerken label .aantal::before, .kenmerkArt .kenmerken .kenmerk .toevoeging::before {content: none;}
.artikel .voorraad .status .toelichting.negatief::before, .artikel .voorraad .status .toelichting.positief::before, .artikel.detail .gekoppeldeCategorie li::before {font-weight: inherit;}
.presentatieWijze select:focus {border-color: var(--color1);}
table .blader_tabel1_n:hover a {color: #fff;}

/* footer */
.pageFooter .h2, .pageFooterHolder a:hover, .pageFooter h2, .sitemap1ul a {color: var(--color1);}
.copyright {display: inline-block; margin-right: 5px; margin-left: 5px; font-weight: bold; vertical-align: middle;}
.pageFooterHolder {background-color: #fff;}
.pageFooterHolder .pageFooter {color: var(--color1); padding-left: 20px; padding-right: 20px; position: relative; max-width: 1200px; border-top: 1px solid var(--borderColor1);}
.pageFooterHolder a {color: #999;}
.pageFooter h3 {color: var(--color1); font-size: 17px;}
.pageFooterKnoppenHolder {background-color: #FFF;}
.pageFooterKnoppenHolder .pageFooterKnoppen {color: var(--color1); position: relative; max-width: 1200px; padding-right: 20px; padding-left: 20px; text-align: center; display: block; font-size: inherit; line-height: inherit;}
.pageFooterKnoppenHolder .pageFooterKnoppen a {margin-right: 5px; margin-left: 5px; vertical-align: middle;}
.sitemap1 {margin-top: 30px; margin-bottom: 30px; max-width: 1200px; padding: 20px; box-sizing: border-box;}
.sitemap1ul > li {width: 23%; font-size: 15px;}
.pageFooterKnoppenHolder .pageFooterKnoppen .copyright {opacity: 1;}

/* overig */
.postPlaats .plaats:only-child {width: 70%;}
.straat .straatnaam:only-child {margin-right: 10px; width: 70%;}
.productCarrousel li {border: 1px solid var(--borderColor1); line-height: 1.25em; margin-right: 25px !important; transition: all 0.3s ease 0s; width: 200px;}
.productCarrousel li:hover {box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.15);}
.productCarrousel li .inner a {display: block; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 0; text-indent: -9999px;}
.productCarrousel li .afbeeldingHouder {width: 100%;}
.affiliateRow {width: 100%; border-spacing: 0; border-collapse: collapse; padding: 0;}
.affiliateRow tr:hover td {background-color: #fcfcfc;}
.affiliateTotaal {text-align: right; padding-right: 15px !important;}
.wmSluiten {position: absolute; right: 17px; top: 17px; font-size: 15px; background: #f5f5f5; line-height: 1; padding: 9px; border-radius: 40px; color: var(--color1); cursor: pointer; width: 15px; height: 15px; vertical-align: middle; text-align: center; transition: .3s all ease;}
.speedSearch ul {z-index: 100; max-height: calc(100vh - 280px); overflow-y: auto;}
.speedSearch > ul > li {color: #383838; position: relative;}
.speedSearch > ul > li a {color: inherit; transition: all .2s ease; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.speedSearch ul li:hover {background-color: #eee;}
.speedSearch ul li a	strong {text-decoration: underline;}
.speedSearch ul li .omschrijving {font-size: 15px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.speedSearch .resultaat {color: var(--color1); font-size: 17px; font-weight: bold; position: relative;}
#extraSchermWinkelmand .schermWinkelMandje .melding {box-shadow: 0 2px 30px rgba(0, 0, 0, 0.3); max-width: 520px; min-width: 250px; overflow-y: scroll;}
#extraSchermWinkelmand .schermWinkelMandje .melding .icoon {background-color: #64a43a; border-radius: 50px; color: #fff; display: block; font-size: 13px; left: -10px; padding: 5px; position: absolute; top: -10px; border: 1px solid #fff;}
#extraSchermWinkelmand .schermWinkelMandje .melding .afbeeldingHouder {line-height: 0; margin-right: 20px; position: relative;}
#extraSchermWinkelmand .schermWinkelMandje .tweedeRijUit, .geslacht .onbekend, .typeKlant .particulier {display: none;}
.lijst tr.inactief td a {color: #aaa;}
.klantWorden {background: #FFF; padding: 15px; box-sizing: border-box; margin: 20px 0;}
.nietMeerVerplicht, .resCategorieen ul li.actief a:hover, .resCategorieen ul li.actief a:link, .resCategorieen ul li.actief a:visited {background-color: #fff;}
.slideshowBorder {border-color: #ccc !important;}
.nieuws .bericht .titel a, .nieuws.widget .bericht .nieuwstitel a {font-family: var(--fontFamily1);}
.nieuwWachtwoordHolder .nieuwWachtwoordContent {background-color: #f2f2f2;}
.HeaderHolder {line-height: 0;}
.HeaderHolder img {width: 100% !important; height: auto !important;}
.HeaderHolder #map-canvas {height: 160px !important;}
.aLandingMenu {background-position-x: 4px; background-position-y: 4px; border-radius: 5px 5px 0 0; height: 24px; padding: 0; position: absolute; top: 2px; width: 24px; z-index: 20; left: 20px;}
.aLandingMenu:hover {background-color: #fff; box-shadow: 0 2px 4px rgba(0,0,0,.3);}
.LandingMenu {box-shadow: 0 2px 4px rgba(0, 0, 0, .3); border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-top-right-radius: 5px; top: 24px;}
.LandingMenu  li {padding: 3px 8px;}
.LandingMenu  li a {color: var(--color1);}
.LandingMenu  li a:visited, .LandingMenu  li a:hover {text-decoration: none; font-size: 11px; color: var(--color1);}
.meldingHouder .melding {box-shadow: 0 33px 40px -16px rgba(0,0,0,.2);}
.privacyMelding {box-shadow: 0 0 60px 5px rgba(0, 0, 0, 0.1);}
.nieuwWachtwoordHolder {max-width: 1200px; position: relative; padding: 0 20px;}
.fixedBlok.achtergrond {background-image: url(images/corporate-wear.jpg); background-repeat: no-repeat; background-size: cover; background-position-x: center; background-position-y: center;}
.fixedBlok {position: relative; background-attachment: fixed; opacity: 1; transition: .3s all ease;}
.meldingHolder {background: #a41d17; color: #FFF; text-align: center; padding: 5px; box-sizing: border-box; width: 100%;}
.openklapper {width: 39px; background-image: url("images/res_plus.svg"); background-color: #FFF; background-repeat: no-repeat; background-position-x: center; background-position-y: center; background-size: 50%; box-sizing: content-box; color: inherit; padding: 0; text-align: inherit; text-decoration: revert;}
.openklapper.open {background-image: url("images/res_min.svg");}
.resCategorieen {background-color: #f5f5f5; margin-bottom: 0; margin-left: -10px; margin-right: -10px; padding: 10px;}
.resCategorieen ul li, .resCategorieen ul li:last-child {margin-right: 10px;}
.resCategorieen ul li a {border-color: #eee; border-width: 2px; background-color: #fff; border-radius: 0;}
.resCategorieen ul li.actief a {border-color: var(--borderColor1); background-color: #fff;}
.resCategorieen::-webkit-scrollbar {display: revert;}
.openklapper::before {content: none;}

@media (min-width: 761px) {
  #tabSerieInhoud .artikel .favorieten {display: block;}
  #tabSerieInhoud .shopTegel .artikel .voorraad {display: block;}
}

@media (min-width: 1001px) {
  .account .seperator {display: list-item;}
  #tabSerieInhoud .shopTegel .artikel:nth-of-type(4n+0) .inner {border-right-width: 0;}
}

@media (min-width: 1201px) {
  .bovenkant .art-nav {margin-bottom: 0; margin-left: 0; margin-top: 0;}
}

@media screen and (max-width: 1500px) {
  .art-Sheet {max-width: 1200px;}
}

@media screen and (max-width: 1200px) {
  .art-Sheet {max-width: 1000px;}
  .bovenkant {height: 120px;}
  .bovenkant .art-nav {left: 0; right: 0; position: absolute; top: 80px; margin-top: 0; margin-right: auto; margin-bottom: 0; border-top: 1px solid var(--borderColor1); border-bottom: 1px solid var(--borderColor1);}
  .vak .inhoud.home-slider {grid-template-columns: 1fr;}
  .pageFooterHolder .pageFooter, .pageFooterKnoppenHolder .pageFooterKnoppen {max-width: 1000px;}
}

@media (min-width: 761px) and (max-width: 1000px) {
  #tabSerieInhoud .shopTegel .artikel:nth-of-type(3n+0) .inner {border-right-color: currentcolor; border-right-width: 0;}
  #tabSerieInhoud .shopTegel .artikel:nth-of-type(4n+0) .inner {border-right-color: #eee;}
}

@media screen and (max-width: 1000px) {
  .art-Sheet {max-width: 760px;}
  .zoeken .veld #zoekWoordID {width: 150px;}
  .account .welkom {display: none;}
  .art-menu li {margin-right: 5px; margin-bottom: 8px; margin-left: 5px;}
  .art-menu li a .t {font-size: 14px;}
  #speedsearchResult {right: -570px;}
  .liquid-slide-sjabloon .inhoud {position: relative; max-width: none; left: 0; top: 0; font-size: 13px; padding: 5px 15px;}
  .liquid-slide-sjabloon .inhoud h2 {font-size: 16px;}
  .liquid-slide-sjabloon .inhoud p {display: none;}
  .liquid-slide-sjabloon .sliderWrapper {background-color: var(--color1);}
  .shopCategorieHolder .categorie, .shopTegel .artikel {width: 33.3%;}
  .shopTegel .artikel:nth-of-type(4n+1) {clear: none;}
  .shopTegel .artikel:nth-of-type(3n+1) {clear: both;}
  .shopTegel .artikel:nth-of-type(4n+0) .inner {border-right: 1px solid #eee;}
  .shopTegel .artikel:nth-of-type(3n+0) .inner {border-right: 0;}
  .adresHolder .adressen .item {flex-basis: calc(50% - 10px);}
  .shopHeader .blok {display: block;}
  .shopHeader .blok .linksVak {display: block; width: 100%; padding-top: 50%;}
  .shopHeader .blok .rechtsVak {display: block; width: 100%;}
  .detailOrderHolder {flex-direction: column;}
  .detailOrderHolder .detailOrderBlok {width: calc(100% - 20px);}
  .detailOrderHolder .detailOrderBlok table.lijst tr {background-image: unset; background-position-x: unset; background-position-y: unset; background-size: unset; background-repeat: unset; background-attachment: unset; background-origin: unset; background-clip: unset; background-color: unset; border: 0; padding: 5px; margin: 0;}
  .detailOrderHolder .detailOrderBlok table.lijst tr td {display: table-cell; border-bottom: 1px solid #eee;}
  .vak .inhoud.home-slider {gap: 15px;}
  .pageFooterHolder .pageFooter, .pageFooterKnoppenHolder .pageFooterKnoppen {max-width: 760px;}
}

@media (max-width: 900px) {
  select {font-size: inherit;}
  .bovenkantHolder .bovenkant .resMenubalkinhoud, .hoverMenu {display: block;}
  .bovenkantHolder .winkelmenu {overflow: visible; white-space: revert;}
  .extrabovenkantHolder.open {z-index: auto;}
  .vak {padding-bottom: 0; padding-top: 0;}
  .tabsV2 .inhoud > div {display: none !important; margin: 0;}
  .tabsV2 .titels {display: flex;}
  .tabsV2 .inhoud > div.actief {display: block !important;}
}

@media (min-width: 761px) and (max-width: 900px) {
  body {-moz-text-size-adjust: revert; -webkit-text-size-adjust: revert;}
  input[type="email"], input[type="password"], input[type="text"], textarea {font-size: inherit;}
  .formulier_text {max-width: none;}
  h1, h2, h3 {clear: none;}
  .art-sidebar1 {display: block;}
  .resMenubalk {display: none;}
  .FCK4kolTd {display: table-cell; width: 20%;}
  .FCK4kolTdS {display: table-cell;}
  .pageFooterHolder .pageFooter {padding-bottom: 30px; padding-top: 45px;}
  .resCategorieen {display: none;}
  .inschrijvenKolom {flex-direction: row;}
  .inschrijvenKolom .rechts {margin-left: 20px; width: 450px;}
  #map-canvas {max-width: none;}
  iframe {max-width: none; width: 300px !important;}
}

@media screen and (max-width: 900px) {
  input[type="number"], input[type="tel"] {font-size: inherit;}
  .privacyMelding .knoppen {padding: 30px;}
  #extraSchermWinkelmand .schermWinkelMandje .melding .meldingBoven td .knoppen {padding: 15px; width: 135px;}
  #extraSchermWinkelmand .schermWinkelMandje .melding .meldingBoven td .knoppen a {box-sizing: border-box; margin: 5px; text-align: center; width: 100%;}
  #extraSchermWinkelmand .schermWinkelMandje .melding .meldingBoven td .knoppen a.doorgaanKassa {border-bottom-right-radius: 3px; border-top-right-radius: 3px;}
  #extraSchermWinkelmand .schermWinkelMandje .melding .meldingBoven td .knoppen a.verderWinkelen {border-bottom-left-radius: 3px; border-top-left-radius: 3px;}
  .extrabovenkantHolder .extrabovenkant .valuta {margin-right: 0.25em;}
  .winkelwagenHouder {display: inline-block;}
  .liquid-slide-sjabloon .inhoud {font-size: 15px; left: 70px; max-width: 400px; padding: 10px 20px; position: absolute; top: 25%;}
  .liquid-slide-sjabloon .inhoud h2 {font-size: 36px; margin: 0 0 .5em;}
  .liquid-slide-sjabloon .inhoud p:last-child {margin: 0 0 1em;}
  .privacyMelding .inhoud {padding: 30px;}
  .adresHolder .adressen .item {flex-basis: calc(33.333% - 10px); margin: 0 10px 10px 0;}
  .adresHolder .adressen .item.open {box-shadow: 0 0 50px -8px rgba(0,0,0,.25); left: 20px; padding: 35px; position: absolute; right: 20px;}
  .artikel.detail .detailinkollommen .links {width: 65%;}
  .artikel.detail .detailinkollommen .rechts {width: 30%;}
  .detailOrderHolder .detailOrderBlok {width: calc(50% - 20px);}
  .detailOrderHolder .detailOrderBlok table.lijst tr td {border-bottom: 1px solid #eee;}
  .pdfkeuzeholder .pdfkeuze .inner .col1 {display: table-cell; width: 90px;}
  .pdfkeuzeholder .pdfkeuze .inner .col2 {display: table-cell; padding: 0 15px; width: auto;}
  .pdfkeuzeholder .pdfkeuze .inner .col3 {display: table-cell; width: 125px;}
  .shopCompact .artikel .prijzen {margin-right: 0;}
  .shopCompact .artikel h2.titel {font-size: 17px;}
  .shopCompact .artikel h2.titel a {font-size: 14px;}
  .stap .blokholder {margin-bottom: 20px;}
  .stap.twee .resBestaandeklant .button {display: inline-block;}
  #cookieHolder .cookie {border-radius: 3px; bottom: 20px; left: -50%; max-width: 400px; right: -50%;}
  .privacyMelding {border-radius: 3px; bottom: 20px; left: 20px; max-width: 370px;}
}

@media (max-width: 760px) {
  #tabSerieInhoud .shopTegel .artikel:nth-of-type(2n+0) .inner, #tabSerieInhoud .shopTegel .artikel:nth-of-type(3n+0) .inner {border-right-color: currentcolor; border-right-width: 0;}
  #tabSerieInhoud .shopTegel .artikel .voorraad {display: block;}
}

@media screen and (max-width: 760px) {
  body {text-size-adjust: none;}
  li.STPMenu2li {margin-left: 10px;}
  li.STPMenu3li {margin-left: 20px;}
  li.STPMenu2li a {font-size: 14px;}
  li.STPMenu3li a {font-size: 13px;}
  table.lijst tr:first-child {display: none;}
  table.lijst tr {display: block; margin: 0 0 10px; background: #fafafa; border-radius: 3px; padding: 10px; border: 1px solid #eee; position: relative;}
  table.lijst tr td {display: block; width: 100%; box-sizing: border-box; border: none; background: none !important; padding: 0;}
  div[class*="grid"] {grid-template-columns: 1fr;}
  input[type="tel"], input[type="number"] {font-size: 16px;}
  #formulier_holder td textarea, #formulier_holder td input[type="text"], #formulier_holder td input[type="password"], #formulier_holder td input[type="email"], #formulier_holder td input[type="tel"], #formulier_holder td input[type="number"] {display: block;}
  h4, h5, h6 {clear: both;}
  table.lijst td.knoppenHouder {position: absolute; right: 0; top: 0; width: auto; padding: 10px; border-left: 1px solid #eee;}
  table.lijst td.knoppenHouder a {padding: 8px; display: block;}
  .art-Sheet {max-width: 550px; width: 100% !important; padding-right: 0; padding-left: 0;}
  #art-main {min-width: 0; overflow: hidden;}
  .art-Block {padding-top: 5%; padding-bottom: 5%; padding-left: 5%; margin-right: 0; margin-left: 0;}
  .art-Block img {max-width: 100%; height: auto !important;}
  .account, .winkelwagenHouder {display: none !important;}
  .inloggen_holder .sep, .shopTegel .artikel .favorieten, #extraSchermWinkelmand .schermWinkelMandje .melding .meldingBoven td:first-child {display: none;}
  .inloggen_holder .inloggen_content {border-top-style: none; border-top-color: currentcolor; width: 100%; margin-bottom: 10px;}
  .inloggen_holder .inloggen_beschrijving {border: 0; display: block; width: 100%; padding: 0;}
  #extraSchermWinkelmand .schermWinkelMandje .melding .meldingBoven td .knoppen {padding: 0; width: 100%;}
  #extraSchermWinkelmand .schermWinkelMandje .melding .meldingBoven td .knoppen a {width: 50%; text-align: center; box-sizing: border-box; float: left; margin: 10px 0 0;}
  #extraSchermWinkelmand .schermWinkelMandje .melding .meldingBoven td .knoppen a.doorgaanKassa {border-top-right-radius: 0; border-bottom-right-radius: 0;}
  #extraSchermWinkelmand .schermWinkelMandje .melding .meldingBoven td .knoppen a.verderWinkelen {border-top-left-radius: 0; border-bottom-left-radius: 0;}
  .blokholder.accountWijzigen .beschrijving {display: block; width: auto; padding: 0; font-weight: bold;}
  .blokholder.accountWijzigen .invoer {display: block; width: auto; padding: 0 0 10px;}
  .stap.vier .factuurAfleverHouder .midden {width: 0; display: none;}
  .stap.vier .gegevens {padding: 10px;}
  .stap.vier .factuurAfleverHouder .links, .stap.vier .factuurAfleverHouder .rechts {width: 100%; display: block; margin-top: 10px;}
  .art-Sheet .FCK4kolTdS {display: none;}
  .art-Sheet .FCK2kolTd {margin-bottom: 15px;}
  .art-Sheet .FCK4kolTd {width: 100%; display: block; margin-bottom: 15px;}
  .vak .inhoud {padding: 20px 0;}
  .blok {display: block;}
  .blok .linksVak {display: block; width: 100%; padding-top: 100%;}
  .blok .rechtsVak {display: block; width: 100%;}
  .fixedBlok.achtergrond .inhoud {padding: 80px 20px;}
  .filters img {width: auto !important;}
  .artikel.detail .linksenrechts, .shopTegel .artikel .voorraad, .dropdown.dealerHolder .bedrijf {display: block;}
  .shopCategorieHolder .categorie, .shopTegel .artikel {width: 50%;}
  .shopLijst .artikel .inner .col1 {width: 85px;}
  .shopTegel .artikel:nth-of-type(3n+1) {clear: none;}
  .shopTegel .artikel:nth-of-type(2n+1) {clear: both;}
  .shopTegel .artikel .verlang, .shopTegel .artikel .formuleHolder, .shopTegel .artikel .prijsafspraakInLijst, .shopCompact .artikel .inner .col1, .shopCompact .artikel .inner .details, .shopCompact .artikel .artikelEenheid, .shopCompact .artikel .extrainfo, .kassaArtikelen th, .kassaArtikel .regelStuk, .stappenbalk li .naam, .mijnAccountOrderHolder .item .pijl {display: none;}
  .shopCompact .artikel .inner {table-layout: auto;}
  .shopCompact .artikel .inner .col3 {width: auto; padding: 0;}
  .artikel.detail .links, .artikel.detail .rechts {width: 100%; padding: 20px;}
  .shopNavigatie {margin-bottom: 0;}
  .pdfKnop {float: unset; margin-bottom: 15px;}
  .stap .totalen {width: 100%; float: unset; padding: 15px;}
  .stap select {font-size: 15px;}
  .stap.drie .blokholder {width: 100%; float: unset;}
  .stappenbalk {padding: 0 0 10px; text-align: center;}
  .stappenbalk li {margin: 0;}
  .stappenKnop li a {font-size: 14px;}
  .stap.twee > .blokholder, #stap2_factuuruitklap, #stap2_bewaaraccount {float: none !important; width: 100% !important; padding: 0;}
  .dropdown.dealerHolder .plaats {float: none;}
  .dropdown.dealerHolder .keuze .km {padding-right: 10px;}
  table.lijst tr td.bedrag {text-align: left; font-weight: bold;}
  .pdfkeuzeholder {border-radius: 0; left: 0; margin: 0; max-width: 100%; padding: 20px 10px 10px; position: absolute; right: 0; top: 64px; width: auto;}
  .pdfkeuzeholder .pdfkeuze .inner .col1, .pdfkeuzeholder .pdfkeuze .inner .col3 {box-sizing: border-box; display: block !important; width: 100% !important;}
  .pdfkeuzeholder .pdfkeuze .inner .col2 {box-sizing: border-box; display: block !important; width: 100% !important; padding: 15px 0;}
  .adresHolder .adressen .item {flex-basis: 100%; margin: 0 0 5px;}
  .adresHolder .adressen .item.open {position: relative; left: auto; top: auto; right: auto; padding: 10px 15px; box-shadow: none;}
  .shopTegel .artikel:nth-of-type(3n+0) .inner {border-right: 1px solid #eee;}
  .shopTegel .artikel:nth-of-type(2n+0) .inner {border-right: 0;}
  .shopHeader .blok .rechtsVak {padding: 20px;}
  .mijnAccountOrderHolder .item {flex-direction: column;}
  .mijnAccountOrderHolder .item .artikelen {display: flex; width: auto; margin: -5px 0 0; padding: 0 10px 10px;}
  .pageFooterHolder .pageFooter {max-width: 550px; padding-top: 20px; padding-bottom: 20px;}
  .pageFooterKnoppenHolder .pageFooterKnoppen {max-width: 550px; padding-right: 10px; padding-left: 10px;}
  .pageFooterHolder {overflow: hidden;}
  .pageFooter .FCK2kolTd {width: 100%; display: block; margin-bottom: 15px;}
  .pageFooter .FCK4kolTd {margin-bottom: 15px;}
  .pageFooter .FCK2kolTdS, .pageFooterKnoppenHolder .pageFooterKnoppen span.seperator {display: none;}
  .copyright, .pageFooterKnoppenHolder .pageFooterKnoppen a {display: block;}
  .sitemap1 .sitemap1ul a {text-decoration: none;}
  .sitemap1 .sitemap1ul li {display: block; float: none; width: auto;}
  ul.sitemap1ul ul, ul.sitemap1ul ul ul, ul.sitemap1ul ul ul ul {margin: 0;}
  #cookieHolder .cookie {width: calc(100% - 40px); max-width: 100%; border-radius: 0; left: auto; right: auto; bottom: 0;}
  .aLandingMenu {display: none !important;}
  #formulier_holder table {width: 100%; max-width: 100%;}
  #formulier_holder td {display: block;}
  .HeaderHolder .slideshowHolder, .HeaderHolder .slideshowHolder div {width: 100% !important;}
  .HeaderHolder .slideshowHolder div img {width: 100% !important; max-width: 100%; height: auto !important;}
  #barcodeScannerCamera video {width: 100%; height: auto;}
  .fixedBlok {background-attachment: unset;}
}

@media (max-width: 680px) {
  .shopSortOptie > * select {width: auto;}
  .shopLijst .artikel {border-radius: 3px; border-left-style: solid; border-left-width: 1px; border-right-style: solid; border-right-width: 1px; border-top-style: solid; border-top-width: 1px; margin-bottom: 10px;}
  .shopLijst .artikel:hover {box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.15);}
  .artikel .artikelnr > .titel, .shopTegel .artikel .inner .bestellen {display: revert;}
  .shopLijst .artikel .inner .inhoud {flex-direction: row;}
  .artikel.detail .shopTegel {grid-template-columns: none;}
  .shopLijst {margin-left: 0; margin-right: 0;}
  .shopSortOptie > * {margin: 0 !important;}
  .shopLijst .artikel .omschrijving {text-align: inherit !important; width: auto;}
  .shopLijst .artikel .prijzen {text-align: inherit !important;}
  .pageFooterKnoppenHolder .pageFooterKnoppen {flex-direction: row;}
}

@media screen and (max-width: 680px) {
  .mijnAccountOrderHolder .item .artikelen {display: inline-flex; margin: auto 0 auto auto; padding: 10px; width: 330px;}
  .mijnAccountOrderHolder .item .pijl {display: flex;}
  #extraSchermWinkelmand .schermWinkelMandje .melding {min-width: 250px;}
}

@media screen and (max-width: 500px) {
  .variatieKeuzePopup input[type="text"], .variatieKeuzePopup textarea {font-size: inherit;}
}

/* handwerk - bron: --migratie/hand.css */
/* header: winkelmandje, account en favorieten rechts in de logorij, zoals de oude site.
   maatwerk.js zet het account achter het mandje; de extrabovenkant is alleen de terugval zonder js */
.extrabovenkantHolder {position: sticky; top: 0; z-index: 5; height: 0; background: none;}
.extrabovenkantHolder .extrabovenkant {position: absolute; top: 0; right: 20px; height: 85px; max-width: none; padding: 0; background: none; align-items: center;}
.extrabovenkantHolder .extrabovenkant .slogan {display: none;}
.bovenkantHolder {position: sticky; top: 0; z-index: 4; border: 0;}
.bovenkantHolder .bovenkant {min-height: 85px; max-width: none; padding: 0 20px; align-items: center;}
.bovenkantHolder .bovenkant a.logo {width: 180px; padding: 20px 0; margin: 0;}
.bovenkantHolder .bovenkant .art-nav:not(:has(li)) {display: none;}
.bovenkantHolder .bovenkant .zoekenHolder {margin: 0 auto; width: 302px; flex: 0 0 auto;}
.bovenkantHolder .bovenkant .zoekenHolder .zoeken {width: 100%;}
.bovenkantHolder .bovenkant > .account {flex: 0 0 auto; display: inline-block;}
.winkelwagenHouder {display: inline-block;}
.winkelwagenHouder .winkelknop {height: auto; background: none;}
.winkelwagenHouder .winkelknop .icoon {position: static; width: auto; height: auto; line-height: 14px;}
.winkelwagenHouder .winkelknop .icoon::before {content: none;}
.winkelwagenHouder .winkelknop .aantal {position: static; display: inline-block; width: auto; height: auto; font-size: 14px; line-height: 14px; box-shadow: none;}
.winkelwagenHouder .winkelknop .titel {height: auto; font-weight: normal; line-height: 14px;}
.bovenkant > .account .welkom {font-weight: normal; color: var(--fontColor1);}

/* categoriebalk */
.bovenkantHolder .winkelmenuHolder {background: #f5f5f5;}
.bovenkantHolder ul.art-menu.winkelmenu {display: block; max-width: none; padding: 0; text-align: center; line-height: inherit; border: 0; background: none;}
.bovenkantHolder ul.art-menu.winkelmenu .separatorHouder {display: none;}

/* home over de volle breedte (was extra code van de homepagina) */
.art-Sheet:has(#lijstId3) {max-width: none; padding: 0;}

@media (max-width: 1200px) {
  .extrabovenkantHolder .extrabovenkant {height: 120px;}
  .bovenkantHolder .bovenkant {min-height: 120px;}
  .bovenkantHolder .bovenkant a.logo {width: 150px;}
}
@media (max-width: 1000px) {
  .bovenkantHolder .bovenkant a.logo {width: 130px;}
  .bovenkantHolder .bovenkant .zoekenHolder {width: 192px;}
}

/* paginaframe: zijbalk 25%, inhoud 75% */
.art-Sheet:has(> .art-sidebar1) {display: flex; align-items: flex-start;}
.art-Sheet > .art-sidebar1 {flex: 0 0 25%; width: 25%;}
.art-Sheet > .art-content {flex: 1 1 0; min-width: 0; width: auto; box-sizing: border-box;}
/* marge van de oude .art-Post, niet op de home */
.art-Sheet > .art-content {padding: 20px 0;}
.art-Sheet:has(#lijstId3) > .art-content {padding: 0;}
/* winkelpagina's zonder zijbalk (was extra code van /store) */
.art-Sheet:has(> .art-content .shopHolder, > .art-content .shopCategorieHolder, > .art-content .artikel.detail) > .art-sidebar1 {display: none;}

/* sorteerbalk */
.shopHolder > .shopSortOptie {display: flex; flex-wrap: nowrap; align-items: center; justify-content: flex-start; text-align: left; margin: 10px 0;}
.shopHolder > .shopSortOptie > div {display: block; margin: 0; width: auto;}
.shopHolder > .shopSortOptie > .aantalPerPagina {flex: 0 0 31.3%;}
.shopHolder > .shopSortOptie > .presentatieWijze {flex: 0 0 18%;}
.shopHolder > .shopSortOptie > .sorteerLijst {flex: 1 1 auto; text-align: right;}

/* filters: geen mobiel filterpaneel, de filterbalk staat er al */
.shopHolder > .kenmerkMobielHouder {display: none;}

/* tegels: de tegel is al een link, geen knop Details */
.shopTegel .artikel .bestellen .detailKnop {display: none;}

/* mobiel: hamburger, logo midden, vergrootglas klapt het zoekveld open (maatwerk.js) */
@media (max-width: 760px) {
  body .bovenkantHolder {display: block !important; position: sticky; top: 0; z-index: 30; border-bottom: 1px solid #ddd;}
  body .bovenkantHolder .bovenkant {height: auto; min-height: 52px; max-width: none; padding: 0 10px; position: relative; flex-wrap: nowrap; align-items: center;}
  .bovenkantHolder .bovenkant .resMenubalk {display: block; order: -1; flex: 0 0 30px; position: static; margin: 0;}
  .bovenkantHolder .bovenkant .resMenubalkinhoud {padding: 0; border: 0; position: static;}
  .bovenkantHolder .bovenkant .resMenubalkinhoud a.resMenucategorieknop {margin: 0; padding: 5px; color: #000;}
  .bovenkantHolder .bovenkant .resMenubalkinhoud a.resMenucategorieknop i {font-size: 20px; font-weight: 900;}
  .bovenkantHolder .bovenkant a.logo {width: 100px; padding: 0; margin: 0 auto;}
  .bovenkantHolder .bovenkant .zoekenHolder {display: block; flex: 0 0 30px; width: 30px; margin: 0;}
  .bovenkantHolder .bovenkant .zoekenHolder .zoeken {display: block !important; width: 30px; position: static; margin: 0; border: 0;}
  .bovenkantHolder .bovenkant .zoekenHolder .veld {display: none;}
  .bovenkantHolder .bovenkant .zoekenHolder .knop {display: block; width: 30px; padding: 5px; border: 0; background: none; box-sizing: border-box;}
  .bovenkantHolder .bovenkant .zoekenHolder .knop::before {color: #000; font-size: 20px;}
  .bovenkantHolder .bovenkant .zoekenHolder.open .veld {display: block; position: absolute; top: 100%; left: 0; right: 0; padding: 10px; background: #fff; border-bottom: 1px solid #ddd;}
  .bovenkantHolder .bovenkant .zoekenHolder.open .veld input#zoekWoordID {width: 100%; box-sizing: border-box; padding: 10px; border: 1px solid #ddd;}
  .bovenkantHolder .bovenkant .zoekenHolder #speedsearchResult,
  .bovenkantHolder .bovenkant .zoekenHolder .speedsearchResultBg {display: none;}
  .bovenkantHolder .winkelmenuHolder {display: none;}
  .bovenkantHolder .bovenkant > .account {display: none;}
  body .bovenkantHolder .bovenkant:has(.resMenuwinkelmandje) {padding-right: 55px;}
  .bovenkantHolder .bovenkant .resMenubalkinhoud a.resMenuwinkelmandje {position: absolute; top: 10px; right: 15px; margin: 0; padding: 5px; font-size: 21px; line-height: 21px;}
  .bovenkantHolder .bovenkant .resMenubalkinhoud a.resMenuwinkelmandje i {font-size: inherit;}
  .bovenkantHolder .bovenkant .resMenubalkinhoud a.resMenuwinkelmandje #reswinkelMandjeAantal {display: block;}
  .art-Sheet > .art-content,
  .art-Sheet:has(#lijstId3) > .art-content {padding: 10px;}
  .shopHolder > .shopSortOptie {margin: 15px 0; min-height: 44px;}
  .shopHolder > .shopSortOptie > .aantalPerPagina {display: none;}
  .shopHolder > .shopSortOptie > .presentatieWijze,
  .shopHolder > .shopSortOptie > .sorteerLijst {flex: 0 1 auto; margin-right: 5px; text-align: left;}
}

/* lijstweergave als tabelrij; .inhoud wijkt met display: contents */
.shopHolder .shopLijst .artikel .inner {display: table; width: 100%; table-layout: fixed;}
.shopHolder .shopLijst .artikel .inner > .afbeeldingHouder {display: table-cell; width: 150px; padding: 0 10px 0 0; vertical-align: middle;}
.shopHolder .shopLijst .artikel .inner > .inhoud {display: contents;}
.shopHolder .shopLijst .artikel .inner > .inhoud > .omschrijving {display: table-cell; vertical-align: top;}
.shopHolder .shopLijst .artikel .inner > .inhoud > .prijzen {display: table-cell; width: 170px; padding: 20px; background: #f5f5f5; text-align: right; vertical-align: middle;}
.shopHolder .shopLijst .artikel .inner > .inhoud > .prijzen .bestellen {text-align: right;}
.shopHolder .shopLijst .artikel .inner > .inhoud > .prijzen .detailKnop {font-size: 14px;}
@media (max-width: 760px) {
  .shopHolder .shopLijst .artikel .inner > .afbeeldingHouder {width: 85px;}
}
@media (max-width: 680px) {
  /* de standaard zet hier text-align: left !important */
  .shopHolder .shopLijst .artikel .inner > .inhoud > .prijzen {text-align: right !important;}
}
@media (max-width: 500px) {
  .shopHolder .shopLijst .artikel .inner > .afbeeldingHouder {width: 55px;}
  .shopHolder .shopLijst .artikel .inner > .inhoud > .prijzen {width: 123px;}
}

/* zoekdropdown: de categorielijst houdt zijn binnenruimte */
#speedsearchResult .speedSearch.categorie ul {padding: 20px;}

/* tabblad Serie: elke derde tegel houdt mobiel zijn rechterrand */
@media (max-width: 760px) {
  #tabSerieInhoud .shopTegel .artikel:nth-of-type(3n) .inner {border-right: 1px solid #eee;}
}

/* inhoud omvat zwevende tegels (oude skin floatte .art-content); anders valt de footer over Bijpassende artikelen */
.art-content {display: flow-root;}

/* sorteerbalk: label voor het aantal per pagina, zoals in de oude template */
.aantalPerPagina::before {content: "#/pagina"; line-height: 31px; padding-right: 8px;}

/* kassa: artikelen en gegevens over de volle breedte, totalen rechts eronder, zoals de oude kassatemplates */
/* stappenbalk: eigen stacking context, anders valt de verbindingslijn (z-index -1) mobiel achter de witte achtergrond */
.stappenbalk {position: relative; z-index: 0;}
.kassainkollommen {display: block;}
.kassainkollommen > .rechts {display: flow-root; width: auto; margin: 0;}
.kassainkollommen > .rechts .blok {display: block; padding: 0; background: none;}
.kassainkollommen > .rechts .blok:empty {display: none;}
.kassainkollommen > .rechts .sticky {position: static; margin: 0;}
.stap .kassainkollommen > .links .blokholder {float: none; width: auto; padding: 0; background: none;}
.stap.drie .kassainkollommen .regel {display: block;}
.kassaArtikel .voorraad .status .image {display: none;}
.stap.vier .totalen .vwHolder .vwTonen {display: block;}
/* stap 2: knop Bestaande klant alleen voor wie nog niet is ingelogd */
body:has(.account .mijnAccount) .stap.twee .resBestaandeklant {display: none;}

/* uitklapmandje (winkelmand_compact.tpl uit de oude skin): lijst tot aan de knoppen, met voorraad, twee knoppen naast elkaar */
.winkelwagenHouder .winkelwagen .inhoud.artikelen {max-height: none;}
.winkelwagenHouder .winkelwagen .inhoud.artikelen .voorraad {display: block;}
.winkelwagenHouder .winkelwagen .inhoud.totaal {display: block;}
.winkelwagenHouder .winkelwagen .inhoud.totaal .winkelmandjeKnoppen a {margin: 0;}
