/* input(160,26): run-time error CSS1030: Expected identifier, found '.'
input(160,36): run-time error CSS1025: Expected comma or open brace, found ')'
input(336,29): run-time error CSS1024: Expected media identifier, found '{'
input(340,1): run-time error CSS1019: Unexpected token, found '}'
input(374,29): run-time error CSS1024: Expected media identifier, found '{'
input(374,62): run-time error CSS1019: Unexpected token, found '}'
input(578,74): run-time error CSS1031: Expected selector, found '/'
input(578,74): run-time error CSS1025: Expected comma or open brace, found '/' */
:root {
    --white: #FFFFFF;
    --black: #F5F5F5;
    --black1: #333C4E;
    --dark: #238bc6;
    --dark-secondary: #403c37;
    --darken: #115a8b;
    --darken-secondary: var(--dark);
    --light: #229ce2; /*color lightend from var --dark*/
    --light-secondary: var(--dark);
    --lighten: #E5E5E5 /*#E5E5E5*/;
    --background: #EEEEEE /*#EEEEEE*/;
    --background-light: #F0F0F0;
    --light-gray: #EEEEEE;
    --dark-pink: var(--dark);
    --background-lights: #F9F9F9;
    --box-light: var(--dark);
    --gray1: #B9B9B9;
    --gray2: #495057;
    --gray3: #777777;
    --gray4: #555555;
    --yellow: #FBBA00;
    --blue: #66AFE9;
    --green: #008000;
    --light-gray2: #dddddd;
    --light-gray3: #D3D3D3;
    --black2: #333C4E;
    --background-black: #2f2f2f;
    --table-blue: #0374bc45;
    --warning-default: #ff0000;
    --warning-option-2: #ffa500;
    --add-to-cart-button: #25D037;

    --main-category-title: var(--dark);
    --sublist-category-title: var(--dark);
    --list-category-title: var(--dark-secondary);
    
    --square-corners: 0px;
    --small-rounded-corners: 5px;
    --medium-rounded-corners: 10px;
    --large-rounded-corners: 15px;
    --rounded-corners: var(--medium-rounded-corners);
    --font-family: 'Open Sans';
    --product-information-bar: 150px;
    --border-width-default: 1px;
    --border-width-option-2: 2px;
}
.item-box .product-box-add-to-cart-button, .variants-buttons .show-variants{
    background-color: var(--add-to-cart-button);
}



/*Homepage categories*/

.home-page-category-grid .item-box .picture{
    border-radius: var(--rounded-corners);
}
.home-page-category-grid .item-box .picture img{
    border-radius: var(--rounded-corners);
}
.category-grid.home-page-category-grid .row {
    justify-content: center;
}

.master-wrapper-page > header .header-sticky-part {
    background: var(--dark-secondary);
}

@media screen and (max-width: 991px) {
    .header-sticky-part {
        margin: 0 -30px;
    }
}

.home-page-filters-wrapper .search-button,
.home-page-filters-wrapper .results-number {
    background: var(--light-secondary);
}

.home-page .homepage-help-wrapper {
    padding: unset;
}

/*home page more information widget*/
.homepage-help {
    border-radius: var(--medium-rounded-corners);
}

.prins-mobile-layout {
    display: none;
}

/*Responsive layout*/
@media screen and (max-width: 1040px) {
    .home-page .homepage-help{
        max-width: unset;
    }

    .home-page .homepage-help-wrapper .img-section {
        right: 0;
    }

    .homepage-help-wrapper img{
        width: 100%;
        height: auto;
        bottom: 0;
        position: absolute;
        max-height: unset;
    }
}

@media (max-width: 480px){
    .home-page .homepage-help-wrapper{
        display: flex;
    }

    .home-page .homepage-help-wrapper .content-section{
        width: 100%;
    }

    .homepage-help-wrapper .img-section{
        display: contents;
    }

    .homepage-help-wrapper .img-section img {
        position: relative;
        margin-bottom: -15px;
    }
}
/*end home page more information widget*/
/*home page whatsapp HTML widget*/
.float{
    position:fixed;
    width:60px;
    height:60px;
    bottom:40px;
    right:40px;
    color:#FFF;
    background-color:#25d366;
    border-radius:50px;
    text-align:center;
    font-size:30px;
    box-shadow: 2px 2px 3px #999;
    z-index:100;
}
.my-float{
    margin-top:16px;
}
.fa.fa-whatsapp {
    font-size: xxx-large;
}
/*end home page whatsapp HTML widget */

.menu-description .item-box {
    display: none;
}

/*FOOTER padding fix*/
.master-wrapper-page:has(.home-page) .footer {
    padding-top: unset;
}

/*Footer background*/
.footer-lower.full-background::before {
    background-color: var(--dark-secondary);
}
.footer-upper.full-background{
  padding: 6rem 0;
}
.footer-upper.full-background::before {
    background-image: url(/images/uploaded/nieuwsbrief-image3_1000.jpeg);
    background-position: center;
    background-size: cover;
    background-color: var(--dark-secondary);
    opacity: 0.8;
    background-blend-mode: overlay;
}

.header-bottom.full-background::before{
    background-image: linear-gradient(45deg, var(--dark), var(--darken));
}

/*Footer content color*/
.footer-lower .footer-block .title{
  color: var(--dark);
}
.footer-lower .footer-block .nav-link{
  color: var(--white);
}

/*width staat in HTML*/
.bestsellers .slick-track {
    width: auto !important;
}

/*header-top background change*/
.header-top.full-background::before {
    background-color: var(--dark-secondary);
}
/*END -- header-top background change*/

/*HTML widget 2 colomn - text left, img right*/
  .two-col-widget {
    display: flex;
    flex-wrap: wrap;
    background: var(--background);
    padding: 1rem;
    border-radius: 8px;
  }

  .two-col-widget .col {
    flex: 1 1 300px; /* flexible but with min width */
    padding: 1rem;
  }

  .two-col-widget .left {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .two-col-widget .right img {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
  }
/*END - HTML widget 2 colomn - text left, img right*/

/*News items homepage*/

/* Container for all news */

.news-list-homepage .title{
    font-weight: bold;
    font-size: 26px;
    color: var(--darken);
}

.news-list-homepage .title strong {
    font-weight: unset;
}

.news-items {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;               /* space between items */
  margin: 2rem 0;
}

/* Individual card */
.news-item {
  flex: 1 1 calc(33.333% - 1rem); /* 3 items per row, responsive */
  background: var(--background);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  display: flex;
  flex-direction: column;
}
/*This unneeded code is here because a class id of the right newsitem has margin for some reason*/
.news-list-homepage .news-items .news-item:nth-last-child(1){
    margin: unset;
}

/* Image wrapper */
.news-item .news-item-picture img {
  width: 100%;
  height: auto;
  object-fit: cover;
  display: block;
}

/* Title */
.news-item .news-title {
  margin: 1rem;
  font-size: 1.2rem;
  font-weight: 600;
}

/* News Date */
.news-list-homepage .news-item .news-date{
    margin: 0 1rem 1rem;
    color: var(--dark-secondary);
}

/* Body/summary */
.news-item .news-body {
  margin: 0 1rem 1rem;
  color: var(--dark-secondary);
  font-size: 0.95rem;
  flex-grow: 1;
  text-align: left;
}

/* Read more button/link */
.news-item .read-more {
  margin: 0 1rem 1rem;
  align-self: flex-start;
  font-size: 0.9rem;
  color: var(--background-light);
  text-decoration: none;
}

.news-item .read-more:hover {
  text-decoration: underline;
}

/* Mobile stack */
@media (max-width: 768px) {
  .news-item {
    flex: 1 1 100%;
  }
}

/*END - News items homepage*/

/*──────────────────────────────────────────────────────────────
                                                                            INFO.WIDGET ──────────────────────────────────────────────────────────────*/ 
.info-widget .title span{
  background:var(--dark);
  padding:15px 30px;
  color:var(--white);
  font-family:var(--font-family);
}

.widget-columns{
  display:flex;
  flex-wrap:wrap;
  align-items:stretch;
  font-family:var(--font-family);
}
.widget-left,
.widget-right{flex:1 1 100%}
@media /*(min-width:992px)*/{
  .widget-left,
  .widget-right{flex:0 0 50%;display:flex;flex-direction:column;justify-content:space-between}
  .widget-right{padding-left:20px}
}

.promo-img{
  width:100%;
  height:100%;
  object-fit:cover;
  cursor:pointer;
  display:block;
  border-radius: var(--rounded-corners);
}

.cta-row{
  position:relative;
  display:flex;
  align-items:center;
  padding:2px;
  background:var(--white);
  border:var(--border-width-default) solid var(--black);
  border-radius: var(--rounded-corners);
  color:var(--dark-secondary);
  text-decoration:none;
  transition:background .2s;
}
.cta-row:hover{background:var(--light-gray)}
.widget-right .cta-row:not(:last-child){margin-bottom:10px}

.cta-text{
  display:flex;
  flex-direction:column;
  justify-content:space-around;
  padding:26px 24px;
  margin-right:60px;
  line-height:1.25;
}
@media /*(min-width:992px)*/{.cta-text/*{margin-right:90px}*/}
.cta-title{font-size:45px;font-weight:500}
.cta-title strong{color:var(--dark)}
.cta-text small{font-size:22px;margin-top:-10px}

.arrow{
  position:absolute;
  top:1px;
  bottom:1px;
  right:1px;
  width:60px;
  background:var(--dark-secondary);
  display:flex;
  align-items:center;
  justify-content:center;
}
@media (min-width:992px){.arrow{width:88px}}
.arrow i{font-size:5rem;color:var(--white);transition:transform .2s}
.cta-row:hover .arrow i{transform:translateX(4px)}

.footer-cta{
  position:relative;
  margin-top:24px;
  padding:30px 30px 48px;
  background:var(--dark-secondary);
  border-radius: var(--rounded-corners);
  color:var(--white);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:12px;
  text-align:left;
  font-size:26px
}
.footer-cta span{font-size:26px;line-height:1.2;font-weight:500;text-transform:uppercase}
.footer-cta span strong{color:var(--white);text-decoration:underline;text-underline-offset:3px}
.footer-cta span strong:hover{color:var(--orange);cursor:pointer}

.speech-btn{
  position:absolute;
  bottom:23px;
  right:20px;
  display:flex;
  justify-content:center;
  align-items:center;
  padding:4px 40px;
  background:var(--white);
  color:var(--black);
  border-radius:20px;
  font:400 26px var(--font-family);
  text-decoration:none;
  white-space:nowrap;
  min-width:max-content
}
.speech-btn::after{
  content:'';
  position:absolute;
  left:50%;
  bottom:-8px;
  transform:translateX(-50%);
  border:8px solid transparent;
  border-top-color:var(--white)
}

@media (max-width:991.98px){
  .widget-right{padding:0}
  .cta-title{font-size:1.35rem}
  .arrow,.speech-btn{width:60px}
  .cta-text{margin-right:60px}
  .footer-cta{padding-bottom:30px}
  .speech-btn{
    position:static;
    width:100%;
    margin-top:16px;
    justify-content:center;
    border-radius:20px
  }
  .speech-btn::after{content:none}
}
/*─────────────────────────────────────────────────────────────
                                                                             EIND INFO.WIDGET
 ─────────────────────────────────────────────────────────────*/
/*──────────────────────────────────────────────────────────────
                                                                            NIEUWS ─────────────────────────────────────────────────────────────*/ 
.news-list-homepage .news-items .news-item {
    overflow: hidden;
    margin-left: 15px;
}
.news-list-homepage .news-items .news-item:nth-child(2) {
    margin-left: 0 !important;
}
.news-items .card-img {
    width: 100%;
    height: auto;
    border-radius: 10px 10px 0 0;
    transition: transform 0.5s ease !important;
}
.news-list-homepage .top {
    padding: 20px 20px 0 20px;
    width: auto;
    background-color: var(--light-gray);
    height: 100%;
    z-index: 1;
}
.news-list-homepage .news-img { height: 54% !important; }
.news-items .card-img:hover { transform: scale(1.2) !important; }
.news-list-homepage .news-item { padding: 0; }
.news-list-homepage .top { padding: 20px 20px 0 20px; }
.news-list-homepage .news-item .buttons {
    padding: 0;
    position: relative;
    bottom: 63%;
    margin: 0 auto;
}
.news-list-homepage .news-item .read-more {
    background: var(--dark);
    border-radius: var(--rounded-corners-theme-2) !important;
}
.news-list-homepage .view-all {
    position: absolute;
    right: 0;
    background: var(--white);
    color: #777;
    border: 1px solid #777;
    padding: 9px 20px;
    border-radius: var(--rounded-corners-theme-2);
    font-weight: bold;
    bottom: 8%;
    display: none;
}
.news-list-homepage .news-item .news-date { display: none; }
@media only screen and (max-width: 991px) {
    .news-list-homepage .news-items .news-item { margin-bottom: 15px; }
    .news-list-homepage .view-all { right: 33%; bottom: unset; }
    .news-list-homepage .news-item .buttons { margin: 15px auto; bottom: 0; }
    .news-list-homepage .news-items .news-item { margin-left: 0; }
    .news-list-homepage .news-item .news-title { padding-bottom: 8px; }
    .news-list-homepage .news-item:nth-last-child(1){ margin-top: 0; }
}
.news-item img {
    width: 100%;
    height: 100%;
}
/*──────────────────────────────────────────────────────────────
END NIEUWS ──────────────────────────────────────────────────────────────*/
            
/*─────────────────────────────────────────────────────────────
            
            
/*─────────────────────────────────────────────────────────────

─
Category page ──────────────────────────────────────────────────────────────*/
.item-grid .item-box .sub-category-item {
    border: none;
	box-shadow: 0px 2px 8px 0px rgba(99, 99, 99, .2);
}

.item-grid .item-box .sub-category-item:hover {
	box-shadow:rgba(99,99,99,.2) 0px 2px 8px 5px;
}

.product-item {
	box-shadow: 0px 2px 4px 2px rgba(99, 99, 99, .2);
}

.item-grid .item-box .product-item:hover {
    box-shadow: 0 0 10px 2px rgba(0, 0, 0, .1);
transition: 0.2s ease-out;
}

.sub-category-item.card-block .title {
    background-color: var(--white);
    margin-bottom: 0;
    font-size: 1rem;
	color:  var(--dark);
    text-transform: none;
    text-align: center;
    padding: 5px 5px;
    display: flex;
    min-height: 40px;
    justify-content: center;
    align-items: center;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}
            
.block .title{
    background-color:var(--white);
    color:var(--dark);
   }

.block{
	box-shadow: 0px 2px 8px 0px rgba(99, 99, 99, .2);
}

.block .listbox {
border: none;
border-radius: var(--rounded-corners);
}

/*──────────────────────────────────────────────────────────────
End Category page ──────────────────────────────────────────────────────────────*/
─
Mega Menu ──────────────────────────────────────────────────────────────*/
  @media (min-width: 992px) {          
    .parent-menu {
        width: 250px;
        float: left;
        padding: 30px 0;
    }
}
            
                  
/*──────────────────────────────────────────────────────────────
End Mega Menu ──────────────────────────────────────────────────────────────*/
               
/* ============================================
   Ratering Nieuws / Blog Tegels – COMPLETE CSS
   ============================================ */

/* --------- Basis layout en positionering --------- */

/* Wrapper van één tegel */
.rich-blog-homepage .blog-post {
    position: relative;
    margin: 40px 10px 120px;
}

/* Afbeelding-blok bovenin */
.rich-blog-homepage .blog-post .post-primary {
    border-radius: 26px;
    overflow: hidden;
    background: #e7ecf4;
}

/* Afbeelding zelf */
.rich-blog-homepage .blog-post .post-picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Witte kaart die over de afbeelding schuift */
.rich-blog-homepage .blog-post .post-details {
    position: absolute;
    left: 6%;
    right: 6%;
    bottom: -60px;
    background: #ffffff;
    padding: 24px 28px;
    border-radius: 26px;
    box-shadow: 0 18px 35px rgba(0, 0, 0, 0.12);

    display: flex;
    flex-direction: column;
    min-height: 210px;     /* gelijke hoogte kaarten */
}

/* Titel */
.rich-blog-homepage .blog-post .post-title {
    font-size: 20px;
    font-weight: 700;
    color: #2b4d7d;
    margin-bottom: 8px;
}

/* Beschrijving (max 3 regels + ...) */
.rich-blog-homepage .blog-post .post-description,
.rich-blog-homepage .blog-post .post-body {
    flex: 1 1 auto;
    font-size: 14px;
    line-height: 1.6;
    color: #555;

    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;       /* Aantal regels */
    -webkit-box-orient: vertical;
}

/* "Lees meer" link */
.rich-blog-homepage .blog-post .read-more {
    font-size: 14px;
    font-weight: 600;
    color: #0072bc;
    text-decoration: none;
    margin-top: 12px;
    align-self: flex-start;
}

.rich-blog-homepage .blog-post .read-more:hover {
    text-decoration: underline;
}

/* Extra ruimte onder de carousel omdat kaarten overlappen */
.rich-blog-homepage .owl-stage-outer {
    overflow: visible !important;
    padding-bottom: 110px;
}

/* Verberg horizontale rommel (zoals schaduwen) */
.rich-blog-homepage {
    overflow-x: hidden;
}


/* --------- 3 kolommen indeling (override OwlCarousel) --------- */

/* Maak de serie items full-width + flex */
.rich-blog-homepage .owl-stage {
    display: flex;
    align-items: stretch;
    width: 100% !important; /* override inline width */
}

/* Zorg dat items via flex verdelen */
.rich-blog-homepage .owl-stage .owl-item {
    box-sizing: border-box;
}

/* Desktop = 3 kolommen */
.rich-blog-homepage .owl-carousel .owl-stage .owl-item {
    flex: 0 0 33.3333%;
    max-width: 33.3333%;
    width: 33.3333% !important;
    margin-right: 25px;
}

/* Tablet = 2 kolommen */
@media (max-width: 991px) {
    .rich-blog-homepage .owl-carousel .owl-stage .owl-item {
        flex: 0 0 50%;
        max-width: 50%;
        width: 50% !important;
    }
}

/* Mobiel = 1 kolom */
@media (max-width: 575px) {
    .rich-blog-homepage .owl-carousel .owl-stage .owl-item {
        flex: 0 0 100%;
        max-width: 100%;
        width: 100% !important;
        margin-right: 0;
    }
}

.rich-blog-homepage .blog-post {
	box-shadow: none;
     margin: 0px ;
overflow: visible ;
}          
            
 /* Speedfilters */  
.fns-speedfilters .filter-data-block li {
    padding: 0 20px !important;
}  

.fns-speedfilters .filter-data-block,
p[class^="filter-item-"] {
    margin-top: 15px;
}     

.filter-data-block {
    border: none;
}

.fns-speedfilters .filter-block {
  border-radius: var(--rounded-corners); 
}

.fns-speedfilters .all-filters-block {
margin-top: 10px;
text-transform: capitalize;
}
.fns-speedfilters .filter-block .title .toggleControl {
   border-bottom: 1px var(--light-secondary) solid;
}



     
/* Basisstijl van de knop */
.product-box-add-to-cart-button {
    position: relative;
    overflow: hidden;
    z-index: 1;
    transition: color 0.3s ease;
}

/* Het bewegende blauwvlak */
.product-box-add-to-cart-button::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 0%;
    background: var(--darken); /* eindkleur: blauw */
    z-index: -1;
    transition: width 0.35s ease;
}

/* Hover: vul van links → rechts */
.product-box-add-to-cart-button:hover::before {
    width: 100%;
}

            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
