/*
 * Custom code goes here.
 * A template should always ship with an empty custom.css
 */
#header {
    background: #29624A;
    color: #fff;
}
body#checkout #header {
    background: #fff;
    -webkit-box-shadow: none;
    box-shadow: none;
}
#header .header-nav a {
    color: #fff;
}

table.ui-datepicker-calendar td {
    padding: 0 !important;
}

.fullwidth {
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
}

.fullvoor16besteldbaan {
    background-color: #29624A;
    color: #fff;
    font-size: 17px;
    padding: 22px 0;
    line-height: 30px;
    clear: both;
    text-align: center;
}

.fullvoor16besteldbaan h3 {
    font-size: 30px !important;
    margin: 0;
}

.fullvoor16besteldbaan p {
    color: #fff !important;
}

#js-product-list {
    margin-right: -30px;
}

.tooltip-bottom {
    position: relative;
    cursor: pointer;
}

.tooltip-bottom:before {
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid hsla(0, 0%, 20%, 0.9);
    display: inline-block;
    content: "";
    position: absolute;
    margin-top: 32px;
    right: 4px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s;
}

.tooltip-bottom::after {
    content: attr(data-tooltip);
    position: absolute;
    top: 125%;
    left: -70px;
    width: 200px;
    transform: translateX(-50%);
    background-color: #333;
    color: #fff;
    padding: 10px;
    border-radius: 4px;
    font-size: 14px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s;
}

.tooltip-bottom:hover::before,
.tooltip-bottom:hover::after {
    opacity: 1;
    visibility: visible;
}

iframe {
    max-width: 100%;
}

.product-description ul {
    list-style: circle;
    padding-left: 20px;
}

.homecats {
    padding: 2rem 0;
    overflow-x: hidden;
}

.featured-products.fullwidth {
    background-color: #F4EFE9;
    padding: 2rem 0;
}

.category-box-5 {
    position: relative;
    margin-bottom: 30px;
}

.category-box-5 .inner {
    overflow: hidden;
    position: relative;
    height: 320px;
}

.category-box-5 img {
    object-fit: cover;
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
}

.category-box-5 .ctitle {
    font-family: 'Epilogue';
    height: 100px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    font-size: 2rem;
    line-height: 2rem;
    background: rgb(0, 0, 0);
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 30%, rgba(0, 0, 0, 0) 100%);
    color: #fff;
    padding: 1rem;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: flex-end;
}

.webdelta-cms-blog .inner {
    overflow: hidden;
    position: relative;
    height: 285px;
    margin-bottom: 30px;
}

.webdelta-cms-blog .btitle {
    font-family: 'Epilogue';
    height: 100px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    font-size: 1.5rem;
    line-height: 1.5rem;
    background: rgb(0, 0, 0);
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 30%, rgba(0, 0, 0, 0) 100%);
    color: #fff;
    padding: 1rem;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: flex-end;
}

.webdelta-cms-blog img {
    object-fit: cover;
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
}

#custom-text .badge15year {
    display: grid;
    justify-content: center;
    justify-items: center;
    margin-bottom: 4rem;
}

#custom-text .badge15year li {
    line-height: 1.5rem;
    padding: 0.5rem;
    font-size: 1.1875rem;
}

#custom-text .badge15year li i {
    margin-top: -3px;
}

#custom-text .badge15year h3 {
    font-size: 1.5rem;
}





/* qty knoppen stylen */
.bootstrap-touchspin {
    display: flex;
    align-items: stretch;
}

.bootstrap-touchspin input {
    order: 2;
    text-align: center;
    border-radius: 0;
    border-left: none;
    border-right: none;
    flex: 1;
}

.bootstrap-touchspin .input-group-btn-vertical {
    display: contents;
}

.bootstrap-touchspin .bootstrap-touchspin-down {
    order: 1;
}

.bootstrap-touchspin .bootstrap-touchspin-up {
    order: 3;
}

.bootstrap-touchspin .btn-touchspin {
    display: flex !important;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 19px !important;
    margin: 0 !important;
    color: #008800;
    background-color: #E4F0EB;
}

.bootstrap-touchspin .btn-touchspin .touchspin-up:after {
    content: "+";
    font-size: 30px;
    line-height: 29px;
    margin-left: 6px;
    color: #008800;
}

.bootstrap-touchspin .btn-touchspin .touchspin-down:after {
    content: "-";
    font-size: 30px;
    line-height: 22px;
    margin-left: 11px;
    color: #008800;
}

.bootstrap-touchspin .material-icons {
    font-size: 24px;
}





.user-info,
.blockcart {
    width: 50px;
    overflow: hidden;
    white-space: nowrap;
    float: left;
    position: relative;
}

.user-info i,
.blockcart i {
    padding: 0.8rem;
    margin-right: 30px;
    color: #fff;
    display: inline-block;
    width: 50px;
    height: 50px;
}

.blockcart.active .cart-products-count {
    position: absolute;
    right: 22px;
    top: -2px;
    background-color: #FF6600;
    color: #fff;
    padding: 0.2rem 0.3rem;
    font-size: 0.7rem;
    line-height: normal;
    border-radius: 3px;
}

.blockcart.inactive .cart-products-count {
    background-color: #ccc;
}


.webdeltamicrodata {
    margin-top: 3px;
    padding: 2rem 0;
    text-align: center;
}

#webdeltamicrodata {
    position: relative;
    top: 2px
}

.page-order .webdeltamicrodata {
    width: 200px;
    float: right
}

.webdeltamicrodata a {
    border: 1px solid #E1E3E5;
    color: #008080;
    display: inline-block;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    width: 335px;
    font-weight: bold;
    text-align: center;
    margin-top: 1.375em;
}

.webdeltamicrodata .stars {
    margin-top: -3px;
    position: relative;
    display: inline-block;
}

.webdeltamicrodata .beveeltonsaan {
    margin-bottom: 1.375em;
}

#webdeltamicrodata--nav {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap-reverse;
    padding-left: 15px;
}

#webdeltamicrodata--nav .reviews {
    max-width: 500px;
}

#webdeltamicrodata--nav .images {
    display: flex;
    gap: 10px;
}

#webdeltamicrodata--nav .images img {
    max-width: 92px;
}

#webdeltamicrodata--nav .reviews h3 {
    margin-bottom: 10px;
}

#webdeltamicrodata--widget .stars,
#webdeltamicrodata--nav .stars {
    position: relative;
    display: inline-block;
}

#webdeltamicrodata--nav .stars svg {
    width: 20px;
    height: 20px;
}

#webdeltamicrodata--nav .aantalreviews {
    color: #7a7b7e;
    text-decoration: underline;
}

#webdeltamicrodata--nav .rating {
    display: flex;
    flex-direction: row;

    gap: 10px;

    align-items: center;

    margin-bottom: 10px;

    min-height: 25px;
}

#webdeltamicrodata--nav .rating-text {
    display: inline-block;

    color: #008080;
}

#webdeltamicrodata--widget .rating-text--big,
#webdeltamicrodata--nav .rating-text--big {
    font-size: 1.5rem;
    font-weight: bold;
}

#webdeltamicrodata--widget {
    position: absolute;
    right: 50px;
    bottom: 50px;
}

#webdeltamicrodata--widget p {
    width: 100%;
}

#webdeltamicrodata--widget .rating-text {
    display: inline-block;

    color: white;
}

#webdeltamicrodata--widget svg {
    width: 14px;
    height: 14px;
}


#webdeltamicrodata--widget svg path {
    fill: white;
}

#webdeltamicrodata--widget .aantalreviews {
    background: none;
    padding: 0;

    width: 100%;
}

.stars svg {
    width: 24px;
    height: 24px
}

.score {
    position: absolute;
    height: 25px;
    top: 0;
    left: 0;
    overflow: hidden;
    white-space: nowrap
}

.stars svg path {
    fill: #FFBC18
}

.beveeltonsaan {
    clear: both
}

#overlay {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(153, 153, 153, 0.6);
    z-index: 50;
    cursor: pointer;
}

.old-meter-price {
    display: inline-block;
    padding: 5px 20px;
    font-size: 13px;
    font-weight: normal;
    color: #888;
    background: #F3F3F3;
    font-family: Arial, sans-serif;
    border-radius: 5px 0 0 5px;
}
.product-prices .current-price {
    background: #FF6600;
    color: #FFF;
    padding: 10px 20px;
    text-align: center;
    font-size: 150%;
    border-radius: 5px;
    margin-right: 10px;
}
.product-price.has-discount .current-price {
    border-radius: 0 5px 5px 0;
    position: relative;

}
.product-price.has-discount .current-price:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 6px solid #f3f3f3;
}
.prijsperlengte {
    font-weight: bold;
}
.totaalprijs {
    font-weight: bold;
    color: #FF6600;
}

.product-variants.js-product-variants {
    background: #f4efe9;
    padding: 20px;
    border-radius: 10px;

    margin-top: 25px;
}

.product-price.h5 {
    display: flex;
    align-items: center;
}
.product-price .prijsgedeelte {
    display: flex;
    align-items: center;
}
.tax-shipping-delivery-label {
    margin-left: auto;
}

.tax-shipping-delivery-label p {
    color: #ff6f0f;
}

.product-add-to-cart-inputs {
    display: flex;
    flex-direction: row;
    gap: 10px;
    margin-bottom: 1.25rem;
}

.btn-down,
.btn-up,
.product-add-to-cart-inputs button {
    background: #E4F0EB;
    color: #008080;
    font-weight: bold;
    font-size: 125%;
    width: 44px;
    margin: 0;
    border-radius: 0;
    padding: 10px;
}

.product-add-to-cart-inputs label {
    font-weight: bold;
}

.product-add-to-cart-inputs span.extrainfo {
    font-size: 0.8125rem;
    line-height: 0.9375rem;
    max-width: 140px;
    display: block;
    padding: 5px 0;
}

.product-add-to-cart-inputs .producttotalorder {}

.js-cart-line-product-quantity,
.add-to-cart-input {
    width: 50px;
    text-align: center;
    background: #fff;
    color: #008080;
    font-weight: bold;
    border: 2px solid #E4F0EB;
    outline: none;
}

.add-to-cart {
    border-radius: 5px;
}

.product-variants {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.product-variants-item {
    width: 100%;
}
.product-variants-row {
    display: flex;
    gap: 20px;
    width: 100%;
}

.product-variants-row .product-variants-item {
    flex: 1;
    margin: 0;
}

/* Zorg ervoor dat de select boxes de volledige breedte innemen */
.product-variants-row .form-control-select {
    width: 100%;
}

/* Optioneel: labels wat meer ruimte */
.product-variants-row .control-label {
    margin-bottom: 8px;
    display: block;
}

.product-variants:empty {
    display: none;
}

.product-variants-item:has(#group_3) {
    width: 100%;
}

#group_3 {
    display: flex;
    flex-wrap: wrap;
}

#group_3 .input-container {
    display: flex;
    flex-direction: column;
    max-width: 70px;
}

#group_3 .color {
    width: 50px;
    height: 50px;
}

#group_3 .attribute-name {
    text-align: left;
    font-size: 0.8125rem;
    line-height: 0.9375rem;
}

.product-variants-item:has(#group_1),
.product-variants-item:has(#group_2) {
    width: 50%;
}

#group_1,
#group_2 {
    width: calc(100% - 10px);
    margin-right: 10px;
}

#wdcustomcontentbanen_block {
    .baan.background {
        background: #5f6d76;
        padding: 16px;
        color: white;
    }

}


.cart-content-btn {
    width: 100%;
    display: flex;
    flex-direction: row;

    gap: 10px;

    padding: 0 45px;
}

.cart-content-btn>* {
    flex-grow: 1;

    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;

    width: 100%;
}

/* Verder winkelen */
.cart-content-btn button {
    border: 2px solid #008080;
    border-radius: 5px;

    color: #008080;

    background: none;
}

.cart-content-btn a {
    border-radius: 5px;
}

#added-to-cart-label {
    color: #04AE59 !important;
}

.added-to-cart-footer {
    background: #f3f3f3;

    padding: 10px 25px 0 25px;
}

/* over ons gekophout */
.social-links {
    list-style: none;
    padding: 0 !important;
    margin: 0;
}

.social-links li {
    margin-bottom: 15px;
    background: none;
    padding: 0 !important;
}

.social-links a {
    display: flex;
    align-items: center;
    text-decoration: none;
    background-color: white;
    padding: 15px;
    border-radius: 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    color: black;
    font-size: 16px;
}

.social-links .icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 15px;
    background-color: #f4a01c;
    color: white;
    font-size: 20px;
    flex-shrink: 0;
}

.icon-youtube::before {
    content: "▶";
    font-weight: bold;
}

.icon-facebook::before {
    content: "f";
    font-family: Arial, sans-serif;
}

.icon-feedback::before {
    content: "★";
}

.team-photo-container {
    text-align: center;
    margin: 20px auto;
}

img.gekophout.teamfoto {
    width: 79%;
    max-width: 600px;
    height: auto;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

.links .row {
    display: flex;
    flex-direction: column;
}

span.prmn_menu_content_title {
    font-size: 19px;
    color: #008080;
}

.product-list-title {
    font-size: 2.5rem;
    margin: 20px 0 30px 0;
}
.card-block.category-additional-description {
    background-color: #E4F0EB;
    padding: 1rem 1rem 0 1.5rem;
    color: #29624A;
    border-radius: 4px;
}
.producttotalorder {
    padding-top: 35px;
    margin-left: 20px;
}
.producttotalorder p {
    margin-bottom: 0;
}

.totalorderpricediscount {
    text-decoration: line-through;
    color: #999;
}

.totalorderpricediscount--small {
    font-size: 0.8em;
}

#originalprice-container,
#originalprice-container-mobile {
    margin-top: 3px;
    line-height: 1;
}

.producttotalorder-mobile p {
    display: flex;
    gap: 5px;
}

.producttotalorder-mobile {
    display: none;
}


/* Spinner animatie */
.loader-spinner {
    width: 40px;
    height: 40px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #3498db;
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin: 0 auto 15px;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.filter-loader p {
    margin: 0;
    color: #333;
    font-weight: 500;
}

/* Dim de filters tijdens loading */
.filters-overlay.loading .facet {
    opacity: 0.5;
    pointer-events: none;
}
.filter-loader.hidden {
    display: none;
}
/* Hide overlay-only elements by default */
.overlay-only {
    display: none !important;
}

/* Show overlay-only elements when filters overlay is active */
.filters-overlay.active .overlay-only {
    display: block !important;
}
.filter-category-title {
    margin: 1rem 2rem;
}

/* Specific display types for different elements */
.filters-overlay.active .overlay-only.filter-loader {
    display: none !important; /* Loader blijft hidden tenzij expliciet getoond */
}

.filters-overlay.active .overlay-only.filter-loader:not(.hidden) {
    display: block !important; /* Toon loader alleen als niet hidden */
}

.filters-overlay.active .filters-apply-container.overlay-only {
    display: flex !important; /* Apply container moet flex zijn */
}

.filters-overlay.active .filters-close.overlay-only {
    display: flex !important; /* Close button moet flex zijn voor centering */
}

@media screen and (max-width: 1000px) {
    .producttotalorder-mobile {
        display: initial;
    }

    .producttotalorder {
        display: none;
    }

}

span#totalorderprice-mobile,
span#totalorderprice {
    font-size: 25px;
}

span#totalorderprice-mobile {
    margin-left: auto;
}

span.totalorderprice--small {
    font-size: 16px;
}

.free-shipping-cta {
    color: #ff6600;
    font-size: 0.875rem;
    margin-bottom: 30px;
    display: block;
}

a.all-product-link {
    float: right;
    margin-top: 1.5rem;
    clear: both;
    font-weight: bold;
    color: #7a7a7a;
    font-size: 20px;
    font-family: 'Epilogue';
}

.active_filters .active-filter-title {
    margin: 0;
    color: #323338;

    margin-right: 12px;
}

.active_filters {
    padding: 0;
    background: none;
}

.active_filters ul {
    margin: 0;
}

.active_filters .filter-block {
    background: #f0f0f0;

    margin-right: 12px;

    border-radius: 6px;
    padding: 8px 10px;
}


.products-slider .product-miniature .thumbnail-container {
    padding-bottom: 0;
    width: 90%;
}
.products-slider {
    cursor: grab;
}
.products-slider:active {
    cursor: grabbing;
}
.tns-controls {
    position: relative;
    z-index: 9;
}
.tns-controls button {
    position: absolute;
    top: 8rem;
    background: #ff6600;
    color: #fff;
    border: none;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    font-size: 0;
}
.tns-controls button[data-controls="prev"] {
    left: -15px;
}
.tns-controls button[data-controls="next"] {
    right: -15px;
}
.tns-controls button:after {
    content: "";
    position: absolute;
    top: 44%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 30px;
    color: #fff;
}
.tns-controls button[data-controls="prev"]:after {
    content: "‹";
}
.tns-controls button[data-controls="next"]:after {
    content: "›";
}
.tns-nav {
    text-align: center;
}
.tns-nav button {
    border: none;
    background: #ccc;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin: 0 5px;
    padding: 0;
}
.tns-nav button.tns-nav-active {
    background: #ff6600;
}

.js-search-filters-clear-all:hover,
.js-search-filters-clear-all:focus,
.js-search-filters-clear-all:active,
.js-search-filters-clear-all {
    background: none !important;
    color: #008080;
    outline: none;
    border: none;
}

.js-search-filters-clear-all i.material-icons {
    margin-right: 0;
}

.facets_title_section {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.facets-title {
    font-size: 1.5rem;
    font-weight: 500;
}

#search_filters .facet .facet_more.collapse:not(.in) {
    display: none;
}

.facet-more-button {
    background: none;
    color: #008080;
    outline: none;
    border: none;

    margin: 5px 0;

    display: flex;
    flex-direction: row;
    align-items: center;
}

.facet-more-button .collapse-icons {
    padding: 0;

    width: 24px;
    height: 24px;
}

.facet-more-button .collapse-icons * {
    display: none;
}

#search_filters .magnitude {
    font-weight: bold;
    font-size: 0.875rem;

    color: #29624a;

    background: #e4f0eb;
    border-radius: 3px;

    padding: 2px 4px;
    margin: 5px;
}

.facet-more-button[aria-expanded="true"] .collapse-icons .remove {
    display: initial;
}

.facet-more-button[aria-expanded="false"] .collapse-icons .add {
    display: initial;
}

#search_widget form input {
    width: 100%;
    padding: 0.5rem;
    outline: none;
    background-color: #fff;
    border: none;
    border-radius: 5px 0 0 5px;
}


.rating-info {
    display: flex;
    align-items: center;
}



.rating-score {
    font-size: 32px;
    font-weight: bold;
    color: #FFFFFF;
    margin-left: 13px;
}

.rating-large {
    font-size: 20px;
}

.rating-small {
    font-size: 17px;
}

.stars-rating {
    display: inline-flex;
    align-items: center;
}

.reviews {
    margin-top: 5px;
}

.rating-reviews {
    font-size: 14px;
    color: #FFFFFF;
}

#friswit {
    width: 25px;
    height: 25px;
    content: " ";
    position: relative;
    /* left: -26px; */
    margin-right: 5px;
    top: 8px;
    display: inline-block;
    border: 1px solid black;
    background-color: #F0EFE8;
}

#verkeerswit {
    width: 25px;
    height: 25px;
    content: " ";
    position: relative;
    /* left: -26px; */
    margin-right: 5px;
    top: 8px;
    display: inline-block;
    border: 1px solid black;
    background-color: #faf9f2;
}

#cremewit {
    width: 25px;
    height: 25px;
    content: " ";
    position: relative;
    /* left: -26px; */
    margin-right: 5px;
    top: 8px;
    display: inline-block;
    border: 1px solid black;
    background-color: #E9E3D7;
}

#gitzwart {
    width: 25px;
    height: 25px;
    content: " ";
    position: relative;
    /* left: -26px; */
    margin-right: 5px;
    top: 8px;
    display: inline-block;
    border: 1px solid black;
    background-color: #4A5054;

}

#antraciet {
    width: 25px;
    height: 25px;
    content: " ";
    position: relative;
    /* left: -26px; */
    margin-right: 5px;
    top: 8px;
    display: inline-block;
    border: 1px solid black;
    background-color: #0e0e10;
}

.color_blokje-friswit {
    width: 25px;
    height: 25px;
    content: " ";
    position: relative;
    left: -26px;
    margin-right: -22px;
    margin-left: 1.6em;
    top: 8px;
    display: inline-block;
    border: 1px solid black;
    background-color: #F0EFE8;
}

.baan.background-groen,
.baan.background-lichtgrijs,
.baan.background-donkergrijs {
    padding: 50px !important;
    margin-bottom: 30px;
}

.baan.background-groen,
.baan.background-groen h1 {
    background: #28624a;
    color: white;
}

.baan.background-lichtgrijs,
.baan.baan.background-lichtgrijs h1 {
    background: #f0f0f0;
}

.baan.background-donkergrijs,
.baan.baan.background-lichtgrijs h1 {
    background: #5f6d76;
    color: white;
}

.baan.background-zand,
.baan.baan.background-zand h1 {
    background: #f4efe9;
    color: #323338;
}



/*div#praatje-5 ul li,div#praatje-6 ul li , div#praatje-192 ul li, div#praatje-193 ul li*/
.component ul li {
    background: url(/img/Asset_1.png) center left no-repeat;
    background-position: top left;
    background-size: 20px;
    padding-left: 30px;
    margin-top: 9px;
}

/*div#praatje-1 ul li, div#praatje-187 ul li, div#praatje-21 ul li*/
.background-donkergrijs .component ul li {
    background: url(/img/vinkje.png) center left no-repeat;
    background-size: 20px;
    padding-left: 30px;
    margin-top: 9px;
}



.pdf-link {
    text-decoration: none;
    font-size: 16px;
    display: inline-flex;
    align-items: center;
}

.pdf-icon {
    width: 20px;
    height: 20px;
    margin-right: 8px;
}

.span7 {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    float: right;
}

.instructie-item-ga-naar .img {
    margin-bottom: 10px;
}

.instructie-item-ga-naar,
.instructie-item-ga-naar .a {
    text-align: center;
    background: #008CB4;
    line-height: 35px;
}

.cart-item {
    border-bottom: #E1E3E5 1px solid;
}

.cart-item .price {
    color: black;
    font-weight: initial;
}
.cart-item .cart-line-total,
.cart-item .price .current-price p {
    margin-bottom: 5px;
    line-height: 1rem;
    margin-top: 0.5rem;
}
.cart-item .price .current-price p.original-price {
    margin-top: 0;
}

.cart-item .per-unit {
    color: #BBBEBF;
    font-weight: initial;
}

.banner {
    text-align: center;
    padding: 20px;
}

.headline {
    color: white;
    font-weight: bold;
    font-size: 24px;
    margin: 0;
    display: inline-flex;
    align-items: center;
}

.info-icon {
    margin-left: 8px;
    width: 22px;
}

.subtext {
    color: white;
    margin: 4px 0 5px;
}

div#praatje-33 ul li,
div#praatje-110 ul li,
div#praatje-111 ul li {
    padding-left: 30px;
    margin-top: 9px;
    background: url(/img/Asset_1.png) left center / 20px no-repeat;
}

.row#baan-67 {
    padding: 20px !important;
    background: #5f6d76;
    color: white;
}

div#praatje-90 ul li {
    padding-left: 30px;
    margin-top: 9px;
    background: url(/img/vinkje.png) left center / 20px no-repeat;
}

/* Uitsparing select box */
.form-control-select#group_7 {
    background: none;
    border: none;
    padding: 0;
    color: #000;
}

/*accordion*/
.webdelta_faq button.btn-link.collapsed:before {
    content: "+";
    font-size: 1.5em;
    width: 20px;
    float: left;
}

.webdelta_faq button.btn-link:before {
    content: "-";
    color: #ff6600;
    font-size: 2em;
    width: 20px;
    float: left;
}

img.logo-mobile {
    width: 138px;
    height: auto;
    margin: 10px 0 10px 15px;
}

ul.product-attributes {
    display: flex;
    flex-wrap: wrap;
    column-gap: 8px;
}

ul.product-attributes span {
    font-size: 0.875rem;
}

ul.product-attributes .separator {
    width: 10px;
    height: 10px;
    padding: 2px;
}

.card.cart-summary {
    background: #F3F3F3;
    padding: 1rem;
}

.cart-grid-right {
    position: sticky;
    top: 85px;
}

.card-block.checkout {
    padding-bottom: 0;
}

.card-block.checkout .btn-primary {
    text-transform: none;
}
.delivery-date-calculator #cart_delivery_date_field_text {
    background: none;
}
.delivery-date-calculator .input-group-addon {
    margin-left: -50px;
}

.klantenservice {
    background: white;
}

.montagehulp .btn-secondary,
.klantenservice .btn-secondary {
    border-radius: 6px;
    border: solid 1px #E1E3E5;

    color: #008080;

    display: block;

    margin: 0 auto;
    padding: 2px 8px;

    width: fit-content;

    font-size: 0.950rem;
    font-weight: normal;

    text-transform: none;

    background: white;
}

.montagehulp .btn-secondary i,
.klantenservice .btn-secondary i {
    color: #008080;
}

/*contactpersoon*/
.contactpersoon {
    position: relative;
    background-color: #F4EFE9;
    display: flex;
    align-items: center;

}

.foto {
    min-height: 300px;
    padding-left: 60px;
}

.foto img {
    position: absolute;
    bottom: 0px;
}

.contactpersoon .text {
    padding-right: 30px;
}




.autohide {
    position: fixed;
    top: 0px;
    right: 0;
    left: 0;
    width: 100%;
    z-index: 990;
    transform: translateY(0px);
    transition: transform 300ms ease-in-out 0s;
    -webkit-box-shadow: 0 10px 20px -10px rgba(0, 0, 0, .4);
    box-shadow: 0 10px 20px -10px rgba(0, 0, 0, .4);
}

#content-hook_order_confirmation {
    padding: 30px 15px;
}

body#contact .col-md-6 .inner {
    background-color: #f6f6f6;
    padding: 1rem;
    margin-bottom: 1rem;
}

/* plinten tabel */
.plintentabelwrapper {
    position: relative;
}

.plintentabelscroller {
    padding-bottom: 5px;
    /*
    overflow-x: scroll;
    overflow-y: visible;
    margin-left: 141px;
    width: 600px;
    width: calc(100% - 102px);
    */
}

table.plintentabel {
    border: none;
    border-right: solid 1px #DDEFEF;
    border-bottom: 5px solid #333;
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    display: table;
    margin-bottom: 30px;
}

table.plintentabel tr:nth-child(odd) {
    background-color: #fff;
}

table.plintentabel tr:nth-child(even) {
    background-color: #f0f0f0;
}

table.plintentabel td a {
    line-height: 20px;
    text-decoration: none !important;
    color: #000 !important;
}

table.plintentabel td a:hover {
    background-color: #ff9900;
}

table.plintentabel th,
table.plintentabel td {
    width: 11%;
    padding: 5px 0;
}

table.plintentabel th {
    background-color: #008cb3;
    color: #fff;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    padding: 9px 0;
}

table.plintentabel td {
    text-align: center;
    /*
    display: table-cell;
    */
    vertical-align: middle;
}

table.plintentabel td a.bekijkknop {
    text-align: center;
    cursor: pointer;
    padding: 4px 15px;
    line-height: 21px;
    display: block;
    max-width: 100%;
    background-color: #ff6600;
    background-image: linear-gradient(to bottom, #ff9900, #ff6600);
    background-image: -moz-linear-gradient(top, #ff9900, #ff6600);
    background-image: -o-linear-gradient(top, #ff9900, #ff6600);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ff9900), to(#ff6600));
    background-image: -webkit-linear-gradient(top, #ff9900, #ff6600);
    background-repeat: repeat-x;
    border: 1px solid #ff6600;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    color: #fff !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff6600', endColorstr='#ff6600', GradientType=0);
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
}

table.plintentabel td a.bekijkknop:hover {
    background-color: #ff9900;
}

table.plintentabel td.highlight {
    font-weight: bold;
    color: #000;
}

table.plintentabel .PricesalesPrice {
    font-weight: bold;
    color: #000;
    display: inline;
}

table.plintentabel span.fromprice {
    color: #7E8285 !important;
}

table.plintentabel span.fromprice .PricesalesPrice {
    font-weight: normal;
    font-size: 12px;
    color: #7E8285 !important;
    display: inline;
    margin-right: 10px;
}

table.plintentabel .stickycol {
    background-color: #333;
    left: 0;
    color: #fff;
    /*
    position: absolute;
    width: 102px;
    */
}

/* Vinkje over color swatch bij actieve staat */
.facet-label.active .custom-checkbox {
    position: relative;
}

.facet-label.active .custom-checkbox .color::after {
    content: '';
    position: absolute;
    top: -3px;
    right: -2px;
    width: 22px;
    height: 21px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E");    background-size: contain;
    background-repeat: no-repeat;
    z-index: 2;
}

/* Accordion buttons - altijd aanwezig maar alleen zichtbaar op mobiel */
.tabs .accordion-header {
    width: 100%;
    padding: 1rem;
    border: 1px solid #bcbebf;
    border-bottom: none;
    text-align: left;
    cursor: pointer;
    font-weight: 500;
    background: none;
    display: none;
    justify-content: space-between;
    align-items: center;
    margin: 0;
    font-size: 1rem;
    transition: all 0.7s ease;
    font-family: inherit;
}
.tabs button.accordion-header[data-target="#bezorginfo"] {
    border-bottom: 1px solid #bcbebf;
}

.tabs .accordion-header::after {
    content: "";
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23333'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    background-size: contain;
    width: 1rem;
    height: 1rem;
    background-repeat: no-repeat;
    transition: transform 0.3s ease;
    transform: rotate(0deg);
}

.tabs .accordion-header.active::after {
    transform: rotate(180deg);
}

.tabs .accordion-header:hover {
    background-color: #e9ecef;
}

.tabs .accordion-header.active {
    color: #000;
}

.back-to-category {
    margin-bottom: 1rem;
    display: none;
}

.modal .close-button {
    position: absolute;
    top: 30px;
    right: 15px;
    background: none;
    color: #000;
    cursor: pointer;
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s ease;
}

.modal .close-button:focus {
    outline: 2px solid #007bff;
}

.betaallogos {
    max-width: 180px;
    height: auto;
    display: block;
    margin: 30px auto 0 auto;
}

@media (max-width: 1024px) {
    #header .header-top #block-reassurance {
        display: none;
    }
}

@media (max-width: 992px) {
    .foto img {
        position: relative;
        height: auto;
        width: 100%;
    }
    .product-flags li.product-flag.discount {
        top: 140px;
    }
}

@media screen and (max-width: 600px) {
    .cms-id-7 #wdcustomcontentbanen_block,
    .cms-id-51 #wdcustomcontentbanen_block,
    .cms-id-6 #wdcustomcontentbanen_block,
    .cms-id-8 #wdcustomcontentbanen_block {
        .baan {
            flex-direction: column !important;
        }
    }
}

@media (max-width: 767px) {
    #search_widget {
        border: 1px solid #ddd;
        border-radius: 8px;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        padding: 6px;
        max-width: 400px;
        margin: 20px auto;
    }

    #header,
    #header .header-top {
        background-color: white;
    }
    .featured-products.fullwidth {
        background-color: #FFF;
    }
    .featured-products.fullwidth .col-md-12 {
        width: 100% !important;
        padding: 0;
    }
    .featured-products.fullwidth .col-md-12 .products.row {
        padding: 0;
        margin-right: 0px;
        display: block;
        max-width: fit-content;
    }
    .featured-products.fullwidth .col-md-12 .products.row .product {
        padding-right: 0 !important;
    }

    .featured-products .products {
        padding: 0;
        margin: 0 -15px;
        display: block;
        max-width: fit-content;

    }


    .btn {
        width: 100%;
    }

    .search-widgets {
        display: none;
    }

    .search-widgets .search-button {
        background: none;
    }

    .header-nav i.material-icons {
        color: black;
    }

    .header i.material-icons.shopping-cart {
        color: black !important;
    }

    .images-container {
        margin: 0 -15px;
    }

    #menu-icon i,
    #_mobile_cart i,
    #_mobile_user_info i,
    .logo-mobile {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 40px;
        width: 40px;
        font-size: 30px;
    }

    #menu-icon i {
        font-size: 40px;
    }

    i.material-icons.search {
        margin-left: 36px;
        font-size: 26px;
    }

    #header .header-nav #menu-icon {
        margin: 8px 1rem
    }

    #header .header-nav .user-info {
        margin: 0;
    }

    .page-product #content-wrapper {
        margin: 2rem 15px 0 15px;
    }

    .page-content.page-cms {
        padding: 0 15px;
    }

    .wh_image_box_1 .wh_image_text h1 {
        font-size: 1.6rem;
        margin-bottom: 0.6em;
    }

    .wh_image_box_1 .wh_image_text a {
        color: #fff;
        background-color: #008080;
        border-radius: 5px;
        text-decoration: none;
        width: 100%;
        font-weight: bold;
        text-align: center;
        margin-top: 1em;
    }

    .wh_image_box_1 .wh_image_text li {
        padding: 0.1rem 0 !important;
        display: flex;
        flex-direction: row;
        font-size: 0.9875rem;
    }

    #wrapper {
        padding-top: 0;
        display: block !important;
    }

    #webdeltamicrodata--widget {
        position: unset;
        right: 0px;
    }

    .hidden-md-up.text-sm-center.mobile {
        background: white;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    #header .header-top {
        padding: 0;
    }

    .modal .products.row .js-product {
        height: auto;
    }

    .category-box-5 {
        padding: 0;
    }

    .webdelta-cms-blog {
        margin: 0 -15px;
    }

    .page-header,
    .page-content {
        padding: 0 15px;
    }

    #header .header-nav .blockcart {
        background: none;
        margin-top: -19px;
        margin-left: 0;
    }

    .contactpersoon {
        flex-direction: column;
        margin-top: 30px;
    }

    .contactpersoon .text {
        padding: 30px 15px;
    }

    .contactpersoon .foto {
        padding: 0;
        margin: 0;
    }
    /* Verberg desktop tabs */
    .nav-tabs {
        display: none !important;
    }

    /* Reset tab-content margin */
    .tab-content {
        margin-top: 0 !important;
    }

    /* Toon accordion headers op mobiel */
    .accordion-header {
        display: flex !important;
    }

    /* Tab-pane styling voor accordion */
    .tab-pane.fade {
        border: 1px solid #dee2e6 !important;
        border-top: none !important;
        margin-bottom: 0 !important;
        padding: 1rem !important;
        animation: slideDown 0.5s ease-out;
    }

    /* Laatste accordion item krijgt bottom border */
    .tab-pane:last-child {
        border-bottom: 1px solid #dee2e6 !important;
    }

    /* Smooth slide animation */
    @keyframes slideDown {
        from {
            opacity: 0;
            max-height: 0;
            padding-top: 0;
            padding-bottom: 0;
        }
        to {
            opacity: 1;
            max-height: 1000px;
            padding-top: 1rem;
            padding-bottom: 1rem;
        }
    }

    /* Filters overlay styling */
    .filters-overlay {
        position: fixed !important;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background: rgba(255, 255, 255, 0.95);
        z-index: 9999 !important; /* Hoger dan header z-index */
        overflow-y: auto;
        padding-top: 20px;
        display: none; /* Verborgen by default */
    }

    /* Wanneer filters actief zijn */
    .filters-overlay.active {
        display: block !important;
    }

    /* Filter content styling */
    .filters-overlay .facet {
        max-width: 800px;
        margin: 0 auto;
        padding: 20px;
        background: white;
        border-radius: 8px;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    }

    /* Close button voor filters */
    .filters-close {
        position: absolute;
        top: 20px;
        right: 20px;
        background: none;
        border: none;
        font-size: 60px;
        cursor: pointer;
        z-index: 10000;
    }

    /* Loader styling */
    .filter-loader {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background: rgba(255, 255, 255, 0.95);
        padding: 30px;
        border-radius: 8px;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
        text-align: center;
        z-index: 10001;
        display: none;
    }


    /* YouTube iframe responsive op mobiel */
    .tab-pane iframe {
        width: 100% !important;
        height: 200px !important;
    }
}

@media (min-width: 768px) {
    .tabs .accordion-header {
        display: none !important;
    }
}

@media (max-width: 575px) {

    #js-product-list {
        margin-right: 0;
    }

    #products .products {
        display: block;
        width: 100%;
        margin-left: 0px;
    }

    #products .products .product {
        width: 100%;
        margin: 0;
        padding: 0;
    }

    .product-miniature,
    .product-miniature .product {
        display: block;
        width: 100%;
        border: none;
    }

    .product-miniature .product-description {
        width: 100%;
        padding: 0 0 2rem 1rem;
        margin-top: -10px;
    }

    .product-miniature .product-price-and-shipping {
        padding: 0;
    }

    .tabs {
        margin: 30px 0;
    }

    .featured-products {
        position: relative;
    }

    i.material-icons.search {
        margin-left: 0px;
        font-size: 26px;
    }

    .product-miniature .thumbnail-top {
        width: 50%;
        float: left;
    }

    .product-miniature .product-description {
        width: 50%;
        float: right;
        position: relative;
        padding-bottom: 2rem;
    }

    .crosssellproduct .product-miniature .thumbnail-top {
        width: 40%;
    }
    .crosssellproduct .product-miniature .product-description {
        width: 60%;
    }

    .product-miniature .thumbnail-container .addtocart {
        width: 100%;
        left: 0;
        bottom: 0;
        position: relative;
    }

    .breadcrumb {
        display: none;
    }

    .back-to-category {
        display: block;
    }

    #main .page-header {
        margin: 1.563rem 0 1rem 0;
        color: #bc8642;
    }

    .page-authentication #main .page-header {
        margin: 1.563rem 0 0 0;
    }

    .cart-content-btn {
        flex-direction: column;
    }

    .cart-grid-right .cart-summary {
        padding: 15px;
        background: #F3F3F3;
    }

    body#checkout .cart-grid-right .card {
        display: none;
    }

    .wh_image_text {
        padding: 0 2rem !important;
    }
    .product-price.h5 {
        align-items: flex-start;
        flex-direction: column;
    }
    .tax-shipping-delivery-label {
        margin-left: 0;
    }
    #originalprice-container-mobile {
        margin-top: -10px;
    }
    .tns-controls button {
        top: 3rem;
    }
}

@media (max-width: 360px) {
    img.logo-mobile {
        width: 75px;
        margin: 10px 0 10px 6px;

    }

    .webdeltamicrodata a {
        width: 275px;
    }
        .wh_image_text {
            padding: 0 1rem !important;
        }
}