:root {
  --kleur1: #cad407;
  --kleur2: #2f2e2d;
  --kleur3: #F7F7F7;
  --fontkleur: #2f2e2d;
  --font-family1: "Work Sans", Helvetica, Arial, sans-serif;
  --max-width: 1560px;
  --text-small: 1000px;
  --border-radius: 5px;
  
}

body {font-family: var(--font-family1); font-weight: normal; color: var(--fontkleur); background: #FFF; font-size: 15px; line-height: 1.85em;}
main {background:url("/skin/images/lijnen.svg") bottom right no-repeat; }
::selection {background: var(--kleur1); color: #FFF;}

textarea, input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="number"] {border-radius: var(--border-radius); background-color: #FFF; color: #666; padding: 12px 10px;}

.breadcrumbs {display: none;}

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(--font-family1); font-weight: bold; color: var(--fontkleur); line-height: 1.35em; margin: 0 0 0.5em 0;}

h1, .h1, h1 a, h1 a:link, h1 a:visited, h1 a:hover {font-size: 35px; color: var(--kleur1);}
h2, .h2, h2 a, h2 a:link, h2 a:visited, h2 a:hover {font-size: 25px;}
h3, .h3, h3 a, h3 a:link, h3 a:visited, h3 a:hover {font-size: 18px;}
h5, .h5, h5 a, h5 a:link, h5 a:visited, h5 a:hover {font-size: 18px; font-weight: normal; color: #999;}

h1 + h5 {margin-top:-1em;}

a.logo {margin: auto 0; outline: 0;}
a.logo img {width: 300px; margin: 0;}

a.knop, .button, a.button, button {position: relative; font-family: var(--font-family1); background-color: var(--kleur1); color: #FFF; border: 0; font-size: 15px; padding: 15px 25px; cursor: pointer; line-height: 1; text-decoration: none !important; font-weight: normal; border-radius: var(--border-radius);}

a.knop:hover, .button:hover, a.button:hover, button:hover {background: var(--kleur2);}

.bovenkantHolder {position: sticky; top: 0; border: 0; background: var(--kleur3); border-bottom: 0; box-shadow: 0 0 20px rgba(0,0,0,.05);}

.bovenkantHolder .winkelmenuHolder {background: var(--kleur2);}
.bovenkantHolder .winkelmenuHolder .winkelmenu {max-width: var(--max-width); display: flex; gap: 30px;}
.bovenkantHolder .winkelmenuHolder .winkelmenu .separatorHouder {display: none;}

.bovenkantHolder .winkelmenuHolder .art-menu li a .t {color: #FFF; font-size: 16px; font-weight: 500; padding: 15px 0; font-family: var(--font-family1);}
.bovenkantHolder .winkelmenuHolder .art-menu li a .t:hover, .bovenkantHolder .winkelmenuHolder .art-menu li a.active .t {color: var(--kleur1);}

.bovenkantHolder .bovenkant {max-width: var(--max-width); padding-top: 15px; padding-bottom: 15px;}
.bovenkantHolder .bovenkant .zoekenHolder {margin: auto; width: 100%; max-width: 600px;}
.bovenkantHolder .bovenkant .zoekenHolder .zoeken {width: 100%; border-radius: var(--border-radius);}
.bovenkantHolder .bovenkant .zoekenHolder .zoeken .veld {width: 100%;}
.bovenkantHolder .bovenkant .zoekenHolder .zoeken .veld #zoekWoordID {padding: 13px;}
.bovenkantHolder .bovenkant .zoekenHolder .zoeken .veld #zoekWoordID::placeholder {color: #bbb;}
.bovenkantHolder .bovenkant .zoekenHolder .zoeken .knop {padding: 10px;}
.bovenkantHolder .bovenkant .zoekenHolder .zoeken .knop:before {font-weight: normal; font-size: 20px;}

#speedsearchResult {left:0; top:100%;}
#speedsearchResult .houder {font-size:inherit; width:100%; max-width: 100vw; border:0; border-radius: 0 0 var(--border-radius) var(--border-radius); padding:10px 10px 40px 10px; box-sizing: border-box;}

#speedsearchResult .houder .speedSearch.categorie .resultaat  {display: none;}
#speedsearchResult .houder .speedSearch.categorie ul          {display: flex; flex-wrap:wrap; gap:10px; padding:10px;}
#speedsearchResult .houder .speedSearch.categorie ul li       {margin:0;}
#speedsearchResult .houder .speedSearch.categorie ul li a     {background:#eee; border-radius: 50px; padding: 5px 15px; border:0;}
#speedsearchResult .houder .speedSearch.categorie ul li a:hover  {background:var(--kleur1); color:#fff;}

#speedsearchResult .houder .speedSearch.artikelen ul li a         {border-radius: var(--border-radius);}
#speedsearchResult .houder .speedSearch.artikelen ul li a:hover   {background-color: #eee;}
#speedsearchResult .houder .speedSearch.artikelen ul li a .omschrijving {font-weight: bold; padding-top:5px;}
#speedsearchResult .houder .speedSearch.artikelen ul li a strong {font-weight: bold; color: var(--kleur1);}
#speedsearchResult .houder .speedSearch.artikelen ul li .thumbnail {float: right;}
#speedsearchResult .houder .speedSearch.artikelen ul li .thumbnail img {mix-blend-mode: multiply;}

#speedsearchResult .houder .knopAllesOnder {position: absolute; bottom: 0; left: 0; right: 0; max-width: 100vw; box-sizing: border-box;}
#speedsearchResult .houder .knopAllesOnder a {background-color: var(--kleur2); color:#fff;}
#speedsearchResult .houder .knopAllesOnder a:hover {background-color: var(--kleur1); color: #fff;}

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

.winkelwagenHouder .winkelwagen {border-radius: var(--border-radius);}
.winkelwagenHouder .winkelwagen .inhoud.artikelen .h3 {font-weight: normal; margin: 0 0 10px 0; line-height: 1.25em; color: #000; font-size: 17px;}
.winkelwagenHouder .winkelwagen .inhoud.totaal .winkelmandjeKnoppen a.winkelmandjeKnopKassa {background: var(--kleur1);}

.account li {border: 0;}
.account .inloggenKnop::before, .account .mijnAccountKnop::before {content: "\f007"; font-family: "Font Awesome 5 Pro";  font-size: 22px; font-weight: lighter; color: var(--fontkleur);}
.account .welkom .bericht,
.account .inloggenKnop .titel, 
.account .mijnAccountKnop .titel, 
.account .favorietenKnop .titel, 
.account .favorietenKnop .haakje, 
.account .favorietenKnop .favAantal {display: none;}
.account .inloggenKnop:hover, .account .favorietenKnop:hover, .account .verlanglijstKnop:hover, .account .mijnAccountKnop:hover {text-decoration: none; color: unset;}
.account li.favorieten {padding: 10px;}
.account .favorietenKnop::before {content: "\f004"; font-family: "Font Awesome 5 Pro";  font-size: 22px; font-weight: lighter; color: var(--fontkleur);}

.account .houder {border-radius: var(--border-radius);}
.account .houder .houder2 {border: 0; background: unset; padding-top: 0;}

.art-Sheet {max-width: var(--max-width);}

.grid-2x {grid-template-columns: 1fr 1fr;}

section .inhoud, .vak .inhoud {padding: 60px 30px; max-width: var(--max-width);}
.inhoud.max900, .max900 {max-width: 900px;}
.inhoud.max700, .max600 {max-width: 700px;}
.inhoud.max600, .max600 {max-width: 600px;}

.vak.groen {background: var(--kleur1);}
.vak.zwart {background: var(--kleur2);}
.vak.grijs {background: var(--kleur3);}
.vak:is(.groen, .zwart), .vak:is(.groen, .zwart) :is(a, a:hover, .h1, h1, .h2, h2, .h3, h3, .h4, h4, .h5, h5) {color: #FFF;}

/* Submenu's (ul.subMenus li a )als blokken met titels in het midden en lichtgrijze achtergrond */

.subMenus { border-radius: var(--border-radius); display: grid; grid-template-columns: repeat(auto-fill, minmax(min(350px, 100%), 1fr)); gap:20px;}
.subMenus li {display: block;}
.subMenus li a {display: block; padding:20px; text-align: center; font-weight: bold; color: var(--fontkleur); border-radius: 5px; background: #F7F7F7; text-decoration: none;}
.subMenus li a:hover {background: var(--kleur1); color: #FFF;}




.shopSortOptie {padding: 0; border-radius: 0; border: 0; margin: 0 0 20px 0;}


.shopCategorieHolder .categorie {border-radius: var(--border-radius); border-color: #ECECEC; padding: 0; overflow: hidden;}
.shopCategorieHolder .afbeeldingHouder {background:#fff;}
.shopCategorieHolder .categorie:hover {box-shadow: unset;}
.shopCategorieHolder .categorie .titel {background: var(--kleur3); padding: 15px;}
.shopCategorieHolder .categorie .titel h2 {font-size: 15px; color: var(--fontkleur);}

.shopCategorieHolder .afbeeldingHouder img {max-height: 75%; max-width: 75%;}

.grijs .shopCategorieHolder .categorie .titel {background: #fff}

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

.compact .shopCategorieHolder.widget {gap: 20px; grid-template-columns: repeat(auto-fill,minmax(min(200px, 100%),1fr))}
.compact .shopCategorieHolder.widget .categorie       {background-color:var(--kleur3);}
.compact .shopCategorieHolder.widget .categorie:hover {filter: brightness(1.05);}
.compact .shopCategorieHolder.widget .categorie .inner {display: grid; grid-template-columns: 80px 1fr; align-items: center; text-align: center;}
.compact .shopCategorieHolder.widget .categorie .inner img {mix-blend-mode: multiply;}
.compact .shopCategorieHolder .categorie .titel h2 {text-align: left; white-space: unset;}

.shopTegel .artikel .inner {border-radius: var(--border-radius); border-color: #ECECEC; padding: 0; background: #FFF; overflow: hidden;}
.shopTegel .artikel .inner:hover {box-shadow: unset;}
.shopTegel .artikel .inner .afbeeldingHouder {background: #FFF; margin: 0;}
.shopTegel .artikel .inner .omschrijving {padding: 15px;}
.shopTegel .artikel .inner .omschrijving h2.titel a {color: var(--fontkleur);}

.shopTegel .artikel .inner .bestellen {display: grid; grid-template-columns: 1fr 1fr; gap: 15px; align-items: center;}
.shopTegel .artikel .inner .bestellen .bestelknop {margin-left: auto;}
.shopTegel .artikel .inner .bestellen .bestelknop input {width: 55px; border-radius: 5px 0 0 5px;}
.shopTegel .artikel .inner .bestellen .bestelknop a.wButBestel {line-height: 1; background: var(--kleur1); border-radius: 0 5px 5px 0; width: unset; padding: 17px 20px;}
.shopTegel .artikel .inner .bestellen .bestelknop a.wButBestel::before {font-weight: lighter; color: #FFF; font-size: 20px; content: "\f290"; font-family: "Font Awesome 5 Pro";}
.shopTegel .artikel .inner .bestellen .bestelknop a.wButBestel span {display: none;}

.shopTegel .artikel .inner .bestellen .prijzen {line-height: 1.35em;}
.shopTegel .artikel .inner .bestellen .prijzen .prijs {font-size: 20px;}

.shopCompact .labels {transform: scale(.5); transform-origin: top left;}
.shopCompact .artikel {display: grid; padding: 2px; grid-template-columns: 70px 1fr 1fr 40px;}
.shopCompact .artikel .omschrijving {line-height: 1.35em;}
.shopCompact .artikel .artikelnr {line-height: 1.5em;}
.shopCompact .artikel .bestellen {width: unset; min-width: 40px; display:block !important;}
.shopCompact .artikel .favorieten,
.shopCompact .artikel .bestellen .aantalMinPlus,
.shopCompact .artikel .artikelEenheid,
.shopCompact .artikel .artikelBestelEenheid {display: none !important;}

.shopCompact .artikel .bestellen .bestelknop a.wButBestel {font-size: inherit; padding: 5px 12px;}
.shopCompact .artikel .bestellen .bestelknop a.wButBestel::before {display:inline-block; font-family: "Font Awesome 5 Pro"; content:"\f07a"; font-weight: normal; margin-right:0;}
.shopCompact .artikel .bestellen .bestelknop a.wButBestel span {display:none;}
.shopCompact .artikel .prijzen {font-size: 14px; text-align: right;}

.artikel.detail .shopCompact .artikel .prijzen .prijs {font-size:16px;}

.productCarousel {margin: 0;}
.productCarousel .artikel {width: calc(25% - 20px); margin: 0 10px;}
.productCarousel .flickity-button {display: none;}

.pageFooterHolder {background: var(--kleur2);}
.pageFooterHolder .pageFooter {max-width: var(--max-width);}
.pageFooterHolder .pageFooter ul {list-style: none; padding: 0; margin: 0;}
.pageFooterHolder .pageFooter a {text-decoration: none !important; color: #FFF;}

.pageFooterHolder .sitemap2ul {display: none;}

.pageFooterKnoppenHolder {background: var(--kleur1);}
.pageFooterKnoppenHolder .pageFooterKnoppen {max-width: var(--max-width);}


.art-Sheet:has(.explodedView) .art-sidebar1 {display: none;}
.shopHolder.explodedView {display:grid; grid-template-columns: 3fr 2fr;}
.shopHolder.explodedView .explodedViewAfbeelding {grid-row: span 4; text-align: center;}
.shopHolder.explodedView .explodedViewAfbeelding img {position: sticky; top:170px; max-height: calc(100vh - 200px); max-width: 100%;}
.shopHolder.explodedView {display:grid;}

.explodedViewInfo:empty {display: none;}
.explodedViewInfo   {position: relative; border-radius:50px; background:#eee; padding:3px 15px 3px 3px; line-height: 1em; display:inline-block; z-index: 5;}
.explodedViewNummer {background-color: var(--kleur1); margin-right: 5px; border-radius: 50px; display: inline-block; font-weight: bold; position: relative; line-height: 16px; min-width: 16px; padding: 4px; text-align: center;  color:#fff; position: absolute; top:10px; left:10px; z-index:5;}
.explodedViewAantal {font-size: 14px; z-index: 4;}
.shopCompact .artikel .explodedViewNummer {position: absolute; z-index:2; top:50%; transform:translateY(-50%) scale(0.9); left:-10px; font-weight: normal;}

.artikel.detail .detailinkollommen {display: grid; margin: 0; grid-template-columns: 1fr 1fr; gap: 30px; grid-template-areas: "a b" "c b" "d b" "e b";}

.artikel.detail .artikelSerieActief .inner {border-color: var(--kleur1);}
.artikel.detail .detailinkollommen .links {margin: 0; width: 100%; grid-area: a;}
.artikel.detail .detailinkollommen .links .galleryHouder button {display: none;}

.artikel.detail  .volledigGallery .carousel-cell-groot .verhouding {height:calc(100vh - 350px); max-height: 500px; padding-bottom:0;}
.thumbnailGallery .carousel-cell.is-selected img, .thumbnailGallery .carousel-cell-yt.is-selected img {border-color: var(--kleur1);}

.artikel.detail .detailinkollommen .rechts {margin: 0; width: 100%; grid-area: b; z-index: 2; position: relative;}
.artikel.detail .detailinkollommen .rechts > div {position: sticky; top: 184px; padding: 30px; box-sizing: border-box; background: #f7f7f7; border-radius: var(--border-radius);}
.artikel.detail .detailinkollommen .rechts h1 {margin: 0; font-size: 24px; color: var(--fontkleur);}
.artikel.detail .detailinkollommen .rechts .merk {line-height: 1.95em; color: #777; font-size: 14px;}
.artikel.detail .detailinkollommen .rechts .eannr {margin: 15px 0;}
.artikel.detail .detailinkollommen .rechts .eannr .EANholder {background: unset; padding: 0; border-radius: 0; margin: 0;}

.artikel.detail .detailinkollommen .rechts .kenmerkgroepKeuze {margin: 0 0 20px 0;}
.artikel.detail .detailinkollommen .rechts .kenmerkgroepKeuze:last-child {margin: 0;}
.artikel.detail .detailinkollommen .rechts .kenmerkgroepKeuze .h3 {color: var(--fontkleur); font-size: 15px;}
.artikel.detail .detailinkollommen .rechts .kenmerkgroepKeuze .artikel {border-color: #E2E2E2; border-radius: var(--border-radius); background: #FFF; min-width: 60px; text-align: center;}
.artikel.detail .detailinkollommen .rechts .kenmerkgroepKeuze .artikel.actief {background: #fff; color: var(--kleur1); border-color: var(--kleur1);}

.artikel.detail .detailinkollommen .rechts .prijsVoorraad {display: flex; margin: 20px 0;}
.artikel.detail .detailinkollommen .rechts .prijsVoorraad .voorraad {margin: auto 0 0 auto; line-height: 1;}
.artikel.detail .detailinkollommen .rechts .prijsVoorraad .prijzen {line-height: 1.35em;}
.artikel.detail .detailinkollommen .rechts .prijsVoorraad .prijzen .prijs {font-size: 23px;}
.artikel.detail .detailinkollommen .rechts .prijsVoorraad .relatieBtwPrijs {font-size: 14px; color: #a4a4a4;}

.artikel.detail .detailinkollommen .rechts .bestellen .bestelknop a.wButBestel {line-height: 1; width: 100%; background: var(--kleur1);}
.artikel.detail .detailinkollommen .rechts .bestellen .bestelknop a.wButBestel::before {display: none;}

.artikel.detail .detailinkollommen .rechts .extraKnopHolder a {width:100%; text-align: center; box-sizing: border-box;}

.artikel.detail .detailinkollommen .rechts .h3 {color: var(--fontkleur); font-size: 15px;}

.artikel.detail .detailinkollommen .rechts .prijsAfspraakHolder {background: #FFFF; margin-top: 20px; transition: .3s all ease; border: 1px solid #F1F1F1; border-radius: var(--border-radius);}
.artikel.detail .detailinkollommen .rechts .prijsAfspraakHolder:empty {display: none;}
.artikel.detail .detailinkollommen .rechts .prijsAfspraakHolder .kortTab1 {font-size: 13px; width: 100%; font-weight: 500;}
.artikel.detail .detailinkollommen .rechts .prijsAfspraakHolder .kortTab1 td {vertical-align: top; border-bottom: 1px solid #F1F1F1; padding: 7px 20px !important;}
.artikel.detail .detailinkollommen .rechts .prijsAfspraakHolder .kortTab1 td.aantallen, .artikel.detail .detailinkollommen .rechts .prijsAfspraakHolder .kortTab1 td.prijsNaKorting {white-space: nowrap; padding: 0;}
.artikel.detail .detailinkollommen .rechts .prijsAfspraakHolder .kortTab1 td.toelichting {text-align: center;}
.artikel.detail .detailinkollommen .rechts .prijsAfspraakHolder .kortTab1 td.prijsNaKorting {text-align: right;}
.artikel.detail .detailinkollommen .rechts .prijsAfspraakHolder .kortTab1 .prijsNaKorting	{font-weight: 500;}
.artikel.detail .detailinkollommen .rechts .prijsAfspraakHolder .kortTab1 td.toelichting {display: none;}
.artikel.detail .detailinkollommen .rechts .prijsAfspraakHolder .kortTab1 .kortTab2 {font-weight: 600;}
.artikel.detail .detailinkollommen .rechts .prijsAfspraakHolder .kortTab1 tr:last-child td {border: 0;}

.artikel.detail .detailinkollommen h2 {color: var(--fontkleur); font-size: 23px;}

.artikel.detail .vak.meebestellen {padding: 40px 0;}

.artikel.detail .detailinkollommen .vak p + br {display: none;}

.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(--kleur1); background: #f2f2f2;}
.artikel.detail .vak.upselling .shopCompact .artikel .favorieten {display: none;}
.artikel.detail .vak.upselling .shopCompact .artikel h2.titel {font-size: 14px;}
.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 20px auto auto;}
.artikel.detail .vak.upselling .shopCompact .artikel .prijzen .prijs {font-size: 15px;}
.artikel.detail .vak.upselling .shopCompact .artikel .bestellen .bestelknop {gap: 20px;}
.artikel.detail .vak.upselling .shopCompact .artikel .bestellen .bestelknop a.wButBestel {background: var(--kleur2); line-height: unset;}
.artikel.detail .vak.upselling .shopCompact .artikel .bestellen .bestelknop a.wButBestel::after {content: ""; font-weight: lighter; color: #FFF; font-size: 18px; content: "\f290"; font-family: "Font Awesome 5 Pro";}
.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 .UPScatPlaatje {line-height: 0;}
.artikel.detail .vak.upselling .UPScontainer .UPSacc_trigger {box-shadow: unset; border-radius: 5px; background: #FFF;}
.artikel.detail .vak.upselling .UPScontainer .UPSacc_container .shopCompact {display: grid; gap: 10px;}

.shopDetailTabKenmerken {margin: 20px 0 0 0;}
.kenmerkArt, .artikelGewicht {display: grid; padding: 7px 15px; grid-template-columns: 1fr 1fr; color: #000; border: 0; font-size: 15px;}
.kenmerkArt .groep, .artikelGewicht .titel {font-weight: normal; color: #8A8884; font-size: 15px;}
.kenmerkArt:nth-child(odd), .artikelGewicht:nth-child(odd) {background-color: #F5F5F5;}
.kenmerkArt .kenmerken .kenmerk {display: block;}
.kenmerkArt .kenmerken .kenmerk .kenmerkPlaatje {display: none;}
.kenmerkArt .kenmerken .kenmerk::after {display: none;}
.kenmerkgroepKeuze.kenmerkAfbeeldingen .artikel .afbeeldingHouder img {mix-blend-mode: darken;}

#tabBijlagenInhoud {font-size: 14px; color: var(--fontkleur);}
#tabBijlagenInhoud table {width: 100%; line-height: 55px;}
#tabBijlagenInhoud table tr {position: relative;}
#tabBijlagenInhoud td {border-bottom: 1px solid #E4E4E4;}
#tabBijlagenInhoud td.blg1 {width: 50px; position: static;}
#tabBijlagenInhoud td.blg1 a img {display: none;}
#tabBijlagenInhoud td.blg1 a {text-decoration: none; position: absolute; left: 0; right: 0; top: 0; bottom: 0; display: block;}
#tabBijlagenInhoud td.blg1::before {content: "\f15b"; font-family: "Font Awesome 5 Pro"; font-size: 28px; color: var(--kleur1); font-weight: 100; padding: 13px 15px; margin-right: 12px;}
#tabBijlagenInhoud table .bijlageIcoon::after {font-size: 8px; background-color: var(--kleur1); color: #FFF; padding: 3px 5px; border-radius: var(--border-radius); position: absolute; left: 20px; bottom: 24px; display: block; line-height: 1em;}
#tabBijlagenInhoud table .bijlageIcoon.dwg::after {content: "DWG";}
#tabBijlagenInhoud table .bijlageIcoon.pdf::after {content: "PDF";}

.artikel .artikelnr {line-height: 1.95em;}
.artikel .btwinfo, .artikel .artikelnr > .titel {display: none !important;}

.kassaArtikelen .artikel .prijzen {line-height: 1.35em; font-weight: 700; color: #000;}

.relatieBtwPrijs, .stap .gewicht {display: none;}
.stap .totalen .totaalTeBetalen td {font-size: 100%;}
.kassainkollommen > .rechts .blok, .couponcodeHouder {background: #f7f7f7; border-radius: var(--border-radius);}
.kassainkollommen > .rechts .blok h2 {font-size: 16px;}
.stap .totaalExclBtw td {font-weight: 600; color: #000;}
.kassainkollommen > .rechts .blok .totalen {font-size: 14px;}
.stap .totalen .stappenKnop a {padding: 15px 20px; background: var(--kleur1); font-weight: normal;}
.stap .totalen .totaalTeBetalen td {color: #000; font-size: 16px;}
.stap .totalen .totaalArtikelen .bedragExclusiefRelatie .relatieBtwPrijs {display: none;}
.stap .blokholder {background: #f7f7f7; border-radius: var(--border-radius);}
.stap .blokholder>.titel {color: var(--kleur1);}
.stap.drie .regel .inhoud,
.stap.drie .links>div {width: 100%;}

.Taalkeuze_vlaggen.dropdownTaal ul {background: #2d2d2d; border-radius: var(--border-radius);}
.Taalkeuze_vlaggen.dropdownTaal ul li .afbeelding {display: none;}
.Taalkeuze_vlaggen.dropdownTaal ul li .omschrijving {color: #FFF;}
.Taalkeuze_vlaggen.dropdownTaal {min-width: 60px; margin: auto 20px;}
.Taalkeuze_vlaggen.dropdownTaal.open ul {background: #2d2d2d;}

.sitemap1ul > li {float:none; width:100%;}

.bovenkantHolder .bovenkant .resMenubalkinhoud a {color: var(--fontkleur); font-weight: lighter;}
.filters .kenmerkgroep .kenmerken .kenmerk img {display: none;}

.gm-style-iw-chr {position: absolute; right:0;}
.gm-style .gm-style-iw-c {border-radius: 0; box-shadow: 0 10px 20px rgba(0,0,0,.2);}
.gm-style .gm-style-iw-c button { top: 5px !important; right: 5px !important; transform: scale(1.5);}
.gMaps_logo {float:none;}
.gm-style img {height:80px; width:auto; margin-bottom:10px;}
.gMapsHolder {padding:30px 20px 20px 20px; line-height: 1.65em; font-weight: normal; width:400px; font-size:16px; box-sizing: border-box; max-width: 100%;}
.gMaps_email, .gMaps_extra1, .gMaps_adres, .gMaps_Telefoon {margin:0; }
.gMaps_Telefoon, .gMaps_extra1, .gMaps_extra2 {margin-top:0.5em;}
.gMaps_website {hyphens: auto;}
.gMaps_bedrijfsnaam {font-weight: bold !important;}
.gMapsL_type, .gMaps_type, .gMaps_naam {display: none}

.USPs {background-color: #fff; border-radius: var(--border-radius); padding: 20px; margin: 20px 0 0 0;}
ul.vinkjes    {list-style: none; padding: 0 .5em 0 .5em; margin: 0 auto 1em auto;}
ul.vinkjes li {padding: 0 0 0 1.5em; position: relative; margin: .6em 0 .6em; line-height: 1.5em; text-align: left;}
ul.vinkjes li::before {content: "\f00c"; font-weight: 700; font-family: "Font Awesome 5 Pro"; margin-right: 5px; color: var(--kleur2); left: 0; top:0; position: absolute }
ul.vinkjes li:empty {display: none;}

.dealerKaart {display: grid; position: relative;}
.dealerKaart .cleared {display: none;}
.dealerLijstHolder {position: absolute; width: unset; right: 0; display: block; z-index: 2; margin: 15px; background: #fff; border-radius: 8px; box-shadow: 0 0 30px 2px rgb(0 0 0 / 20%); float: unset;}
#dealerLijst {height: auto!important; max-height: 500px; overflow-y: auto;}

.dealerControls {display: none;}
.dealerData:hover {background-color: #fff;}
.dealerData.actief {box-shadow: unset; background-color: #fff;}
.dealerData.actief:before {border-right: 10px solid var(--tweedekleur);}
.dealerKaartMap {float: unset;}
.gm-style div {border: 0 !important;}
.gMapsL_bedrijfsnaam {font-weight: normal;}
.gMapsL_bedrijfsnaam, .gMapsL_naam, .gMapsL_adres, .gMapsL_postcode, .gMapsL_land, .gMapsL_extra1, .gMapsL_extra2, .gMapsL_extra3, .gMapsL_Fax, .gMapsL_logo {font-size: 13px !important; line-height: 1.75em;}
.gMapsL_email, .gMapsL_website, .gMapsL_Telefoon, .gMapsL_Mobiel {display: none;}
.dealerLijstAantal {font-size: 17px; text-transform: lowercase;}
.dealerLijstAantal span {font-size: inherit;}

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

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


}

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

  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: 25px;}
  h5, .h5, h5 a, h5 a:link, h5 a:visited, h5 a:hover {font-size: 20px;}

  a.logo img {width: 100px;}

  .vak {padding: 0;}
  .art-Sheet, section .inhoud, .vak .inhoud {padding: 20px;}

  .bovenkantHolder .bovenkant .zoekenHolder {margin: auto 20px;}
  .bovenkantHolder .bovenkant .zoekenHolder .zoeken {position: static;}

  .productCarousel .artikel {width: calc(50% - 20px);}

  .shopTegel .artikel .inner .bestellen {grid-template-columns: 1fr;}
  .shopTegel .artikel .inner .bestellen .bestelknop {margin-left:0;}


  .artikel.detail .detailinkollommen {grid-template-columns: 1fr; grid-template-areas: "a" "b" "c";}
  .artikel.detail .detailinkollommen .rechts > div {padding: 20px; position: relative; top: unset;}

  .artikel.detail .volledigGallery .carousel-cell-groot .verhouding {max-height: 250px; min-height: 200px;}
  .artikel.detail .thumbnailGallery .carousel-cell img {max-height: 40px;}

  .shopCategorieHolder.widget {grid-template-columns: 1fr 1fr;}
  .shopHolder.explodedView {display: block;}

  .shopCompact .artikel {display: grid; padding: 2px; grid-template-columns: 1fr 3fr 1fr; gap: 10px;}
  .shopCompact .artikel .bestellen .bestelknop a.wButBestel {display: none;}
  .shopCompact .artikel h2.titel, .shopCompact .artikel h2.titel a {word-break: break-all;}

}

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

  .productCarousel .artikel {width: calc(100% - 20px);}

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


}
