@charset "utf-8";
/* CSS Document */

.colorsamples-wrap {
    background-color:var(--tint-color);
    background: url('img/beton_background_pattern.jpg'), #c0c0c0;
    background-size: cover;
    background-position: center;
    background-blend-mode: overlay;
    padding-top:35px;
    padding-bottom:35px;
}
.colorsamples {
    gap:15px;
    text-overflow: ellipsis;
    overflow: hidden;
    flex-wrap: nowrap;
    padding-bottom:35px;
    transition: .3s ease;
}

.colorsamples.opened {
    flex-wrap: wrap;
}
.opened a.minderweergeven {
    display: block;
}
a.minderweergeven, .opened a.meerweergeven {
    display: none;
}

a.used-product {
    display: inline-block;
    text-decoration: none;
    width:140px;
    min-width: min(140px, calc(33% - 6px));
    max-width: min(140px, calc(33% - 6px));
    border:1px solid var(--tint-color);
    background-color: white;
    padding:.4em;
    text-align: center;
    font-size:0.9rem;
    transition: .25s ease;
}
a.used-product:hover {
    transform:scale(1.08);
}
.used-product-image {
    width:100%;
}
.used-product-image img {
    width:100%;
    height:auto;
    aspect-ratio:1/1;
    object-fit: cover;
    object-position: center;
}
.used-product span {
    display: block;
    font-size:inherit;
    line-height: 1.4em;
}
@media screen and (max-width:768px) {
    .colorsamples {
        gap:10px;
    }
    a.used-product {
        font-size:.8rem;
    }
}

.slick-arrows {
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; /* Standard syntax */
    margin-right:35px;
}
.slick-arrows .slick-arrow {
    display: inline-block;
    position: relative;
    height:35px;
    width:35px;
    cursor: pointer;
    margin:0 5px;
    transition: .3s ease;
}
.slick-arrows .slick-arrow.slick-hidden {
    display: none;
}
.slick-arrows .slick-arrow::before {
    content:'';
    display: block;
    border-top:2px solid black;
    border-left:2px solid black;
    position: absolute;
    top:25%;
    left:25%;
    transform:rotate(-45deg);
    height:12px;
    width:12px;
}
.slick-arrows .slick-next::before {
    transform:rotate(135deg);
}
.slick-arrows .slick-disabled {
    opacity: .5;
}

.video_wrap {
    width:100%;
    display: block;
    position: relative;
}
.video_wrap video, .video_wrap iframe {
    width:100%;
    height:auto;
    aspect-ratio:16/9;
    object-fit: contain;
    object-position: center;
}

.embedcontainer {
    width:830px;
    max-width: 100%;
}
.embedcontainer iframe {
    max-width: 100%;
}

.review-slider .slick-track {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
}
.review-slider .slick-track .slick-slide {
    height:auto;
    width:400px;
    max-width: calc(100vw - 30px);
    background-color:var(--tint-color);
    margin-right: 40px;
    border-radius: 18px;
    padding:25px;
}
.review-slider .slick-slide::before {
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 371.343 238.283"><g transform="translate(-30 -403)"><path d="M168.311,94.3c.052,67.26-54.355,125-117.829,139.009-11.514,2.541-32.644,9.283-43.258.91-8.163-6.439-9.483-20.1-3.578-28.481,8.073-11.454,25.8-8.05,37.9-10.478,15.6-3.131,36.719-9.775,47.138-22.529-15.365-6.681-31.777-5.86-46.87-15.164-14.52-8.95-25.591-22.284-32.6-37.791C-5.868,86.428,3.3,45,30.933,20.9c26.775-23.363,65.39-27.947,96.105-9.618,30.109,17.967,41.994,49.02,41.273,83.02" transform="translate(30 403)"/><path d="M371.312,94.3c.052,67.26-54.355,125-117.829,139.009-11.514,2.541-32.644,9.283-43.258.91-8.163-6.439-9.483-20.1-3.578-28.481,8.073-11.454,25.8-8.05,37.9-10.478,15.6-3.131,36.719-9.775,47.138-22.529-15.365-6.681-31.777-5.86-46.87-15.164-14.52-8.95-25.591-22.284-32.6-37.791C197.133,86.428,206.3,45,233.934,20.9c26.775-23.363,65.39-27.947,96.1-9.618,30.109,17.967,41.994,49.02,41.273,83.02" transform="translate(30 403)"/></g></svg>');
    display: block;
    width:68px;
    height:auto;
}
.quote-name {
    display: block;
    opacity: .5;
    font-style: italic;
}
.quote-name::before {
    content:'- ';
}

.logoslider-wrap {
    background-color:var(--main-color);
    color:white;
    padding:25px 0;
}
.logoslider-wrap .slick-slide {
    padding:0 8px;
}
.slider-logo {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    padding:0;
    background-color:white;
    width:210px;
    max-width: 100%;
    aspect-ratio:2/1;
}
.slider-logo img {
    display: block;
    width:calc(100% - 12px);
    height:calc(100% - 12px);
    object-fit: contain;
    object-position: center;
}

.table-border {
    max-width:100%;
    &, th, td {
        border: 1px solid black;
        border-collapse: collapse;
    }
    td {
        padding:.15em .25em;
    }
}

ul.page-numbers  {
    list-style: none;
    font-size:.9rem;
    margin:2em 0;
    padding:0;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap:.4em;
}
.page-numbers li {
    display: inline-block;
    margin:0;
    padding:0;
}
.page-numbers a, .page-numbers span.current {
  color: var(--main-color);
  float: left;
  padding: 6px 12px;
  text-decoration: none;
  transition: background-color .3s;
  border: 1px solid #ddd;
  margin: 0;
}
.page-numbers span.current {
  background-color: var(--main-color);
  color: white;
  border: 1px solid var(--main-color);
}
.page-numbers a:hover:not(.active) {background-color: var(--tint-color);}

.single-project a {
    text-decoration: none;
    display: block;
}
.single-project h4, .single-project .h4 {
    display:block;
}
.project-img {
    width:100%;
    height:auto;
}
.project-img img {
    display: block;
    width:100%;
    height:auto;
    aspect-ratio:1/1;
    object-fit: cover;
    object-position: center;
}
.projectruimte {
    display: inline-block;
    font-size:.7rem;
    padding:.15em .4em;
    line-height: 1.3em;
    color:white;
    background-color:var(--main-color);
    border-radius: 3px;
    margin-right:.5em;
    margin-bottom:.3em;
}


.form form {
    max-width:480px;
    width:100%;
}
.form form input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]), .form form textarea, .form form select {
    font-size:inherit;
    font-family:inherit;
    line-height: 1.5em;
    font-weight: inherit;
    resize:none;
    border:1px solid var(--main-color);
    border-radius: 0;
    width:100%;
}
.form form button, .form form input[type="submit"] {
    -webkit-appearance:none;
    border:none;
    font-family: inherit;
    cursor: pointer;
    display: inline-block;
    text-decoration: none;
    font-size:1.1rem;
    padding:.5em 1em;
    background-color:var(--plus-color);
    color:white;
    transition: .16s ease;
    border-radius: 4px;
    width:auto;
}
.form form button:hover, .form form input[type="submit"]:hover {
    background-color:var(--plus-color);
}
.forminator-custom-form .forminator-row {
    margin-bottom: .5em;
    width:100%;
}

.forminator-custom-form .forminator-row:has(> .forminator-col-6), .forminator-custom-form .forminator-row:has(> .forminator-col-md-6) {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    gap:1em;
}
.forminator-custom-form .forminator-col-6, .forminator-custom-form .forminator-col-md-6 {
    flex-grow:1;
    flex-basis:0;
}
.forminator-custom-form span.forminator-error-message {
    display: block;
    margin-top:.2em;
    color:var(--min-color);
    font-size:.8rem;
    line-height: 1.2em;
}
.forminator-custom-form .forminator-response-message {
    display: none;
}
span.forminator-label, label.forminator-radio {
    display: block;
}

.payment-icons {
    display: flex;
    flex-wrap: wrap;
    gap:.5rem;
}
.payment-icons .payment-icon img {
    display: inline-block;
    width:2rem;
    height:auto;
}
span.payment-icon:empty {
	display:none;
}


footer {
    background-color:var(--main-color);
    color:white;
    padding:60px 0 0 0;
}
footer hr {
    border:none;
    height:1px;
    background-color: white;
    margin-top:2em;
}
.footer-links ul {
    margin:0;
    padding:0;
    list-style: none;
}
.footer-links a {
    text-decoration: none;
}
.footer-socials {
    margin-top:2em;
}
.footer-socials a {
    text-decoration: none;
    display: inline-block;
    margin:0 1em 0 0;
    filter: brightness(0) invert(1);
}
.footer-socials img {
    width:25px;
    height:25px;
    object-fit: contain;
    object-position: center;
}
.footer-bottom-menu {
    ul {
        list-style:none;
        margin:0;
        padding:0;
        li {
            display:inline-block;
            margin-left:1.25em;
        }
    }
}