h1 { font-size: 52px; margin: 20px 0 30px 0;}
h2 { font-size: 42px; margin: 30px 0 15px 0;}
.col-lg-6 h2 { margin-top: 0;}
.col-lg-9 h2 { margin-top: 0;}

/*===========================================================
          HEADER
===========================================================*/
.header-img { margin-bottom: 43px;}
.header-img .image { position: relative; overflow: hidden;}
.header-img .image::after { content: ''; background: linear-gradient(0deg, rgba(26, 32, 109, 0.65) 0%, rgba(26, 32, 109, 0.65) 100%); width: 100%; height: 100%; position: absolute; inset: 0;}
.header-img .image img { object-fit: cover; width: 100%; height: 100%; object-position: center; min-height: 335px;}
.bluebar-overlay { width: calc(100% - 30px); position: absolute; height: 8px; background: #1a206d; top: 8px; z-index: 999; mix-blend-mode: darken;}
.textbox { color: var(--white); font-family: var(--primary-font); font-size: clamp(3rem, 7vw, 100px); font-style: italic; font-weight: 300; line-height: normal; position: absolute; bottom: 40px !important; left: var(--half-space); max-width: var(--container-width); text-wrap: balance; }

/*Tablet*/
@media (max-width: 991px) {
  .header-img .textbox { left: 24px; bottom: 24px; max-width: calc(100% - 48px);}
}
/*Mobiel*/
@media (max-width: 767px) {
  .header-img .textbox { left: 16px; bottom: 16px; max-width: calc(100% - 32px);}
}

/*===========================================================
					BREADCRUMBS
===========================================================*/
.container-fluid.breadcrumb { padding: 0 15px; list-style: none; background: none; border-radius: 0;}
.block.breadcrumb { padding: 0; margin-bottom: 0; background: none;}
.block.breadcrumb ul { padding-left: 0; margin-bottom: 0;}
.block.breadcrumb ul li { list-style: none; display: inline; color: #AAAAAA;}
.block.breadcrumb ul li.breadcrumarrow:after { content: "\f105"; font-family: 'Font Awesome 5 Pro'; font-size: 16px; font-weight: 300; font-style: normal; margin: 0 5px;}
.block.breadcrumb ul li a { font-size: 16px; font-weight: 300; color: #AAAAAA;}
.block.breadcrumb ul li:last-child a { font-size: 16px; font-weight: 500; color: #AAAAAA;}

/*===========================================================
					CONTENT
===========================================================*/
div[class*="col-"]:has(+ div[class*="col-"]) { padding-right: 25px; }
div[class*="col-"] + div[class*="col-"] { padding-left: 25px; }

.bluebar { padding: 50px 0; background: #232b99; color: #ffffff;}
.bluebar h5 { color: #fff;}
.bluebar ul { margin-top: 25px;}

.block.content.center { text-align: center;}

.block.slides.slider.single-item { border-top: none; height: calc(100% - 44px);}

.block.content ul { padding-left: 0;}
.block.content ul li { list-style: none;}
.block.content ul li { position: relative; padding-left: 30px; margin-bottom: 10px;}
.block.content ul li:before { content: "\f00c"; color: #00a020; font-family: 'Font Awesome 5 Pro'; font-weight: normal; position: absolute; top: 0; left: 0;}

.block.html.circle { margin: 10px 0 20px 0;}
.block.html.circle img { border-radius: 100%;}

.block.list.werkenbij .col-md-6.col-lg-3 { margin-bottom: 30px;}
.block.list.werkenbij a { text-decoration: none; color: #222222;}
.block.list.werkenbij .item { margin-top: 25px; text-align: left;}
.block.list.werkenbij .item .image { overflow: hidden;}
.block.list.werkenbij .item .image img { -moz-transition: all 0.5s; -webkit-transition: all 0.5s; transition: all 0.5s;}
.block.list.werkenbij .item:hover .image img { -moz-transform: scale(1.08); -webkit-transform: scale(1.08); transform: scale(1.08);}
.block.list.werkenbij .item .content { margin-top: 20px;}
.block.list.werkenbij .item .content .title { margin: -60px 0 10px 20px; padding: 10px 20px; position: relative; width: 90%;}
.block.list.werkenbij .item .content .title:before { content: ""; display: block; width: 100%; height: 100%; background: #ed1e3d; mix-blend-mode: darken; position: absolute; top: 0; left: 0;}
.block.list.werkenbij .item .content .title h3 { position: relative; margin-bottom: 0; color: #ffffff; line-height: 30px;}
.block.list.werkenbij .item .content .dienstverb { font-family: 'Eaves'; font-size: 22px; color: #19206d; font-weight: 400; margin-bottom: 0; display: block;}
.block.list.werkenbij .item .content .werktext { }
.block.list.werkenbij .item .content .btn-default { font-size: 14px; padding: 8px 25px;}

.block.list.werkenbij .listitem { padding: 0 15px;}
.block.list.werkenbij .listitem h1 { margin-bottom: 20px;}
.block.list.werkenbij .listitem ul { padding-left: 0;}
.block.list.werkenbij .listitem ul li { list-style: none;}
.block.list.werkenbij .listitem ul li { position: relative; padding-left: 30px; margin-bottom: 10px;}
.block.list.werkenbij .listitem ul li:before { content: "\f00c"; color: #00a020; font-family: 'Font Awesome 5 Pro'; font-weight: normal; position: absolute; top: 0; left: 0;}

.row.maps .col-lg-12 { padding: 0;}
.row.maps iframe { width: 100%; margin-top: 10px;}

.reviews .review { display: flex;}
.reviews .review .left { margin-right: 20px;}
.reviews .review .right { width: 100%;}
.reviews .rating-number { overflow: hidden; font-size: 30px; position: relative;}
.reviews .rating-number span { color: #fff; position: absolute; top: 40%; left: 0; width: 100%; text-align: center; margin-top: -.25em; z-index: 1;}
.reviews .rating-number svg { width: 65px;}

.block.list.team { text-align: center;}
.block.list.team .item { margin-bottom: 30px;}
.block.list.team .item .image { overflow: hidden;}
.block.list.team .item .image img { -moz-transition: all 0.5s; -webkit-transition: all 0.5s; transition: all 0.5s;}
.block.list.team .item:hover .image img { -moz-transform: scale(1.08); -webkit-transform: scale(1.08); transform: scale(1.08);}
.block.list.team h3 { margin: 10px 0 0 0;}
.block.list.team p { font-family: 'Eaves'; font-size: 24px; font-weight: 500; color: #555555; margin: 0 0 0 0;}

.block.html.filters ul { margin: 10px 0 40px 0;}
.block.html.filters ul { padding-left: 0;}
.block.html.filters ul li { display: inline; list-style: none;}
.block.html.filters ul li .btn.btn-secondary { padding: 10px 30px;}
.block.html.filters ul li .btn.btn-secondary:hover { background: #ED1E3A;}
.block.html.filters ul li .btn.btn-secondary:after { display: none;}

.block.list.tips { margin: -20px 0 30px 0;}
.block.list.tips .item { padding-left: 40px; margin-bottom: 4px;}
.block.list.tips .item:before { content: '\f178'; font-family: 'Font Awesome 5 Pro'; margin-left: -20px; margin-right: 20px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
.block.list.tips a .item { color: #ed1e3d;}
.block.list.tips a:hover { text-decoration: none; color: #ed1e3d;}
.block.list.tips a:hover .item:before { content: '\f178'; font-family: 'Font Awesome 5 Pro'; margin-left: -10px; margin-right: 10px;}

.block.content.openingstijden table tr td:nth-child(1) { width: 120px;}

.container-fluid.content iframe { max-width: 100%; }

/*IMAGE COMPARISON*/
.comparison-slider-wrapper { position: relative; width: 100%; margin: 10px 0; background-color: white;}
.comparison-slider-wrapper img { max-width: none !important;}
.comparison-slider-wrapper .comparison-slider { position: relative; width: 100%; margin: 0; box-sizing: border-box;}
.comparison-slider-wrapper .comparison-slider > img { max-width: none !important; width: 100%; height: auto; display: block;}
.comparison-slider-wrapper .comparison-slider .overlay { display: none; position: absolute; width: 150px; bottom: 20px; right: 20px; background-color: rgba(237,30,61,0.8); padding: 5px 15px; box-sizing: border-box; font-family: 'Eaves'; font-weight: bold; color: #ddd; text-align: right; text-transform: uppercase;}
@media screen and (min-width: 767px) {
  .comparison-slider-wrapper .comparison-slider .overlay { display: block;}
}
.comparison-slider-wrapper .comparison-slider .resize { position: absolute; top: 0; left: 0; height: 100%; width: 50%; overflow: hidden;}
.comparison-slider-wrapper .comparison-slider .resize > img { display: block;}
.comparison-slider-wrapper .comparison-slider .resize .overlay { right: auto; left: 20px; text-align: left;}
.comparison-slider-wrapper .comparison-slider .divider { position: absolute; width: 2px; height: 100%; background-color: rgba(256, 256, 256, 0.2); left: 50%; top: 0; bottom: 0; margin-left: -1px; cursor: ew-resize;}
.comparison-slider-wrapper .comparison-slider .divider:before { content: ""; position: absolute; width: 20px; height: 20px; left: -9px; top: 50%; margin-top: -10px; background-color: white; transform: rotate(45deg); transition: all 0.1s ease-in-out;}
.comparison-slider-wrapper .comparison-slider .divider:after { content: ""; position: absolute; width: 12px; height: 12px; left: -5px; top: 50%; margin-top: -6px; background-color: white; transform: rotate(45deg); transition: all 0.1s ease-in-out;}
.comparison-slider-wrapper .comparison-slider .divider.draggable:before { width: 30px; height: 30px; left: -14px; margin-top: -15px;}
.comparison-slider-wrapper .comparison-slider .divider.draggable:after { width: 20px; height: 20px; left: -9px; margin-top: -10px; background-color: #555;}
.comparison-slider-wrapper .caption { position: relative; width: 100%; padding: 10px; box-sizing: border-box; font-size: 12px; font-style: italic;}

/*RED BLOCK*/
.redblock-terugbel { background: #ed1e3d; padding: 45px 40px 50px 40px; color: #fff;}
.redblock-terugbel h2 { color: #fff;}
.redblock-terugbel .phone { font-family: 'Eaves'; font-size: 40px; font-weight: 300; font-style: italic; margin: 25px 0 25px 0;}
.redblock-terugbel .phone i { font-size: 30px; margin-right: 10px;}
.redblock-terugbel .form_message { display: none;}
.redblock-terugbel .form-horizontal { display: flex; justify-content: space-between;}
.redblock-terugbel .form-group { margin-bottom: 0;}
.redblock-terugbel .form-group:nth-child(7) { display: none;}
.redblock-terugbel .form-control { background: #B41830; border: 0; border-radius: 50px; padding: 7px 20px;}
.redblock-terugbel input::placeholder { color: rgba(255,255,255,0.5);}
.redblock-terugbel .btn-default { background: #1a206d; border-bottom: 0; border-radius: 50px; font-family: 'Eaves'; font-size: 18px; font-style: normal; padding: 6px 20px;}
.redblock-terugbel .btn-default:hover { background: #1a206d; border-bottom: 0;}

/*OFFERTE AANVRAGEN*/
.offerte-aanvraag { margin-top: 50px;}
.offerte-aanvraag .offerte-block { background: #F7F7F7; padding: 50px 100px;}
.offerte-aanvraag .offerte-block .btn.btn-default { width: 100%;}
.offerte-aanvraag .offerte-block .block.list.werkwijze { padding: 0 50px;}
.offerte-aanvraag .offerte-block .block.list.werkwijze .item { display: flex; margin-bottom: 50px;}
.offerte-aanvraag .offerte-block .block.list.werkwijze .item .number { padding-right: 30px;}
.offerte-aanvraag .offerte-block .block.list.werkwijze .item .number span { display: flex; align-items: center; justify-content: center; background: #ED1E3D; border-radius: 50px; width: 50px; height: 50px; color: #ffffff;}
.offerte-aanvraag .offerte-block .block.list.werkwijze .item:nth-child(1) .number span:before { content: "1";}
.offerte-aanvraag .offerte-block .block.list.werkwijze .item:nth-child(2) .number span:before { content: "2";}
.offerte-aanvraag .offerte-block .block.list.werkwijze .item:nth-child(3) .number span { background: #009528;}
.offerte-aanvraag .offerte-block .block.list.werkwijze .item:nth-child(3) .number span:before { content: "3";}
.offerte-aanvraag .offerte-block .block.list.werkwijze .item .content h3 { font-family: 'Source Sans Pro'; font-size: 18px; font-weight: 600; color: #222222; margin-bottom: 0;}
.offerte-aanvraag .offerte-block .block.list.werkwijze .item .content .text { font-family: 'Source Sans Pro'; font-size: 18px; font-weight: 300; color: #222222;}

/*===================== ACCORDION =====================*/
.block.list.accordion { }
.block.list.accordion .card { border-radius: 0 !important; border: 1px solid #000080; color: #ED1E3D; margin-bottom: 10px;}
.block.list.accordion .card-header { padding: 0; background-color: transparent !important; box-shadow: none !important; border: 0;}
.block.list.accordion .card-header .card-title { margin-bottom: 0;}
.block.list.accordion .card-header .card-title > div { position: relative; padding: 10px 50px 10px 20px; cursor: pointer; background-color: transparent !important; box-shadow: none !important;}
.block.list.accordion .card-header .card-title div h3 { font-size: 24px; font-weight: 700; color: #000080; margin-bottom: 0;}
.block.list.accordion .card-header .icon { height: auto; transition: 0.3s; transform: rotateZ(-45deg); position: absolute; right: 25px; top: 11px; color: #ED1E3D;}
.block.list.accordion .card-header .collapsed .icon { transform: rotateZ(0deg);}
.block.list.accordion .card-header .collapsed:hover .icon { transform: rotateZ(-20deg);}
.block.list.accordion .card-body { color: #222222;}
.block.list.accordion .card-body p { color: #222222; margin: 0 0 10px 0;}


/*NIEUW OFERTE FORMULIER 2024*/
/*== formulier ==*/

.container.container-sm { max-width: 720px;}

.offerte-col { border: 1px solid #000;}
.offerte-col .offerte-big form { display: flex; flex-wrap: wrap;}

.offerte-col .offerte-big form .form-group { width: 100%;}

.offerte-col .offerte-big form .border-top { padding-top: 24px; margin-top: 12px;}
.offerte-col .offerte-big form .border-bottom { padding-bottom: 24px;}

.offerte-col .offerte-big form .nolabel label { display: none;}

.offerte-col .offerte-big form h3 { font-family: 'Eaves'; font-size: 1.125; font-weight: bold; padding-left: 15px;}
.offerte-col .offerte-big form .form_field_name { color: var(--red); font-family: 'Eaves'; font-size: 1.125; font-weight: bold;}

.offerte-col .offerte-big form h3,
.offerte-col .offerte-big form .info .form_field_name,
.offerte-col .offerte-big form .category .form_field_name { font-size: 1.3rem; color: var(--blue);}

/*===Categorie===*/
.offerte-col .offerte-big form .category .form_field_entry { display: flex; flex-wrap: wrap;}
.offerte-col .offerte-big form .category .form_field_entry label { width: 50%;}

/*===Vloer===*/
.offerte-col .offerte-big form .floor-1,
.offerte-col .offerte-big form .floor-2,
.offerte-col .offerte-big form .floor-3,
.offerte-col .offerte-big form .floor-4,
.offerte-col .offerte-big form .floor-more { visibility: hidden; display: none; height: 0; margin: 0;}

/*vloer check*/
.offerte-col .offerte-big form:has(.floor-count option[value="1"]:checked) .floor-1,
.offerte-col .offerte-big form:has(.floor-count option[value="2"]:checked) .floor-1,
.offerte-col .offerte-big form:has(.floor-count option[value="2"]:checked) .floor-2,
.offerte-col .offerte-big form:has(.floor-count option[value="3"]:checked) .floor-1,
.offerte-col .offerte-big form:has(.floor-count option[value="3"]:checked) .floor-2,
.offerte-col .offerte-big form:has(.floor-count option[value="3"]:checked) .floor-3,
.offerte-col .offerte-big form:has(.floor-count option[value="4"]:checked) .floor-1,
.offerte-col .offerte-big form:has(.floor-count option[value="4"]:checked) .floor-2,
.offerte-col .offerte-big form:has(.floor-count option[value="4"]:checked) .floor-3,
.offerte-col .offerte-big form:has(.floor-count option[value="4"]:checked) .floor-4 { visibility: visible; display: initial; height: auto; margin-bottom: 16px;}

/*Vloer meer dan... check*/
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) .floor-more { visibility: visible; display: block; height: auto;}
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) .floor-1,
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) .floor-1,
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) .floor-2,
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) .floor-1,
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) .floor-2,
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) .floor-3,
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) .floor-1,
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) .floor-2,
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) .floor-3,
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) .floor-4 { visibility: hidden; display: none; height: 0;}

/*=== metingen inpur verbergen als vloerkleed niet checked is ===*/
/*verberg wanner niet checked*/
.offerte-col .offerte-big form:not(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_1_anders"],
.offerte-col .offerte-big form:not(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_1_lengte"],
.offerte-col .offerte-big form:not(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_1_breedte"],
.offerte-col .offerte-big form:not(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_1_diameter"],
.offerte-col .offerte-big form:not(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_2_anders"],
.offerte-col .offerte-big form:not(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_2_lengte"],
.offerte-col .offerte-big form:not(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_2_breedte"],
.offerte-col .offerte-big form:not(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_2_diameter"],
.offerte-col .offerte-big form:not(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_3_anders"],
.offerte-col .offerte-big form:not(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_3_lengte"],
.offerte-col .offerte-big form:not(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_3_breedte"],
.offerte-col .offerte-big form:not(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_3_diameter"],
.offerte-col .offerte-big form:not(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_4_anders"],
.offerte-col .offerte-big form:not(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_4_lengte"],
.offerte-col .offerte-big form:not(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_4_breedte"],
.offerte-col .offerte-big form:not(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_4_diameter"],
.offerte-col .offerte-big form:not(.category input[value="Vast Tapijt"]:checked) input[name="tapijt_oppervlak"] { display: none;}

/*Has het wel checked is laten zien*/
.offerte-col .offerte-big form:has(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_1_anders"],
.offerte-col .offerte-big form:has(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_1_lengte"],
.offerte-col .offerte-big form:has(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_1_breedte"],
.offerte-col .offerte-big form:has(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_1_diameter"],
.offerte-col .offerte-big form:has(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_2_anders"],
.offerte-col .offerte-big form:has(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_2_lengte"],
.offerte-col .offerte-big form:has(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_2_breedte"],
.offerte-col .offerte-big form:has(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_2_diameter"],
.offerte-col .offerte-big form:has(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_3_anders"],
.offerte-col .offerte-big form:has(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_3_lengte"],
.offerte-col .offerte-big form:has(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_3_breedte"],
.offerte-col .offerte-big form:has(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_3_diameter"],
.offerte-col .offerte-big form:has(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_4_anders"],
.offerte-col .offerte-big form:has(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_4_lengte"],
.offerte-col .offerte-big form:has(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_4_breedte"],
.offerte-col .offerte-big form:has(.category input[value="Vloerkleed"]:checked) input[name="vloerkleed_4_diameter"],
.offerte-col .offerte-big form:has(.category input[value="Vast Tapijt"]:checked) input[name="tapijt_oppervlak"] { display: block;}


/*Bij meer dan 4 ook de velden verstoppen*/
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) input[name="vloerkleed_1_anders"],
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) input[name="vloerkleed_1_lengte"],
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) input[name="vloerkleed_1_breedte"],
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) input[name="vloerkleed_1_diameter"],
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) input[name="vloerkleed_2_anders"],
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) input[name="vloerkleed_2_lengte"],
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) input[name="vloerkleed_2_breedte"],
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) input[name="vloerkleed_2_diameter"],
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) input[name="vloerkleed_3_anders"],
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) input[name="vloerkleed_3_lengte"],
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) input[name="vloerkleed_3_breedte"],
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) input[name="vloerkleed_3_diameter"],
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) input[name="vloerkleed_4_anders"],
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) input[name="vloerkleed_4_lengte"],
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) input[name="vloerkleed_4_breedte"],
.offerte-col .offerte-big form:has(.floor-count option[value="Meer dan 4"]:checked) input[name="vloerkleed_4_diameter"] { display: none;}

/*stoffe meubel*/
.offerte-col .offerte-big form:has(.category input[value="Stoffen Meubel"]:checked) .description:has([name="beschrijving"]) { display: none;}

/*=vorm=*/
.offerte-col .offerte-big form .shape .form_field_entry { display: flex; flex-wrap: wrap;}
.offerte-col .offerte-big form .shape .form_field_entry label { width: 33%;}


/*Afbeelding*/
.offerte-col .offerte-big form .upload { display: none; visibility: hidden; height: 0;}
.offerte-col .offerte-big form:has(.category :checked) .upload { display: block; visibility: visible; height: auto;}

/*Beschrijving*/
.offerte-col .offerte-big form .description { display: none; visibility: hidden; height: 0;}
.offerte-col .offerte-big form:has(.category :checked) .description { display: block; visibility: visible; height: auto;}

/*Gegevens*/
.offerte-col .offerte-big form .info .form_field_entry { display: flex;}
.offerte-col .offerte-big form .info .form_field_entry label { width: 50%;}


/*STAPPEN*/
.block.list.steps { counter-reset: steps; row-gap: 30px;}
.block.list.steps .col { }
.block.list.steps .col .item { height: 100%; padding: 20px; background-color: var(--light-red);}
.block.list.steps .col:nth-child(odd) .item { border-bottom: 9px solid var(--blue);}
.block.list.steps .col:nth-child(even) .item { border-bottom: 9px solid var(--red);}
.block.list.steps .col .item .image img { max-width: 50px; object-fit: contain;}
.block.list.steps .col .item .counter { margin: 40px 0 25px;}
.block.list.steps .col .item .counter::after { counter-increment: steps; content: "0" counter(steps); font-size: 2.5rem; font-weight: 300; font-family: var(--primary-font); font-style: italic; color: var(--blue);}
.block.list.steps .col .item .content h3 { text-wrap: balance; font-size: 1.5625rem; color: var(--blue); font-weight: 800;}
.block.list.steps .col .item .content .text p:last-child { margin-bottom: 0;}
.block.list.steps .col .item .content .text a { color: var(--red);}

/*CONTACTBLOK*/
.block.html.img-contact-bar { position: relative; overflow: hidden;}
.block.html.img-contact-bar .image { position: relative; height: clamp(250px, 22vw, 320px); margin: 0; }
.block.html.img-contact-bar .image img { width: 100%; height: 100%; object-fit: cover; display: block;}
.block.html.img-contact-bar .image::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #1A206D 0%, rgba(26, 32, 109, 0.20) 100%); pointer-events: none; z-index: 1;}
.block.html.img-contact-bar .content { position: absolute; top: 0; left: 0; z-index: 2; height: 100%; display: flex; flex-direction: column; justify-content: center; padding: 0 60px; color: var(--white);}
.block.html.img-contact-bar .content h2 { color: var(--white); margin: 0 0 8px;}
.block.html.img-contact-bar .content .text p { margin: 0;}
.block.html.img-contact-bar .content .text p:has(.btn) { margin-top: 24px;}
.block.html.img-contact-bar .content .text .btn.btn-secondary { background-color: var(--red);}

/*============================================
		RESPONSIVE
=============================================*/
/*---------------------------------------*/
@media only screen and (max-width: 1399px) {
  .block.list.steps .col .item::after { right: 12px;}
  .block.html.img-contact-bar .content { padding: 0 48px;}
}

/*---------------------------------------*/
@media only screen and (max-width: 1199px) {
}

/*---------------------------------------*/
@media only screen and (max-width: 991px) {
  .block.list.steps .col { min-width: 50%;}
  .block.html.img-contact-bar .content h2 { font-size: 1.875rem; }
  
  div[class*="col-"]:has(+ div[class*="col-"]) { padding-right: calc(var(--bs-gutter-x) * .5); }
div[class*="col-"] + div[class*="col-"] { padding-left: calc(var(--bs-gutter-x) * .5); }
}

/*---------------------------------------*/
@media only screen and (max-width: 767px) {
  .block.list.steps .col { width: 100%; flex: 0 0 100%;}
  .block.list.steps .col .item .image img { min-height: unset; }
  .block.html.img-contact-bar .image { height: clamp(260px, 40vw, 320px);}
  .block.html.img-contact-bar .content { max-width: 100%; padding: 0 32px;}
}

/*---------------------------------------*/
@media only screen and (max-width: 575px) {
}

/*============================================
		RESPONSIVE OUD
=============================================*/

/*#Medium device
==================================================*/
@media only screen and (min-width: 1220px) and (max-width: 1480px) {
  .btn-success { padding: 15px 20px;}
  div#fieldid_5079 .form-control { width: 60%;}
  .quoteblock h5 { font-size: 20px;}
  .footer { font-size: 17px;}
  #navbarNav { position: relative; bottom: 0;}
  #navbarNav  ul.navbar-nav { }
}

/*#Tablet (Landscape )
==================================================*/
@media only screen and (min-width: 959px) and (max-width: 1220px) {
  .landing-text-img iframe { width: 100%;}
  .block.list.werkenbij .werkitem { margin-top: 0;}
  .block.list.werkenbij .werkitem .dienstverb { margin-bottom: 5px;}
  .block.list.werkenbij .werkitem p.werktext { min-height: 150px;}
}

/*Tablet (Portrait)
==================================================*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
  .header-img .textbox { bottom: -45px; left: 50px; width: 80%; padding: 20px 40px;}
  .header-img .textbox .text-layer { font-size: 30px;}
  .container-fluid.content .block.html.circle { max-width: 400px; margin: 20px auto 0 auto;}
  .block.list.werkenbij .werkitem p.werktext { min-height: 130px;}
}

/*#Mobile (Landscape)
==================================================*/
@media only screen and (min-width: 480px) and (max-width: 767px) {

}
/*Mobiel (Portrait)
==================================================*/
@media only screen and (max-width: 479px) {
  h1 { font-size: 40px; line-height: 44px; margin-top: 0; margin-bottom: 20px;}
  h2 { font-size: 30px; margin: 15px 0;}
  h3 { font-size: 22px;}
  .header-img { margin-bottom: 25px;}
  .container-fluid.breadcrumb .col-md-12 { padding: 0;}
  .block.breadcrumb { margin-left: 0;}
  .container-fluid.content > .row:nth-child(2) { }
  iframe { width: 100%;}
  .block.list.werkenbij .listitem img { padding-top: 25px;}
  .block.list.team { margin-top: 30px;}
  .block.content.center { text-align: left;}
}
