:root {
  --color1: #202125;
  --color2: #A71C1C;
  --color3: #FFF;
  --color4: #6D1214;
  --fontColor: #202124;
  --fontFamily1: "Barlow", Helvetica, Arial, sans-serif;
  --fontFamily2: "Barlow Condensed", Helvetica, Arial, sans-serif;
  --bodyFontSize: 15px;
  --h1Size: 35px;
  --h2Size: 22px;
  --h3Size: 20px;
  --space10: 10px;
  --space15: 15px;
  --space20: 20px;
  --space30: 30px;
  --space40: 40px;
  --space50: 50px;
  --space80: 80px;
  --space100: 100px;
}


body {font-family: var(--fontFamily1); font-weight: normal; background: #fff;  font-size: 15px;}

::selection {background: #000; color: #FFF;}

textarea, input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="number"] { border-radius: 4px; border: 1px solid #cbd4dd;}
input[type="checkbox"]:checked::before, input[type="radio"]:checked::before {}

h1, .h1, h1 a, h1 a:link, h1 a:visited, h1 a:hover,
h2, .h2, h3, .h3, h4, h5, h6, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a,
h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover,
h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited {font-family: var(--fontFamily2); font-weight: 400; font-style: normal; text-transform: uppercase;}


h1, .h1, h1 a, h1 a:link, h1 a:visited, h1 a:hover {font-size: 30px;}
h2, .h2, h2 a, h2 a:link, h2 a:visited, h2 a:hover {font-size: 22px; font-weight: 600;}
h3, .h3, h3 a, h3 a:link, h3 a:visited, h3 a:hover {font-size: 20px;}
h5, .h5, h5 a, h5 a:link, h5 a:visited, h5 a:hover {color: #939393; font-size: 18px; font-weight: normal;}

h1      {font-weight: 900;}
h1 + h5 {margin-top: -0.70em; margin-bottom: 1em;}
h2 + h5 {margin-top: -0.70em; margin-bottom: 1em;}

a.logo {margin: auto 0; outline: 0;}
a.logo img {width: 210px; margin-right:10px}

/* .breadcrumbs {display: none;} */

header {box-shadow: 0 0 3px 0 rgb(0 49 82 / 20%); position: sticky; top: 0; z-index: 10;}
.extrabovenkantHolder {border-bottom: 0; background-color: var(--color1);}
.extrabovenkantHolder .extrabovenkant .slogan {padding: 0; margin: auto 0 auto auto;}
.extrabovenkantHolder .extrabovenkant .slogan a {text-decoration: none; color: #FFF; font-size: 12px;}
.extrabovenkantHolder .extrabovenkant .slogan a i {margin-right: 5px;}
.extrabovenkantHolder .extrabovenkant .Taalkeuze_vlaggen.dropdownTaal {margin: auto 0 auto auto; min-width: unset;}
.extrabovenkantHolder .extrabovenkant .Taalkeuze_vlaggen.dropdownTaal.open ul {}
.extrabovenkantHolder .extrabovenkant .Taalkeuze_vlaggen.dropdownTaal ul {position: static;}
.extrabovenkantHolder .extrabovenkant .Taalkeuze_vlaggen.dropdownTaal ul li .afbeelding {display: none;}
.extrabovenkantHolder .extrabovenkant .Taalkeuze_vlaggen.dropdownTaal ul li .omschrijving {font-size: 13px;}

.bovenkantHolder .winkelmenu {display: flex; gap: 30px;}
.bovenkantHolder .winkelmenu .rechts {margin-left: auto; gap: 30px; display: flex;}
.bovenkantHolder .winkelmenu li {position: static;}
.bovenkantHolder .winkelmenu li a .t {padding: 15px 0; color: var(--color3); font-size: 20px;}
.bovenkantHolder .winkelmenu li a .t:hover {color: var(--color3);}
.bovenkantHolder .winkelmenu li a.active .t {color: var(--color3);}
.bovenkantHolder .winkelmenu li .t.hoverMenuActief::after {margin: auto auto auto 10px; color: var(--color3);}

.extrabovenkantHolder .extrabovenkant .contact {margin-left: auto; padding: 5px 0; display: flex; gap: 15px;}
.extrabovenkantHolder .extrabovenkant .contact a {text-decoration: none; color: #FFF; font-size: 13px;}
.extrabovenkantHolder .extrabovenkant .contact a::before {content: "\f879"; font-family: "Font Awesome 5 Pro";  margin-right: 10px;}
.extrabovenkantHolder .extrabovenkant .contact a.mail::before {content: "\f0e0";}

.bovenkantHolder {background: #FFF; border: 0;}
.winkelmenuHolder {background: var(--color4); border-top: 1px solid #e2e2e2; padding: 12px 0;}

.art-menu {gap: 22px; display: flex;}
.art-menu li.separatorHouder {display: none;}
.art-menu li a {position: relative;}
.art-menu li a .t {padding: 15px 0; color: var(--fontColor); font-size: 20px; text-transform: uppercase; cursor: pointer; font-family: var(--fontFamily2); font-weight: 400; font-style: normal;}
.art-menu li a .t::before {content: ""; display: block; position: absolute; bottom: 9px; left: 0; width: 0; height: 1px; background-color: var(--color2); transition: all .3s ease;}
.art-menu li a.active .t::before {background-color: var(--color2);}
.art-menu li a:hover .t::before, .art-menu li a.active .t::before {width: 100%;}
.art-menu li a .t:hover, .art-menu li a.active .t {color: var(--color2);}

.art-menu.winkelmenu li a .t::before {background-color: var(--color3);}
.art-menu.winkelmenu li a .t:hover, .art-menu.winkelmenu li a.active .t {color: var(--color3);}

.hoverMenu {left: 0; right: 0; width: 100%; max-width: 1580px; overflow: unset; margin: 0 auto; border-radius: 0; box-shadow: unset; transform: unset; top: 100%; padding-top:5px;}
.hoverMenu::after {content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 100vw; transform: translateX(-50%); background: #FFF; z-index: -1;}
.hoverMenu.open { box-shadow: 0 10px 150px rgba(0,0,0,.2);}
.hoverMenu .kolommen {width: 100%; padding: 30px; box-sizing: border-box; display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 30px;}
.hoverMenu .kolommen .kolom .titel a {font-family: var(--fontFamily1); color: var(--color1); font-size: 16px; pointer-events: none; font-weight: bold;}
.hoverMenu .kolommen .kolom a {color: var(--fontkleur1); line-height: 1.85em; padding: 0; width: unset; border: 0; font-size: 14px; position: relative; display: inline-block;}
.hoverMenu .kolommen .kolom a::after {content: ""; display: block; position: absolute; bottom: 0; left: 0; width: 0; height: 1px; background-color: var(--color1); transition: all .3s ease;}
.hoverMenu .kolommen .kolom a:hover::after {width: 100%;}
.hoverMenu .kolommen .kolom a::before {display: none;}
.hoverMenu .afbeelding a::before, .hoverMenu .afbeelding a::after{display:none !important}
.hoverMenu .afbeelding a img {width: 250px; height: 90px; object-fit: contain; object-position: left;}
.hoverMenu .kolommen .kolom a:hover {text-decoration: none; color: var(--color1); background: unset;}
/* .hoverMenu .kolommen .kolom:nth-child(1) > ul {column-count: 2; column-gap: 20px;} */
.hoverMenu .kolommen .kolom {padding: 0; width: 100%;}
.hoverMenu .kolommen .kolom > ul {position: relative; opacity: 1; left: 0; right: unset; visibility: unset; box-shadow: unset; border: 0;}
.hoverMenu .kolommen .kolom > ul::before {display: none;}
.hoverMenuBg {z-index: 1; opacity: 0; position: fixed; left: 0; top: 0; right: 0; background: rgb(0 0 0 / 20%); background-repeat: repeat; transition: opacity 0.3s ease 0s;}
.hoverMenuBg.open {opacity: 1; bottom: 0; box-shadow: 0 30px 40px rgba(0,0,0,.2);}


.hoverMenu .categorie {padding: 30px; order: 2; box-sizing: border-box; display:none}

.catMenu0ul,.catMenu1ul,.catMenu2ul,.catMenu3ul,.catMenu4ul,.catMenu5ul {
  margin: 0!important;
  list-style: none;
  padding: 0!important
}

.catMenuLink2li,.catMenuLink2liSel {
  color: #777!important;
  display: inline-block;
  font-size: 13px;
  line-height: 1.75em;
  text-decoration: none!important;
  padding: 0 0 0 15px;
  font-weight: 400;
  margin: 2px 0;
  margin-left: 30px
}

.catMenuLink3li,.catMenuLink3liSel {
  color: #777!important;
  display: inline-block;
  font-size: 13px;
  line-height: 1.75em;
  text-decoration: none!important;
  padding: 0 0 0 25px;
  font-weight: 400;
  margin: 2px 0;
  margin-left: 30px
}

.catMenu4li,.catMenu4liSel {
  color: #777!important;
  display: inline-block;
  font-size: 13px;
  line-height: 1.75em;
  text-decoration: none!important;
  padding: 0 0 0 35px;
  font-weight: 400;
  margin: 2px 0;
  margin-left: 30px
}


.catMenuLink2liSel, .catMenuLink2li:hover, .catMenuLink3liSel, .catMenuLink3li:hover, .catMenu4liSel, .catMenu4li:hover, .catMenu5liSel, .catMenu5li:hover, .catMenu6liSel, .catMenu6li:hover {
  color: #000!important
}

.catMenu2li>a:hover,.catMenu3li>a:hover,.catMenu4li>a:hover, .catMenu5li>a:hover, .catMenu6li>a:hover,
.catMenu2liSel>a:hover,.catMenu3liSel>a:hover,.catMenu4liSel>a:hover, .catMenu5liSel>a:hover, .catMenu6liSel>a:hover { text-decoration: underline!important }


div.grid-2x {gap:50px;}
.shopHeader .grid-2x {gap:50px; grid-template-columns: 2fr 1fr;}
.shopHeader .grid-2x div:last-child {display:flex; justify-content: center;}


a.knop, .button, a.button, button {font-family: var(--fontFamily2); background: var(--color2); font-size: 20px; padding: 15px 20px; border-radius: 4px;  line-height: 1; font-weight: 700; text-decoration: none !important;}
a.knop:hover, .button:hover, a.button:hover, button:hover {opacity: .7;}

section.grijs, .vak.grijs {}
.inhoud.max1200 {max-width: 1200px; margin-left: auto; margin-right: auto;}

.bovenkantHolder .bovenkant .zoekenHolder {margin: auto;}
.zoeken {background: #f2f2f2; border: 0; border-radius: 5px; min-width: 400px;}
.zoeken .veld {width: 100%;}
.zoeken .veld #zoekWoordID {padding: 13px;}
.zoeken .veld #zoekWoordID, .zoeken .veld #zoekWoordID::-webkit-input-placeholder {font-size: 14px;}
.zoeken .knop {padding: 13px;}

#speedsearchResult {left: 0; border-radius: 3px; max-width: 1520px; margin: 0 auto; padding: 0px;}
#speedsearchResult .houder {display:block; border-radius: 3px; border: 0; box-shadow: 0 20px 50px 0 rgba(0,0,0,0.20); font-size:inherit; width: 100%; box-sizing: border-box; padding: 20px;}
.speedSearch.categorie {order:1;}
.speedSearch.artikelen {width: 100%;}
.speedsearchLoader {display: none;}
#speedsearchResult .houder .speedSearch ul li a {border:0; display: flex; border-radius: 4px;}
#speedsearchResult .houder .speedSearch ul li a .omschrijving {margin: auto 0; font-weight: normal;}
#speedsearchResult .houder .speedSearch ul li a strong {font-weight: bold; color: var(--color1);}
#speedsearchResult .houder .speedSearch.artikelen ul li .artikelNr {font-size:14px;}
#speedsearchResult .houder .speedSearch .resultaat {padding: 10px; margin: 0;  font-weight: bold; font-size: 17px;}
#speedsearchResult .houder .speedSearch .resultaat a.knopAlles {display: none;}
#speedsearchResult .houder .speedSearch ul li a:hover {}
#speedsearchResult .houder .speedSearch.artikelen ul li .thumbnail img {mix-blend-mode: darken;}
#speedsearchResult .houder .speedSearch ul li {margin: 0;}
#speedsearchResult .houder .knopAllesOnder a {padding: 15px 20px; border-radius: 4px; line-height: 1;  border: 0; color: #fff; background: var(--color2); font-size: 16px; font-weight: 600;}
#speedsearchResult .houder .knopAllesOnder a:hover {background: #015db3;}

.winkelwagenHouder .winkelknop {background: unset; padding: 10px;}
.winkelwagenHouder .winkelknop .icoon::before {font-weight: normal; color: var(--fontColor);  font-size: 22px; content: "\f290";}
.winkelwagenHouder .winkelknop .aantal {box-shadow: unset; background-color: var(--color2); padding:1px 6px 0 6px; border-radius: 100%; line-height: 17px; top: -10px; right: -10px; color: #FFF;}

.account li {border: 0;}
.account .inloggenKnop::before, .account .mijnAccountKnop::before {content: "\f007"; font-family: "Font Awesome 5 Pro";  font-size: 22px; font-weight: normal; color: var(--fontColor);}
.account .welkom .bericht,
.account .inloggenKnop .titel, 
.account .mijnAccountKnop .titel, 
.account .favorietenKnop .titel, 
.account .favorietenKnop .haakje, 
.account .favorietenKnop .favAantal {display: none;}
.account .houder .houder1 {padding: 20px;}
.account .mijnAccount .houder .houder1 {padding: 20px 20px 10px 20px;}
.account .houder .houder1 a {text-decoration: none; margin: 0;}
.account .houder .houder2 {background: unset; border: 0; padding: 0 20px 20px 20px;}
.account .houder .houder2 .registreer {color: #939393; font-size: 14px;}
.account .houder .houder2 .registreer a {}
.account .houder .houder2 .uitloggen a {font-family: inherit; font-size: 15px; padding: 15px 20px; border-radius: 4px;  line-height: 1; font-weight: 700; text-decoration: none !important; color: var(--fontColor); display: block; text-align: center;}
.account .inloggenKnop:hover, .account .favorietenKnop:hover, .account .verlanglijstKnop:hover, .account .mijnAccountKnop:hover {text-decoration: none; color: unset;}
.account .favorietenKnop::before {content: "\f004"; font-family: "Font Awesome 5 Pro";  font-size: 22px; font-weight: normal; color: var(--fontColor);}
.account .welkom {font-weight: bold;  font-size: 13px; margin: auto;}
.account .houder {border-radius: 4px;}
.account .inloggen .inlogKnop .wachtwoordKwijt a {color: #939393; font-size: 14px;}
.account .inloggen .cookie {margin-top: 10px; font-size: 14px;}
.account .inloggen .cookie label {display: flex; align-items: center;}

.pageFooterHolder {background-color: var(--color1);}
.pageFooterHolder strong {color:#fff;}
.pageFooterKnoppenHolder {border: none; background: var(--color4);}
.pageFooter h2, .pageFooter .h2 {font-size: 20px; font-weight: 700; color: #FFF;}
.pageFooterHolder .pageFooter {font-size: 15px; color: #a1a2a3;}
.pageFooterHolder .pageFooter ul {list-style: none; padding: 0; margin: 0;}
.pageFooterHolder .pageFooter ul ul.sitemap2ul {display: none;}
.pageFooterHolder a {text-decoration: none; color: #a1a2a3;}
.pageFooterHolder a > em {color: #FFF !important; font-size: 18px; margin-right: 5px;}
.pageFooterKnoppenHolder .pageFooterKnoppen .extramenu a {margin-right: 10px;}
.pageFooterKnoppenHolder .pageFooterKnoppen .extramenu a:hover {opacity: .5;}
.pageFooterKnoppenHolder .pageFooterKnoppen .extramenu .seperator {display: none;}
.pageFooterKnoppenHolder .pageFooterKnoppen .copyright {opacity: .5;}
.pageFooterHolder .pageFooter .SMIconen {margin: 20px 0 0 auto;}
.pageFooterHolder .pageFooter .SMIconen a { color: var(--color1); padding: 5px 0px 5px 5px; width: 30px; height: 23px; display: inline-flex; margin: 0 5px 0 0; font-size: 16px; border-radius: 5px; text-decoration: none;}
.pageFooterHolder .pageFooter .SMIconen a em {margin: auto;}
.pageFooterHolder .pageFooter .SMIconen a:hover {opacity: .5;}

.shopSortOptie {border: 0; padding: 0; margin: 20px 0; clear:both;}
.shopSortOptie a.actief {color: var(--color1)!important; }
.shopSortOptie select {border: 1px solid #cbd4dd; border-radius: 4px; font-weight: 600;  font-size: 14px;}
.shopSortOptie .aantalPerPagina {display: none;}
.shopSortOptie .sorteerLijst {margin: auto 0 auto auto;}

.shopCategorieHolder.widget {grid-template-columns: 1fr 1fr 1fr 1fr 1fr;}
.shopCategorieHolder {clear: both;}
.shopCategorieHolder .categorie {border-radius: 4px; border: 2px solid #eee; transition: .3s all ease;}
.shopCategorieHolder .categorie:hover {box-shadow: unset; border-color: var(--color1); background: #f2f2f2;}
.shopCategorieHolder .categorie .titel { border-radius: 0 0 4px 4px;}
.shopCategorieHolder .categorie .titel h2 {font-weight: 600;  font-size: 20px;}
.shopCategorieHolder .afbeeldingHouder img {border-radius: 4px 4px 0 0; mix-blend-mode: darken;}
.shopCategorieHolder .afbeeldingHouder .verhouding {padding-bottom: 75%;}

.categorieBlokken                 {grid-column: 1/-1; display:grid; gap:30px; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));}
.categorieBlokken .categorieBlok  {background-color: #FFF; position: relative; transition: all .3s ease; border-radius: 5px; overflow: hidden;}
.categorieBlokken .categorieBlok .tekst  {padding: 20px 25px 15px 25px; position: relative;}

.categorieBlokken .categorieBlok .tekst  a        {display:block; line-height: 1.35em; color:var(--fontColor); padding:10px 30px 10px 15px; border-radius:5px; background-color:#fff; transition: all .3s ease; position: relative; margin-bottom:5px;}
.categorieBlokken .categorieBlok .tekst  h2       {font-size: 19px;}
.categorieBlokken .categorieBlok .tekst  a::after {content: "\f061"; position: absolute; right: 10px; font-size: 16px; font-family: "Font Awesome 5 Pro"; font-weight: 100; opacity:0.1; transition: all .3s ease;}
.categorieBlokken .categorieBlok .tekst  a:hover  {background-color:var(--color1); color:#fff;}
.categorieBlokken .categorieBlok .tekst  a:hover::after  {opacity: 1;}
.categorieBlokken .categorieBlok .afbeelding {display: none;}

.shopTegel {grid-gap: 10px; grid-template-columns: repeat(auto-fill, minmax(min(250px, 100%), 1fr));}
.shopTegel .artikel .inner {border-radius: 4px; border: 2px solid #eee;}
.shopTegel .artikel .inner:hover {box-shadow: unset; border-color: var(--color1); background: #f2f2f2;}
.shopTegel .artikel .inner .afbeeldingHouder .verhouding {padding-bottom: 75%;}
.shopTegel .artikel .inner .afbeeldingHouder img {border-radius: 4px 4px 0 0; mix-blend-mode: darken;}
.shopTegel .artikel .inner .prijzen {line-height: 1.5em; margin: 15px 0 0 0;}
.shopTegel .artikel .inner .prijzen .prijs {font-size: 17px; }
.shopTegel .artikel .inner .prijzen .van {opacity: 1; color: #939393;}
.shopTegel .artikel .inner .rechtsboven div a {font-size: 12px;}
.shopTegel .artikel .inner .rechtsboven div a i {font-weight: normal;}
.shopTegel .artikel .inner .rechtsboven div.aan a i {font-weight: bold; color:var(--color1)}
.shopTegel .artikel .inner .omschrijving h2.titel a {font-size: 18px;}
.shopTegel .artikel .bestellen .bestelknop a.wButBestel {padding: 10px 15px; font-size: inherit;}

.shopCompact .artikel .bestellen input {max-width: 50px;}
.shopCompact .artikel .bestellen .bestelknop a.wButBestel {font-size: 13px; padding: 8px 10px;}
.shopCompact .artikel .prijzen {font-size: 14px;}
.shopCompact .artikel h2.titel {font-family: var(--fontFamily1); font-size:inherit;}
.shopCompact .artikel .favorieten {display: none}

.productCarousel {margin: 0;}
.productCarousel .flickity-prev-next-button {*display: none;}

.artikel .bestellen .bestelknop a.wButBestel { padding: 10px;}
.artikel.detail .shopDetailModernKenmerken {margin: 0;}

.kenmerkArt, .artikelGewicht, .EANnummer {display: grid; padding: 5px 15px; grid-template-columns: 1fr 2fr; color: #000; border: 0; font-size: 15px;}
.kenmerkArt .groep, .artikelGewicht .titel, .EANnummer .toelichting {font-weight: bold; color: #000;}
.kenmerkArt:nth-child(odd), .artikelGewicht:nth-child(odd) {background: #f2f2f2;}
.kenmerkArt .kenmerken .kenmerk {display: flex;}
.kenmerkArt .kenmerken .kenmerk .toevoeging {margin-left: auto;}
.kenmerkArt .kenmerken .kenmerk .toevoeging::before,
.kenmerkArt .kenmerken .kenmerk .toevoeging::after,
.kenmerkArt .kenmerken .kenmerk::after {display: none;}

.kenmerkgroepKeuze.tags .artikel.actief {border-color: var(--color1); }
.kenmerkgroepKeuze.afbeeldingen .artikel img {mix-blend-mode: darken;}
.kenmerkgroepKeuze.afbeeldingen .artikel.actief {border-color: var(--color1); }

.filters .kenmerkgroep .kenmerken {z-index:unset}
.filters .actieveKenmerken {border-top: 0; padding: 0;}
.filters .actieveKenmerkenLijst {padding: 0 20px 10px;}

.artikel.detail .detailinkollommen {display: grid; grid-template-columns: 1fr 1fr; gap: 30px; margin: 0;}
.artikel.detail .detailinkollommen .links, .artikel.detail .detailinkollommen .rechts {margin: 0; width: 100%;}
.artikel.detail .bestellen {display: flex; margin: 20px 0;}
.artikel.detail .bestellen .bestelknop {width: 100%;}
.artikel.detail .bestellen .bestelknop a.wButBestel {width: 100% !important; font-weight: bold; padding: 9px; box-sizing: border-box;  border-radius: 4px; background: var(--color2);}
.artikel.detail .bestellen .bestelknop .wButBestel::before {display: none;}
.artikel.detail .bestellen .bestelknop input {border-radius: 4px; border: 0; margin-right: 0;}
.artikel.detail .prijzen {margin: 15px 0;}
.artikel.detail .prijzen .prijs { font-size: 20px;}

.artikel.detail .links > .vak {margin: 30px 0;}
.artikel.detail .links .favorieten {margin: 0; position: absolute; right: 0; top: 0; padding: 20px;}
.artikel.detail .links .favorieten .toelichting {display: none;}
/* .artikel.detail .links .favorieten a {line-height: 1; font-size: 14px; font-weight: normal; padding: 8px; display: block; background: #f2f2ef; color: #777; border-radius: 3px;} */
/* .artikel.detail .links .favorieten .image {padding: 0; display: none;} */
.artikel.detail .kenmerkenPlaatje {position:absolute; z-index:2; top:10px;}

#tabArtikelOmschrijvingInhoud img {max-width:100%; height:auto !important;}

.artikel.detail .vak.meebestellen {position: relative;}
.artikel.detail .vak.meebestellen::after {content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 100vw; transform: translateX(-50%);  z-index: -1;}
.artikel.detail .vak.meebestellen .inhoud {padding: 30px 0; margin: 50px 0;}
.artikel.detail .vak.meebestellen .inhoud .h3 {font-size: 22px; font-weight: 600;}

.artikel.detail .vak.upselling .shopCompact .artikel {border-radius: 4px; border: 2px solid #eee; padding: 5px 10px; box-sizing: border-box;}
.artikel.detail .vak.upselling .shopCompact .artikel:hover {border-color: var(--color1); background: #f2f2f2;}
.artikel.detail .vak.upselling .shopCompact .artikel .favorieten {display: none;}
.artikel.detail .vak.upselling .shopCompact .artikel .artikelnr, .artikel.detail .vak.upselling .shopCompact .artikel .omschrijving .prijzen {display: none;}
.artikel.detail .vak.upselling .shopCompact .artikel .afbeeldingHouder img {mix-blend-mode: darken;}
.artikel.detail .vak.upselling .shopCompact .artikel .prijzen {margin: auto 10px auto auto;}
.artikel.detail .vak.upselling .shopCompact .artikel .prijzen .prijs {font-size: 15px;}
.artikel.detail .vak.upselling .shopCompact .artikel .bestellen .bestelknop {gap: 10px;}
.artikel.detail .vak.upselling .shopCompact .artikel .bestellen .bestelknop .aantalMinPlus {margin: 0;}
.artikel.detail .vak.upselling .shopCompact .artikel .bestellen .bestelknop .aantalMinPlus input {margin: 0; border: 0;}
.artikel.detail .vak.upselling .UPScontainer .UPSacc_trigger {display: none;}

.artikel.detail .detailinkollommen .rechts .artikelInfo {position: sticky; top: 185px; max-width: 600px;}

.artikel.detail .detailinkollommen .rechts .kenmerkgroepKeuze {margin: 20px 0;}
.artikel.detail .detailinkollommen .rechts .kenmerkgroepKeuze .h3 {font-size: 14px;}

.artikel.detail .formuleHolder { margin: 20px 0; border-radius: 5px;}
.artikel.detail .formuleHolder.reset {display: none;}
.artikel.detail .formuleHolder > .titel {background-color: var(--color1); color: #FFF; padding: 10px 20px; border-radius: 5px 5px 0 0; margin: 0; font-size: 15px;}
.artikel.detail .formuleHolder label {font-size: 13px; font-weight: bold; }
.artikel.detail .formuleHolder .content {padding: 20px; box-sizing: border-box;}
.artikel.detail .formuleHolder .content .formuleMeerprijs {color: #939393; font-size: 12px; font-weight: 400;}
.artikel.detail .formuleHolder .content .totaalFormuleVariatiePrijs {display: flex; align-items: center; margin: 20px 0 0 0;}
.artikel.detail .formuleHolder .content .totaalFormuleVariatiePrijs .prijs { font-size: 20px; font-weight: bold;}
.artikel.detail .formuleHolder .content .totaalFormuleVariatiePrijs .toelichting {font-size: 14px; margin-right: 10px;}

.artikel.detail .detailinkollommen .blok.persoonlijk {display: grid; grid-template-columns: 2fr 1fr; gap: 20px; position: relative; padding: 35px; border: 0; background: #f2f2f2; margin-bottom: 20px;}
.artikel.detail .detailinkollommen .blok.persoonlijk .afbeelding {line-height: 0; position: absolute; right: 0; bottom: 0;}
.artikel.detail .detailinkollommen .blok.persoonlijk .afbeelding img {height: 220px !important; object-fit: contain; width:100% !important;}

.artikelEenheid, .artikelBestelEenheid {display: none}

.artikel.detail .voorraad .status .toelichting { border-radius: 5px;  font-size: 13px; padding: 10px; font-weight: bold;}
.artikel.detail .voorraad .status .toelichting::before {content: "\f111"; font-family: "Font Awesome 5 Pro"; margin-right: 10px; font-weight: bold;  font-size: 7px; vertical-align: middle;}
.artikel.detail .voorraad .status .toelichting.positief {background: #e9fbee; }
.artikel.detail .voorraad .status .toelichting.negatief {background: #f8ecec; color: #c05252;}
.artikel.detail .voorraad .status .toelichting.negatief::before {color: #c05252;}

.artikel.detail #tabFormulierInhoud {padding:30px; border-radius: 5px; margin-bottom:20px;}

.volledigGallery .carousel-cell-groot .verhouding {padding-bottom: 75%;}
.thumbnailGallery .carousel-cell.is-selected img, .thumbnailGallery .carousel-cell-yt.is-selected img {border-color: var(--color1);}

.winkelwagenHouder .winkelwagen {border-radius: 4px; width: 600px;}
.kassaArtikelen .artikel .tekst a.kassaArtikelTitel { font-size: 14px;}

.artikelnr > .titel {display: none;}
.artikel .artikelnr {color: #939393; font-size: 13px;}
.prijzen .relatieBtwPrijs {color: #939393;}
.artikel .aantalMinPlus {border-color: #cbd4dd; border-radius: 4px;}
.artikel .aantalMinPlus input {border: 0;}
.artikel .labels .label { color: #FFF; background: var(--color1);}
.artikel .labels .label img {width: 45px;}

.kassaArtikelen .artikel .aantallen input {border-radius: 4px !important;}
.kassaArtikelen .artikel .tekst .meerinfo .voorraad {display: none;}
.stap .totalen .totaalTeBetalen td {font-size: 100%;}
.stap .totalen table .totaalVerzendkosten .omschrijving, .stap .totalen table .totaalVerzendkosten .bedragExclusiefRelatie .relatieBtwPrijs {display: none;}

.kassainkollommen > .rechts .blok, .couponcodeHouder {border: 1px solid var(--color1);  border-radius: 4px;}
.kassainkollommen > .rechts .blok:empty {display: none;}
.stap .totaalExclBtw td {font-weight: 600; }
.kassainkollommen > .rechts .blok .totalen {font-size: 14px;}
.stap .totalen .stappenKnop a {padding: 15px 20px; }
.stap .totalen .totaalTeBetalen td { font-size: 16px;}
.stap .totalen .totaalArtikelen .bedragExclusiefRelatie .relatieBtwPrijs {display: none;}


.stappenbalk .bezig::before {background-color: var(--color1);}
.stappenbalk .bezig .naam {color: var(--color1);}

.kassainkollommen > .rechts .blok.bestaandeKlant h2 {font-size: 18px;}
.kassainkollommen>.rechts .sticky {top: 170px;}

.stap .blokholder {border-radius: 0; padding: 0; background: transparent;}
.stap .blokholder > .titel { margin-bottom: 5px;}

.stap.twee .links>div, .stap.drie .links>div {width: 100%; margin: 0;}
.stap.twee .links, .stap.drie .links {margin: 0; display: grid; gap: 20px;}
.stap.twee .tekstNieuwAdres a {font-family: inherit; font-size: 15px; padding: 15px 20px; border-radius: 4px; margin-bottom: 10px;  line-height: 1; font-weight: 700; text-decoration: none !important;}

.typeKlant input[type="radio"]+label::before, .geslacht input[type="radio"]+label::before {top: 16px;}

.stap.drie .regel.actief { background-color: #FFF !important;}

.bovenkantHolder .bovenkant {padding:7px 30px;}

.bovenkantHolder .bovenkant .resMenubalkinhoud {display: flex;}
.bovenkantHolder .bovenkant .resMenubalkinhoud a.resMenucategorieknop {order: 1;}
.bovenkantHolder .bovenkant .resMenubalkinhoud a.resMenucategorieknop i, .bovenkantHolder .bovenkant .resMenubalkinhoud a.resMenuwinkelmandje i {display: none;}
.bovenkantHolder .bovenkant .resMenubalkinhoud a.resMenucategorieknop::before {font-weight: normal;  font-size: 22px; content: "\f0c9"; font-family: "Font Awesome 5 Pro";}
.bovenkantHolder .bovenkant .resMenubalkinhoud a.resMenuwinkelmandje::before {font-weight: normal;  font-size: 22px; content: "\f290"; font-family: "Font Awesome 5 Pro";}
.resMenubloktitel { border-bottom: 1px solid #eee; color: #000; text-transform: none; font-size: 15px; font-weight: 600; padding: 10px 15px;}
.resMenublokinhoud .resMenuItem.active > a {color: var(--color1);}
.resMenublokinhoud .resMenuItem a {border-bottom: 1px solid #eee; }
.resMenuItem.favorieten a span, .resMenuItem.verlanglijst a span {border: 2px solid var(--color1);  font-size: 13px; font-weight: 600;}

.blader_holder {margin-top: 20px; overflow: auto; border: 0; padding: 0;}
.blader_tabel1 {width: auto;}
.blader_holder table      {table-layout: fixed; margin: 0 auto; border: 1px solid #e2e2e2; border-radius: 0; overflow: hidden;}
.blader_holder table td {vertical-align: middle; line-height: 1; padding: 0;}
.blader_holder table td a, .blader_holder table td .blader_tabel1_s {display: block; border: 0; font-size: 13px; border-radius: 0; height: 24px; border-right: 1px solid #e2e2e2; width: 32px; text-align: center; line-height: 1; padding-top: 10px; margin: 0; text-decoration: none; color: #b7b7b7;}
.blader_tabel1_n, .blader_tabel1_s {border: 0; border-radius: 0; height: unset; font-size: inherit; line-height: 1; width: 100%;}
.blader_holder table td:last-child a, .blader_holder table td:last-child .blader_tabel1_s, .blader_holder table td:last-child img  {border-right: 0;}
.blader_holder table td a img {padding: 0; border: 0; vertical-align: top; display: inline-block; width: 13px;}
.blader_holder table td > img {display: none;}
.blader_tabel1_n:hover, .blader_holder table td a:hover { color: var(--color1);}
.blader_tabel1_n:hover a { color: var(--color1);}
.blader_holder table td .blader_tabel1_s {background-color: var(--color1);}

/* Prijsafspraken en kortingstabellen */
.kortTab1 {font-size: 15px; width: 100%; line-height: 1.75em;}
.kortTab1 th {text-align: left;}
.kortTab1 td {vertical-align: top;}
.kortTab1 td.aantallen, .kortTab1 td.prijsNaKorting {white-space: nowrap; padding: 0;}
.kortTab1 td.toelichting {text-align: center;}
.kortTab1 td.prijsNaKorting {text-align: right; }
.kortTab2 {font-weight: bold; border-bottom:1px solid #e2e2e2; padding-top: 5px;}
.kortTab1 .prijsNaKorting	{font-weight: bold;}
.prijsAfspraakHolder {margin: 20px 0; transition: .3s all ease; border-radius: 5px; }
.prijsAfspraakHolder.open {max-height: 100vh;}
.kortTab1 {width:100%; font-size: 14px;}
.kortTab2 {font-weight: bold; border-bottom:1px solid #BFBFBF; display: none;}
.kortTab1 .prijsNaKorting	{font-weight: bold; color: #6AB65D;}
.kortTab1 th {display: none;}
.kortTab1 td {border-bottom: 1px solid #ddd; padding: 5px 20px !important;}
.kortTab1 tr:last-child td {border: 0;}
.prijsafspraakLos .kortTab1 .toelichting 		  {display: none;}
.prijsafspraakLos .kortTab1 .toelichting span {display: none;}
.prijsafspraakLos .kortTab1                   {width: 100%; color: #111111;}
.prijsafspraakInLijst                             {display: none;}
.prijsafspraakInLijst .kortTab1 .toelichting 		  {display: none;}
.prijsafspraakInLijst .kortTab1 .toelichting span {display: none;}
.prijsafspraakInLijst .kortTab1                   {width: auto;}
.prijsafspraakKnop {box-sizing: border-box;font-weight: bold;position: relative; background-color: var(--color1);padding: 10px 20px;border-radius: 5px 5px 0 0;margin: 0;font-size: 15px;line-height: 1.35em; color:#fff;}
#tabPrijsafspraakPercentageInhoud br {display: none;}
/* Einde prijsafspraken en kortingstabellen */

#tabBijlagenInhoud {font-size: 14px; color: #333;}
#tabBijlagenInhoud table {width: auto; line-height: 55px;}
#tabBijlagenInhoud td.blg1 a img {display: none;}
#tabBijlagenInhoud td.blg1 a {text-decoration: none;}
#tabBijlagenInhoud td.blg1 a::before {content: "\f33d"; font-family: "Font Awesome 5 Pro"; font-size: 18px; color: var(--color1); font-weight: normal; border: 1px solid #ddd; background: #FFF; border-radius: 50%; padding: 13px 15px; margin-right: 12px;}

.inloggen_holder .inloggen_content {border-top: 0;}

.nieuwWachtwoordHolder {max-width: 500px;}
.nieuwWachtwoordHolder .nieuwWachtwoordContent h2 {display: none;}

.shopHeader {margin: 0 0 30px 0;}
.shopFooter {margin: 30px 0 0 0;}

.art-Sheet .art-sidebar1 .contactBlok {background: #f2f2f2; padding: 20px; box-sizing: border-box; border-radius: 4px;}

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

  .zoeken {min-width: 300px;}
  .extrabovenkantHolder .extrabovenkant .uspHolder {width: 100%;}

}

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

  .extrabovenkantHolder .extrabovenkant .uspHolder .usp:last-child {display: none;}

  .shopCategorieHolder.widget {grid-template-columns: 1fr 1fr 1fr;}

}

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


      :root {  
     --space10: 10px;
     --space15: 15px;
     --space20: 10px;
     --space30: 20px;
     --space40: 20px;
     --space50: 25px;
     --space80: 40px;
     --space100: 50px;
  }


  a.logo img {width: 120px;}
  .bovenkantHolder .bovenkant {min-height: 0;}

  .extrabovenkantHolder {display: none;}

  #speedsearchResult {right: 0; top: 100%;}
  #speedsearchResult .houder {padding: 10px;}

  .zoeken {min-width: 100%; position: static;}
  .zoeken .knop {padding: 8px;}
  .zoeken .veld #zoekWoordID {padding: 8px;}
  .zoeken .knop:before {font-size: 16px;}

  .artikel.detail .detailinkollommen {grid-template-columns: 1fr; gap: 0;}
  .artikel.detail .detailinkollommen .rechts .artikelInfo {max-width: 100%; position: relative; top: unset;}
  .artikel.detail .links > .vak {padding: 0;}

  .liquid-slide-sjabloon .sliderWrapper {background-color: var(--color1);}

  .winkelmenuHolder {display: none;}

  .sliderHolder {grid-template-columns: 1fr;}

  .vak {padding: 0;}

  .shopCategorieHolder.widget {grid-template-columns: 1fr 1fr;}

  .artikel.detail .vak.upselling .shopCompact .artikel .bestellen .bestelknop .aantalMinPlus {display: block;}

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


}