/******* MAIN */
html {scroll-behavior: smooth;}
body {color:#666666;font-size: 14px; font-family: 'Lato', sans-serif;}

h3,h4,h5,h6 {color: #0c4279}
h1 {color: #0c4279; font-weight:700;font-size: 26px;margin-bottom: 10px;}
h2 {color: #0c4279; font-weight:700;}
a, a:hover, a:focus, a:active, a:visited {;color: inherit;}
.no-underline {text-decoration: none;}

/******* COMMON */
.grey {color:#555}
.orange {color:#f90}
.blue {color:#0c4279}
.green {color:#117d29}
.green-2 P{color:#60C400}
.bg-orange {background-color:#f90}
.bg-blue {background-color:#0c4279}
.bg-grey {background-color:#e9ecef}
.bg-grey-1 {background-color: #F5F5F5}
.bg-green {background-color:#117d29}
.bg-green-2 {background-color:#60C400}
.border-hover,
.border-hover-green {border: 1px solid #e9ecef}
.border-hover:hover {cursor: pointer;border: 1px solid #0c4279}
.border-hover-green:hover {cursor: pointer;border: 1px solid #117d29}
.rounded-m {border-radius: 1rem}
.hide,
.onzichtbaar {display:none!important}
.block,
.block-static-block.widget, 
.block-cms-link.widget {margin-bottom:0;}
.mark {background-color:initial}
.message.global.noscript, .message.global.cookie {padding:8px}
.page-products .columns {margin-top:0; padding-top: 0;}
.page.messages,
.column.main {margin-top: 0;}

.imghelper {width: 100%; height: auto; aspect-ratio: attr(width) / attr(height);} 
.imgfit {object-fit: cover;}

@media (max-width: 991px) {
    .page.messages, .column.main {margin-top:0;padding-top: 0;}
    .sidebar > .block.filter {padding-top: 20px;}
}

/******* BUTTONS */
.btn-2 { text-align: center;white-space: nowrap;vertical-align: middle; line-height: 2rem;padding: 8px 12px;font-size: 1.4rem;box-shadow: none;display: inline-block;border: 1px solid transparent;border-radius: 4px;transition: color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out;}
.btn-2.primary {font-weight: 400;color: #0C4279;background-color: #ffc107; border-color: #ffc107;text-decoration: none;}
.btn-2.primary:hover {background-color: #e0a800;border-color: #d39e00;}

.btn-lg {font-size: 1.8rem;}
button:not(.primary) {box-shadow: none}

.action.primary {background: #0c4279;border: 1px solid #0c4279;color: #fff;font-size: 1.4rem}
.action.primary:focus,
.action.primary:active {background: #0c4279;border: 1px solid #0c4279;color: #fff}
.action.primary:hover {background: #006bb4;border: 1px solid #006bb4;color: #fff}

.btn-checkout,
.btn-checkout:focus,
.btn-success:focus {color: #fff;background-color: #0e7726;border-color: #0e7726}
.btn-warning:focus {color: #212529;background-color: #e0a800;border-color: #d39e00}
.btn-xl-w {width: 100%!important} 

/******* FOCUS ISSUES */
._keyfocus *:focus, input:not([disabled]):focus, textarea:not([disabled]):focus, select:not([disabled]):focus {box-shadow: initial;}
button:focus {outline: none}

/******* HEADER */
.page-header {margin-bottom:0}
.page-header .panel.wrapper {background-color: #F4F4F4;color: #575757;}
.header.links li.greet.welcome {display: none;}
.header.panel > .header.links > li {margin: 0 0 0 20px}
.header.panel > .header.links > li > a,
.header.panel > .header.links > li > a:hover,
.header.panel > .header.links > li > a:visited {color: #575757}

@media screen and (min-width: 769px) {
    .page-header .header.panel {height: 32px; padding-top: 5px; padding-bottom:5px}
    .header.content {height: 80px; padding: 18px 20px 0;}
    .logo {margin: 0 auto 24px 0;}
}

.kiyoh-shop-snippets .rating-box {display:block; margin:0}
.kiyoh-shop-snippets .rating-box .rating {display:block}

.breadcrumbs { min-height: auto;margin-bottom: 0;}
.breadcrumbs .item {min-height: 25px;}
.breadcrumbs .items {font-size: 14px; color: #039; padding: 10px 0;}
.breadcrumbs a {font-size: 14px; color: #039!important; }
.breadcrumbs strong {font-size: 14px; color: #039!important; }
.breadcrumbs .item:not(:last-child):after {line-height: 25px;width: 12px}

@media (max-width: 768px) {

    .breadcrumbs .item {
        padding-bottom: 15px;
    }
    .breadcrumbs .items a {
        padding: 5px;
        border: 1px solid #039;
        border-radius: 5px;
        font-size: 13px;
        text-decoration: none; 
    }
    .breadcrumbs .item.home {
        display: none!important;
    }
    .breadcrumbs .item:not(:last-child) {
        display: inline-block;
    }
    .breadcrumbs .item:last-child {
       display: none;
    }
    .breadcrumbs .item:before {
        content: "\e617";
        font-family: 'luma-icons';
        font-size: 10px;
    }
    .breadcrumbs .item:after {
        display: none!important;
    }
    .catalog-product-view .breadcrumbs .item:last-child {
        display: block;
    }
    .catalog-product-view .breadcrumbs .item:nth-last-child(2) {
        display: none;
    }

}
/******* HEADER > SEARCH BTN */
.block-search .action.search {right: 0;}
.block-search .action.search:before {width: 41px; height: 41px;line-height: 38px;}

@media (max-width: 768px) {

    .block-search .control {
        padding: 0;
    }
    .block-search input {
        border: 0;

    }

}


/******* HEADER > MENU */

@media only screen and (max-width: 768px) {
    .nav-open .page-wrapper {
        left: 0;
    }
}

@media (max-width: 768px) {
    .nav-sections-item-title {width: 50%}
}

@media (min-width: 768px) {
    .section-items.nav-sections-items {background-color:#0C4279}
    .nav-sections-item-content .navigation {background: #0c4279; line-height: 0; height: 47px;}
    .navigation > ul {display: table; width: 100%;}
    .navigation > ul > li.level0 {display: table-cell;}
    .navigation .level0 > .level-top {color: #fff;font-size: 16px;font-weight: 400; line-height: 45px;}
    .navigation .level0 > .level-top:hover {color: #0C4279;font-size: 16px;}
    .sw-megamenu.navigation li.level0:hover .level-top {background-color: #fff;color: #0C4279;}
    .navigation .level0 .submenu {border: none}
    .navigation .level0 .submenu .container {padding: 0}
    .navigation .level0.parent > a:after {margin-left: 8px;width: 10px; height: 16px;content: '\e622'; font-family: 'luma-icons'; font-size: 10px;}
    .navigation .submenu li.level1 > a:hover {text-decoration: underline}
    .navigation .submenu a:hover > span {text-decoration: none;}
    .navigation .submenu li.level1 > a {padding: 2px!important; color: #555; text-transform: initial!important;text-decoration: none!important; font-weight: 400!important;}
    .sticky {background-color: #fff;margin: 0 auto;max-width: 100%;max-height: 109px;position: fixed;top: 0;width: 100%;z-index: 99;}
    .customer-welcome .action.switch {color: #555;}
    .customer-welcome .action.switch > span {position: initial; width: initial; height: initial;margin: 4px;}
    .customer-welcome .customer-name {line-height: 1.4;}
}

.nav-sections .header.links li > a {text-transform: uppercase;}
.nav-sections {margin-bottom: 0;}
.block-minicart .component-wrapper {display: none}
.block-minicart .block-content > .actions > .primary .action.primary {background-color: #218336;border:none}
.block-minicart .product-image-photo {width: auto!important;height: auto!important;}

/******* HEADER > SEARCH */
.block-search .label {width: 40px;height: 40px;}
.block-search .label:before {color: #0c4279; line-height: 40px;width: 30px;height: 40px;} 
.block-search input {color: #505050; border-color: #dbe0e2; border-radius: 6px;margin: 0;height: 40px;padding: 10px 50px 10px 20px;}
.block-search input::-webkit-input-placeholder {font-size: 14px;}

@media (min-width: 769px) {

    .block-search {margin-left: 55px; position: relative; vertical-align: middle; float: left;}
}
@media (min-width: 1200px) {

    .block-search {width: 450px; margin-left: 55px}
}

.page-header .mini-service {font-size: 22px;width: 42px; color: #0C4279;transform: rotate(133deg); -webkit-transform: rotate(133deg);-moz-transform: rotate(133deg);-ms-transform: rotate(133deg);-o-transform: rotate(133deg);    font-family: 'Font Awesome 5 Free';font-weight: 700;}
.page-header .custom-block a > * {display: inline-block}
.page-header .custom-block a {text-decoration:none}
.page-header .custom-block { height: 40px; line-height: 1;position: absolute;right: 120px}
.page-header .custom-block a:hover {text-decoration:none}
.page-header .custom-block .klantenservice{color:#0C4279;font-size: 14px}
.page-header .custom-block .klantenservice b {font-size: 16px; font-weight:700;line-height:27px}
 
/******* HEADER > CART */
.minicart-items .product-item-name a,
.minicart-wrapper .action.showcart.active:active:before, 
.minicart-wrapper .action.showcart.active:hover:before,
.minicart-wrapper .action.showcart:active:before,
.nav-toggle:before,
.minicart-wrapper .action.showcart:hover:before {color:#0c4279}
.minicart-wrapper .action.showcart .counter.qty {font-size:10px;background-color: #218336; height: 18px; width: 18px;line-height: 18px;border-radius: 50%;position: absolute; left: 18px;top: -6px;}
.minicart-wrapper .action.showcart:before,
.minicart-wrapper .action.showcart.active:before {font-family: "Font Awesome 5 Free"; color: #0C4279;content: '\f07a'; line-height: 40px;font-weight: 700; font-size:30px;}


@media (max-width: 768px) {

.minicart-wrapper .action.showcart:before, 
.minicart-wrapper .action.showcart.active:before{font-size: 22px;}


}
/******* HEADER > USP */
.usp-container {height: 33px;}
@media (min-width: 768px) {.usp-container {height:42px;}}

.usp-container a,
.usp-container a:hover {text-decoration: none}
.usp-container .text {display: inline-block; vertical-align: middle;text-align: left;line-height: initial; color:#0C4279}
.usp-container .title {font-weight: 700; font-size:13px}
.usp-container .subtitle {display: block;font-size:12px}
.usp-container .icon {font-size:18px; display: inline-block;vertical-align: middle; color:#0c4279;width:30px;height:18px;font-family: 'Font Awesome 5 Free';font-weight: 900;}

/******* HOMEPAGE */

@media (max-width: 769px) {
    .home-mainbanner-img {min-height:200px;}
}

@media (min-width: 770px) {
    .home-mainbanner-img {min-height:260px;}
}

.home-categorie h2 a:hover {color:#0c4279}
.home-categorie p {color:#555}
.home-categorie a, .home-categorie a:hover {text-decoration:none}
.home-categorie a {max-height: 280px;}
.home-categorie .cattitle {vertical-align: middle; display: block; font-weight: 700 !important; color: #0c4279;font-size: 1.75rem;}

.product-item .price-box .price-label,
.product-item .price-label {display: none}
.home-usp {min-height: 200px;}
.product-item-info-front .product-item-details {background-color: initial; min-height: initial;}

.product.data.items > .item.title:not(.disabled) > .switch:active, 
.product.data.items > .item.title.active > .switch, 
.product.data.items > .item.title.active > .switch:focus, 
.product.data.items > .item.title.active > .switch:hover {background: #F5F5F5;border-bottom: 1px solid #F5F5F5;color: #0C4279;}
.product.data.items > .item.title > .switch {background: #fff;height: 44px; border: 1px solid #e9ecef; font-weight: 600;color: #0C4279;}
.product.data.items > .item.content {background: #F5F5F5;border: 1px solid #e9ecef;}

.homepage-tabs .price-container .price-wrapper {font-weight: 700;} 
.homepage-tabs span.old-price,
.homepage-tabs .minimal-price-link {display: none!important;}
.homepage-blog-img {max-height: 175px;}
.banner {color: #0c4279; font-weight: 700;  background-color: rgba(255, 255, 255, 0.6); backdrop-filter: blur(2px);}
.banner .title {display: block; font-size: 28px;    line-height: normal;}
.banner .sub {display: block; font-size: 19px; font-weight: 400;}

@media (max-width: 769px) {
    .home-categorie .card-img-top {max-width: 120px;float:left; margin-right:10px}
    .home-categorie .card {width: 100%;display:block; height: 46px!important;}
}
@media (max-width: 991px) {
    .banner .title {font-size: 24px;}
    .banner .sub {font-size: 14px;}
}

.cat-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
  }
  
  /* Mobiel layout */
  .cat-item {
    background-color: #F5F5F5;
    border-radius: 0.5rem;
    padding: 0.25rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-decoration: none !important;
    color: inherit;
    font-weight: 500;
    box-sizing: border-box;
    /*  flex: 0 0 calc(50% - 0.5rem);  */
    flex: 0 0 100%;
    transition: background-color 0.2s ease, color 0.2s ease;
  }
  
  .cat-item:hover {
    background-color: #eaeaea;
  }
  
  .cat-content {
    display: flex;
    align-items: center;
    flex-grow: 1;
    gap: 0.75rem;
  }
  
  .cat-item img {
    width: 80px;
    height: 80px;
    object-fit: contain;
    flex-shrink: 0;
    border-radius: 0.25rem;
  }
  /* Maak de afbeelding kleiner op mobiel */
  @media (max-width: 991.98px) {
    .cat-item img {
      max-width: 70px;
      max-height: 40px;
    }
  }
  
  .cat-name {
    word-break: break-word;
  }
  
  .cat-arrow {
    color: #0c4279;
    font-size: 3rem;
    font-weight: bold;
  }
  
  /* Geen onderstreping in alle toestanden */
  .cat-item:visited,
  .cat-item:focus,
  .cat-item:active,
  .cat-item:hover {
    text-decoration: none !important;
  }
  
  /* Desktop layout */
  @media (min-width: 992px) {
    .cat-item {
      flex: 0 0 calc(16.666% - 0.833rem);
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: 1rem;
      height: 140px;
      text-align: center;
      position: relative;
    }
  
    .cat-content {
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 1.5rem;
    }
  
    .cat-item img {
      margin: 0 auto;
    }
  
    .cat-name {
      text-align: center;
    }
  
    .cat-arrow {
      display: none;
      line-height: 0;
    }
  }
  

/******* KIYOH FOOTER */
.kiyoh-widget-slider .kiyoh-widget-item .name {
    opacity: 1 ;
}

/******* CATALOG */
.price-including-tax, .price-excluding-tax {font-size: inherit;}
.category-description .btn-sm {font-size: 12px}
.block-category-list .block-content .item a, 
.sidebar>.block.filter .item a { text-decoration: none; font-size: 12px}
.sidebar > .block.filter {margin-bottom: 20px;}
.sidebar > .block.filter .title {display: none;}
.filter-options-content {font-size: 12px}
.filter-options-content a:hover { background-color: transparent;}
.block-category-list .block-content, .sidebar > .block.filter .options dd {margin: 0; padding: 10px 15px;border: 1px solid #e9ecef;border-top: 0; border-radius: 0 0 5px 5px;}
.block-category-list .block-title, .sidebar > .block.filter .options dt {color:#0C4279;padding: 10px 15px;margin: 0;font-size: 13px;font-weight: bold;text-transform: uppercase;border: 1px solid #e9ecef;position: relative;cursor: pointer; border-radius: 5px 5px 0 0; display: block;text-decoration: none;}
.sidebar > .block.filter .item .count,
.filter .block-subtitle  {display: none;}
.block-category-list .block-content ol li.item, .sidebar > .block.filter ol li.item {margin: 0;}
.sidebar > .block.filter li {margin-bottom: 4px;}
.filter-options {border-radius: .25rem;border: 1px solid #e9ecef;}
.filter-options-item {border-bottom: none;color:#0C4279}

@media (max-width: 769px) {
    .sidebar > .block.filter {display: none;}
}

.catalog-customerservice {min-height: 321px;border-radius: .25rem;border: 1px solid #e9ecef;padding: 10px 15px;}
.catalog-customerservice .item {text-decoration: none; border-top: 1px solid #e9ecef;align-items: center;}
.catalog-customerservice .item:hover { text-decoration: none;}
.catalog-customerservice .medium-title {color:#0C4279; font-size:14px;font-weight:700;}
.catalog-customerservice .medium-content {font-size: 12px;}

.product-customerservice .item {color:#0C4279; text-decoration: none;align-items: center;}
.product-customerservice .item:hover {color:#0C4279; text-decoration: none;}
.product-customerservice .content {color:#555}
.product-customerservice .medium-title {font-weight:600;}
.product-customerservice .medium-content {color:#505050;font-size: 12px;}

.product-item-info-2 {text-align: center; position: relative; border: 1px solid #f4f4f4; background-color: #f4f4f4;}
.product-item-info-2 .product-item-details {text-align: left;min-height: 100px;padding: 1.2rem !important; background-color: #fff;border-radius: 0.2rem;}
.product-item-info-2 .product-item-name h2 {color: #333; font-size: 14px; font-weight: 600;}
.old-price .price-label {display: none!important;}
.old-price {text-decoration: line-through;}

.product-info-main .product-info-price .old-price .price-wrapper .price {text-decoration: line-through;} 
.product-item-info-2 .price-container .price {font-size: 18px; font-weight: 700;}
.product-item-info-2 .product-item-details .minimal-price-link {display:none;}

.product-item-info-2 .product-image-wrapper {mix-blend-mode: multiply;}
.product-item-info-2.product-item-size {color: #555}

.product-overzicht-colorindicator{margin:10px 0 0 0;padding:0;}
.product-overzicht-colorindicator li{margin:0; display:inline-block; height:12px; width:12px; box-shadow:1px 1px 1px #e3e3e3; -webkit-border-radius:50%; -moz-border-radius:50%; -khtml-border-radius:50%; border-radius:50%}

.extra-idicator {color: #fff;background-color: #177300; position: absolute; right: 0; top:50%; font-weight: 400;padding: 5px 8px; border-radius: .25rem 0 0 .25rem; z-index: 2;}
.designer-idicator {color: #fff;background-color: #0C4279; position: absolute; display: block; font-weight: 400;padding: 5px 8px; border-radius: .25rem 0; z-index: 2;}
.designer-idicator i {height: 11px;width: 12px;}

.product-options-idicator {background-color:#f5f5f5;position: relative;text-align: center; background: #0C4275; margin:0; color: #fff; font-size: 1.8rem;}
.product-options-idicator:after {top: 100%;left: 50%;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none;border-color: rgba(0, 51, 102, 0);border-top-color: #0C4275;border-width: 15px;margin-left: -15px;}

.page-bottom .content .widget {padding: 1rem;border-radius: .25rem; border: 1px solid #e9ecef;;margin-top: 30px;margin-bottom: 30px;}

.product h2 {margin: 10px 0;}
.product-item-info-2 .product-image-container {margin: 1.4rem 0;}
.option-description-text {font-size: 13px;}

.magepow-categories-grid .magepow-categories-category {text-decoration: none;}
.magepow-categories-grid .magepow-categories-category-name {color: #fff; background-color: #0c4279;}
.magepow-categories-grid .magepow-categories-category-image {min-height: 170px;}
.magepow-categories-grid .magepow-categories-category-image img {height: auto;}

/******* CATALOG INTRO TEXT (HIDE ONEMOBILE) */
.products {margin: 0;}
.category-description img {width: 100%;max-width: 100%; }

@media (max-width: 768px) {
    .cat-banner .lpc-image { 
        display: none;
    }
    .cat-description {
        padding: 1rem !important;
    }
}

.cat-banner {
    overflow: hidden;
    border-radius: .5rem;
}


/* Voor mobiele weergave */
@media (max-width: 767px) {
    .read-more-text {
        display: block;
        max-height: 65px;
        overflow: hidden;
        position: relative;
        transition: max-height 0.5s ease;
        margin:0;
    }
    
    .read-more-text:before {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 40px;
        background: linear-gradient(transparent, #f9f9f9);
        pointer-events: none;
    }
    
    .read-more-check {
        display: none;
    }
    
    .read-more-button {
        display: block;
        cursor: pointer;
        text-align: center;
        margin: 0 auto;
    }
    
    .read-more-button:after {
        content: "Lees meer";
    }
    
    .read-more-check:checked ~ .read-more-text {
        max-height: 1000px;
    }
    
    .read-more-check:checked ~ .read-more-text:before {
        display: none;
    }
    
    .read-more-check:checked ~ .read-more-button {
        display: none;
    }
}

/* Voor desktop weergave */
@media (min-width: 768px) {
    .read-more-button {
        display: none;
    }
    
    .read-more-check {
        display: none;
    }
}

/******* PRODUCT */
.product-info-main .productbox {margin-bottom: 10px}
.productbox .product-price-tax {font-size: 12px;vertical-align: text-bottom; display: block;}
.productbox .price {color: #0C7F27;font-size: 1.5rem}
.product-info-main .product-info-price {max-height: 54px;border: none; margin-bottom:0;display: inline-block; width: initial;vertical-align: bottom;min-height: 36px;}
.product-info-main .product-info-price .price-box .price,
.product-info-main .product-info-price .price-wrapper .price {font-size: 28px!important;line-height: 36px; margin-right: 10px;}
.product-info-main .product-info-price .price-box {vertical-align: baseline; display: block;}
.product-info-main .product-info-price .price-box .special-price {display: table-cell;}
.product-info-main .product-info-price .price-box .old-price {display: table-cell;}
.product-info-main .product-info-price .weee {font-size: inherit;}

.product-info-main .price-box {margin: 0; padding-bottom:0}
.product-info-main .product-info-price .trust-icons {margin-right: 10px}
.product-info-main .prices-tier {margin-top: 10px;margin-bottom: 10px;background-color: #ebf6f0;padding: 8px;} 
.product-info-main .prices-tier .item {margin-bottom: initial}
.product-info-main .prices-tier .item:before {content: "\e610";font-family: 'luma-icons';margin-right:5px;color:#0C7F27;font-weight: 900;}
.product-info-main .price-wrapper .price {min-height: 26px;color:#555}
.product-info-main .prices-tier .price-wrapper .price {font-size:inherit;font-weight: 700;color: #0C7F27;}
.product-info-main .attribute .value {display: inline-block;font-weight:700; margin-left: 5px}
.product-info-main .attribute .type {font-weight:400}
.product-info-main .badge {font-size:13px;margin-top:8px; display:table; font-weight: 400;}
.product-info-main .product.sku {color: #555; display: inline-block;padding: 2px 0;font-size: 13px}
.product-info-main .product-info-levertijd {color:#0C7F27; font-size:inherit;}
.product-info-main .product-info-levertijd .value {display:inline}
.product-info-main .product-info-levertijd:before {content: "\f017";font-family: FontAwesome; margin-right: 5px}
.product-info-main .page-title-wrapper .page-title {color: #0C4279}
.btn-title {font-size: 13px;font-weight: 400;}

.product.info.detailed .additional-attributes {width: 100%;} 
.product.info.detailed.fullwidth-row > .product.data.items.container {margin: 0 auto;padding: 0 15px;}
.product.info.detailed .additional-attributes > tbody > tr > td,
.product.info.detailed .additional-attributes > tbody > tr > th {padding:6px 4.5px 6px 9px; width: auto; border:none}
.product.info.detailed td.col.data.Afmeting:after {content:"cm"}

.catalog-product-view .product-options-wrapper .field .note {color:#555} 
.catalog-product-view .product-options-wrapper > .fieldset > .field {background-color:#F5F5F5;padding:5px 10px; color: #555;margin:0;vertical-align: top;}
.catalog-product-view .product-options-wrapper {padding-bottom: 0;border:none}
.product-options-wrapper .fieldset > .field .choice input {vertical-align: middle;}
.product-options-wrapper .fieldset > .field .field.choice {margin-bottom: 0;}
.product-options-wrapper .fieldset {background-color: #f5f5f5;}


.product-options-wrapper textarea {height: 10rem;}
.cart.table-wrapper .actions-toolbar>.action-preview {display: none}

.fieldset > .field.qty, .nested.options-list > .field.qty {display: inline-block;vertical-align: middle;margin: 0;margin-right: 15px;}
.table-wrapper .table:not(.totals):not(.cart):not(.table-comparison) > tbody > tr td[data-th]:before, .table-wrapper .table:not(.totals):not(.cart):not(.table-comparison) > tbody > tr th[data-th]:before {color: #555}
.product-info-main .product-info-stock-sku {display: none;}

@media screen and (min-width: 769px) {
    .product.info.detailed,
    .servicebanner {clear: left;width: 57%;float: left;}
}


/******* FOTORAMA gallery */
.fotorama__nav-wrap--horizontal.fotorama__nav-wrap {min-height: 30px;}
.fotorama__thumb {background-color: #fff} 
.fotorama__thumb-border {border: 1px solid #124275;border-radius: .25rem} 


/* Container bepaalt de hoogte via een ratio, niet de inhoud */
.product.media .gallery-placeholder {
  position: relative;
  aspect-ratio: 4 / 3;    /* stem af op jouw gekozen verhouding */
  /* max-height: 450px;   */
  width: 100%;
  overflow: hidden;
}

/* Placeholder beeld overlapt, veroorzaakt geen reflow */
.product.media .gallery-placeholder__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: opacity .2s ease;
}

/* Zodra Fotorama klaar is verbergen we enkel de placeholder, ruimte blijft staan */
.product.media .gallery-placeholder.is-ready .gallery-placeholder__image {
  opacity: 0;
}

/* Geef de hele Fotorama-keten een definite height die matcht met de container */
.product.media .fotorama,
.product.media .fotorama__wrap,
.product.media .fotorama__stage,
.product.media .fotorama__stage__frame {
  /* height: 100% !important;
  max-height: 450px; */ 
  min-height: 1px;
}

/* Afbeeldingen netjes binnen de stage houden, zonder reflow */
.product.media .fotorama__img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}

/* Thumbnails vast formaat om springen in de navigatie te voorkomen */
.product.media .fotorama__nav__frame,
.product.media .fotorama__thumb {
  height: 80px;
  min-height: 80px;
}

.product.media .fotorama__wrap--hidden { visibility: hidden; }
.product-add-form .product-options-wrapper .field .control {width: initial;}
.box-tocart .fieldset > .field > .label {display:none}
.mageworx-optionswatches-option-gallery_image {width:100%; height: auto;border-radius: .25rem; border: 1px solid #e9ecef}
.uppertext .input-text {text-transform: uppercase;}

.fotorama__active .fotorama__dot {background-color: #f90;border-color: #f90;}
.fotorama__dot {border-radius: 50%;width: 12px;height: 12px;}

/******* SWATCHES */
.mageworx-swatch-option.selected {outline: 3px solid #60C400;}
.mageworx-swatch-option.image:not(.disabled):hover, .mageworx-swatch-option.color:not(.disabled):hover { outline: 3px solid #60C400;}

.smallswatch .mageworx-swatch-option {width: 45px!important;height:45px!important; border-radius: 50%;}
.mediumswatch .mageworx-swatch-option {width: 50px!important;height:50px!important; border-radius: 50%;background-size: cover!important;}
.bigswatch .mageworx-swatch-option {width: 88px!important;height:88px!important; border-radius: 50%;background-size: cover!important;}
.bigswatchv .mageworx-swatch-option {width: 88px!important;height:88px!important;background-size: cover!important;}
.largeswatch .mageworx-swatch-option {width: 110px!important;height:110px!important; border-radius: 50%;background-size: cover!important;}
.largeswatchv .mageworx-swatch-option {width: 110px!important;height:110px!important; background-size: cover!important;}
.xlargeswatch .mageworx-swatch-option {width: 150px!important;height:150px!important; border-radius: 50%;background-size: cover!important;}
.xlargeswatchv .mageworx-swatch-option {width: 150px!important;height:150px!important; background-size: cover!important;}

.smallswatch .mageworx-swatch-info,
.mediumswatch .mageworx-swatch-info,
.bigswatch .mageworx-swatch-info,
.bigswatchv .mageworx-swatch-info,
.largeswatch .mageworx-swatch-info,
.largeswatchv .mageworx-swatch-info,
.xlargeswatch .mageworx-swatch-info,
.xlargeswatchv .mageworx-swatch-info {max-width: none;}

.bigimageswatch .mageworx-swatch-option.image  {height: 100px!important;}
.mageworx-swatch-container {max-width: 50%;}
.swatch-attribute.size .mageworx-swatch-option {
    max-width: 100%;
    background-position: left !important;
    background-size: 100% !important;
    background-color: #fff !important;}

.dynamic_option_hint {
    display: none;
}

.mageworx-swatch-option.image {
    position: relative; /* essentieel voor positioning van de pseudo-elementen */
    overflow: visible;  /* laat dingen uitsteken buiten het element */
    z-index: 1;
}

.mageworx-swatch-option.image.selected::after {
    content: "";
    position: absolute;
    top: -8px;
    right: -8px;
    width: 22px;
    height: 22px;
    background-color: #60C400;
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    line-height: 22px;
    border-radius: 50%;
    text-align: center;
    z-index: 10;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10' fill='white'%3E%3Cpath d='M4.2 9.3L0.6 5.6l1.4-1.4 2.2 2.1L10 0.6l1.4 1.4z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 12px 12px;
}

/* Aanpassing ivm calculatie opmaatgemaakte artikelen  */

.cm-label {
    width: 48%;
    display: inline-block;
    position: relative;
    vertical-align: top;
    margin-right: 4%;
    margin-bottom: 20px;
}

.cm-label:nth-of-type(2n) {
    margin-right: 0;
}

.cm-label .control {
    position: relative;
}

/* Inputveld */
.cm-label input[type="text"] {
    padding-right: 50px;
    height: 40px;
    font-size: 16px;
    border: 1px solid #ccc;
    border-radius: 4px;
    width: 100%;
    box-sizing: border-box;
    line-height: normal;
}

/* De cm-label als overlappende pseudo-element buiten input */
.cm-label .control::before {
    content: "cm";
    position: absolute;
    top: 20px;
    right: 15px;
    transform: translateY(-50%);
    background: #eee;
    color: #333;
    font-size: 13px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 4px;
    pointer-events: none;
    z-index: 2;
    line-height: 1;
}

.dynamic_option_measurement_unit {display: none;}
.dynamic_option_hint { display: none;}
/* Aanpassing ivm calculatie opmaatgemaakte artikelen  */

.title-size {white-space:nowrap; text-transform: lowercase;}

.box-tocart .actions,
body .product-info-main .box-tocart .actions {float: right; width: calc(100% - 90px) !important;text-align: center !important;display: inline-block !important;margin-bottom: 10px !important;margin-right: 0;}
.box-tocart .action {line-height: 2.2rem;padding: 14px 17px;font-size: 1.8rem; border-radius: 3rem;}
.box-tocart .input-text.qty {width: 70px;height: auto;padding: 15px;}

/******* POPUPS */ 
.webforms-popup{max-width: 800px;}
.mfp-close:hover {background-color: transparent;}
.webforms .fieldset {margin:0; border-radius: .25rem;padding: 1rem;}
.webforms .explain-small,
.webforms-gdpr {font-size: 90%; color: #555;}
.usp-popup {max-width: 800px; margin: 0 auto;}
.usp-popup .modal-inner-wrap {border-radius: .3rem;}
.modal-popup h1 {font-size: 20px; margin-bottom: 10px;}
.modal-content,
.modal-header {border: none}
.modal-popup._inner-scroll .modal-inner-wrap {overflow:hidden;}
.drop-zone {min-width: auto!important;}
.webforms form {margin-top: 20px!important;}
.webforms-fields-comment {margin-top: 0!important;}

/******* FOOTER */
.page-footer {margin-top: 20px}
.footer-middle {padding: 20px 5px; background-color: #0C4279;color: #fff;}
.footer-middle-2 {padding: 20px 5px; background-color: #F4F4F4;color:#666;}
.footer-middle a {color:#fff; text-decoration: none;}
.footer-middle-2 a {color:#555; text-decoration: none;}
.page-footer ul li {position: relative;line-height: 1;display: block;margin: 0;}
.page-footer ul li a {display: inline-block; padding: 6px 0;}
.page-footer ul {list-style: none; margin: 0;padding: 0;}
.footer-middle .block .block-title {margin: 5px 0;}
.copyright {background-color: #fff;color: #555;margin-bottom:0; font-size:12px;}

@media (min-width: 769px) {
    .page-footer ul li:before {content: "\f105";font-family: "Font Awesome 5 Free";font-weight: 700;margin-right: 8px;}
}
@media (max-width: 991px) {
    .page-footer ul li a {padding: 17px 0;}
}
@media (max-width: 1200px) {
    .page-footer ul li:before {display: none;}
}

/******* SHOPPING CART */
.cart.table-wrapper .actions-toolbar {margin-bottom: 10px}
.cart-summary .checkout-methods-items .action.primary.checkout { background: #218336; border: 1px solid #218336;}
.cart.table-wrapper .actions-toolbar > .action-edit {right: 26px;}

/******* PAY FOOTER */

.payicons img {margin: 5px 10px;}

/******* FAQ */
.faq-search-form input {height: 37px}

/******* Backend */
.block-collapsible-nav .item {width: 100%;}
.account .col {width: auto;}
.account .table th, .account .table td {border-top: none;}
.account .design-images .product-item-photo {display: inline-block} 

/******* Avoid zoom on mobile forms */
@media screen and (-webkit-min-device-pixel-ratio:0) and (max-width:1024px) { 
    select, textarea, input,
    input[type=text], input[type=password], input[type=url], input[type=tel], input[type=search], input[type=number], input[type=datetime], input[type=email] 
    {
      font-size: 16px!important;
    }
  }  

/******* Temp fix hide tooltip custom options */

img[class^='option-select-tooltip-'], div[class*=' option-select-tooltip-']
{
  display:none!important;
}
/******* Temp fix mobile logo */
@media only screen and (max-width: 768px) {
    .logo   { margin-top: 14px!important;}
}
/******* Temp fix hide padding block div */
.category-description>div>div {
  padding: 0!important;
}

/******* FAQ */
.mpfaqs h1 {color:#fff;font-size: 3rem;margin: 1rem 0;}
.mpfaqs .card-panel {padding:10px}
.mpfaqs .grey.darken-4 {background-color:#f89900 !important}
.mpfaqs-list__block__category .header-description {display: none;}
.mpfaqs-article-view .klantenservice-top-info {display:none;}
.mpfaqs-category-view .klantenservice-top-info {display:none;}
.mpfaqs .row .col {flex-basis: initial!important;}

/******* Related products */
.block.related {
    display: block;
    clear: both;
    -ms-flex-order: 2;
    -webkit-order: 2;
    order: 2;
    min-height: 415px;
    margin: 0;
}

.block.related .block-title strong {
    color: #0c4279;
    font-weight: 700;
    font-size: 1.8rem;
}

.block.related .products-grid .product-item {
    width: calc((100% - 2rem)/2);
    margin-left: auto;
}

@media (min-width: 1024px) {
    .block.related .products-grid .product-item { width: calc((100% - 3rem) / 6);}
}

/******* Zoom on hover */

  .zoho {
    overflow: hidden;
  }
  .zoho img {
    transition: transform 0.3s ease;
  }
  .zoho:hover img {
    transform: scale(1.1);
  }

/******* Quantity */

.product-add-form .qty {
    position: relative;
}

.qty .input-text {
    width: calc(100% - 40px); /* Zorg ervoor dat de input ruimte overlaat voor de knoppen */
    padding-right: 40px;
}

.qty-buttons {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.qty-button {
    width: 24px;
    height: 26px;
    text-align: center;
    font-size: 16px;
    line-height: 1; 
    border:0;
    padding: 0;
    margin:  0;
    background-color: #f0f0f0;
    border: 1px solid #ccc;
    cursor: pointer;
}

.box-tocart .input-text.qty {
    width: 70px;
    height: auto;
    padding: 13px 25px 13px 5px;
    font-size: 16px;
}

.qty-button.plus {
    border-bottom: 0;
}

.qty-button.minus {
    border-top: 0;
}
/* Enable clear cart */
.cart-container .form-cart .actions.main .clear {
    display: inline;
}