:root {
  --kleur1: #1B2A76;
  --kleur2: #00b900;
}


body {font-family: "Avenir LT Std", Helvetica, Arial, Sans-Serif; font-size: 16px;}
.art-menu li a .t {font-family: "Avenir LT Std 55 Roman", Helvetica, Arial, Sans-Serif; color: #555559;}

h1, h2 {font-family: "Avenir LT Std 55 Roman", Helvetica, Arial, Sans-Serif;}

a.logo img {width:250px; transition: .3s all ease;}

/* Kleuren */
h1, h1 a, h1 a:link, h1 a:visited, h1 a:hover,

.art-menu li a .t:hover,
.art-menu li a.active .t,
.art-menu ul li a.active,
.art-menu ul li a.active:before,
.bovenkantHolder .winkelmenu li a.active {}

/* Overige */
blockquote {
  background: #fff;
  border-radius: 6px;
  padding: 20px 30px;
  border: none;
  box-shadow: 5px 10px 30px 0 rgba(0,0,0,.1);
  max-width: 700px;
  position: relative;
  box-sizing: border-box;
}
blockquote::before {
  content: "\f10d";
  font-family: "Font Awesome 5 Pro";
  position: relative;
  display: inline-block;
  font-size: 18px;
  font-weight: 600;
  color: #7d9abf;
  left: -10px;
  top: -10px;
}

/* Links */
a, a:link, a:visited, a.visited, a:hover, a.hover,
a:link,
a:visited, a.visited,
a:hover, a.hover,

/* Inputs */
input[type="radio"]:checked::before,
input[type="checkbox"]:checked::before,

/* Responsive */
.resMenublokinhoud .resMenuItem.active > a,

/* Faq */
.faqHolder.actief .titel a,

.tooltip::before, 
.popupHolder .popup .titel .sluiten
{color: #1B2A76;}

/* Kolommen */
.pageFooterHolder .pageFooter .FCK3kolTd {vertical-align: middle;}


.extrabovenkant .valuta:hover {color:#000;}


/* Knop standaard aanpassingen */
a.knop,
.button, a.button, button,
.stap .totalen .stappenKnop a {padding: 13px 14px 11px; text-decoration: none; font-family: "Avenir LT Std 55 Roman", Helvetica, Arial, Sans-Serif; font-size: 15px; background: #1B2A76; background: #1B2A76; color:#fff; cursor:pointer;}

/* Backgrounds */
a.knop,
.button, a.button, button,
.blader_tabel1_s,
.slideshowNav .activeSlide,
.cookieMelding .inhoud .sluiten,
.popupHolder .popup .titel .sluiten,

.art-menu li a .t.action {background-color: #1B2A76;}

.winkelwagenHouder .winkelwagen .inhoud.totaal .winkelmandjeKnoppen a.winkelmandjeKnopKassa {background:var(--kleur2)}
.winkelwagenHouder .winkelwagen .inhoud.totaal .winkelmandjeKnoppen a.winkelmandjeKnopOfferte {background:#7E9ABF;}

.artikel .bestellen .bestelknop > * {box-sizing: inherit!important;}

.vak.grijs::before {background: #7E9ABF;}
.vak.grijs .inhoud h1,
.vak.grijs .inhoud h2,
.vak.grijs .inhoud ul,
.vak.grijs .inhoud p {color:#fff;}
.vak.grijs .inhoud a.knop {background:#555559; color:#fff;}

/* Blokken met achtergrond afbeelding script */
.vak.home {display: flex; padding:0; flex-wrap:wrap;}
.vak.home.ruimte {margin:20px 0;}

.vak.home .foto {background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 0; padding: 50px; box-sizing: border-box; flex: 1;}

.vak.home .tekst {display: inline-block; padding: 50px; box-sizing: border-box; background: #eee; flex: 1; }
.vak.home .tekst .tekstInhoud {display: table-cell; vertical-align: middle;}
.vak.home .tekst .tekstInhoud a.knop {background: #1B2A76; color:#fff;}
.vak.home .tekst .tekstInhoud p:last-child {margin-bottom: 0;}

.vak.home .tekst.blauw {background: #7E9BC0; color:#fff;}
.vak.home .tekst.blauw h2,
.vak.home .tekst.blauw a {color:#fff;}
.vak.home .tekst.blauw a.knop {background: #555559; color: #fff;}

.vak.home .tekst.blauw.midden {text-align: center;}
.vak.home .tekst.blauw.midden .tekstInhoud {display: block;}

.vak.lichtblauw {background: #edeef4;}
.vak.lichtblauw::before {position: absolute; top: 0; bottom: 0; left: 50%; width: 100vw; transform: translateX(-50%); content: ""; background: #edeef4; z-index: -2;}

/* Knoppen color */
.art-menu li a .t.action,
.stappenbalk .bezig .naam {color: #7E9ABF;}

/* Donkerder / hovers */
.winkelwagenHouder .winkelknop .aantal,
.presentatieWijze a .titel, .sorteerKnoppen a .titel,

/* Call to action knoppen */
.meldingHouder .melding .knoppen a.bevestigen,
.stap .totalen .stappenKnop a,
.artikel .bestellen .bestelknop a.wButBestel,
.stap.twee .tekstNieuwAdres a,
#extraSchermWinkelmand .schermWinkelMandje .knoppen a.bevestigen,

/* Orderproces */
.stappenbalk .bezig::before,
.stap .totalen .bedrag .gratis,
.stap.drie .regel .bedrag .gratis,
a.knop.volgendeStap
{background: var(--kleur2);}

.stap.drie .regel .bedrag .gratis,
.stap .totalen .bedrag .gratis {padding:5px 5px 3px;}

a.knop.volgendeStap {color: #fff;}

/* .1 opacity voor actieve statussen */
.stap.drie .regel.actief {background: #f0f5f7;}

/* Tansparantie */
.liquid-slide-sjabloon .inhoud {background:rgba(27, 42, 118, 0.9); border-radius:3px;}


/* Border color */
.stap.drie .regel.actief {border-color: #7E9ABF;}

.EANnummer .toelichting, .artikelnrKenmerk .artikelnr .titel {min-width: 60px; color: #aaa; padding-right: 10px; display: inline-block;}
#specificatiesInhoud .artikelnrKenmerk, #specificatiesInhoud .EANholder {padding: 5px 0; border-bottom: 1px solid #eee;}
.kenmerkArt .groep, .artikelGewicht .titel {min-width:101px;}

.filters .kenmerkgroep .kenmerken {z-index: 0;}


/* USP */
ul.vinkjes {list-style: none; padding-left: 0; margin: 0; margin-bottom:10px;}
ul.vinkjes li {padding: 0;}
ul.vinkjes li:before {content: ""; font-family: "Font Awesome 5 Pro"; font-weight: 700; color: var(--kleur2); left: -8px; position: relative; padding: 0 0 0 10px;}
ul.vinkjes li strong {font-family:"Avenir LT Std 55 Roman"; color: #ff810a;}

/* Border top color */
.tabsV2 .titels > div.actief {border-top-color: #7E9ABF;}

/* Footer */
.pageFooterHolder .pageFooter {text-align: center;}
.pageFooterHolder .pageFooter .socialMedia a {font-size: 25px; color:#7E9ABF;}
.pageFooterHolder .pageFooter .socialMedia a:hover {color:#fff;}
.pageFooterHolder .pageFooter a {color:#7E9ABF;}
.pageFooterKnoppenHolder {background: #7E9ABF;}

/* Slogan */
.slogan span,
.account .inloggenKnop,
.account .favorietenKnop {font-weight: bold; font-family: "Avenir LT Std 55 Roman", Helvetica, Arial, sans-serif; color: #1e2d77; margin-right: 5px; font-size:15px;}
.slogan span a {margin-left:5px;}
.account .welkom {color:#fff;}
.account .inloggenKnop:hover, .account .favorietenKnop:hover, .account .verlanglijstKnop:hover, .account .mijnAccountKnop:hover {color:#ddd;}

/* Display none */
.artikelGroepPrijs {display: none;}

/* Inloggen  */
.account .houder {display: none;}
.account .openGeklapt .houder {display: block;}

/* Overige */

h1, .h1, h1 a, h1 a:link, h1 a:visited, h1 a:hover  {font-size:24px;}
h2, .h2, h2 a, h2 a:link, h2 a:visited, h2 a:hover  {font-size:20px;}
h3, .h3, h3 a, h3 a:link, h3 a:visited, h3 a:hover  {}

table + h2,
table + h3 {margin-top:2em !important;}

.art-menu li a.active .t {color:#1B2A76; border-bottom:2px solid #7E9ABF;}
a.catMenuLink0liSel {color:#1B2A76 !important; border-bottom:2px solid #7E9ABF; padding-top: 5px; padding-bottom:5px;}
a.catMenuLink1liSel {color:#1B2A76 !important; }

.stap .totalen .totaalTeBetalen td {font-size: 100%;}

.shopTegel .shopDetailModernKenmerken                         {font-size:13px; line-height: 1.5em;;}
.shopTegel .artikel .kenmerkArt                               {border:0; padding:0; display:inline-block; width: auto; line-height: 1.5em;}
.shopTegel .artikel .kenmerkArt .titel::after                 {content:","; padding-right:3px;}
.shopTegel .artikel .kenmerkArt:last-of-type .titel::after    {content:"";}
.shopTegel .artikel .kenmerkArt .groep  {display:none; width:auto;}

.shopTegel .artikel .meerinfo {margin-top:0;}
.shopTegel .artikel .prijzen {margin-top:auto;}


.shopTegel .artikel .bestellen {display:none;}
.shopTegel .artikel .voorraad,
.shopLijst .artikel .voorraad,
.shopCompact .artikel .voorraad {display:none !important;}



.artikel .voorraad .aantal {font-weight: bold;}
.artikel .voorraad .aantal.aantalPos {color:var(--kleur2);}

.kassaArtikelen .artikel .aantallen input {width:60px;}

.artikel.detail .detailinkollommen .rechts .productDetailIconen {display: flex; gap: 10px; line-height: 0; margin: 30px 0;}
.artikel.detail .detailinkollommen .rechts .productDetailIconen img {height: 50px !important; width: auto !important;}

/* .artikel .prijzen .valuta {display:none;} */
.relatieBtwPrijs {display: none !important;}
.stap .gewicht {display:none;}


.artikel .artikelnr {color: #303030; font-size: 16px;}

.shopNavigatie .button {white-space: nowrap; background: 0; color: #000;}

.productCarrousel li .artikel .inner .afbeeldingHouder {
  width: 200px!important;
  height: 200px!important;
}

/* Moederartikel naast elkaar tonen V2  */
.artikel.detail .dochters             {margin:10px 0; max-width:300px;} 
.dropdown ul {position: relative;}

.art-Sheet {max-width: 1800px;}

.bovenkantHolder {position: sticky; top: 0; transition: .3s all ease;}
.bovenkantHolder.scrolled .bovenkant a.logo img {width: 150px;}

.extrabovenkant .account {margin-left:20px}
a.snelBestelLink {color:#fff; font-size:15px; margin-left:auto; font-family: "Avenir LT Std 55 Roman", Helvetica; text-decoration: none; line-height: 40px;}
a.snelBestelLink:hover {text-decoration: underline;}

.progressHolder {height: 5px; background: #ccc; position: fixed; top: 0; z-index: 22; width: 100%; background-color: #f1f1f1;}
.progressBar {height: 5px; background: #75c567; width: 0%;}


.EANholder {margin-bottom:20px;}

.artikel.detail .bestellen .bestelknop a.wButBestel {margin: 0; display: flex;}
.artikel.detail .bestellen .bestelknop .wButBestel::before {display: none;}
.artikel.detail .bestellen .bestelknop .wButBestel span {margin: auto;}
.artikel.detail .bestellen .bestelknop .wButBestel span::before {content: "\f291"; font-family: "Font Awesome 5 Pro"; margin: 0px 10px 0px 0px; font-weight: normal;}
.artikel.detail a.bestellenUit.button {display: none; max-width: 280px;}
.artikel.detail .favorieten {margin: 15px 0;}

.artikel.detail .vak.faq {margin-top: 30px;}

.adviesprijs {display:block;}

.registreer {font-size: 15px;}

.bedrijfsGegevens.zakelijkTonen {max-height: 250px;}

.kassainkollommen .links .blokholder #verzendmethodes .button, .kassainkollommen .links .blokholder #verzendmethodes a.button, .kassainkollommen .links .blokholder #verzendmethodes button {margin-top: 10px; padding: 5px 10px;}

a[name^='toc'] {display: block; position: relative; top: -150px; visibility: hidden;}

.extrabovenkantHolder { padding-top: 3px; }
.bovenkantHolder { border: 0; }
.bovenkantHolder .winkelmenu { border: 0; background-color: #edeef4; }
.extrabovenkantHolder { background-color: #1a2a76; color: #fff; }
.slogan span a { margin-left: 5px; color: inherit; text-decoration: none; }
.account li {border: 0;}
.account .openGeklapt .inloggenKnop, .account .openGeklapt .favorietenKnop, .account .openGeklapt .verlanglijstKnop, .account .openGeklapt .mijnAccountKnop { color: inherit; }
.slogan span, .account .inloggenKnop, .account .favorietenKnop { color: inherit; }
.art-menu li a .t { padding: 5px 0; margin: 5px 10px; }
.filters.filtersLinks { border: 0; background: #edeef4; }

#extraSchermWinkelmand .schermWinkelMandje .shopLijst {padding: 20px; box-sizing: border-box;}

#extraSchermWinkelmand .schermWinkelMandje .shopLijst .artikel .prijzen {width: unset;}

#extraSchermWinkelmand .schermWinkelMandje .shopLijst .artikel .bestellen {display: block;}
#extraSchermWinkelmand .schermWinkelMandje .shopLijst .artikel .bestellen .bestelknop a.wButBestel {line-height: 1; width: unset !important; margin-left: auto;}
#extraSchermWinkelmand .schermWinkelMandje .shopLijst .artikel .bestellen .bestelknop a.wButBestel span {display: none;}
#extraSchermWinkelmand .schermWinkelMandje .shopLijst .artikel .bestellen .bestelknop a.wButBestel::before {font-family: "Font Awesome 5 Pro"; font-weight: normal; color: #FFF; font-size: 16px; content: "\f290";}
#extraSchermWinkelmand .schermWinkelMandje .shopLijst .artikel .bestellen .bestelknop input {margin: 0;}
#extraSchermWinkelmand .schermWinkelMandje .shopLijst .artikel .bestellen .aantalMinPlus {display: none;}



#tabMeebestellenInhoud .shopLijst {padding: 20px; box-sizing: border-box;}

#tabMeebestellenInhoud .shopLijst .artikel .prijzen {width: unset;}

#tabMeebestellenInhoud .shopLijst .artikel .bestellen {display: block;}
#tabMeebestellenInhoud .shopLijst .artikel .bestellen .bestelknop a.wButBestel {line-height: 1; width: unset !important; margin-left: auto;}
#tabMeebestellenInhoud .shopLijst .artikel .bestellen .bestelknop a.wButBestel span {display: none;}
#tabMeebestellenInhoud .shopLijst .artikel .bestellen .bestelknop a.wButBestel::after {font-family: "Font Awesome 5 Pro"; font-weight: normal; color: #FFF; font-size: 16px; content: "\f290";}
#tabMeebestellenInhoud .shopLijst .artikel .bestellen .bestelknop input {margin: 0;}

#extraSchermWinkelmand .schermWinkelMandje .melding .popupTekst {text-align: center;}


/* Downloadsectie aangepast */
.downloadsSectie {padding:30px; margin-bottom: 30px; background: #edeef4; border-radius: 5px;}
.downloadsSectie p:last-child {margin-bottom:0;}

.downloadsSectie .SectieLijst table.lijst th {display:none;}
.downloadsSectie .SectieLijst table.lijst tr {display:grid; grid-template-areas: "a b" "a c"; gap:0; grid-template-columns: auto 1fr; gap: 0; line-height: 1.35em; margin-bottom:10px;border-radius: 5px;overflow: hidden;}
.downloadsSectie .SectieLijst table.lijst tr:first-child {display: none;}
.downloadsSectie .SectieLijst table.lijst tr td:nth-child(1) {grid-area: a; padding: 10px 10px 10px 5px; text-align: center; display: flex; justify-content: center; align-items: center;}
.downloadsSectie .SectieLijst table.lijst tr td:nth-child(2) {grid-area: b; padding-top: 10px; white-space: wrap;}
.downloadsSectie .SectieLijst table.lijst tr td:nth-child(3) {grid-area: c; padding-bottom: 10px; padding-top: 5px; white-space: wrap;}
.downloadsSectie .SectieLijst table.lijst tr td:nth-child(1) img {width:auto; max-height: 100%; max-width: 100%;}
.downloadsSectie .SectieLijst table.lijst tr td {padding:0; border:0;}
.downloadsSectie .SectieLijst table.lijst tr td a {font-weight: bold; font-size: 18px;}
                                                    


@media screen and (max-width: 1000px){
  .vak.home {margin-bottom:10px;}
  .vak.home:last-child {flex-wrap: wrap-reverse; margin-bottom:0;}
  .vak.home .foto {padding: 50%; overflow: hidden;}

  .extrabovenkantHolder .extrabovenkant .slogan {display: block!important;}

  .inschrijvenKolom {flex-direction: column;}
  .inschrijvenKolom>.rechts {width: 100%; margin: 0;}
}

@media screen and (max-width: 900px){
.bovenkantHolder .winkelmenu {white-space: normal;}
.art-menu.winkelmenu {display:none;}
.openklapper {width:40px;}
}

@media screen and (max-width: 760px){
  ul.vinkjes {padding-bottom:7px; border-bottom: 1px solid #eee;}
  a.logo img {width:150px;}

  .pageFooterHolder .pageFooter .FCK3kolTd {margin-bottom:20px;}
}