html {
scroll-behavior: smooth;
}
body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
color: #212529;
text-align: left;
background-color: #fff;
font-family: 'Open Sans', sans-serif;
font-family: 'Titillium Web', sans-serif;
}
.website-container{
/*background-image: url(/fileadmin/images/website-background/website-background-winter.jpg);
background-repeat: no-repeat;
background-position: top center;
background-color: #fff;*/
background-color: #fbfbfb;
/*background-image: none;*/
}
:root{
--mc-blue:#0242a3;
--brand:#0057A8;
--brand-dark:#003E7A;
--accent:#FF6B00;
--accent-hover:#e05e00;
--light:#F4F8FC;
--text:#1A2332;
--muted:#5A6A7A;
--white:#fff;
--mc-gray-100: #f5f6f8;
--mc-gray-200: #e8eaed;
--mc-gray-400: #9ea5b0;
--mc-gray-600: #5a6270;
--mc-gray-800: #2c3038;
--mc-gray-777: #777777;
}
*,::after,::before{box-sizing:border-box}
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&display=swap');
label{display: inline-block; margin-bottom: 0.5rem; color: #000;}
.form-group{margin-bottom: 1rem !important;}
.container-fluid {
margin-right: auto;
margin-left: auto;
padding-left: 0px;
padding-right: 0px;
}
.contentWrapper{
/* padding-top: 15px; */
padding-bottom: 15px;
}
.row {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-left: -8px;
margin-right: -8px;
}
.mb-0{margin-bottom: 0;}
.mb-1{margin-bottom: .25rem;}
.mb-2{margin-bottom: .5rem;}
.mb-25{margin-bottom: .625rem;}
.mb-3{margin-bottom: .75rem;}
.mb-4{margin-bottom: 1rem;}
.mb-5{margin-bottom: 1.25rem;}
.mb-6{margin-bottom: 1.5rem;}
.mb-7{margin-bottom: 1.75rem;}
.mb-8{margin-bottom: 2rem;}
.mb-9{margin-bottom: 3rem;}
.mb-10{margin-bottom: 4rem;}
img{max-width: 100%;}
.main img{display: block; max-width: 100%;}
.frame-indent{margin: 0 10px !important;}
.frame-space-before-extra-small{margin-top: 8px !important; margin-top: 4px !important;}
.frame-space-before-small{margin-bottom: 16px !important;}
.frame-space-after-extra-small{margin-bottom: 8px !important; margin-bottom: 10px !important;}
.frame-space-after-small{margin-bottom: 16px !important; margin-bottom: 5px !important; margin-bottom: 14px !important;}
.powermail_form h3{display: none;}
.powermail_legend{display: none;}
.powermail_fieldset{border: none; padding: 0; margin: 0;}
.powermail_fieldset .col-md-6{padding: 0px 0px; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
.control-label{-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
/*.frame-layout-3 .powermail_fieldset{margin-left: -10px;}*/
#powermail_field_vragenopmerkingen{height: 100%; width: 50%;}
.navbar-dark .navbar-nav .nav-link{
font-weight: 600;
font-size: 17px;
font-size: 18px; /*Nav font-wijziging */
}
/* Code om dropdown in menu open te laten klappen zonder te klikken, dus door te 'hoveren / hover'.
.dropdown:hover .dropdown-menu{
display: block;
}
.dropdown-menu{
margin-top: 0;
}*/
.dropdown-menu, .dropdown{
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.pagetitle{
color: #0242a3;
font-size: 1.125rem;
padding: 2px;
}
h1.title{
background-color: #0242a3 !important;
border-top: none;
padding: 0 15px;
}
h2.txteh{
color: #0242a3;
font-size: 1.125rem;
padding: 0 !important;
font-weight: 600 !important;
}
h2.txteh strong{font-weight: 600 !important;}
h3.txteh{
color: #0242a3;
font-size: 1.125rem;
}
a{
text-decoration: none;
}
a.rood{
color: #de0e1c;
text-decoration: none;
}
p.groen{
margin: 0px 15px;
line-height: 22px;
}
p.zwart{
margin: 0px 15px;
}
h2.zwart {
margin-left: -15px;
}
li.liloc{
list-style-image: url('/fileadmin/images/layout/green-icon.png');
margin-left: -15px;
font-size: 15px;
}
ul.airco-checkmarks{
padding-left: 25px;
overflow: hidden;
margin-bottom: 0;
}
/*
.airco-checkmarks{
margin-left: -25px;
}
*/
li.green-checkmark{
width: calc(100% / 3);
float: left;
list-style-image: url('/fileadmin/images/layout/green-icon.png');
margin-left: -15px;
margin-left: 0;
font-size: 14px;
}
li.green-checkmark-2{
width: 100%;
float: left;
list-style-image: url('/fileadmin/images/layout/green-icon.png');
margin-left: -15px;
margin-left: 0;
font-size: 14px;
}
li.disc{
margin-left: -15px;
font-size: 14px;
list-style-type: disc;
}
.nav-top{
position: relative;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: justify;
justify-content: space-between;
height: 1.875rem;
}
.nt{
float: left;
}
.telefoon{
margin-left: auto;
margin-right: auto;
}
.mail{
margin: 0px 0px 0px -35px;
padding: 4px;
}
p.nt{
color: #ffffff;
font-size: 16px;
float: left;
margin: 0px 0px 0px 5px;
line-height: 1.875rem;
}
p.Telcon {
color: transparent;
font-size: 16px;
float: left;
padding: 0px 8px 0px 12px;
line-height: 1.75rem;
}
p.ntstr {
color: transparent;
font-size: 16px;
float: left;
padding: 0px 8px 0px 12px;
line-height: 1.75rem;
}
.btn {
display: block;
font-weight: 400;
text-align: center;
white-space: nowrap;
vertical-align: top;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
border: 1px solid transparent;
padding: 0.160rem 0.300rem;
font-size: 0.84rem;
line-height: 1.5;
border-radius: 0.25rem;
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;
cursor: pointer;
}
a.btn-multicool-online-regelen{color: #fff;}
.btn-warning {
color: #212529;
background-color: #ffc107;
border: 1px solid #000000;
}
.btn-primary{
display: block;
font-weight: 700;
text-align: center;
white-space: nowrap;
vertical-align: top;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-webkit-appearance: none;
user-select: none;
border: 1px solid transparent;
padding: 0.160rem 0.300rem;
font-size: 0.9375rem;
line-height: 1.5;
border-radius: 0.25rem;
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;
min-width: 140px;
height: 45px;
background-color: #f38800;
background-color: #00b900 !important;
color: #FFF;
cursor: pointer;
font-size: 15px !important;
font-weight: 400;
padding: .375rem .75rem !important;
min-width: auto;
height: auto;
}
.btn-primary:hover{
background-color: #00AC00 !important;
}
.btn-telefoon{
background-color: #0242a3 !important;
}
.btn-telefoon:hover{
background-color: #003596 !important;
}
.btn-garantie:hover{
background-color: #AF955F !important;
}
.btn-interesse{
background-color: #ff6600 !important;
transition: background-color 0.3s ease; /* Smooth transition */
margin: 0 auto;
background-color: #0090e3 !important;
}
.btn-interesse:hover {
background-color: #ff751a !important; /* 10% lighter */
background-color: #33a9ec !important; /* 10% lighter */
}
.btn-offerte{
background-color: #3dc3d2 !important;
}
.btn-offerte-aanvragen-side{
background-color: #ff6600 !important;
background-color: #0090e3 !important;
}
.btn-offerte-aanvragen-side:hover{
background-color: #ff6e1a !important; /* 2% lighter */
background-color: #33ACEF !important;
}
.aanvragen{width:100%;}
.gratis-offerte-aanvragen{
font-size: 20px;
padding: 0.75rem;
height: auto;
width: 100%;
margin: 0 auto;
border-radius: 0;
}
.sidebar .gratis-offerte-aanvragen, .sidebar-ldp .gratis-offerte-aanvragen{
height: 60px;
font-size: 18px !important;
font-weight: 600;
}
.telefoon-icon{margin-right:15px; font-size:22px; line-height: 27px imp !important; vertical-align: middle;}
.btn-cta-lp .telefoon-icon{font-size: 18px;}
.btn-garantie{
background-color: #9f8857 !important;
display: flex;
align-items: center;
justify-content: center;
transition: background-color 0.3s ease;
margin: 16px auto 0px auto;
}
.vijfjrgarimg{
max-height: 100%;
display: inline-block;
margin-right: 15px;
max-width: 100%;
height: auto;
display: block;
max-height: 60px;
}
.vijfjrgartxt{
display: inline-block;
line-height: 28px;
max-height: 100%;
display: flex;
align-items: center;
}
.garantie-icon-in-image-right{
position: absolute;
left: 82%;
top: 50%;
transform: translate(-50%, -50%);
max-height: 70px;
}
#expandContentGarantie p {
text-align: center;
}
.garantie-icon-in-image-left{
position: absolute;
left: 30%;
top: 35%;
transform: translate(-40%, -50%);
max-height: 70px;
}
.btn-warning:hover {
color: #212529;
background-color: #e0a800;
border-color: #d39e00;
}
.btn-warning:focus, .btn-warning.focus {
box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
}
input[value="Bestelling verzenden"]{
background-color: #f38800;
}
.mrtp{
margin-top: -4px;
}
.stretched-link::after{
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
pointer-events: auto;
content: "";
background-color: rgba(0, 0, 0, 0);
}
h1, h2, h3, h4, h5, h6 {
margin-top: 0;
margin-bottom: 0px;
color: #FFFFFF;
}
h1 {
margin-left: 0px;
margin-right: 0px;
line-height: 1.875rem;
font-size: 17px;
color: #0242a3;
color: #777777;
color: #fff;
}
h2 {
font-size: 18px;
margin-bottom: 0rem !important;
color: #0242a3;
font-weight: 600;
color: #000;
font-size: 14px;
font-size: 15px; /*Nav font wijziging */
line-height: normal;
font-size: 16px;
line-height: 1.3;
}
h2 strong{
font-weight: 600 !important;
}
.frame-layout-3 h2{
font-size: 15px;
}
h5 {
color: #000000;
background-color: transparent;
font-size: 18px;
font-weight: bold;
}
h5.card-title-ft{
font-size: 1.0625rem;
}
h6.footer-text{
font-size: 0.875rem;
font-weight: 400;
margin-bottom: 0rem !important;
}
ol,
ul,
dl {
margin-top: 0;
margin-bottom: 1rem;
list-style-type: none;
margin-bottom: 10px;
}
li{
list-style-type:none;
}
ol ol,
ul ul,
ol ul,
ul ol {
margin-bottom: 0;
list-style-type: none;
}
a {
color: #0242a3;
}
p a {
font-weight: 600;
font-style: italic;
}
.footer p a{
font-weight: 400;
font-style: normal;
}
p {
line-height: 1.3;
font-size: 14px;
margin: auto;
margin-bottom: 10px;
font-size: 15px; /*Nav font wijziging */
font-size: 16px;
}
.frame-layout-1 li{
font-size: 15px;
list-style-type: disc;
}
.frame-layout-1 li a:hover{
text-decoration: underline;
}
p.card-ft{
font-size: 0.875rem;
padding: 1.1875rem 1.1875rem 0.625rem;
}
p.liniaal{
margin: 50px;
}
a:visited, a:link, a:active{
text-decoration: none;
}
a li a:hover {
background: red;
}
div.card-footer-ft{
font-size: 0.875rem;
}
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col,
.col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm,
.col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md,
.col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg,
.col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl,
.col-xl-auto {
position: relative;
width: 100%;
min-height: 0px;
margin-top: 0px;
}
.top-header{
height: 1.875rem;
background-color: #0090e3;
background-color: #efefef;
}
.thirdHeader{
height: 1.875rem;
background-color: #0242a3;
}
.footersec{
border-top: 1px solid #808080;
background-color:#0242a3 !important;
padding: 30px 0px;
}
.centerdiv{
max-width: 1920px;
margin: 0px auto;
}
.contentContainer{
overflow: auto;
}
.block{
float: left;
}
.klantenservicesec{
float: left;
margin-left: 5% !important;
width: 22% !important;
min-width: 22% !important;
}
.socialsec{
float: left;
width: 14% !important;
min-width: 14% !important;
}
.modellensec{
float: left;
width: 15% !important;
min-width: 15% !important;
}
.geenideesec{
float: left;
width: 13% !important;
min-width: 13% !important;
}
.contactsec{
float: left;
width: 19% !important;
min-width: 19% !important;
}
.container {
width: 100%;
padding-left: 8px;
padding-right: 8px;
margin-left: auto;
margin-right: auto;
}
.sidebar .frame-space-after-small{
margin-bottom: 8px !important;
margin-bottom: 10px !important;
}
.homeslider{
margin: 0px auto;
width: 100%;
background-color: #FFFFFF;
}
.text-center {
text-align: center !important;
}
.page-title{
background-color: #ffffff;
/*max-width: 1280px; Verwijderd na blauw maken page-title*/
margin: 0 auto;
padding: 6px 0px;
background-color: #ebebeb;
background-color: #fbfbfb;
background-color: #0090e3;
}
.pt-3,
.py-3 {
padding-top:1rem!important;
}
.pr-3,
.px-3 {
padding-right:1rem!important
}
.pb-3,
.py-3 {
padding-bottom:1rem!important
}
.subFooter {
margin: 0px auto;
background: #0242a3;
padding: 40px;
border-top: 1px solid #FFFFFF;
}
.footerdiv{
/*width: 1200px;*/
margin: 0 auto;
overflow: hidden;
}
.footerlinks{
padding-bottom: 30px;
}
.footercopyright{
text-align: center;
}
.footer-copyright{
border-top: 0px solid;
color:rgba(255, 255, 255, 0.55);
background-color: #0090e3;
padding-top: 15px;
padding-bottom: 15px;
padding: 8px 0 10px 0;
}
.footer-align{
text-align: center !important;
}
button {
border-radius: 0;
font-family: 'Open Sans', sans-serif;
font-family: 'Titillium Web', sans-serif;
}
button:focus {
outline: 1px dotted;
outline: 5px auto -webkit-focus-ring-color;
outline: none;
box-shadow: none;
}
button:focus, button:active{
outline: none;
}
.navbar-collapse {
-ms-flex-preferred-size: 100%;
flex-basis: 100%;
-ms-flex-positive: 1;
flex-grow: 1;
-ms-flex-align: center;
align-items: center;
outline: none;
}
.navbar-expand .navbar-collapse {
display: -ms-flexbox !important;
display: flex !important;
-ms-flex-preferred-size: auto;
flex-basis: auto;
}
.navbar-nav {
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
padding-left: 0;
margin-bottom: 0;
list-style: none;
}
.navbar-nav .nav-link {
padding-right: 0;
padding-left: 0;
}
.navbar-nav .nav-item.dropdown:hover .dropdown-menu{display: block;}
ul.navbar-nav{
align-items: center;
}
li.nav-item{
display: flex;
align-items: center;
}
.navbar-expand .navbar-nav {
-ms-flex-direction: row;
flex-direction: row;
}
.navbar-expand .navbar-nav .dropdown-menu {
position: absolute;
}
.navbar-expand .navbar-nav .nav-link {
padding-right: 0.5rem;
padding-left: 0.5rem;
}
.navbar-light .navbar-nav .nav-link {
color: rgba(0, 0, 0, 0.5);
}
.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus {
color: rgba(0, 0, 0, 0.7);
}
.navbar-light .navbar-nav .nav-link.disabled {
color: rgba(0, 0, 0, 0.3);
}
.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus {
color: rgba(255, 255, 255, 0.75);
}
.navbar-dark .navbar-nav .nav-link.disabled {
color: rgba(255, 255, 255, 0.25);
}
.ml-auto,
.mx-auto {
margin-left: auto !important;
}
.nav-tabs .nav-item {
margin-bottom: -1px;
}
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
color: #495057;
background-color: #fff;
border-color: #dee2e6 #dee2e6 #fff;
}
.nav-fill .nav-item {
-ms-flex: 1 1 auto;
flex: 1 1 auto;
text-align: center;
}
.nav-justified .nav-item {
-ms-flex-preferred-size: 0;
flex-basis: 0;
-ms-flex-positive: 1;
flex-grow: 1;
text-align: center;
}
.dropup,
.dropright,
.dropdown,
.dropleft {
position: relative;
}
.nav-link {
display: block;
padding: 0.5rem 1rem;
}
.nav-link:hover, .nav-link:focus {
text-decoration: none;
outline: none;
border: none;
}
.nav-link.disabled {
color: #6c757d;
}
.nav-tabs .nav-link {
border: 1px solid transparent;
border-top-left-radius: 0.25rem;
border-top-right-radius: 0.25rem;
}
.nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus {
border-color: #e9ecef #e9ecef #dee2e6;
}
.nav-tabs .nav-link.disabled {
color: #6c757d;
background-color: transparent;
border-color: transparent;
}
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
color: #495057;
background-color: #fff;
border-color: #dee2e6 #dee2e6 #fff;
}
.nav-pills .nav-link {
border-radius: 0.25rem;
}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
color: #fff;
background-color: #007bff;
}
.navbar-nav .nav-link {
padding-right: 0;
padding-left: 0;
}
.navbar-expand .navbar-nav .nav-link {
padding-right: 0.5rem;
padding-left: 0.5rem;
}
.navbar-light .navbar-nav .nav-link {
color: rgba(0, 0, 0, 0.5);
}
.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus {
color: rgba(0, 0, 0, 0.7);
}
.navbar-light .navbar-nav .nav-link.disabled {
color: rgba(0, 0, 0, 0.3);
}
.navbar-light .navbar-nav .show > .nav-link,
.navbar-light .navbar-nav .active > .nav-link,
.navbar-light .navbar-nav .nav-link.show,
.navbar-light .navbar-nav .nav-link.active {
color: rgba(0, 0, 0, 0.9);
}
.navbar-dark .navbar-nav .nav-link {
color: rgba(255, 255, 255, 0.5);
}
.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus {
color: rgba(255, 255, 255, 0.75);
}
.navbar-dark .navbar-nav .nav-link.disabled {
color: rgba(255, 255, 255, 0.25);
}
/* Februai 2025 - button border-color box-shadow en outline verwijderd
.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
color: #fff;
background-color: #0062cc;
border-color: #005cbf;
}
.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}
.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
color: #fff;
background-color: #545b62;
border-color: #4e555b;
}
.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
color: #fff;
background-color: #0062cc;
border-color: #005cbf;
}
.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}
.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
color: #fff;
background-color: #545b62;
border-color: #4e555b;
}
.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus,
.show > .btn-secondary.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5);
}
.btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active,
.show > .btn-success.dropdown-toggle {
color: #fff;
background-color: #1e7e34;
border-color: #1c7430;
}
.btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus,
.show > .btn-success.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
}
.btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active,
.show > .btn-info.dropdown-toggle {
color: #fff;
background-color: #117a8b;
border-color: #10707f;
}
.btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus,
.show > .btn-info.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
}
.btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active,
.show > .btn-warning.dropdown-toggle {
color: #212529;
background-color: #d39e00;
border-color: #c69500;
}
.btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus,
.show > .btn-warning.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
}
.btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active,
.show > .btn-danger.dropdown-toggle {
color: #fff;
background-color: #bd2130;
border-color: #b21f2d;
}
.btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus,
.show > .btn-danger.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
}
.btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active,
.show > .btn-light.dropdown-toggle {
color: #212529;
background-color: #dae0e5;
border-color: #d3d9df;
}
.btn-light:not(:disabled):not(.disabled):active:focus, .btn-light:not(:disabled):not(.disabled).active:focus,
.show > .btn-light.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
}
.btn-dark:not(:disabled):not(.disabled):active, .btn-dark:not(:disabled):not(.disabled).active,
.show > .btn-dark.dropdown-toggle {
color: #fff;
background-color: #1d2124;
border-color: #171a1d;
}
.btn-dark:not(:disabled):not(.disabled):active:focus, .btn-dark:not(:disabled):not(.disabled).active:focus,
.show > .btn-dark.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
}
.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle {
color: #fff;
background-color: #007bff;
border-color: #007bff;
}
.btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-primary.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}
.btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active,
.show > .btn-outline-secondary.dropdown-toggle {
color: #fff;
background-color: #6c757d;
border-color: #6c757d;
}
.btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-secondary.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5);
}
.btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active,
.show > .btn-outline-success.dropdown-toggle {
color: #fff;
background-color: #28a745;
border-color: #28a745;
}
.btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-success.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
}
.btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled).active,
.show > .btn-outline-info.dropdown-toggle {
color: #fff;
background-color: #17a2b8;
border-color: #17a2b8;
}
.btn-outline-info:not(:disabled):not(.disabled):active:focus, .btn-outline-info:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-info.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
}
.btn-outline-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:not(:disabled):not(.disabled).active,
.show > .btn-outline-warning.dropdown-toggle {
color: #212529;
background-color: #ffc107;
border-color: #ffc107;
}
*/
.dropdown-toggle::after {
display: inline-block;
width: 0;
height: 0;
margin-left: 0.255em;
vertical-align: 0.255em;
content: "";
border-top: 0.3em solid;
border-right: 0.3em solid transparent;
border-bottom: 0;
border-left: 0.3em solid transparent;
display: none !important;
}
.dropdown-toggle:empty::after {
margin-left: 0;
}
.dropup .dropdown-toggle::after {
display: inline-block;
width: 0;
height: 0;
margin-left: 0.255em;
vertical-align: 0.255em;
content: "";
border-top: 0;
border-right: 0.3em solid transparent;
border-bottom: 0.3em solid;
border-left: 0.3em solid transparent;
}
.dropup .dropdown-toggle:empty::after {
margin-left: 0;
}
.dropright .dropdown-toggle::after {
display: inline-block;
width: 0;
height: 0;
margin-left: 0.255em;
vertical-align: 0.255em;
content: "";
border-top: 0.3em solid transparent;
border-right: 0;
border-bottom: 0.3em solid transparent;
border-left: 0.3em solid;
}
.dropright .dropdown-toggle:empty::after {
margin-left: 0;
}
.dropright .dropdown-toggle::after {
vertical-align: 0;
}
.dropleft .dropdown-toggle::after {
display: inline-block;
width: 0;
height: 0;
margin-left: 0.255em;
vertical-align: 0.255em;
content: "";
}
.dropleft .dropdown-toggle::after {
display: none;
}
.dropleft .dropdown-toggle::before {
display: inline-block;
width: 0;
height: 0;
margin-right: 0.255em;
vertical-align: 0.255em;
content: "";
border-top: 0.3em solid transparent;
border-right: 0.3em solid;
border-bottom: 0.3em solid transparent;
}
.dropleft .dropdown-toggle:empty::after {
margin-left: 0;
}
.dropleft .dropdown-toggle::before {
vertical-align: 0;
}
.dropdown-menu {
position: absolute;
top: 100%;
left: 0;
z-index: 1000;
display: none;
float: left;
min-width: 10rem;
padding: 0rem 0;
margin: 0.125rem 0 0;
font-size: 1rem;
color: #212529;
text-align: left;
list-style: none;
background-color: #fff;
background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 0.25rem;
border-color: transparent;
margin: 0 !important;
background-color: #0090e3;
}
.dropdown-menu-right {
right: 0;
left: auto;
}
.dropup .dropdown-menu {
top: auto;
bottom: 100%;
margin-top: 0;
margin-bottom: 0.125rem;
}
.dropright .dropdown-menu {
top: 0;
right: auto;
left: 100%;
margin-top: 0;
margin-left: 0.125rem;
}
.dropleft .dropdown-menu {
top: 0;
right: 100%;
left: auto;
margin-top: 0;
margin-right: 0.125rem;
}
.dropdown-menu[x-placement^="top"], .dropdown-menu[x-placement^="right"], .dropdown-menu[x-placement^="bottom"], .dropdown-menu[x-placement^="left"] {
right: auto;
bottom: auto;
}
.dropdown-menu.show {
display: block;
}
.nav-tabs .dropdown-menu {
margin-top: -1px;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
/* Verwijderd op 13-12-2023 bij activeren collapse on hover
.navbar-nav .dropdown-menu {
position: static;
float: none;
}
*/
.navbar-expand .navbar-nav .dropdown-menu {
position: absolute;
}
.collapse:not(.show) {
display: none;
}
.navbar-toggler-icon {
display: inline-block;
width: 1.5em;
height: 1.5em;
vertical-align: middle;
content: "";
background: no-repeat center center;
background-size: 100% 100%;
width: 30px;
height: 30px;
}
.navbar-light .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navbar-dark .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 1.0)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.card {
border-bottom-color: #000000;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
border-bottom-style: solid;
border-bottom-width: 1px;
border-left-color: #000000;
border-left-style: solid;
border-left-width: 1px;
border-right-color: #000000;
border-right-style: solid;
border-right-width: 1px;
border-top-color: #000000;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
border-top-style: solid;
border-top-width: 1px;
box-sizing: border-box;
display: flex;
flex-basis: 0%;
flex-direction: column;
flex-grow: 1;
flex-shrink: 0;
font-size: 16px;
font-weight: 400;
line-height: 24px;
margin-bottom: 0px;
margin-left: 15px;
margin-right: 15px;
min-width: 0px;
overflow: break-word;
position: relative;
text-align: left;
width: 380px;
}
.card {
position: relative;
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
min-width: 0;
word-wrap: break-word;
background-color: #fff;
background-clip: border-box;
border: 1px solid rgba(0,0,0,.125);
border-radius: .25rem;
}
.modified-card{
display: -ms-flexbox;
display: flex;
-ms-flex: 1 0 0%;
flex: 1 0 0%;
-ms-flex-direction: column;
flex-direction: column;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 15px;
border: 1px solid;
border-radius: 4px;
}
.banner-title {
padding: 0.5rem;
margin: 0px 0px -16px 0px;
text-align: center;
}
.card-img {
width: 100%;
border-radius: calc(0.25rem - 1px);
}
.card-img-top {
display: block;
margin-left: auto;
margin-right: auto;
border-top-left-radius: calc(0.25rem - 1px);
border-top-right-radius: calc(0.25rem - 1px);
width: 100%;
}
.card-body {
-ms-flex: 1 1 auto;
flex: 1 1 auto;
padding: 0.0rem;
}
.card-title {
margin-top: 0px;
margin-bottom: 15px;
}
.card-footer {
padding: 0.0rem 1.2rem 0.625rem;
background-color: #FFFFFF;
}
.card-footer:last-child {
border-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px);
}
.border-dark {
border-color: #808080 !important;
}
.card-deck {
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
}
.card-deck .card {
margin-bottom: 15px;
}
#contact{
margin: 0px 0px;
}
#contact-singleselect-1 {
width: 353px;
height: 33px;
}
.form-control{
display: block;
width: 100%;
height: calc(1.5em + .75rem + 2px);
padding: 0.375rem 0.75rem;
font-size: 15px;
font-weight: 400;
line-height: 1.5;
color: #495057;
background-color: #fff;
background-clip: padding-box;
border: 1px solid #ced4da;
border-radius: .25rem;
transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
-webkit-text-size-adjust: 100%;
height: 35px;
border-radius: 0;
font-family: 'Open Sans', sans-serif;
font-size: 14px;
font-family: 'Titillium Web', sans-serif;
}
.input{
margin: 5px 0px;
display: inline-block;
width: 77%;
}
.interesse-formulier{
margin-top: 20px;
}
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
border-color: #52A8EC;
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.075) inset, 0 0 10px rgba(82, 168, 236, 1.0);
outline: 0 none;
}
.xxlarge{
height: 150px;
}
.actions{
margin: 10px 0px 0px 0px;
}
.navbar > .container,
.navbar > .container-fluid {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: justify;
justify-content: space-between;
}
.navbar-expand > .container,
.navbar-expand > .container-fluid {
padding-right: 0;
padding-left: 0;
}
.navbar-expand > .container,
.navbar-expand > .container-fluid {
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.navbar-toggler {
padding: 0.25rem 0.75rem;
font-size: 1.25rem;
line-height: 1;
background-color: transparent;
border: 1px solid transparent;
border-radius: 0.25rem;
font-size: 20px;
padding: 4px 12px;
}
.navbar-toggler:hover, .navbar-toggler:focus {
text-decoration: none;
}
.navbar-toggler:not(:disabled):not(.disabled) {
cursor: pointer;
}
.navbar-expand .navbar-toggler {
display: none;
}
.navbar-light .navbar-toggler {
color: rgba(0, 0, 0, 0.5);
border-color: rgba(0, 0, 0, 0.1);
}
.navbar {
position: relative;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: justify;
justify-content: space-between;
padding: .6rem 1rem;
z-index: 100;
padding: 14px 16px;
}
.wht{
border-top: 0px solid rgba(255, 255, 255, 0.5);
}
.navbar-dark .navbar-brand {
color: #fff;
padding: 0px 0px 0px 16px;
}
.navbar-dark .navbar-brand:hover, .navbar-dark .navbar-brand:focus {
color: #fff;
}
.navbar-logo img{
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
padding-left: 0;
margin-bottom: 0;
list-style: none;
}
.navbar-dark .navbar-nav .nav-link {
color: rgba(255, 255, 255, 0.5);
color: #fff;
}
.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus {
color: rgba(255, 255, 255, 0.75);
color: #fff;
color: #ff6600;
color: #efefef;
}
.navbar-dark .navbar-nav .nav-link.disabled {
color: rgba(255, 255, 255, 0.25);
}
.navbar-dark .navbar-nav .show > .nav-link,
.navbar-dark .navbar-nav .active > .nav-link,
.navbar-dark .navbar-nav .nav-link.show,
.navbar-dark .navbar-nav .nav-link.active {
color: #fff;
}
.navbar-dark .navbar-toggler {
color: rgba(255, 255, 255, 0.5);
border-color: rgba(255, 255, 255, 0.1);
color: #fff;
border-color: #fff;
margin-right: 2px;
}
.navbar-dark .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 1.0)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navbar-dark .navbar-text {
color: rgba(255, 255, 255, 0.5);
}
.navbar-dark .navbar-text a {
color: #fff;
}
.navbar-dark .navbar-text a:hover, .navbar-dark .navbar-text a:focus {
color: #fff;
}
.dropdown-item {
display: block;
padding: 0.25rem 1.5rem;
padding: 7px 1.5rem;
clear: both;
color: #0242a3;
color: #fff;
text-align: inherit;
white-space: nowrap;/*
background-color: transparent;
background-color: #e2e8f0;
background-color: #0242a3;*/
border: 0;
text-decoration: none !important;
font-size: 15px;
outline: none;
font-size: 14px;
font-size: 16px; /*Nav font-wijziging */
font-weight: 600;
font-weight: 400;
line-height: 1.6; /*Nav font-wijziging */
}
/*
.dropdown-menu .dropdown-item, .dropdown-menu .dropdown-item:hover, .dropdown-menu .dropdown-item.active{
border-bottom: 1px solid #fff;
}*/
.dropdown-item.active, .dropdown-item:active {
color: #0242a3;
color: #fff;
text-decoration: none;/*
background-color: #ffffff;
background-color: #0090e3;*/
border: 0px;
outline: none;
/*font-weight: bold;*/
/*background: #0242a3;*/
color: #ff6600;
color: #fff; /*Nav font-wijziging */
font-weight: 600; /*Nav font-wijziging */
}
.dropdown-item:hover, .dropdown-item:focus {
color: #0242a3;
color: #fff;
text-decoration: none;/*
background-color: #f0f8ff;
background-color: #0090e3;
background-color: #0242a3;*/
border: 0px;
outline: none;
color: #ff6600;
color: #000; /*Nav font-wijziging */
background-color: #efefef; /*Nav font-wijziging */
}
.dropdown-item.disabled, .dropdown-item:disabled {
color: #6c757d;
background-color: transparent;
}
.nav-tabs .nav-item {
margin-bottom: -1px;
}
.nav-fill .nav-item {
-ms-flex: 1 1 auto;
flex: 1 1 auto;
text-align: center;
}
.nav-justified .nav-item {
-ms-flex-preferred-size: 0;
flex-basis: 0;
-ms-flex-positive: 1;
flex-grow: 1;
text-align: center;
}
.nav-item, .dropdown-item{
transition: all 0.3s ease; /* Animates all properties */
}
.bg-dark {
background-color: #0242a3 !important;
}
a.bg-dark:hover, a.bg-dark:focus,
button.bg-dark:hover,
button.bg-dark:focus {
background-color: #1d2124 !important;
}
.navbar-brand {
display: inline-block;
padding-top: 0.3125rem;
padding-bottom: 0.3125rem;
margin-right: 1rem;
font-size: 1.25rem;
line-height: inherit;
white-space: nowrap;
max-height: 50px;
}
.navbar-brand:hover, .navbar-brand:focus {
text-decoration: none;
}
.navbar-light .navbar-brand {
color: rgba(0, 0, 0, 0.9);
}
.navbar-light .navbar-brand:hover, .navbar-light .navbar-brand:focus {
color: rgba(0, 0, 0, 0.9);
}
.navbar-dark .navbar-brand {
color: #fff;
padding: 0px 0px 0px 0px;
}
.navbar-dark .navbar-brand:hover, .navbar-dark .navbar-brand:focus {
color: #fff;
}
.carousel {
position: relative;
}
.carousel-inner {
position: relative;
width: 100%;
overflow: hidden;
}
.carousel .item {
width: 100%; /*slider width*/
max-height: 600px; /*slider height*/
}
.carousel .item img {
width: 100%; /*img width*/
}
.carousel-fade .carousel-item {
opacity: 0;
transition-duration: .6s;
transition-property: opacity;
}
.carousel-fade .carousel-item.active,
.carousel-fade .carousel-item-next.carousel-item-left,
.carousel-fade .carousel-item-prev.carousel-item-right {
opacity: 1;
}
.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-right {
opacity: 0;
}
.carousel-fade .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-prev {
-webkit-transform: translateX(0);
transform: translateX(0);
}
@supports ((-webkit-transform-style: preserve-3d) or (transform-style: preserve-3d)) {
.carousel-fade .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-prev {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.carousel-inner {
position: relative;
width: 100%;
overflow: hidden;
}
.carousel-item {
position: relative;
display: none;
-ms-flex-align: center;
align-items: center;
width: 100%;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-perspective: 1000px;
perspective: 1000px;
}
.carousel-item.active,
.carousel-item-next,
.carousel-item-prev {
display: block;
transition: -webkit-transform 0.6s ease;
transition: transform 0.6s ease;
transition: transform 0.6s ease, -webkit-transform 0.6s ease;
}
@media screen and (prefers-reduced-motion: reduce) {
.carousel-item.active,
.carousel-item-next,
.carousel-item-prev {
transition: none;
}
}
.carousel-item-next,
.carousel-item-prev {
position: absolute;
top: 0;
}
.carousel-item-next.carousel-item-left,
.carousel-item-prev.carousel-item-right {
-webkit-transform: translateX(0);
transform: translateX(0);
}
@supports ((-webkit-transform-style: preserve-3d) or (transform-style: preserve-3d)) {
.carousel-item-next.carousel-item-left,
.carousel-item-prev.carousel-item-right {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.carousel-item-next,
.active.carousel-item-right {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
@supports ((-webkit-transform-style: preserve-3d) or (transform-style: preserve-3d)) {
.carousel-item-next,
.active.carousel-item-right {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
.d-block {
display: block !important;
}
.w-100 {
width: 100% !important;
}
.carousel-control-prev,
.carousel-control-next {
position: absolute;
top: 0;
bottom: 0;
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: center;
justify-content: center;
width: 15%;
color: #fff;
text-align: center;
opacity: 0.5;
}
.carousel-control-prev:hover, .carousel-control-prev:focus,
.carousel-control-next:hover,
.carousel-control-next:focus {
color: #fff;
text-decoration: none;
outline: 0;
opacity: .9;
}
.carousel-control-prev {
left: 0;
}
.carousel-control-next {
right: 0;
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
display: inline-block;
width: 20px;
height: 20px;
background: transparent no-repeat center center;
background-size: 100% 100%;
}
.carousel-control-prev-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E");
}
.carousel-control-next-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E");
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
.sr-only-focusable:active, .sr-only-focusable:focus {
position: static;
width: auto;
height: auto;
overflow: visible;
clip: auto;
white-space: normal;
}
.c-color {
background-color: #FFFFFF;
background-color: #ebebeb;
}
.footer-navigatie-titel {
color: #ffffff !important;
font-size: 15px;
margin: 10px 0px 10px !important;
}
.footer-navigatie-lijst-link{
color: #ffffff !important;
font-size: 14px;
text-decoration: none !important;
}
.footer-navigatie-lijst-links{
margin-bottom: -4px;
}
.footer-navigatie-lijst-links-copy{
margin-top: 38px;
}
.footer-navigatie-lijst-links-first{
margin-top: 7px;
margin-top: 5px;
margin-bottom: -4px;
}
.footerRow .footer-navigatie-lijst-link:hover{
text-decoration: underline !important;
}
.footerRow .footer-navigatie-titel:hover{
text-decoration: none !important;
}
.co-99{
margin: 10px 0px 10px !important;
font-weight: 600;
}
#c924 li{
font-size: 14px;
line-break: 1.2;
}
#c923 p{
font-size: 14px;
line-height: 1.2;
}
#c923 h2{
font-size: 14px;
line-height: 1.2;
}
#c919 p{
font-size: 14px;
line-height: 1.2;
}
#c919 h2{
font-size: 14px;
line-height: 1.2;
}
#c920 p{
font-size: 14px;
line-height: 1.2;
}
#c920 h2{
font-size: 14px;
line-height: 1.2;
}
#c921 p{
font-size: 14px;
line-height: 1.2;
}
#c921 h2{
font-size: 14px;
line-height: 1.2;
}
#c896 p{
font-size: 11px;
line-height: 1.2;
}
#c896 h2{
font-size: 14px;
line-height: 1.2;
}
#c916 p{
font-size: 11px;
line-height: 1.2;
}
#c916 h2{
font-size: 14px;
line-height: 1.2;
}
#c916 strong{
font-size: 13px;
line-height: 1.2;
padding-bottom: 0.3rem;
font-weight: 600;
}
#c917 p{
font-size: 11px;
line-height: 1.2;
}
#c917 h2{
font-size: 14px;
line-height: 1.2;
}
#c917 strong{
font-size: 13px;
line-height: 1.2;
padding-bottom: 0.3rem;
font-weight: 600;
}
#c918 p{
font-size: 11px;
line-height: 1.2;
}
#c918 h2{
font-size: 14px;
line-height: 1.2;
}
#c918 strong{
font-size: 13px;
line-height: 1.2;
padding-bottom: 0.3rem;
font-weight: 600;
}
#c1972 p{
font-size: 11px;
line-height: 1.2;
}
#c1972 h2{
font-size: 13px;
line-height: 1.2;
padding-bottom: 0.3rem;
font-weight: bolder;
color: #404040;
}
#c1973 p{
font-size: 11px;
line-height: 1.2;
}
#c1974 p{
font-size: 11px;
line-height: 1.2;
}
#c924 .ce-uploads img{
padding-top: 0 !important;
height: auto;
}
#c924 li{
font-size: 11px;
}
#c923 p{
font-size: 11px;
line-height: 1.2;
}
.privacy-subtitle{
padding-bottom: 0.3rem;
margin: 0 !important;
}
.privacy-subtitle strong{
font-size: 13px !important;
font-weight: 600;
}
.footer p{
margin-bottom: 0;
}
.contactInfoTop{
float: right;
line-height: 30px;
font-size: 15px;
font-weight: 600;
font-weight: 400;
}
.navtop-img-tel{
margin-top: 7px;
height: 18px;
float: left;
}
.navtop-img-env{
margin-top: 8px;
height: 15px;
float: left;
}
.padded-img img{
padding: 10px;
}
.fixed-top {
position: fixed;
top: 0;
right: 0;
left: 0;
z-index: 1030;
}
.sticky {
position: fixed;
top: 0;
width: 100%
}
.sticky + .main-section {
padding-top: 65px;
}
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
position: relative;
width: 100%;
min-height: 1px;
padding-right: 8px;
padding-left: 8px;
}
.col-12 {
-webkit-box-flex: 0;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.eenPixel{
width: 1px;
float: left;
}
.radio{
font-size: 14px;
line-height: 1.5;
}
.footer{
background-color: #0242a3;
width: 100%;
padding-top: 15px;
}
.footerContainer{
width: 100%;
padding-right: 10px;
padding-left: 10px;
margin-right: auto;
margin-left: auto;
}
.footerRow{
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -10px;
margin-left: -10px;
}
.socialmediaicons{
overflow: hidden;
margin: 7px auto;
}
.txtpad{
padding: 0px 20px;
}
/*
@media (max-width: 767px){
.col-md-4{
text-align: center !important;
}
}
*/
.imgclass{
max-width: 90%;
height: auto;
}
.smi-pad{
width: 46px;
height: 46px;
padding: 8px;
float: left;
}
#c697{
margin: 0 auto;
}
/*
a[href^="tel"] {
text-decoration: none;
}*/
.bg-color{
background-color: #0242a3;
}
.btn-group{
display: none;
}
#powermail_field_uwvraag{
height: 100%;
width: 50%;
}
#powermail_field_vragenopmerkingen{
height: 100%;
width: 50%;
}
.footer-text-color{
color:#ffffff !important;
cursor: pointer;
text-decoration: none !important;
}
/*
.content-rechts{
padding-left: 10px;
padding-right: 10px;
}
*/
.aa{
max-width: 1280px;
margin: 0 auto;
padding-top: 2px;
}
p.boldtext{
color: #0242a3;
}
.ce-uploads-fileName{
color: #0242a3;
font-weight: bold;
}
.card-container{
width: 100%;
max-width: 945px;
padding-left: 10px;
padding-right: 10px;
}
.modifiied-card{
margin-bottom: 15px;
border: 1px solid;
border-radius: 4px;
}
.kaart{
padding: 0 0 0 0;
border: 1px solid #b7b7b7;
overflow: hidden;
margin-bottom: 15px;
background-color: #FFFFFF;
}
.card-border{
border: 1px solid #808080;
border-radius: 4px;
}
.links{
width: 61%;
float: left;
}
.rechts{
width: 39%;
float: left;
}
.card-titel{
margin-top: 10px;
margin-bottom: 0px;
padding-bottom: 0px;
}
h2.kaart-titel{
font-size: 13px;
text-align: center;
color: #ffffff;
background-color: transparent !important;
line-height: 30px;
border-top: 0;
}
.card-img{
display: block;
margin: 0 auto;
width: 70%;
position: relative;
}
p.card-tekst{
font-size: 15px;
margin: auto;
}
.card-footer-new-max600{
width: 100%;
font-size: 15px;
float: left;
}
.card-footer-new-min600{
margin-top: 7px;
}
.card-btn{
color: #ffffff;
background-color: #0242a3;
display: block;
text-align: center;
vertical-align: top;
user-select: none;
padding: 0px 5px;
height: 31px;
}
.btn-orange{border-radius: 0px;border: none;background-color: #f38800;}
.card-btn-top{
color: #ffffff;
background-color: #3783c7;
display: block;
text-align: center;
vertical-align: top;
user-select: none;
padding: 0px 5px;
height: 30px;
}
p.card-button{
font-size: 14px !important;
line-height: 31px;
font-weight: 500;
}
@media screen and (max-width: 599px){
.card-footer-new-min600{
display: none;
}
.imgpos{
position: unset !important;
}
.kaart{
height: 95px;
background-color: #dddfec;
}
.margin-small-pixels{
margin-bottom: 15px;
}
.card-btn-top{
background-color: #dddfec;
height: 17px;
margin-top: 15px;
}
h2.kaart-titel{
color: #000000;
line-height: 17px;
}
.gridstyle{
min-height: 805px;
}
}
@media screen and (min-width: 600px){
.kaart{
width: calc(33.333333% - 15px);
float: left;
/*min-height: 180px;*/
}
.kaart-margin{
margin-left: 22.5px;
margin-right: 22.5px;
}
.links{
width: 100%;
float: none;
}
.rechts{
width: 100%;
float: none;
}
.card-img{
display: block;
margin: 0 auto;
width: 65%;
/*height: 120px;*/
position: relative;
}
.card-footer-new-max600{
display: none;
}
.card-titel{
margin-top: 0px;
min-height: 35px;
}
h2.kaart-titel{
font-size: 1.0625rem;
font-weight: bold;
margin-bottom: 0;
}
.actie-head-layout{
background-color: #0242a3;
}
}
@media (min-width: 1024px) and (max-width: 1124px){
h2.kaart-titel{
font-size: 14px;
font-weight: bold;
margin-bottom: 0;
}
h4.kaart-titel{
font-size: 15px;
font-weight: bold;
margin-bottom: 0;
}
}
@media (min-width: 711px) and (max-width: 850px){
h2.kaart-titel{
font-size: 14px;
font-weight: bold;
margin-bottom: 0;
}
h4.kaart-titel{
font-size: 14px;
font-weight: bold;
margin-bottom: 0;
}
}
@media (min-width: 600px) and (max-width: 710px){
h2.kaart-titel{
font-size: 12px;
font-weight: normal;
margin-bottom: 0;
}
h4.kaart-titel{
font-size: 14px !important;
font-weight: normal;
margin-bottom: 0;
}
}
@media (min-width: 341px) and (max-width: 374px){h4.kaart-titel{font-size: 14px !important;}}
@media (min-width:1270px){
.kaart-x264{
min-height: 264px;
}
.kaart-img-rechts-xmarg{
margin: 35px 0;
}
.gridstyle{
min-height: 956px;
}
}
.imgpos{
width: 100%;
margin: auto;
position: absolute;
top: 0;
bottom: 0;
max-height: 120px;
}
.margin-pixels{
margin-bottom: 15px;
}
.margin-pixels strong{font-weight: 500 !important;}
.anchor {
position: relative;
}
.anchor a {
left: 0;
position: absolute;
top: -170px;
text-decoration: underline;
}
.btn-offerte-aanvragen{
width: 210px;
padding: 15px 0.3rem;
line-height: 0.9375rem;
background-color: #f38800;
}
a:visited{
text-decoration: none;
/*color: #0242a3;*/
}
.nav-link{
text-decoration: none !important;
}
.dropdown-item{color: #0242a3;color: #fff;}
li.liloc a{
color: #000000;
}
li.liloc a:hover{
text-decoration: underline;
}
p a:hover {
text-decoration: underline !important;
}
.footer-copyright p{
font-size: 14px;
line-height: 20px;
font-size: 15px;
}
.meer-informatie{
width: 45%;
float: left;
margin: 0 2.5%;
}
.offerte-aanvragen{
width: 45%;
float: left;
margin: 0 2.5%;
}
.tx-powermail{
max-width: 500px;
}
.powermail_fieldset .row{
max-width: 500px;
}
.powermail_fieldset .col-sm-10{
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.powermail_fieldset .col-sm-10 .form-control{
width: 100%;
}
/*
.form-item{
width: 100%;
float: left;
}
*/
/*
.powermail_fieldset_5 .form-item:nth-child(2){
width: 50%;
}
.powermail_fieldset_5 .form-item:nth-child(3){
width: 50%;
}
.powermail_fieldset_5 .form-item:nth-child(5){
width: 80%;
}
.powermail_fieldset_5 .form-item:nth-child(6){
width: 20%;
}
.powermail_fieldset_1 .form-item:nth-child(2){
width: 50%;
}
.powermail_fieldset_1 .form-item:nth-child(3){
width: 50%;
}
.powermail_fieldset_1 .form-item:nth-child(5){
width: 80%;
}
.powermail_fieldset_1 .form-item:nth-child(6){
width: 20%;
}
.powermail_fieldset_7 .form-item:nth-child(2){
width: 50%;
}
.powermail_fieldset_7 .form-item:nth-child(3){
width: 50%;
}
.powermail_fieldset_7 .form-item:nth-child(5){
width: 80%;
}
.powermail_fieldset_7 .form-item:nth-child(6){
width: 20%;
}
.powermail_fieldset_8 .form-item:nth-child(2){
width: 50%;
}
.powermail_fieldset_8 .form-item:nth-child(3){
width: 50%;
}
.powermail_fieldset_8 .form-item:nth-child(5){
width: 80%;
}
.powermail_fieldset_8 .form-item:nth-child(6){
width: 20%;
}
.powermail_fieldset_7 .form-item:nth-child(6){
width: 20%;
}
.powermail_fieldset_6 .form-item:nth-child(2){
width: 50%;
}
.powermail_fieldset_6 .form-item:nth-child(3){
width: 50%;
}
.powermail_fieldset_6 .form-item:nth-child(5){
width: 80%;
}
.powermail_fieldset_6 .form-item:nth-child(6){
width: 20%;
}
*/
.tx-powermail label{
line-height: 2;
font-weight: bold;
margin-bottom: 0;
font-size: 14px;
color: #777777;
}
.tx-powermail .form-group{
margin-bottom: 6px !important;
overflow: hidden;
}
@media (min-width: 1024px) and (max-width: 1280px){
.gratis-offerte-aanvragen{
font-size: 20px;
max-width: 400px;
margin: 0 auto;
}
.contactInfoTop{margin-right: 15px;}
}
@media (min-width: 1024px) and (max-width: 1280px){
.side-banner-buttons{
font-size: 18px;
}
.btn-telefoon .side-banner-buttons{
font-size: 21px;
}
}
/* default styles for extension "tx_frontend" */
.ce-align-left { text-align: left; }
.ce-align-center { text-align: center; }
.ce-align-right { text-align: right; }
.ce-table td, .ce-table th { vertical-align: top; }
.ce-textpic, .ce-image, .ce-nowrap .ce-bodytext, .ce-gallery, .ce-row, .ce-uploads li, .ce-uploads div { overflow: hidden; }
.ce-left .ce-gallery, .ce-column { float: left; margin-left:0px;}
.ce-center .ce-outer { position: relative; float: right; right: 50%; }
.ce-center .ce-inner { position: relative; float: right; right: -50%; }
.ce-right .ce-gallery { float: right; }
.ce-gallery figure { display: table; margin: 0; /*padding: 0px 10px;*/}
.ce-gallery figcaption { display: table-caption; caption-side: bottom; }
.ce-gallery img { display: block; }
.ce-gallery iframe { border-width: 0; }
.ce-border img,
.ce-border iframe {
border: 1px solid #b7b7b7 !important;
border-radius: 0px !important;
width: 100%;
height: auto;
}
.ce-intext.ce-right .ce-gallery, .ce-intext.ce-left .ce-gallery, .ce-above .ce-gallery {
margin-bottom: 0px;
}
.ce-intext.ce-right .ce-gallery { margin-left: 10px; }
.ce-intext.ce-left .ce-gallery { margin-right: 10px; }
.ce-below .ce-gallery { margin-top: 10px; }
.ce-column { margin-right: 0px; }
.ce-column:last-child { margin-right: 0px; }
.ce-row { margin-bottom: 10px; }
.ce-row:last-child { margin-bottom: 0; }
.ce-above .ce-bodytext { clear: both; }
.ce-intext.ce-left ol, .ce-intext.ce-left ul { padding-left: 40px; overflow: auto; }
/* Headline */
.ce-headline-left { text-align: left; color: #0242a3; margin: 0; font-size: 17px;}
.ce-headline-center { text-align: center; }
.ce-headline-right { text-align: right; }
/* Uploads */
.ce-uploads { margin: 0; padding: 0; }
.ce-uploads li { list-style: none outside none; margin: 1em 0; }
.ce-uploads img { float: left; padding-right: 1em; vertical-align: top; padding-top: 4px;}
.ce-uploads span { display: block; }
/* Table */
.ce-table { width: 100%; max-width: 30%; margin-left: -0.75rem;}
.ce-table th, .ce-table td { padding: 0.4em 0.75em; vertical-align: top; }
.ce-table thead th { border-bottom: 2px solid #dadada; }
.ce-table th, .ce-table td { /*border-top: 1px solid #dadada;*/ font-size: 0.875rem; line-height: 0.6rem;}
.ce-table-striped tbody tr:nth-of-type(odd) { background-color: rgba(0,0,0,.05); }
.ce-table-bordered th, .ce-table-bordered td { border: 1px solid #dadada; }
/* Space */
.frame-space-before-extra-small { margin-top: 0.9375em; }
.frame-space-before-small { margin-top: 1em; }
.frame-space-before-medium { margin-top: 0.625em; }
.frame-space-before-large { margin-top: 0.5em; }
.frame-space-before-extra-large { margin-top: 1.75em; }
.frame-space-after-extra-small { margin-bottom: 0.9375em; }
.frame-space-after-small { margin-bottom: 1.25em; }
.frame-space-after-medium { margin-bottom: 1.0em; margin-bottom: 10px !important; }
.frame-space-after-large { margin-bottom: 0.9375em !important; }
.frame-space-after-extra-large { padding: 0px 10px; overflow: hidden; }
/* Frame */
.frame-ruler-before:before { content: ''; display: block; border-top: 1px solid rgba(0,0,0,0.25); margin-bottom: 2em; }
.frame-ruler-after:after { content: ''; display: block; border-bottom: 1px solid rgba(0,0,0,0.25); margin-top: 2em; }
.frame-indent { margin-left: 10px; margin-right: 10px; overflow: hidden;}
.frame-indent-left { margin-left: 33%; }
.frame-indent-right { margin-right: 33%; }
h3 {
font-size: 15px;
line-height: 1.5;
text-align: center;
color: black;
font-size: inherit;
font-weight: 400;
background-color: transparent;
padding: 0px 20px;
}
.frame-layout-1 h3{
font-size: 14px;
line-height: 1.3;
}
h2.kaart-mobiele-airco{
background-color: #dddfec !important;
}
h4.kaart-mobiele-airco{
background-color: #dddfec !important;
}
.kaart-mobiele-airco{
background-color: #dddfec;
}
.main-buttons{
width: 100%;
}
@media (min-width: 568px) and (max-width: 1024px){
.main-buttons{
margin:0 auto;
}
}
@media (min-width: 568px) and (max-width: 767px){
.gratis-offerte-aanvragen{
max-width: 400px;
margin: 0 auto;
}
}
@media (min-width: 280px) and (max-width: 340px){
.actie-head-color{
font-size: 12px !important;
}
}
@media (max-width: 348px){
.CTAs-LP .offerte-aanvragen-lp .btn-cta-lp{
width: 100%;
max-width: 300px;
max-height: 60px;
}
}
.powermail_fieldwrap_type_text{
margin: 15px 0px;
}
.powermail_fieldwrap_type_text.layout3{
font-weight: bold;
}
.powermail_fieldwrap{
margin-bottom: 10px;
}
.btn-offerte-aanvragen{
max-width: 162px;
}
.container > h1{
font-size: 18px;
font-weight: 600;
}
.fa {
padding: 3px;
font-size: 17px;
text-align: center;
text-decoration: none;
border-radius: 50%;
height: 32px;
width: 32px;
line-height: unset;
}
.fa-facebook {
background: #3B5998;
color: #ffffff;
}
.fa-twitter {
background: #55ACEE;
color: #ffffff;
padding-left: 5px;
}
.fa-instagram{
background: #D6249F;
background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%);
color: #ffffff;
}
.fa-youtube{
background: #FF0000;
color: #ffffff;
}
.fa-envelope{
background: #000000;
color: #ffffff;
padding: 5px 4px;
color: #000;
}
.fa {
padding: 3px;
font-size: 17px;
text-align: center;
text-decoration: none;
border-radius: 50%;
height: 30px;
width: 30px;
line-height: unset;
}
.fa-facebook{
background: #000000!important;
background: #0090e3 !important;
color: #fff;
}
.fa-twitter{
background: #000000!important;
background: #0090e3 !important;
color: #fff;
padding-left: 4px;
}
.fa-instagram{
background: radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%);
background: #000000!important;
background: #0090e3 !important;
color: #fff;
}
.fa-youtube {
background: red;
background: #000000!important;
background: #0090e3 !important;
color: #fff;
}
.smi-pad .fa-envelope {
background: #000;
background: #000000!important;
background: #0090e3 !important;
color: #fff;
padding: 5px 4px;
}
.fa-facebook:hover, .fa-twitter:hover, .fa-instagram:hover, .fa-youtube:hover, .fa-envelope:hover{
background: #f38800 !important;
}
.ct{float: left; color: #ffffff;}
.ct .fa-phone-alt{margin-right: 10px;}
.ct-telefoon{margin-right: 24px;}
.ct .fa-envelope{margin-right: 10px;}
.contactInfoTop .fa-envelope{background: transparent; padding: unset;}
.home-icon-button{font-size: 17px; vertical-align: initial;}
.house-icon{
height: 20px;
width: auto;
vertical-align: middle;
}
.house-icon path {
fill: #fff; /* Default color */
transition: fill 0.3s ease; /* Smooth transition for hover effect */
}
.house-icon:hover path {
fill: #efefef; /* Hover color */
}
.go-to-button path{
fill: #fff;
stroke: #fff;
stroke-width: 20px;
}
h2.h2-intro-tekst{
line-height: 18px;
margin-bottom: 8px !important;
font-weight: 600;
font-size: 15px; /*Nav font wijziging */
font-size: 16px;
line-height: 1.3;
}
.card-online-regelen{background-color: #fff; margin-bottom: 16px; margin-left: 0; margin-right: 0; margin-top: 0; width: auto; background-color: #e2e8f0;}
.card .card-online-regelen{
position: relative;
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
min-width: 0;
word-wrap: break-word;
background-color: #fff;
background-clip: border-box;
border: 1px solid rgba(0,0,0,.125);
border-radius: .25rem;
}
.card-body{
-ms-flex: 1 1 auto;
flex: 1 1 auto;
min-height: 1px;
padding: 1.25rem;
padding: 0.7rem;
}
h3.online-regelen{
color: #0099cc;
text-align: center;
font-size: 16px !important;
font-weight: 400;
padding: 0;
color: #000;
font-weight: 600;
color: #f59c1a;
color: #777777;
color: #000;
}
.card-online-regelen .card-text{
text-align: center;
height: 54px;
color: #000;
}
.btn{
display: inline-block;
text-align: center;
vertical-align: middle;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-color: transparent;
border: 1px solid transparent;
padding: .375rem .75rem;
font-size: 1rem;
line-height: 1.5;
border-radius: .25rem;
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
font-family: 'Open Sans', sans-serif;
font-family: 'Titillium Web', sans-serif;
}
.powermail_fieldwrap .btn-primary{
font-size: 16px !important;
font-weight: 600;
width: 100%;
max-width: 200px;
height: 42px;
border-radius: .5rem;
}
.btn-multicool-online-regelen{
color: #fff;
background-color: #007bff;
border-color: #007bff;
display: block;
margin: 0 auto;
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
font-size: 14px;
font-weight: 600;
}
.btn-multicool-online-regelen:hover{
background-color: #0069d9; border-color: #0069d9;
}
.btn-cta{
background-color: #ff6601;
color: #FFF;
cursor: pointer;
font-size: 15px !important;
font-weight: 400;
padding: 0.375rem 0.75rem !important;
min-width: auto;
height: auto;
}
.CTAs-LP{
margin: 20px 0 !important;
}
.CTAs-LP .offerte-aanvragen-lp{
text-align: center;
}
.btn-cta-lp{
width: 300px;
height: 60px;
border-radius: 0;
font-size: 18px !important;
font-weight: 600;
height: 42px; /* Aanpassing n.a.v. rebrand mid jan 25 */
font-size: 16px !important; /* Aanpassing n.a.v. rebrand mid jan 25 */
border-radius: .5rem; /* Aanpassing n.a.v. rebrand mid jan 25 */
}
.CTA-LP-btn-align > a > div, .CTA-LP-btn-align > a > button, .CTA-LP-btn-align > a > img{
margin: 0 auto;
}
.main-lp .top-image{
margin-bottom: 10px;
}
.hybride-warmtepomp-schema{
max-width: 750px;
margin: 0px auto 10px auto;
}
.border img{
border: none !important;
border-radius: 0px !important;
}
.ldp-h2{font-size:17px;color:#000;font-weight: 600;font-size: 14px;}
h2.margin-pixels{font-size:17px;color:#000000;font-weight: 600; line-height: 1.3; font-size: 14px; font-weight: 600; line-height: normal; color: #000; margin-bottom: 5px !important;}
h4.kaart-titel{font-size:16px;text-align:center;color:#ffffff;background-color:transparent !important;line-height:30px;border-top: 0;font-weight: 600;}
.col-1 {
-ms-flex: 0 0 8.333333%;
flex: 0 0 8.333333%;
max-width: 8.333333%;
}
.col-2 {
-ms-flex: 0 0 16.666667%;
flex: 0 0 16.666667%;
max-width: 16.666667%;
}
.col-3 {
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
}
.col-4 {
-ms-flex: 0 0 33.333333%;
flex: 0 0 33.333333%;
max-width: 33.333333%;
}
.col-5 {
-ms-flex: 0 0 41.666667%;
flex: 0 0 41.666667%;
max-width: 41.666667%;
}
.col-6 {
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
}
.col-7 {
-ms-flex: 0 0 58.333333%;
flex: 0 0 58.333333%;
max-width: 58.333333%;
}
.col-8 {
-ms-flex: 0 0 66.666667%;
flex: 0 0 66.666667%;
max-width: 66.666667%;
}
.col-9 {
-ms-flex: 0 0 75%;
flex: 0 0 75%;
max-width: 75%;
}
.col-10 {
-ms-flex: 0 0 83.333333%;
flex: 0 0 83.333333%;
max-width: 83.333333%;
}
.col-11 {
-ms-flex: 0 0 91.666667%;
flex: 0 0 91.666667%;
max-width: 91.666667%;
}
.col-12 {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
@media (min-width: 576px) {
.col-sm {
-ms-flex-preferred-size: 0;
flex-basis: 0;
-ms-flex-positive: 1;
flex-grow: 1;
min-width: 0;
max-width: 100%;
}
.col-sm-1 {
-ms-flex: 0 0 8.333333%;
flex: 0 0 8.333333%;
max-width: 8.333333%;
}
.col-sm-2 {
-ms-flex: 0 0 16.666667%;
flex: 0 0 16.666667%;
max-width: 16.666667%;
}
.col-sm-3 {
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
}
.col-sm-4 {
-ms-flex: 0 0 33.333333%;
flex: 0 0 33.333333%;
max-width: 33.333333%;
}
.col-sm-5 {
-ms-flex: 0 0 41.666667%;
flex: 0 0 41.666667%;
max-width: 41.666667%;
}
.col-sm-6 {
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
}
.col-sm-7 {
-ms-flex: 0 0 58.333333%;
flex: 0 0 58.333333%;
max-width: 58.333333%;
}
.col-sm-8 {
-ms-flex: 0 0 66.666667%;
flex: 0 0 66.666667%;
max-width: 66.666667%;
}
.col-sm-9 {
-ms-flex: 0 0 75%;
flex: 0 0 75%;
max-width: 75%;
}
.col-sm-10 {
-ms-flex: 0 0 83.333333%;
flex: 0 0 83.333333%;
max-width: 83.333333%;
}
.col-sm-11 {
-ms-flex: 0 0 91.666667%;
flex: 0 0 91.666667%;
max-width: 91.666667%;
}
.col-sm-12 {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.flex-sm-row{flex-direction:row!important}
}
@media (min-width: 768px) {
.col-md {
-ms-flex-preferred-size: 0;
flex-basis: 0;
-ms-flex-positive: 1;
flex-grow: 1;
min-width: 0;
max-width: 100%;
}
.col-md-1 {
-ms-flex: 0 0 8.333333%;
flex: 0 0 8.333333%;
max-width: 8.333333%;
}
.col-md-2 {
-ms-flex: 0 0 16.666667%;
flex: 0 0 16.666667%;
max-width: 16.666667%;
}
.col-md-3 {
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
}
.col-md-4 {
-ms-flex: 0 0 33.333333%;
flex: 0 0 33.333333%;
max-width: 33.333333%;
}
.col-md-5 {
-ms-flex: 0 0 41.666667%;
flex: 0 0 41.666667%;
max-width: 41.666667%;
}
.col-md-6 {
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
}
.col-md-7 {
-ms-flex: 0 0 58.333333%;
flex: 0 0 58.333333%;
max-width: 58.333333%;
}
.col-md-8 {
-ms-flex: 0 0 66.666667%;
flex: 0 0 66.666667%;
max-width: 66.666667%;
}
.col-md-9 {
-ms-flex: 0 0 75%;
flex: 0 0 75%;
max-width: 75%;
}
.col-md-10 {
-ms-flex: 0 0 83.333333%;
flex: 0 0 83.333333%;
max-width: 83.333333%;
}
.col-md-11 {
-ms-flex: 0 0 91.666667%;
flex: 0 0 91.666667%;
max-width: 91.666667%;
}
.col-md-12 {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
}
@media (min-width: 992px) {
.col-lg {
-ms-flex-preferred-size: 0;
flex-basis: 0;
-ms-flex-positive: 1;
flex-grow: 1;
min-width: 0;
max-width: 100%;
}
.col-lg-1 {
-ms-flex: 0 0 8.333333%;
flex: 0 0 8.333333%;
max-width: 8.333333%;
}
.col-lg-2 {
-ms-flex: 0 0 16.666667%;
flex: 0 0 16.666667%;
max-width: 16.666667%;
}
.col-lg-3 {
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
}
.col-lg-4 {
-ms-flex: 0 0 33.333333%;
flex: 0 0 33.333333%;
max-width: 33.333333%;
}
.col-lg-5 {
-ms-flex: 0 0 41.666667%;
flex: 0 0 41.666667%;
max-width: 41.666667%;
}
.col-lg-6 {
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
}
.col-lg-7 {
-ms-flex: 0 0 58.333333%;
flex: 0 0 58.333333%;
max-width: 58.333333%;
}
.col-lg-8 {
-ms-flex: 0 0 66.666667%;
flex: 0 0 66.666667%;
max-width: 66.666667%;
}
.col-lg-9 {
-ms-flex: 0 0 75%;
flex: 0 0 75%;
max-width: 75%;
}
.col-lg-10 {
-ms-flex: 0 0 83.333333%;
flex: 0 0 83.333333%;
max-width: 83.333333%;
}
.col-lg-11 {
-ms-flex: 0 0 91.666667%;
flex: 0 0 91.666667%;
max-width: 91.666667%;
}
.col-lg-12 {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
}
@media (max-width: 991px){
.sidebar{
max-width: 316px;
margin: 0 auto;
display: none;
}
.gratis-offerte-aanvragen{
width: 300px;
}
.mobiele-afbeeldingen{
width: 300px;
height: auto;
margin: 0 auto;
}
.res-disno{
display: none;
}
}
.modellen{
height: 260px;
border: 1px solid #b7b7b7;
margin-bottom: 15px;
overflow: hidden;
position: relative;
background-color: #fff;
}
.card-title-model{
margin-bottom: 0px;
}
.card-title-background{
background-color: #0242a3;
}
.card-img-modellen{
width: 100%;
margin: 8px auto 0px auto;
height: 134px;
}
.iw100{
max-width: 100%;
}
.btn-meer-info{
max-width: 65%;
float: right;
}
.meer-informatie-modellen{
position: absolute;
top: 193px;
}
.meer-informatie-modellen-vloer{
position: absolute;
bottom: 0px;
}
.list-group {
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
padding-left: 0;
margin-bottom: 0;
border-radius: 0.25rem;
}
.list-group-flush {
word-break: break-word;
border-radius: 0;
padding-left: 28px;
margin-top: -10px;
}
.list-group-flush > .list-group-item {
border-width: 0 0 1px;
}
.list-group-flush > .list-group-item:last-child {
border-bottom-width: 0;
}
.list-group-item {
position: relative;
display: block;
padding: 0rem;
background-color: transparent;
}
.list-group-item:first-child {
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
.list-group-item:last-child {
border-bottom-right-radius: inherit;
border-bottom-left-radius: inherit;
}
.modellen a{
text-decoration: none;
color: inherit;
}
li.assortiment-li{
list-style-image:url('/fileadmin/images/layout/green-icon.png');
margin-left: 0px;
display: list-item;
font-size: 13px;
line-height: 18px;
}
.assortiment-meer-informatie{
border-radius: 0px;
border: none;
background-color: #f38800;
margin-bottom: -15px;
text-align: left;
}
.card-title-model h2{
font-size: 1rem;
}
.card-footer-modellen{
margin-top: 6px;
}
.card-footer-modellen p{
font-size: 13px;
text-align: left;
margin-left: 5px;
}
.powermail_fieldwrap .col-sm-2{
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.labels{width: 200px;margin:10px auto 0px auto;}
.frame-layout-2 h2{
font-size: 17px;
font-weight: 600;
color: #000;
margin-bottom: 8px !important;
}
.main-content{
max-width: 1280px;
margin: 0 auto;
background-color: #ebebeb;
background-color: #fbfbfb;
padding-top: 10px;
}
/*
.powermail_fieldset_1 .form-item:nth-child(2){width: 30%; float: left;}
.powermail_fieldset_1 .form-item:nth-child(3){width: 70%; float: left;}
.powermail_fieldset_1 .form-item:nth-child(5){width: 60%; float: left;}
.powermail_fieldset_1 .form-item:nth-child(6){width: 20%; float: left;}
.powermail_fieldset_1 .form-item:nth-child(7){width: 20%; float: left;}
.powermail_fieldset_1 .form-item:nth-child(8){width: 30%; float: left;}
.powermail_fieldset_1 .form-item:nth-child(9){width: 70%; float: left;}
.powermail_fieldset_1 .form-item:nth-child(10){width: 30%; float: left;}
.powermail_fieldset_1 .form-item:nth-child(11){width: 70%; float: left;}
.powermail_fieldset_5 .form-item:nth-child(2){width: 30%; float: left;}
.powermail_fieldset_5 .form-item:nth-child(3){width: 70%; float: left;}
.powermail_fieldset_5 .form-item:nth-child(5){width: 60%; float: left;}
.powermail_fieldset_5 .form-item:nth-child(6){width: 20%; float: left;}
.powermail_fieldset_5 .form-item:nth-child(7){width: 20%; float: left;}
.powermail_fieldset_5 .form-item:nth-child(8){width: 30%; float: left;}
.powermail_fieldset_5 .form-item:nth-child(9){width: 70%; float: left;}
.powermail_fieldset_5 .form-item:nth-child(10){width: 30%; float: left;}
.powermail_fieldset_5 .form-item:nth-child(11){width: 70%; float: left;}
.powermail_fieldset_6 .form-item:nth-child(2){width: 30%; float: left;}
.powermail_fieldset_6 .form-item:nth-child(3){width: 70%; float: left;}
.powermail_fieldset_6 .form-item:nth-child(5){width: 60%; float: left;}
.powermail_fieldset_6 .form-item:nth-child(6){width: 20%; float: left;}
.powermail_fieldset_6 .form-item:nth-child(7){width: 20%; float: left;}
.powermail_fieldset_6 .form-item:nth-child(8){width: 30%; float: left;}
.powermail_fieldset_6 .form-item:nth-child(9){width: 70%; float: left;}
.powermail_fieldset_6 .form-item:nth-child(10){width: 30%; float: left;}
.powermail_fieldset_6 .form-item:nth-child(11){width: 70%; float: left;}
.powermail_fieldset_7 .form-item:nth-child(2){width: 30%; float: left;}
.powermail_fieldset_7 .form-item:nth-child(3){width: 70%; float: left;}
.powermail_fieldset_7 .form-item:nth-child(5){width: 60%; float: left;}
.powermail_fieldset_7 .form-item:nth-child(6){width: 20%; float: left;}
.powermail_fieldset_7 .form-item:nth-child(7){width: 20%; float: left;}
.powermail_fieldset_7 .form-item:nth-child(8){width: 30%; float: left;}
.powermail_fieldset_7 .form-item:nth-child(9){width: 70%; float: left;}
.powermail_fieldset_7 .form-item:nth-child(10){width: 30%; float: left;}
.powermail_fieldset_7 .form-item:nth-child(11){width: 70%; float: left;}
.powermail_fieldset_8 .form-item:nth-child(2){width: 30%; float: left;}
.powermail_fieldset_8 .form-item:nth-child(3){width: 70%; float: left;}
.powermail_fieldset_8 .form-item:nth-child(5){width: 60%; float: left;}
.powermail_fieldset_8 .form-item:nth-child(6){width: 20%; float: left;}
.powermail_fieldset_8 .form-item:nth-child(7){width: 20%; float: left;}
.powermail_fieldset_8 .form-item:nth-child(8){width: 30%; float: left;}
.powermail_fieldset_8 .form-item:nth-child(9){width: 70%; float: left;}
.powermail_fieldset_8 .form-item:nth-child(10){width: 30%; float: left;}
.powermail_fieldset_8 .form-item:nth-child(11){width: 70%; float: left;}
.powermail_fieldset_9 .form-item:nth-child(2), .powermail_fieldset_11 .form-item:nth-child(2){width: 30%; float: left;}
.powermail_fieldset_9 .form-item:nth-child(3), .powermail_fieldset_11 .form-item:nth-child(3){width: 70%; float: left;}
.powermail_fieldset_9 .form-item:nth-child(4), .powermail_fieldset_11 .form-item:nth-child(5){width: 60%; float: left;}
.powermail_fieldset_9 .form-item:nth-child(5), .powermail_fieldset_11 .form-item:nth-child(6){width: 20%; float: left;}
.powermail_fieldset_9 .form-item:nth-child(6), .powermail_fieldset_11 .form-item:nth-child(7){width: 20%; float: left;}
.powermail_fieldset_9 .form-item:nth-child(7), .powermail_fieldset_11 .form-item:nth-child(8){width: 30%; float: left;}
.powermail_fieldset_9 .form-item:nth-child(8), .powermail_fieldset_11 .form-item:nth-child(9){width: 70%; float: left;}
.powermail_fieldset_9 .form-item:nth-child(9), .powermail_fieldset_11 .form-item:nth-child(10){width: 30%; float: left;}
.powermail_fieldset_9 .form-item:nth-child(10), .powermail_fieldset_11 .form-item:nth-child(11){width: 70%; float: left;}
.powermail_fieldset_10 .form-item:nth-child(2){width: 30%; float: left;}
.powermail_fieldset_10 .form-item:nth-child(3){width: 70%; float: left;}
.powermail_fieldset_10 .form-item:nth-child(5){width: 60%; float: left;}
.powermail_fieldset_10 .form-item:nth-child(6){width: 20%; float: left;}
.powermail_fieldset_10 .form-item:nth-child(7){width: 20%; float: left;}
.powermail_fieldset_10 .form-item:nth-child(8){width: 30%; float: left;}
.powermail_fieldset_10 .form-item:nth-child(9){width: 70%; float: left;}
.powermail_fieldset_10 .form-item:nth-child(11){width: 60%; float: left;}
.powermail_fieldset_10 .form-item:nth-child(12){width: 20%; float: left;}
.powermail_fieldset_10 .form-item:nth-child(13){width: 20%; float: left;}
.powermail_fieldset_10 .form-item:nth-child(14){width: 30%; float: left;}
.powermail_fieldset_10 .form-item:nth-child(15){width: 70%; float: left;}
.powermail_fieldset_10 .form-item:nth-child(16){width: 30%; float: left;}
.powermail_fieldset_10 .form-item:nth-child(17){width: 70%; float: left;}
.powermail_fieldset_12 .form-item:nth-child(2){width: 30%; float: left;}
.powermail_fieldset_12 .form-item:nth-child(3){width: 70%; float: left;}
.powermail_fieldset_12 .form-item:nth-child(6){width: 60%; float: left;}
.powermail_fieldset_12 .form-item:nth-child(7){width: 40%; float: left;}
.powermail_fieldset_12 .form-item:nth-child(8){width: 30%; float: left;}
.powermail_fieldset_12 .form-item:nth-child(9){width: 70%; float: left;}
.powermail_fieldset_12 .form-item:nth-child(10){width: 30%; float: left;}
.powermail_fieldset_12 .form-item:nth-child(11){width: 70%; float: left;}
.powermail_fieldset_12 .form-item:nth-child(12){width: 100%; float: left;}
*/
.powermail_fieldset textarea{height: 100%;}
.powermail_fieldwrap_oude_adresgegevens_verhuizing{font-weight: bold;}
.powermail_fieldwrap_nieuwe_adresgegevens_verhuizing{font-weight: bold;}
.powermail_fieldwrap_abonnement_meenemen_ja_nee .radio{width: 15%; float: left;}
.radio label{font-weight: normal; line-height: normal;}
.powermail_fieldset_10 .powermail_fieldwrap_type_text{margin: 0;}
.powermail_fieldwrap_type_submit{margin-top: 16px;}
#multicool-airco-main div[class*='col-'], .mc-airco-modellen div[class*='col-']{
float: left;
}
#multicool-airco-main .intro-text{
margin-bottom: 5px;
}
#multicool-airco-main .intro-text h2{
line-height: 1.3;
}
.multicool-airco-checks li{
list-style-image: url('/fileadmin/images/layout/green-icon.png');
margin-left: -15px;
font-size: 14px;
}
.foot-dorp-form h2{
font-size: 14px;
line-height: 1.3;
}
#multicool-airco-main, #multicool-airco-content, #multicool-airco-main-content {
display: block;
position: relative;
float: left;
width: 100%;
overflow: hidden;
}
#multicool-airco-main .overlay, #multicool-airco-content .overlay, #multicool-airco-main-content .overlay {
height: 50px;
width: 100%;
position: absolute;
bottom: 0;
left: 0;
background-image: -webkit-linear-gradient(rgba(255,255,255,0),#fbfbfb);
background-image: linear-gradient(rgba(255,255,255,0),#fbfbfb);
}
.desc-button {
font-size: 14px;
text-align: left;
float: left;
width: 100%;
color: #000;
position: relative;
padding: 10px 20px;
background: #fbfbfb;
margin-top: -10px;
}
.desc-button svg {
position: absolute;
top: 14px;
height: 14px;
width: 13px;
margin-left: 5px;
color: #007bff;
}
.desc-button:hover{
color: #000;
text-decoration: underline;
}
.desc-button.less svg {
transform: rotate(180deg);
}
.footer ul{
padding: 0;
margin-top: 0;
}
h5, .frame-layout-3 h3, .frame-layout-1 h3{
font-size: 14px;
font-weight: lighter;
padding-top: 14px;
margin-bottom: 0px;
color: #212529;
}
.frame-layout-3 figure.image img{
border-radius: 0.5rem;
}
.footer h5{
font-size: 15px;
font-weight: 600;
color: #fff;
margin-bottom: 15px;
line-height: 1.2;
padding-top: 0px;
font-size: 16px; /*Nav font wijziging */
}
.footer li{
font-size: 14px;
text-decoration: none;
color: #fff;
line-height: 1.6;
font-size: 15px; /*Nav font wijziging */
margin: 2px 0;
}
.footer a, .footer{
color: #fff;
}
.footer .footer-copyright p a{
color: rgba(255, 255, 255, 0.55);
}
.footer{
font-size: 14px;
}
.footer span{
font-size: 14px;
}
.footer li a:hover, .footer a:hover{
text-decoration: underline;
}
.footer .footer-main .image-embed-item{
max-width: 170px;
height: auto;
max-width: 185px;
}
.footer-place-marker{
width: 30px;
padding-left: 5px;
padding-right: 5px;
display: inline;
}
.footer-phone{
width: 30px;
padding-left: 3px;
padding-right: 5px;
display: inline;
}
.footer-mail-icon{
width: 30px;
padding-left: 1px;
padding-right: 4px;
display: inline-block;
}
.footer-afhaal-locatie{
display: block;
width: 100%;
font-size: 15px;
font-weight: 600;
}
.footer-place-adres, .footer-phone-number, .footer-mail-adres{
display: inline;
}
.footer-place-marker .fas, .footer-phone .fas, .footer-mail .fas{
font-size: 18px;
font-size: 16px;
}
.footer-item-image, .footer-locatie, .footer-telefoon, .footer-mail{
display: block;
}
.footer-afhalen, .footer-telefoon, .footer-mail{
margin-bottom: 10px;
}
.footer-main{
padding-bottom: 20px;
}
.sidebar-ldp{
max-width: 316px;
}
.image-border-radius img{
border-radius: 0.5rem;
width: 100%;
}
.justify-content-end {
justify-content: flex-end!important;
}
.usp-list-top a{
color: #fff;
color: #000;
/*color: #0242a3;*/
}
.usp-list-top a:hover{
text-decoration: underline;
}
.usp-list-top i:hover, .usp-list-top a:hover{
color: #fff;
color: #000;
/*color: #0242a3;*/
}
.usp-list-top i.fa-check{
color: #39b54a;
margin-right: 5px;
}
.usp-list-top i{
color: #39b54a;
}
.top-header .fa-envelope:hover, .top-header .fa-envelope{
background: transparent !important;
padding: 0;
}
.usp-banner-top{
display: flex;
align-self: center;
gap: 20px;
/*
margin-bottom: 0px;
margin-left: 0px;
display: flex;
list-style: none;
padding: 0px;
color: #fff;*/
}
.usp-list-top{
height: 30px;
display: flex;
align-items: center;
gap: 7px;
/*
margin-right: 2.5rem;
display: list-item;
padding: 4.6px 0px;
list-style: none;
color: #fff;
font-size: 13px;
font-size: 14px;
line-height: 30px;
height: 30px;
padding: 0;
color: #000;
color: #0242a3;
margin-right: 1.5rem;*/
}
.usp-list-top-check{
background: url(/fileadmin/images/layout/icons/white-icon.png) left center no-repeat;
padding-left: 20px;
}
/*
.usp-list-top-check:first-child{
margin-right: 1.75rem !important;
}*/
.usp-list-top:last-child{
margin-right: 0px;
}
.fa-ul{
margin-left: 0 !important;
list-style: none;
padding-left: 0;
}
.li-top-icon{
display: inline-flex;
vertical-align: middle;
margin: 0;
}
.li-top-icon path{
fill: #39b54a;
transition: fill 0.3s ease, stroke 0.3s ease;
}
.li-top-icon:hover path {
fill: #0242a3;
}
.li-top-tekst, span.li-top-tekst, .usp-list-top a span{
font-size: 14px;
line-height: 1.2;
color: #333;
display: inline-flex;
align-items: center;
margin: 0;
}
.usp-list-top a{
display: flex;
align-items: center; /* Center SVG and text in links */
gap: 7px; /* Match gap in */
text-decoration: none; /* Remove underline */
color: #333; /* Text color */
margin: 0; /* Reset any default margins */
padding: 0; /* Reset any default padding */
}
/*
/ Opmaken Onderhoud & Service pagina
*/
.onderhoud-service-ul{height: auto; margin-bottom: 10px; padding-left: 28px;}
.onderhoud-service-ul .modellen-li{font-size: 15px; line-height: 1.3; margin-bottom: 10px; margin-bottom: 5px;}
li.groen-li{list-style-image: url(/fileadmin/images/layout/icons/green-icon.png);}
li.grijs-li{list-style-image: url(/fileadmin/images/layout/icons/grey-icon.png);}
.onderhoud-service-ul .grijs-li{color: #d3d3d3;}
.onderhoud-service-desc-tekst{padding-right: 10px;}
.onderhoud-voorwaarden-ul{font-size: 13px;}
.onderhoud-voorwaarden-ul li{list-style-type: disc;}
.checkmark-ul{height: auto; margin-bottom: 10px; padding-left: 28px;}
.checkmark-ul .modellen-li{font-size: 14px; line-height: 1.3; margin-bottom: 10px; margin-bottom: 5px;}
.powermail_fieldwrap_type_check label{
font-weight: 400;
}
/*
.powermail_form_13 .powermail_fieldwrap_type_check .input-field-wrap{
float: right;
}
.powermail_fieldset_13 .form-item:nth-child(7), .powermail_fieldset_13 .form-item:nth-child(12), .powermail_fieldset_13 .form-item:nth-child(14){
width: 30%;
float: left;
}
.powermail_fieldset_13 .form-item:nth-child(8), .powermail_fieldset_13 .form-item:nth-child(13), .powermail_fieldset_13 .form-item:nth-child(15){
width: 70%;
float: left;
}
.powermail_fieldset_13 .form-item:nth-child(9){
width: 60%;
float: left;
}
.powermail_fieldset_13 .form-item:nth-child(10), .powermail_fieldset_13 .form-item:nth-child(11){
width: 20%;
float: left;
}*/
/* Outcommended sinds site updates mei 2026
.tx-powermail .powermail_fieldwrap_type_check .control-label{
-ms-flex: 0 0 75%;
flex: 0 0 75%;
max-width: 75%;
float: left;
}
.tx-powermail .powermail_fieldwrap_type_check .col-sm-10{
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
float: left;
}
*/
.form-item .powermail_fieldwrap_straat{width: 60%; float: left;}
.form-item .powermail_fieldwrap_voornaam, .form-item .powermail_fieldwrap_voorletters, .form-item .powermail_fieldwrap_postcode, .form-item .powermail_fieldwrap_telefoonnummer{width: 30%; float: left;}
.form-item .powermail_fieldwrap_naam_bedrijfsnaam, .form-item .powermail_fieldwrap_achternaam, .form-item .powermail_fieldwrap_naam, .form-item .powermail_fieldwrap_woonplaats, .form-item .powermail_fieldwrap_e_mailadres, .form-item .powermail_fieldwrap_email{width: 70%; float: left;}
.form-item .powermail_fieldwrap_toev, .form-item .powermail_fieldwrap_huisnummer, .form-item .powermail_fieldwrap_nr{width: 20%; float: left;}
/*
* Toegevoegd mei 2026 nav nieuw pagina's
*/
.powermail_fieldwrap.powermail_fieldwrap_type_input.powermail_fieldwrap_telefoonnummer{
width: 100%;
}
.powermail_fieldwrap.powermail_fieldwrap_type_input.powermail_fieldwrap_e_mailadres{
width: 100%;
}
.warmtepompboiler-img{display: flex;justify-content: center;align-items: center;}
.warmtepompboiler-img img{
margin: 16px auto;
max-height: 300px;
}
.frame-type-uploads img{
height: 150px;
width: auto;
}
.frame-type-uploads .ce-uploads-fileName{
font-size: 15px;
font-weight: 400;
}
.frame-type-uploads .ce-uploads li:nth-child(1){
margin-top: 0;
}
.airco-container-inner {
border: 1px solid #b7b7b7;
overflow: hidden;
position: relative;
margin-bottom: 16px;
}
.airco-container-inner{
container-type: inline-size;
}
.airco-item-link, .content-item-block-link {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 20;
}
.airco-item-title, .content-item-block-title {
background-color: #0242a3;
background-color: #fff;
border-bottom: 1px solid #b7b7b7;
}
.airco-item-title h2, .content-item-block-title h2 {
line-height: 30px;
font-size: 16px;
text-align: center;
color: #ffffff;
font-weight: 600;
text-align: left;
font-size: 16px;
color: #fff;
font-weight: 600;
line-height: 34px;
line-height: normal;
margin: 0 0 0 10px;
margin: 0px;
padding: 0;
position: relative;
color: #000;
padding: 5px 10px;
padding-right: 10px;
padding-right: 5px;
}
.airco-item-inner{
height: auto;
}
.airco-container-inner img {
height: 200px;
margin: 0 auto;
padding: 20px;
height: 160px;
padding: 10px;
}
.airco-item-bottom-container {
padding: 12px;
overflow: hidden;
padding-top: 0px;
}
.airco-item-bottom, .content-item-block-footer {
--bg-opacity: 1;
background-color: #e2e8f0;
background-color: rgba(226,232,240,var(--bg-opacity));
padding: .5rem;
overflow: hidden;
}
.airco-item-highlights ul, .airco-item-bottom-container ul {
padding: 0;
margin: 0;
margin-bottom: 10px;
padding: 0 5px;
}
.airco-item-highlights .item-bullet, .airco-item-bottom-container .item-bullet {
font-size: 13px !important;
line-height: 1.5;
margin: 0 0 1rem;
margin-bottom: 1rem;
font-size: .875rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
--text-opacity: 1;
color: #38a169;
color: rgba(56,161,105,var(--text-opacity));
color: #00b900;
color: rgba(0,185,0,var(--text-opacity));
color: #718096;
margin-bottom: 8px;
font-weight: 400;
width: 100%;
}
.airco-item-highlights .item-bullet::before, .airco-item-bottom-container .item-bullet::before {
width: 9px;
height: 9px;
border-radius: 9999px;
--bg-opacity: 1;
background-color: #38a169;
background-color: rgba(56,161,105,var(--bg-opacity));
background-color: #00b900;
background-color: rgba(0,185,0,var(--text-opacity));
display: inline-block;
margin-right: .5rem;
content: "";
}
.airco-item-bottom .go-to-button, .airco-item-bottom .more-info-button, .content-item-block-footer .go-to-button, .content-item-block-footer .more-info-button {
display: inline-block;
margin-right: 8px;
color: #fff;
box-shadow: none;
padding: 10px 20px;
font-weight: bold;
border-radius: 4px;
margin: 0;
line-height: 1;
cursor: pointer;
position: relative;
text-decoration: none;
overflow: visible;
}
.airco-item-bottom .go-to-button, .content-item-block-footer .go-to-button {
z-index: 31;
--bg-opacity: 1;
background-color: #718096 !important;
background-color: rgba(113,128,150,var(--bg-opacity)) !important;
background-color: #0097e0 !important;
transition: all 0.25s ease-in-out !important;
float: left;
margin-right: 8px;
line-height: 16px;
}
.airco-item-bottom .more-info-button, .content-item-block-footer .more-info-button {
z-index: 32;
display: flex;
background-color: #ff6600;
background-color: #0242a3;
color: #fff;
transition: all 0.25s ease-in-out !important;
background-color: #0097e0;
}
.airco-item-bottom .fa-li{
left: 0px;
color: #00b900;
}
.airco-item-bottom .fa-li::before{
color: #00b900;
}
.go-to-button, .airco-item-bottom-container .airco-item-bottom a.go-to-button{
display: flex;
justify-content: center;
align-items: center;
height: 100%;
}
.go-to-button:hover{
background-color: #58677D !important;
background-color: #0242a3 !important;
background-color: #0097e0 !important;
color: #ff6600;
color: #fff;
}
.more-info-button:hover{
background-color: #E64D00 !important;
background-color: #00b900 !important;
background-color: #0242a3 !important;
}
.meer-informatie-btn {
font-size: 14px;
font-weight: 600;
line-height: 16px;
font-size: 15px;
}
.meer-informatie-btn:hover{color: #ff6600;color:#fff;}
table tbody p{margin-bottom: 0px;}
table tbody tr td{font-size: 14px; line-height: 1.3;}
.clear{clear: both;}
.mc-page-main-intro{
overflow: hidden;
}
.mc-page-main-intro .frame-layout-1 h2{
font-size: 14px;
line-height: 18px;
font-weight: 600;
margin-bottom: 8px;
}
#mc-page-main-content {
display: block;
position: relative;
float: left;
width: 100%;
overflow: hidden;
}
#mc-page-main-content .overlay {
height: 50px;
width: 100%;
position: absolute;
bottom: 0;
left: 0;
background-image: -webkit-linear-gradient(rgba(255,255,255,0),#fbfbfb);
background-image: linear-gradient(rgba(255,255,255,0),#fbfbfb);
}
.top-image-mobiele-airco{
margin-bottom: 10px;
display: none;
}
.powermail_form_13 .powermail_fieldset_13 .powermail_fieldwrap_type_check .input-field-wrap{
float: right;
}
.powermail_form_13 .powermail_fieldset_13 .powermail_fieldwrap{
padding: 0 0 1px 0 !important;
margin: 0 !important;
padding-right: 16px !important;
}
.powermail_form_13 .powermail_fieldset_13 .powermail_fieldwrap_type_input{
padding: 0 16px 0 0 !important;
}
.powermail_form_13 .powermail_fieldset_13 .powermail_fieldwrap_type_submit{
margin-top: 16px !important;
}
.powermail_form_13 .powermail_fieldset_13 .powermail_fieldwrap label{
padding: 0 !important;
margin-bottom: 1px;
}
.powermail_form_13 .powermail_fieldset_13 .powermail_fieldwrap label, .powermail_form_13 .powermail_fieldset_13 .powermail_fieldwrap div.input-field-wrap{
font-size: 15px;
line-height: 1.5;
}
.os-block .blokje-text{
width: 50%;
float:left;
padding: 0 5px;
}
.os-block .blokje-button{
width: 50%;
float: left;
padding: 0 5px;
}
.card-wrapper{padding: 1rem 2rem; background-color: #efefef; border: none; margin-bottom: 16px; background-color: #fff;}
h4.card-title.card-onderhoud{color: #f59c1a; font-size: 22px; font-weight: 600; margin-bottom: 0.5rem;}
.card-onderhoud{height: auto;}
.card-text-strong{font-size: 17px; font-weight: bold; height: 85px;}
.card-text-body{height: 144px;}
.card-footer{border-radius: 0.25rem !important;}
.btn-basis{background-color: #224e84;}
.btn-service-plus{background-color: #3bbbed;}
.btn-all-in{background-color: #f59c1a;}
.onderhoud-button span{color: #ffffff; font-weight: bold;}
.onderhoud-button:hover{text-decoration: none;}
.list-group-abonnementen{height: auto !important; margin-bottom: 10px;}
.list-group-abonnementen .modellen-li{font-size: 15px; line-height: 1.3; margin-bottom: 10px; margin-bottom: 5px;}
li.grijs-li{list-style-image: url(/fileadmin/images/layout/icons/grey-icon.png);}
.list-group-abonnementen .grijs-li{color: #d3d3d3;}
.onderhoud-basis-voorwaarden{font-size: 13px;}
.card-online-regelen{
background-color: #f4f4f4;
background-color: #fff;
background-color: #e2e8f0;
border-radius: .25rem !important;
}
h3.online-regelen{
text-align: center;
font-size: 18px;
line-height: 1.5;
color: #f59c1a;
color: #777777;
color: #000;
font-size: 16px;
}
.os-block{
border-radius: 0;
border: 1px solid #b7b7b7;
}
.card-footer{
padding: .75rem 1.25rem;
background-color: rgba(0, 0, 0, .03);
border-top: 1px solid rgba(0, 0, 0, .125);
border-radius: 0.25rem;
}
@media (min-width: 300px) and (max-width: 375px){
.modellen{
height: unset;
}
.card-img-modellen{
height: 100px;
margin: 8px auto 0px auto !important;
}
.card-footer-modellen{
display: block;
height: 25px;
}
.list-group-flush{
margin-top: 0 !important;
height: 100px;
}
.vloermodel{
margin: 8px auto 0px auto !important;
}
.vloermodel .iw100{
margin: 0 0 0 14px !important;
}
}
@media (max-width: 359px){
.airco-item-title, .content-item-block-title{
height: 50px;
}
}
@media (max-width: 374px){
.airco-item-bottom .go-to-button{
display: none;
}
.home-content-item{
-ms-flex: 0 0 100% !important;
flex: 0 0 100% !important;
max-width: 100% !important;
}
.home-content-item .content-item-block-title{
height: auto;
}
}
@media (max-width: 360px) {
.top-header .usp-banner-top .usp-list-top:nth-child(2){
display: none;
}
}
@media (min-width: 375px) and (max-width: 500px){
.modellen{
height: unset;
}
.card-img-modellen{
height: 100px;
margin: 8px auto 0px auto !important;
}
.card-footer-modellen{
display: block;
height: 30px;
}
.list-group-flush{
margin-top: 0 !important;
height: 70px;
}
.vloermodel{
margin: 8px auto 0px auto !important;
}
.vloermodel .iw100{
max-width: 70% !important;
margin: 0 0 0 20px !important;
}
}
@media (max-width: 400px){
.airco-item-bottom .more-info-button, .content-item-block-footer .more-info-button{
padding: 4px !important;
}
}
@media (max-width: 420px){
.airco-item-title h2, .content-item-block-title h2{
font-size: 14px;
padding: 5px 6px;
}
}
@media (min-width: 0px) and (max-width: 575px){
.frame-layout-1{display: none;}
}
@media (max-width: 500px){
.os-block .blokje-text{
width: 100%;
}
.os-block .blokje-button{
width: 100%;
}
}
@media (max-width: 575px){
.contentWrapper{
padding-top: 2px;
}
.card-online-regelen .btn-multicool-online-regelen{
display: none;
}
.card-online-regelen h3.online-regelen{
font-size: 15px !important;
}
.card-online-regelen .card-text{
height: 54px;
margin-bottom: 0;
}
.col-xs-12 {
width: 100%;
}
.klantenservice-direct-online-regelen h3.online-regelen, .klantenservice-veel-gestelde-vragen h3.online-regelen{
text-align: left;
font-size: 15px !important;
}
.klantenservice-direct-online-regelen .card-text, .klantenservice-veel-gestelde-vragen .card-text{
margin-top: 5px;
text-align: left;
}
.footer{
text-align: center;
}
.locatie-gegevens{
width: 100%;
margin: 0 auto;
}
.footer > .ce-image, .ce-gallery, .ce-row, .ce-column, figure.image{
display: block;
width: 100%;
}
.footer-main > .container > .row > div:nth-child(2), .footer-main > .container > .row > div:nth-child(3), .footer-main > .container > .row > div:nth-child(4), .footer-main > .container > .row > div:nth-child(5){
display: none;
}
.footer img{
margin: 0 auto;
}
.locatie-gegevens div:nth-child(4){
margin-bottom: 0px;
}
.footer-place-marker, .footer-phone, .footer-mail-icon{
padding-left: 0px;
}
.footer-locatie{
margin-left: -3px;
}
.footer-phone-content{
margin-left: -2px;
}
.top-header .justify-content{
justify-content: center !important;
}
.top-header .usp-banner-top .usp-list-top:first-child{
display: none;
}
.navbar-dark .navbar-nav .nav-link{
font-size: 16px;
font-weight: 400;
font-size: 17px;
font-weight: 600;
}
.dropdown-item{
padding: 9px 1.5rem;
}
.main-section .container{
max-width: calc(100% - 16px);
}
.top-banner, .top-banner-ldp {
display: none;
}/*
.top-banner{
display: none;
}*/
.col-xs-3{
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
}
.col-xs-4{
-ms-flex: 0 0 33.33333333%;
flex: 0 0 33.33333333%;
max-width: 33.33333333%;
}
.col-xs-6{
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
}
.col-xs-12{
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.airco-item-inner{
height: auto;
}
.airco-container-inner img{
height: auto;
padding: 5px;
padding: 0px 5px;
}
.airco-item-inner-img{
display: none;
}
.airco-item-bottom-container, .content-item-block-footer-container{
padding: 6px;
}
.airco-item-highlights ul, .airco-item-bottom-container ul{
/*display: none;*/
padding: 0;
margin-bottom: 6px;
}
.airco-item-bottom .go-to-button{
/*display: none;*/
padding: 4px 8px;
margin-right: 4px;
}
.content-item-block-footer .go-to-button{
padding: 4px 6px;
margin-right: 4px;
}
.airco-item-bottom .more-info-button, .content-item-block-footer .more-info-button{
padding: 4px 5px;
}
.meer-informatie-btn{
font-size: 12px;
/*font-size: 11px;*/
}
.airco-item-bottom{
padding: 6px 6px 6px 6px;
}
.airco-item-bottom ul li:nth-child(2), .airco-item-bottom ul li:nth-child(3){
display: none;
}
.airco-item-highlights .item-bullet, .airco-item-bottom-container .item-bullet{
font-size: 11px !important;
margin-bottom: 0px;
}
.content-item-block .content-item-block-img img{
height: auto !important;
padding: 5px !important;
}
.usp-list-top-check:nth-child(2){
display: none;
}
.main-content .main{
min-height: 330px;
}
.img-2{
display: none;
}
.CTAs-LP .offerte-aanvragen-lp:nth-child(1){
margin-bottom: 10px;
}
.garantie-icon-in-image-right{
width: 50px;
}
.garantie-icon-in-image-left{
width: 50px;
}
}
@media (min-width: 576px) and (max-width: 767px){
.klantenservice-faq h3.online-regelen{
height: 56px;
}/*
.top-header .usp-banner-top .usp-list-top:nth-child(2){
display: none;
}*/
.usp-list-top-check:first-child {
margin-right: 2.5rem;
}
.airco-item-inner, .airco-item-inner-img img{
height: auto;
}
.home-card .card-body .card-text{
height: 72.8px;
}
.content-item-block-footer-container p{
height: 72px;
}
.airco-container-inner .airco-item-bottom-container .more-info-button{
padding: 10px 19px;
}
.CTAs-LP .offerte-aanvragen-lp .btn-cta-lp{
width: 100%;
height: calc(60px * 0.82);
}
.meer-informatie-btn{
font-size: 14px;
}
.card-onderhoud{height: 48px;}
.card-text-body{height: 200px;}
.onderhoud-button span{font-size: 15px;}
}
@media (min-width: 576px) and (max-width: 991px){
.footer-item{
margin-bottom: 20px;
}
.footer .footer-main > div > div > div:nth-child(4), .footer .footer-main > div > div > div:nth-child(5){
margin-top: 20px;
}
.os-block .blokje-text{
width: 100%;
}
.os-block .blokje-button{
width: 100%;
}
}
@media (min-width: 450px) and (max-width: 500px){
.list-group-flush{
height: 70px !important;
}
.card-img-modellen{
height: 120px !important;
}
.kastmodel{
width: 20% !important;
}
.list-group-abonnementen{
height: 100% !important;
}
}
/* If the container is smaller than 160px
@container (max-width: 500px) {
.airco-container-inner .airco-item-title h2 {
font-size: 11px;
}
}
*/
@media (min-width: 575px) and (max-width: 700px){
.card-img-modellen .iw100{
margin-top: 10px;
}
}
@media screen and (max-width: 450px){
.kaart-img-rechts{
width: 100%;
}
}
@media (min-width: 501px) and (max-width: 599px){
.kaart-img-rechts{
margin-top: 10px;
}
}
@media (min-width: 451px) and (max-width: 500px){
.kaart-img-rechts{
width: 85%;
margin-top: 10px;
}
}
@media (min-width: 300px) and (max-width: 375px){
.kaart-img-rechts{
margin-top: 10px;
}
}
@media (min-width: 376px) and (max-width: 450px){
.kaart-img-rechts{
margin-top: 10px;
}
}
@media (min-width: 300px) and (max-width: 575px){
.card-wrapper{
padding: 0.5rem;
}
}
@media (max-width: 517px){
.ce-table{
max-width: 53% !important;
}
}
@media (max-width: 394px){
.ce-table{
max-width: 75% !important;
}
}
@media (max-width: 375px){
.top-banner {
display: none;
}
.top-banner-mobmed{
display: none;
}
}
@media (min-width: 376px){
.top-banner-mobile{
display: none;
}
}
@media (min-width: 576px) {
.container {
max-width: 540px;
}
.card-deck {
-ms-flex-flow: row wrap;
flex-flow: row wrap;
}
.card-deck .card {
display: -ms-flexbox;
display: flex;
-ms-flex: 1 0 0%;
flex: 1 0 0%;
-ms-flex-direction: column;
flex-direction: column;
margin-right: 15px;
margin-bottom: 0;
margin-left: 15px;
max-width: 272px;
height: 315px;
}
.card-deck .card .semicard{
display: -ms-flexbox;
display: flex;
-ms-flex: 1 0 0%;
flex: 1 0 0%;
-ms-flex-direction: column;
flex-direction: column;
margin-right: 15px;
margin-bottom: 0;
margin-left: 15px;
max-width: 574px;
}
.card-deck .card {
display: -ms-flexbox;
display: flex;
-ms-flex: 1 0 0%;
flex: 1 0 0%;
-ms-flex-direction: column;
flex-direction: column;
margin-right: 15px;
margin-bottom: 0;
margin-left: 15px;
max-width: 300px !important;
}
.footerContainer {
max-width: 540px;
}
.top-header .justify-content{
justify-content: flex-end !important;
}
.top-banner-mobmed{
display: none;
}
.airco-item-inner-img-sm {
display: none;
}
.main-content .main{
min-height: 500px;
}
}
@media (min-width: 500px) and (max-width: 575px){
.modellen{
height: unset;
}
.card-img-modellen{
height: 100px;
width: 55% !important;
margin: 8px auto 0px auto !important;
}
.card-footer-modellen{
display: block;
height: 30px;
}
.list-group-flush{
margin-top: 0 !important;
height: 70px;
}
.vloermodel{
margin: 8px auto 0px auto !important;
}
.vloermodel .iw100{
max-width: 70% !important;
margin: 0 0 0 20px !important;
}
.kastmodel{
width: 14% !important;
}
.mobiele-airco{
width: 27% !important;
}
}
@media (min-width: 575px) and (max-width: 767px){
.modellen{
height: unset;
}
.card-img-modellen{
height: 100px;
width: 60% !important;
margin: 8px auto 0px auto !important;
}
.card-footer-modellen{
display: block;
height: 30px;
}
.list-group-flush{
margin-top: 0 !important;
height: 70px;
}
.vloermodel{
margin: 8px auto 0px auto !important;
}
.vloermodel .iw100{
max-width: 70% !important;
margin: 0 0 0 20px !important;
}
.kastmodel{
width: 14% !important;
}
.mobiele-airco{
width: 27% !important;
}
}
@media (max-width: 450px){
.tx-powermail .powermail_fieldwrap_type_check .control-label {
-ms-flex: 0 0 65%;
flex: 0 0 65%;
max-width: 65%;
float: left;
}
}
@media (max-width: 599px){
.card-btn{
height: 30px;
}
p.card-button{
line-height: 30px;
}
.card-footer-new-max600{
width: 82%;
margin-top: 10px !important;
margin: 0 auto;
float: none;
}
.kaart-img-rechts{
width: 70%;
margin: 0 auto;
}
.actie-head-color{
color: #ffffff !important;
line-height: 28px !important;
}
.actie-head-layout{
background-color: #0242a3;
max-height: 28px;
margin-top: 15px;
margin-left: auto;
margin-right: auto;
width: 90%;
}
}
@media (max-width: 767px){
.footermku{
text-align: center !important;
margin-bottom: 20px;
}
h1{
font-size: 16px;
text-align: left;
}
.page-title h1{
font-size: 16px !important;
line-height: 20px;
padding-top: 2px;
}
.form-control{
width: 100%;
}
.ce-table{
max-width: 40% !important;
}
.col-xs-offset-1{
margin-left: 0;
}
.btn-multicool-online-regelen{
width: 100%;
font-size: 14px;
}
.homeslider{
display: none;
}
.block {
margin-left: -20px;
margin-right: -20px;
}
p.kersttekst{
display: none;
}/*
h2.h2-intro-tekst{
font-size: 14px;
}*/
#powermail_field_uwvraag{
width: 100%;
}
#powermail_field_vragenopmerkingen{
width: 100%;
}
#c697{
margin-top: 0;
}
.footermku{
display: none;
}
h2.margin-pixels{font-size: 14px !important;}
.navbar-brand img{
width: 175px;
height: 40px;
vertical-align: bottom;
}
/*.footer-copyright{
padding: 10px 0;
}
*/
/*
h2.ldp-h2{
font-size: 14px !important;
line-height: 1.3;
}*/
.frame-layout-2 h2{
font-size: 15px !important;
font-weight: bold !important;
line-height: 1.3;
}
.page-title h1{
text-align: left;
line-height: 20px;
padding: 5px 0;
font-size: 14px;
}
}
@media (min-width: 768px){
.container {
max-width: 720px;
}
#powermail_field_uwvraag {width: 100% !important;}
#powermail_field_vragenopmerkingen{width: 100% !important;}
.parsley-errors-list{width: 70% !important;float:left !important;}
.modellen{
height: unset;
}
.card-img-modellen{
height: 100px;
width: 70% !important;
margin: 8px auto 0px auto !important;
}
.card-footer-modellen{
display: block;
height: 30px;
}
.list-group-flush{
margin-top: 0 !important;
height: 70px;
}
.modellen .list-group-flush{
margin-top: 10px !important;
}
.vloermodel{
margin: 8px auto 0px auto !important;
}
.vloermodel .iw100{
max-width: 70% !important;
margin: 0 0 0 20px !important;
}
.kastmodel{
width: 17% !important;
}
.mobiele-airco{
width: 31% !important;
}
.kanaalmodel .iw100{
margin-top: 10px;
}
.footerContainer {
max-width: 720px;
}
.col-md-6 {
-webkit-box-flex: 0;
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
}
.dubbeleAfbeelding{
max-width: 452px !important;
}
.sticky + .main-section {
padding-top: 80px;
}
}
@media (min-width: 768px) and (max-width: 900px){
.card-img-modellen .iw100{
margin-top: 10px;
}
}
@media (min-width: 768px) and (max-width: 991px){
.airco-item-highlights ul, .airco-item-bottom-container ul{
padding: 0;
}
.airco-item-inner, .airco-container-inner img{
height: auto;
}
.airco-item-bottom .go-to-button, .airco-item-bottom .more-info-button{
padding: 10px;
}
.airco-item-bottom-container{
padding: 6px;
padding-top: 0;
}
.airco-item-highlights .item-bullet, .airco-item-bottom-container .item-bullet{
font-size: 12px !important;
}
.airco-item-highlights .item-bullet::before, .airco-item-bottom-container .item-bullet::before{
margin-right: 6px;
}
.content-item-block-footer-container p{
height: 72px;
}
.content-item-block-footer .go-to-button{
padding: 7px;
}
.content-item-block-footer .more-info-button{
padding: 7px 15px;
}
}
@media (max-width: 991px){
li.green-checkmark{
width: 100%;
}
.sidebar{
max-width: 316px;
margin: 0 auto;
display: none;
}
.gratis-offerte-aanvragen{
width: 300px;
height: 60px;
font-size: 18px !important;
font-weight: 600;
}
.mobiele-afbeeldingen{
width: 300px;
height: auto;
margin: 0 auto;
}
.frame-layout-1{
display: none !important;
}
li.liloc{
font-size: 14px;
line-height: 1.3;
}
.sidebar-ldp{
margin: 0 auto;
}
.sidebarldp .content-rechts div:nth-child(1), .sidebarldp .content-rechts div:nth-child(2), .sidebar-ldp .content-rechts div:nth-child(3), .sidebar-ldp .content-rechts div:nth-child(4){
display: none;
}
.sidebar-ldp .ce-image{
margin-top: 17px;
}
.navbar-nav .nav-item{
padding: 3px 0px;
}
.navbar-dark .navbar-nav .nav-link{
color: rgba(255, 255, 255);
}
.navbar-nav .dropdown-menu{
position: static;
float: none;
}
.dropdown-item{
font-size: 17px;
}
ul.navbar-nav{
align-items: flex-start;
}
}
@media (max-width: 1199px){
h4.kaart-titel{
font-size: 14px;
}
}
@media (min-width: 992px) and (max-width: 1199px){
.disya{
width: calc(100% - 316px);
max-width: 100%;
flex: unset;
}
.disno{
width: 316px;
max-width: 100%;
flex: unset;
}
.main{
width: calc(100% - 316px);
max-width: 100%;
}
.sidebar{
width: 316px;
max-width: 100%;
}
.navbar-dark .navbar-nav .nav-link{
font-size: 14px;
}
.card-wrapper{
padding: 1rem;
}
.card-onderhoud{
height: 48px;
}
.card-text-body{
height: 200px;
}
.onderhoud-button span{
font-size: 15px;
}
.ldp-hero__intro{
margin-left: 0;
}
.werkgebied-kaart{
aspect-ratio: 1 / 1;
}
}
@media (min-width: 992px) and (max-width: 1279px){
.btn-multicool-online-regelen{
font-size: 14px;
}
}
@media (min-width: 992px){
.container {
max-width: 960px;
}
.navbar-expand-lg {
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-ms-flex-pack: start;
justify-content: flex-start;
}
.navbar-expand-lg .navbar-nav {
-ms-flex-direction: row;
flex-direction: row;
}/* Verwijderd op 13-12-2023 bij activeren collapse on hover
.navbar-expand-lg .navbar-nav .dropdown-menu {
position: absolute;
margin-top: 17px;
}*/
.navbar-expand-lg .navbar-nav .nav-link {
padding-right: 0.5rem;
padding-left: 0.5rem;
padding-top: 22.25px;
padding-bottom: 22.25px;
padding: 0 0.5rem;
display: flex;
align-items: center;
}
.navbar-expand-lg > .container,
.navbar-expand-lg > .container-fluid {
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.navbar-expand-lg .navbar-collapse {
display: -ms-flexbox !important;
display: flex !important;
-ms-flex-preferred-size: auto;
flex-basis: auto;
}
.navbar-expand-lg .navbar-toggler {
display: none;
}
.footerContainer {
max-width: 960px;
}
.disya .gratis-offerte-aanvragen{
display: none;
}
.main .gratis-offerte-aanvragen{
display: none;
}
.mobiele-afbeeldingen{display: none;}
.offset-lg-1{
margin-left: 8.3333333333%;
}
.frame-layout-2{
display: none !important;
}
.main-content .main{
min-height: 900px;
}
#myHeader{
height: 70px;
}
.full-disno{
display: none;
}
.navbar-nav li:hover > .dropdown-menu, li.nav-item:hover > .dropdown-menu{
transition: all 0.3s ease; /* Animates all properties */
}
.list-group-abonnementen{
margin-bottom: 30px;
}
ul.navbar-nav{
align-items: center;
}
}
@media (min-width: 992px) and (max-width: 1366px){
.container > h1{
font-size: 18px;
font-size: 16px;
}
}
@media (max-width: 1023px){
p.Telcon {
display: none;
}
}
@media (min-width: 1024px){
.frame-space-after-large{
display: none;
}
.main-buttons{
width: 40%;
}
.telefoon{
width: 1238px;
}
}
@media (min-width: 1200px){
.container, .container-lg, .container-md, .container-sm, .container-xl{
max-width: 1140px;
}
.col-xl-3{
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
}
.col-xl-4{
-ms-flex: 0 0 33.333333%;
flex: 0 0 33.333333%;
max-width: 33.333333%;
}
.col-xl-6{
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
}
.col-xl-7{
-ms-flex: 0 0 58.333333%;
flex: 0 0 58.333333%;
max-width: 58.333333%;
}
.col-xl-9{
-ms-flex: 0 0 75%;
flex: 0 0 75%;
max-width: 75%;
}
.footerContainer {
max-width: 1140px;
}
.sidebar-ldp{
width: 316px;
max-width: unset;
flex: unset;
}
.ldp-warmtepompen .ldp-hero__intro{
max-width: 650px;
}
}
@media (min-width: 1200px) and (max-width: 1279px){
.disya{
width: calc(100% - 316px);
max-width: 100%;
flex: unset;
}
.disno{
width: 316px;
max-width: 100%;
flex: unset;
}
.main{
width: calc(100% - 316px);
max-width: 100%;
flex: unset;
}
.sidebar{
width: 316px;
max-width: 100%;
flex: unset;
}
.sidebar-ldp{
width: 316px;
max-width: 100%;
flex: unset;
}
h4.card-title{
min-height: 48px;
}
}
@media (min-width: 1200px) and (max-width: 1366px){
.main-section{
/*max-width: 1060px;*/
margin: 0 auto;
}
.main-section .container{
margin: 0 auto;
max-width: 1044px;
}
.main-section .row {
max-width: 1044px;
/*display: block;
flex-wrap: unset;
overflow: hidden;*/
}
.main{
flex: 1;
float: left;
}
.sidebar{
width: 30%;
max-width: 30%;
flex: unset;
float: left;
}
.row-flex{
display: flex !important;
flex-wrap: wrap !important;
}
.card-online-regelen .btn-nijsink{
font-size: 14px;
}
.airco-item-bottom .go-to-button{
padding: 10px 15px;
}
.airco-item-bottom .more-info-button{
padding: 10px;
}
.navbar .container, .footer .container, .top-header .container{
max-width: 1060px;
}
.airco-item-bottom-container ul{
height: 94px;
}
.card-online-regelen .card-body{
padding: 0.7rem 2px;
}
.card-online-regelen .btn-multicool-online-regelen{
font-size: 14px;
padding: 5px;
font-weight: 400;
}
.card-online-regelen .card-text{
font-size: 13px;
line-height: 1.5;
}
.meer-informatie-btn{
font-size: 14px;
}
.navbar-dark .navbar-nav .nav-link{
font-size: 16px;
}
}
@media (min-width: 1280px) {
.container {
max-width: 1264px;
}
}
.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl{
width: 100%;
padding-left: 8px;
padding-right: 8px;
margin-left: auto;
margin-right: auto;
}
.row {
margin-left: -8px;
margin-right: -8px;
}
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto{
padding-left: 8px;
padding-right: 8px;
}
.tx-powermail .container-fluid{
padding: 0px 0px;
}
.powermail_fieldset .col-md-6{
padding: 0 16px 0 0 !important;
}
/*
#c1285 {
margin-bottom: 8px !important;
}*/
@media all and (orientation:landscape)
and (min-width : 576px)
and (max-width : 767px) {
.main p{
font-size: 13px;
}
.nav-link{
padding: 0.25rem 0rem;
}
.navbar-dark .navbar-nav .nav-link{
font-size: 14px;
}
.dropdown-item{
padding: 0.25rem 1.5rem;
font-size: 14px;
}
}
@media all and (orientation:landscape)
and (min-width: 768px)
and (max-width: 991px) {
.navbar-dark .navbar-nav .nav-link{
font-size: 14px;
}
.nav-link{
padding: 0.25rem 0rem;
}
.dropdown-item{
padding: 0.25rem 1.5rem;
font-size: 14px;
}
}
/*
* airco-ldp.css
* Aanvullende stijlen voor de Airco landingspagina (Airco-LDP.html)
* Voeg toe aan je bestaande stylesheet of include apart via TypoScript:
*
* page.includeCSS.aircoLdp = EXT:mc_site/Resources/Public/Css/airco-ldp.css
*
* Deze stijlen zijn specifiek voor de landingspagina en conflicteren
* niet met je bestaande mc_site CSS.
*/
/* ============================================================
USP BALK – onder hero banner
============================================================ */
.ldp-usp-balk {
background: #1a1a1a;
border-radius: 4px;
padding: 12px 16px;
margin-bottom: 20px;
}
.ldp-usp-lijst {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-wrap: wrap;
gap: 8px 24px;
}
.ldp-usp-item {
display: flex;
align-items: center;
gap: 7px;
color: #ffffff;
font-size: 13px;
font-weight: 500;
}
.ldp-usp-icon {
fill: #4CAF50;
flex-shrink: 0;
}
@media (max-width: 575px) {
.ldp-usp-lijst {
flex-direction: column;
gap: 6px;
}
}
/* ============================================================
FAQ SECTIE
============================================================ */
.ldp-faq {
margin-bottom: 24px;
}
.ldp-faq__title {
font-size: 20px;
font-weight: 700;
margin-bottom: 16px;
color: #1a1a1a;
}
.ldp-faq__item {
border: 1px solid #e0e0e0;
border-radius: 4px;
margin-bottom: 6px;
overflow: hidden;
background: #fff;
}
.ldp-faq__vraag {
width: 100%;
background: #f8f8f8;
border: none;
padding: 14px 16px;
text-align: left;
font-size: 14px;
font-weight: 600;
color: #1a1a1a;
cursor: pointer;
display: flex;
justify-content: space-between;
align-items: center;
gap: 12px;
transition: background 0.15s;
}
.ldp-faq__vraag:hover {
background: #f0f0f0;
}
.ldp-faq__icon {
fill: #555;
flex-shrink: 0;
transition: transform 0.2s;
}
/* Wordt niet meer gebruikt.
.ldp-faq__antwoord {
padding: 14px 16px;
font-size: 14px;
color: #444;
line-height: 1.65;
}
*/
.ldp-faq__antwoord p {
margin: 0;
}
/* expliciet zichtbaar bij open state */
.ldp-faq__item[open] .ldp-faq__antwoord {
display: block;
}
/* Open staat via JS class toggle
DIT GEBRUIKEN WE NIET MEER!
.ldp-faq__item--open .ldp-faq__antwoord {
display: block;
}
.ldp-faq__item--open .ldp-faq__icon {
transform: rotate(180deg);
}
.ldp-faq__item--open .ldp-faq__vraag {
background: #efefef;
}
*/
:root {
--mc-brand: #0057A8;
--mc-brand-dark: #003E7A;
--mc-brand-light: #EEF5FF;
--mc-brand-border: #C8DFF5;
--mc-accent: #FF6B00;
--mc-accent-hover: #E05E00;
--mc-text: #1A2332;
--mc-muted: #5A6A7E;
--mc-bg: #F5F8FC;
--mc-white: #FFFFFF;
--mc-border: #DDE8F4;
--mc-radius-sm: 8px;
--mc-radius-md: 10px;
--mc-radius: 14px;
--mc-radius-lg: 20px;
--mc-shadow-sm: 0 2px 8px rgba(0, 57, 122, 0.07);
--mc-shadow: 0 6px 24px rgba(0, 57, 122, 0.10);
--mc-shadow-lg: 0 16px 48px rgba(0, 57, 122, 0.13);
--mc-transition: 0.22s ease;
}
/* Scoped reset – alleen binnen ldp-wrapper zodat de rest van mc_site
niet wordt beïnvloed */
.ldp-wrapper *,
.ldp-wrapper *::before,
.ldp-wrapper *::after {
box-sizing: border-box;
}
.ldp-wrapper {
font-family: inherit; /* erft van mc_site body */
color: var(--mc-text);
line-height: 1.65;
}
/* ─────────────────────────────────────────────────────────────────────
2. LAYOUT WRAPPER
───────────────────────────────────────────────────────────────────── */
/* De ldp-main vervangt het .main-section / .contentWrapper blok
dat Default.html wél heeft. Hierdoor heeft de LDP volledige
controle over zijn eigen breedte en padding. */
.ldp-main {
background: var(--mc-bg);
}
/* ─────────────────────────────────────────────────────────────────────
3. HERO
───────────────────────────────────────────────────────────────────── */
.ldp-hero {
background: linear-gradient(140deg, #002D5C 0%, #003E7A 35%, #0057A8 70%, #006FCA 100%);
background: linear-gradient(140deg, #0242a3 0%, #003E7A 35%, #0057A8 70%, #006FCA 100%);
color: var(--mc-white);
padding: 72px 0 64px;
position: relative;
overflow: hidden;
/* Toegevoegd nav uitbreiding met afbeelding*/
--ldp-hero-fallback: linear-gradient(140deg, #0242a3 0%, #003E7A 35%, #0057A8 70%, #006FCA 100%);
background-color: #0242a3;
background-image:
linear-gradient(90deg, rgba(2, 66, 163, 0.92) 0%, rgba(0, 62, 122, 0.74) 48%, rgba(0, 87, 168, 0.46) 100%),
var(--ldp-hero-image-desktop, var(--ldp-hero-fallback));
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
/* Subtiele decoratieve cirkel rechtsonder */
.ldp-hero::after {
content: '';
position: absolute;
bottom: -120px;
right: -80px;
width: 420px;
height: 420px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.04);
pointer-events: none;
}
/* Location tag */
.ldp-hero__tag {
display: inline-flex;
align-items: center;
gap: 7px;
background: var(--mc-accent);
color: var(--mc-white);
font-size: 12px;
font-weight: 700;
letter-spacing: 0.6px;
text-transform: uppercase;
padding: 6px 14px;
border-radius: 30px;
margin-bottom: 20px;
}
/* H1 */
.ldp-hero__title {
font-size: clamp(30px, 4.5vw, 50px);
font-weight: 800;
line-height: 1.12;
margin-bottom: 20px;
letter-spacing: -0.5px;
}
.ldp-hero__city {
color: #7EC8FF;
}
/* Intro alinea */
.ldp-hero__intro {
font-size: 17px;
line-height: 1.65;
opacity: 0.92;
max-width: 580px;
margin-bottom: 32px;
}
.ldp_hero__intro__div{
max-width: 580px;
margin: 0 auto 32px auto;
}
.ldp_hero__intro__div p{
font-size: 17px;
line-height: 1.65;
opacity: 0.92;
}
/* CTA knoppen */
.ldp-hero__ctas {
display: flex;
flex-wrap: wrap;
gap: 12px;
margin-bottom: 28px;
}
.ldp-btn {
display: inline-flex;
align-items: center;
gap: 9px;
font-weight: 700;
font-size: 15px;
padding: 14px 26px;
border-radius: var(--mc-radius-sm);
text-decoration: none;
transition: background var(--mc-transition), transform var(--mc-transition), box-shadow var(--mc-transition);
cursor: pointer;
border: none;
white-space: nowrap;
}
.ldp-btn--accent {
background: var(--mc-accent);
color: var(--mc-white);
box-shadow: 0 4px 16px rgba(255, 107, 0, 0.35);
}
.ldp-btn--accent:hover {
background: var(--mc-accent-hover);
color: var(--mc-white);
transform: translateY(-2px);
box-shadow: 0 8px 24px rgba(255, 107, 0, 0.40);
}
.ldp-btn--ghost {
background: rgba(255, 255, 255, 0.10);
color: var(--mc-white);
border: 2px solid rgba(255, 255, 255, 0.28);
}
.ldp-btn--ghost:hover {
background: rgba(255, 255, 255, 0.18);
color: var(--mc-white);
transform: translateY(-2px);
}
/* Trust chips */
.ldp-hero__chips {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.ldp-trust-chip {
display: inline-flex;
align-items: center;
gap: 6px;
background: rgba(255, 255, 255, 0.10);
border: 1px solid rgba(255, 255, 255, 0.18);
color: var(--mc-white);
font-size: 13px;
font-weight: 500;
padding: 7px 13px;
border-radius: 30px;
}
.ldp-trust-chip svg {
fill: #7EC8FF;
flex-shrink: 0;
}
/* Hero afbeelding */
.ldp-hero__imgwrap {
position: relative;
border-radius: var(--mc-radius-lg);
overflow: hidden;
box-shadow: var(--mc-shadow-lg);
}
.ldp-hero__img {
display: block;
width: 100%;
height: 380px;
object-fit: cover;
border-radius: var(--mc-radius-lg);
}
/* Badge over de afbeelding */
.ldp-hero__imgbadge {
position: absolute;
bottom: 16px;
left: 16px;
background: var(--mc-brand-dark);
color: var(--mc-white);
font-size: 12px;
font-weight: 700;
padding: 7px 13px;
border-radius: 30px;
display: flex;
align-items: center;
gap: 6px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}
/* ─────────────────────────────────────────────────────────────────────
4. USP STRIP
───────────────────────────────────────────────────────────────────── */
.ldp-usp-strip {
background: var(--mc-accent);
color: var(--mc-white);
}
/* Gebruik Bootstrap .row.g-0 als ouder */
.ldp-usp-item {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
gap: 10px;
padding: 22px 16px;
border-right: 1px solid rgba(255, 255, 255, 0.18);
transition: background var(--mc-transition);
}
.ldp-usp-item:last-child {
border-right: none;
}
.ldp-usp-item:hover {
background: rgba(255, 255, 255, 0.08);
}
.ldp-usp-item__icon {
width: 48px;
height: 48px;
background: rgba(255, 255, 255, 0.15);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.ldp-usp-item__label {
font-size: 12px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.5px;
line-height: 1.4;
}
/* ─────────────────────────────────────────────────────────────────────
5. BODY / SIDEBAR GRID
───────────────────────────────────────────────────────────────────── */
.ldp-body {
padding: 64px 0 80px;
}
/* De rij moet een stacking context zijn voor de sticky sidebar */
.ldp-body__row {
align-items: flex-start; /* cruciaal voor sticky! */
}
.ldp-body__main {
/* Extra ruimte zodat de content niet tegen de sidebar aan plakt */
padding-right: 8px;
}
/* Herbruikbare sectie-spacer binnen de linkerkolom */
.ldp-section {
margin-bottom: 52px;
}
.ldp-section:last-child {
margin-bottom: 0;
}
.ldp-standaard p{
font-size: 16px;
color: var(--mc-muted);
line-height: 1.7;
margin-bottom: 28px;
}
/* Standaard h2 binnen de content */
.ldp-h2 {
font-size: clamp(22px, 2.8vw, 30px);
font-weight: 700;
color: var(--mc-brand-dark);
line-height: 1.25;
margin-bottom: 14px;
letter-spacing: -0.2px;
margin-bottom: 0.5rem !important;
}
.ldp-standaard h2{
font-size: clamp(22px, 2.8vw, 30px);
font-weight: 700;
color: var(--mc-brand-dark);
line-height: 1.25;
margin-bottom: 14px;
letter-spacing: -0.2px;
margin-bottom: 0.5rem !important;
}
.ldp-lead {
font-size: 16px;
color: var(--mc-muted);
line-height: 1.7;
margin-bottom: 28px;
}
/* ─────────────────────────────────────────────────────────────────────
6. DIENST CARDS
───────────────────────────────────────────────────────────────────── */
.ldp-card {
background: var(--mc-white);
border: 1px solid var(--mc-border);
border-radius: var(--mc-radius);
padding: 26px 22px;
height: 100%;
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 12px;
transition: transform var(--mc-transition), box-shadow var(--mc-transition), border-color var(--mc-transition);
box-shadow: var(--mc-shadow-sm);
}
.ldp-card:hover {
transform: translateY(-4px);
box-shadow: var(--mc-shadow);
border-color: var(--mc-brand-border);
}
.ldp-card__icon {
width: 50px;
height: 50px;
background: var(--mc-brand);
border-radius: var(--mc-radius-sm);
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
/* Centreer het blokje horizontaal in de flex-column card */
align-self: center;
color: #ffffff;
}
.ldp-card__icon svg,
.ldp-card__icon svg path {
fill: #ffffff !important;
display: block;
}
.ldp-card h3 {
font-size: 17px;
font-weight: 700;
color: var(--mc-brand-dark);
margin: 0;
line-height: 1.3;
align-items: center;
align-self: center;
}
.ldp-card p {
font-size: 14px;
color: var(--mc-muted);
line-height: 1.6;
margin: 0;
text-align: center;
}
/* ─────────────────────────────────────────────────────────────────────
7. CERTIFICERING BLOK
───────────────────────────────────────────────────────────────────── */
.ldp-cert-block {
display: flex;
flex-direction: row; /* badges links naast tekst vanaf 768px */
gap: 24px;
align-items: flex-start;
background: var(--mc-brand-light);
border: 1px solid var(--mc-brand-border);
border-radius: var(--mc-radius);
padding: 28px 26px;
margin-bottom: 52px;
}
.ldp-cert-block__badges {
display: flex;
flex-direction: column;
gap: 8px;
flex-shrink: 0;
align-self: anchor-center;
}
.ldp-cert-badge {
background: var(--mc-brand);
color: var(--mc-white);
font-size: 11px;
font-weight: 700;
letter-spacing: 0.5px;
text-transform: uppercase;
padding: 8px 12px;
border-radius: var(--mc-radius-sm);
text-align: center;
min-width: 58px;
line-height: 1.2;
}
.ldp-cert-badge span {
display: block;
font-size: 16px;
letter-spacing: 0;
}
.ldp-cert-block__text h3 {
font-size: 17px;
font-weight: 700;
color: var(--mc-brand-dark);
margin-bottom: 10px;
line-height: 1.35;
}
.ldp-cert-block__text p {
font-size: 14px;
color: var(--mc-muted);
line-height: 1.7;
margin: 0;
}
/* ─────────────────────────────────────────────────────────────────────
8. SEO TEKST BLOK
───────────────────────────────────────────────────────────────────── */
.ldp-seo-block {
background: var(--mc-white);
border: 1px solid var(--mc-border);
border-radius: var(--mc-radius);
padding: 32px 28px;
margin-bottom: 52px;
box-shadow: var(--mc-shadow-sm);
}
.ldp-seo-block h2 {
font-size: clamp(20px, 2.4vw, 26px);
font-weight: 700;
color: var(--mc-brand-dark);
margin-bottom: 14px;
line-height: 1.3;
margin-bottom: 0.5rem !important;
}
.ldp-seo-block p {
font-size: 15px;
color: var(--mc-muted);
line-height: 1.7;
margin-bottom: 14px;
}
.ldp-seo-block p:last-child {
margin-bottom: 0;
}
/* Checkmark lijst */
.ldp-check-list {
list-style: none;
padding: 0;
margin: 12px 0 16px;
display: flex;
flex-direction: column;
gap: 8px;
}
.ldp-check-list li {
font-size: 14px;
color: var(--mc-text);
padding-left: 26px;
position: relative;
line-height: 1.55;
}
.ldp-check-list li::before {
content: '';
position: absolute;
left: 0;
top: 5px;
width: 15px;
height: 15px;
background: var(--mc-brand);
border-radius: 50%;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512' width='9' height='9'%3E%3Cpath fill='white' d='M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
}
/* ─────────────────────────────────────────────────────────────────────
9. WERKGEBIED PILLS
───────────────────────────────────────────────────────────────────── */
.ldp-area-pills {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-top: 16px;
}
.ldp-area-pill {
background: var(--mc-white);
border: 1.5px solid var(--mc-border);
border-radius: 30px;
padding: 7px 16px;
font-size: 13px;
font-weight: 600;
color: var(--mc-brand);
transition: background var(--mc-transition), border-color var(--mc-transition), color var(--mc-transition);
}
.ldp-area-pill:hover {
background: var(--mc-brand-light);
border-color: var(--mc-brand);
}
.ldp-area-pill--active {
background: var(--mc-brand);
color: var(--mc-white);
border-color: var(--mc-brand);
}
.ldp-area-pill--active:hover {
background: var(--mc-brand-dark);
border-color: var(--mc-brand-dark);
color: var(--mc-white);
}
/* ─────────────────────────────────────────────────────────────────────
10. REVIEWS
───────────────────────────────────────────────────────────────────── */
.ldp-rating-bar {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 4px;
flex-wrap: wrap;
}
.ldp-stars {
color: var(--mc-accent);
font-size: 20px;
letter-spacing: 2px;
line-height: 1;
}
.ldp-rating-score {
font-size: 20px;
font-weight: 800;
color: var(--mc-brand-dark);
}
.ldp-rating-count {
font-size: 14px;
color: var(--mc-muted);
}
.ldp-review {
background: var(--mc-white);
border: 1px solid var(--mc-border);
border-radius: var(--mc-radius);
padding: 24px 22px;
height: 100%;
display: flex;
flex-direction: column;
gap: 10px;
box-shadow: var(--mc-shadow-sm);
}
.ldp-review__stars {
color: var(--mc-accent);
font-size: 16px;
letter-spacing: 2px;
}
.ldp-review__text {
font-size: 14px;
color: var(--mc-text);
line-height: 1.65;
font-style: italic;
flex: 1;
margin: 0;
}
.ldp-review__name {
font-size: 13px;
font-weight: 700;
color: var(--mc-brand-dark);
margin-top: auto;
}
/* ─────────────────────────────────────────────────────────────────────
11. FAQ – native /
Geen extra JavaScript nodig.
───────────────────────────────────────────────────────────────────── */
.ldp-faq {
display: flex;
flex-direction: column;
gap: 6px;
}
.ldp-faq__item {
background: var(--mc-white);
border: 1px solid var(--mc-border);
border-radius: var(--mc-radius-sm);
overflow: hidden;
box-shadow: var(--mc-shadow-sm);
transition: border-color var(--mc-transition);
}
.ldp-faq__item[open] {
border-color: var(--mc-brand-border);
}
.ldp-faq__vraag {
display: flex;
justify-content: space-between;
align-items: center;
gap: 16px;
padding: 18px 20px;
font-size: 15px;
font-weight: 600;
color: var(--mc-brand-dark);
cursor: pointer;
list-style: none;
user-select: none;
background: transparent;
transition: background var(--mc-transition);
}
/* Verberg de standaard browser driehoek */
.ldp-faq__vraag::-webkit-details-marker { display: none; }
.ldp-faq__vraag::marker { display: none; }
.ldp-faq__vraag:hover {
background: var(--mc-brand-light);
}
.ldp-faq__item[open] > .ldp-faq__vraag {
background: var(--mc-brand-light);
border-bottom: 1px solid var(--mc-brand-border);
}
/* Chevron rotatie bij open */
.ldp-faq__chevron {
fill: var(--mc-muted);
flex-shrink: 0;
transition: transform var(--mc-transition);
}
.ldp-faq__item[open] .ldp-faq__chevron {
transform: rotate(180deg);
}
.ldp-faq__antwoord {
padding: 16px 20px 20px;
font-size: 14px;
color: var(--mc-muted);
line-height: 1.7;
border-top: 1px solid #e0e0e0;
}
/* ─────────────────────────────────────────────────────────────────────
12. SIDEBAR & FORMULIER
───────────────────────────────────────────────────────────────────── */
#offerte {
scroll-margin-top: 86px; /* 70px navbar + 16px lucht */
}
.ldp-sidebar {
position: sticky;
top: 86px; /* 70px navbar + 16px lucht */
align-self: flex-start;
}
.ldp-sidebar__inner {
isolation: isolate;
background: var(--mc-white);
border: 1px solid var(--mc-border);
border-radius: var(--mc-radius-lg);
box-shadow: var(--mc-shadow);
}
/* Form header (blauwe balk bovenaan) */
.ldp-form-header {
border-radius: var(--mc-radius-lg) var(--mc-radius-lg) 0 0;
border-radius: var(--mc-radius) var(--mc-radius) 0 0;
background: var(--mc-brand);
background: #0242a3 ;
color: var(--mc-white);
padding: 22px 24px 18px;
}
.ldp-form-header__title {
font-size: 18px;
font-weight: 700;
margin-bottom: 4px;
display: flex;
align-items: center;
gap: 9px;
color: #fff;
justify-content: center;
}
.ldp-form-header__title svg {
fill: rgba(255, 255, 255, 0.80);
flex-shrink: 0;
}
.ldp-form-header__sub {
font-size: 13px;
opacity: 0.78;
margin: 0;
text-align: center;
color: var(--mc-white);
}
#offerte .ldp-sidebar .ldp-form-header__sub {
font-size: 13px;
line-height: 1.3;
opacity: 0.78;
margin: 0;
text-align: center;
color: var(--mc-white);
}
/* Powermail wrapper */
.ldp-form-body {
padding: 20px 22px 0;
}
/* Telefoon blok onderaan de sidebar */
.ldp-form-phone {
border-radius: 0 0 var(--mc-radius-lg) var(--mc-radius-lg);
border-radius: 0 0 var(--mc-radius) var(--mc-radius);
background: var(--mc-brand-dark);
background: #0242a3;
color: var(--mc-white);
padding: 16px 22px;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
gap: 4px;
margin-top: 20px;
}
.ldp-form-phone__label {
font-size: 12px;
opacity: 0.70;
}
.ldp-form-phone__number {
display: flex;
align-items: center;
gap: 8px;
color: var(--mc-white);
font-size: 20px;
font-weight: 700;
text-decoration: none;
letter-spacing: 0.3px;
transition: opacity var(--mc-transition);
}
.ldp-form-phone__number:hover {
opacity: 0.82;
color: var(--mc-white);
}
.ldp-form-phone__number svg {
fill: rgba(255, 255, 255, 0.75);
}
.ldp-form-phone__hours {
font-size: 11px;
opacity: 0.55;
}
/* ─────────────────────────────────────────────────────────────────────
13. POWERMAIL OVERRIDES
Stijlen voor de Powermail-formuliervelden binnen .ldp-form-body
Prefixed met .ldp-form-body zodat andere Powermail-formulierenwelkom
op de site niet worden geraakt.
───────────────────────────────────────────────────────────────────── */
/* Labels */
.ldp-form-body .powermail_fieldwrap {
margin-bottom: 14px;
}
.ldp-form-body label,
.ldp-form-body .powermail_label {
display: block;
font-size: 12px;
font-size: 14px;
font-weight: 600;
color: var(--mc-text);
margin-bottom: 5px;
}
/* Input, textarea, select */
.ldp-form-body input[type="text"],
.ldp-form-body input[type="email"],
.ldp-form-body input[type="tel"],
.ldp-form-body input[type="number"],
.ldp-form-body textarea,
.ldp-form-body select {
width: 100%;
padding: 11px 14px;
border: 1.5px solid var(--mc-border);
border-radius: var(--mc-radius-sm);
font-size: 14px;
color: var(--mc-text);
background: var(--mc-white);
transition: border-color var(--mc-transition), box-shadow var(--mc-transition);
appearance: none;
-webkit-appearance: none;
font-family: inherit;
}
.ldp-form-body input:focus,
.ldp-form-body textarea:focus,
.ldp-form-body select:focus {
outline: none;
border-color: var(--mc-brand);
box-shadow: 0 0 0 3px rgba(0, 87, 168, 0.12);
}
/* Select pijltje */
.ldp-form-body select {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' width='12'%3E%3Cpath fill='%235A6A7E' d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 14px center;
padding-right: 38px;
}
/* Textarea hoogte */
.ldp-form-body textarea {
min-height: 90px;
resize: vertical;
}
/* Submit knop */
.ldp-form-body input[type="submit"],
.ldp-form-body button[type="submit"],
.ldp-form-body .powermail_submit {
width: 100%;
background: var(--mc-accent) !important;
color: var(--mc-white);
font-weight: 700;
font-size: 15px;
padding: 14px 20px;
border: none;
border-radius: var(--mc-radius-sm);
cursor: pointer;
transition: background var(--mc-transition), transform var(--mc-transition), box-shadow var(--mc-transition);
letter-spacing: 0.2px;
margin-top: 4px;
font-family: inherit;
}
.ldp-form-body input[type="submit"]:hover,
.ldp-form-body button[type="submit"]:hover,
.ldp-form-body .powermail_submit:hover {
background: var(--mc-accent-hover);
transform: translateY(-2px);
box-shadow: 0 6px 18px rgba(255, 107, 0, 0.35);
}
/* Radio / checkbox in Powermail */
.ldp-form-body .powermail_radio label,
.ldp-form-body .powermail_check label {
font-size: 13px;
font-weight: 400;
color: var(--mc-muted);
display: inline-flex;
align-items: center;
gap: 6px;
cursor: pointer;
margin-bottom: 0;
}
/* Foutmeldingen */
.ldp-form-body .powermail_field_error_container,
.ldp-form-body .f3-form-error {
font-size: 12px;
color: #C0392B;
margin-top: 4px;
}
/* Bevestigingsmelding */
.ldp-form-body .powermail_confirmation,
.ldp-form-body .tx-powermail-pi1-confirmation {
background: #E8F5E9;
border: 1px solid #A5D6A7;
border-radius: var(--mc-radius-sm);
padding: 14px 16px;
font-size: 14px;
color: #2E7D32;
margin-top: 12px;
}
/* Privacy tekst */
.ldp-form-body .powermail_fieldwrap_privacy,
.ldp-form-body p.ldp-privacy-note {
font-size: 11px;
color: var(--mc-muted);
text-align: center;
line-height: 1.5;
margin-top: 8px;
}
.ldp-form-body .tx-powermail .powermail_form .powermail_tab_navigation{
margin: 0;
}
/* ─────────────────────────────────────────────────────────────────────
14. LDP SEO-FOOTER (boven de globale site footer)
───────────────────────────────────────────────────────────────────── */
.ldp-seo-footer {
background: var(--mc-brand-dark);
background: #0242a3;
color: rgba(255, 255, 255, 0.55);
padding: 20px 0;
font-size: 13px;
line-height: 1.6;
}
.ldp-seo-footer p {
margin: 0;
}
/* ─────────────────────────────────────────────────────────────────────
15. MOBIELE STICKY CTA BALK
Zichtbaar onder 992px (Bootstrap lg breakpoint).
d-lg-none zorgt dat deze op desktop verborgen is.
───────────────────────────────────────────────────────────────────── */
.ldp-mobile-cta {
position: fixed;
bottom: 0;
left: 0;
right: 0;
display: flex;
z-index: 1050;
box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
}
/* Zorg dat de pagina niet achter de balk verdwijnt op mobiel */
@media (max-width: 991px) {
.ldp-wrapper {
padding-bottom: 68px;
}
}
.ldp-mobile-cta__btn {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
font-size: 14px;
font-weight: 700;
padding: 16px 12px;
text-decoration: none;
transition: filter var(--mc-transition);
}
.ldp-mobile-cta__btn:hover {
filter: brightness(0.92);
}
.ldp-mobile-cta__btn svg {
fill: currentColor;
flex-shrink: 0;
}
.ldp-mobile-cta__btn--tel {
background: var(--mc-brand);
color: var(--mc-white);
}
.ldp-mobile-cta__btn--offerte {
background: var(--mc-accent);
color: var(--mc-white);
}
/* ─────────────────────────────────────────────────────────────────────
16. HULPKLASSEN (scoped – alleen van toepassing binnen ldp-wrapper)
───────────────────────────────────────────────────────────────────── */
/* Vervangt Bootstrap .mt-5 voor gevallen die specifieke LDP-spacing nodig hebben */
.ldp-mt {
margin-top: 52px;
}
/* Scoped vervanging voor Bootstrap .text-muted binnen LDP */
.ldp-muted {
color: var(--mc-muted);
}
/* ─────────────────────────────────────────────────────────────────────
17. RESPONSIVE
───────────────────────────────────────────────────────────────────── */
/* ── Tablet (< 1200px) ─────────────────────────────────────────── */
@media (max-width: 1199px) {
.ldp-hero {
padding: 56px 0 48px;
}
/* cert-block blijft row vanaf 768px — geen override nodig hier */
}
/* ── Mobiel / tablet staand (< 992px) ─────────────────────────── */
@media (max-width: 991px) {
.ldp-hero {
padding: 44px 0 36px;
text-align: center;
background-position: center top;
}
.ldp-hero__tag {
margin-left: auto;
margin-right: auto;
}
.ldp-hero__intro {
margin-left: auto;
margin-right: auto;
}
.ldp-hero__ctas {
justify-content: center;
}
.ldp-hero__chips {
justify-content: center;
}
/* Sidebar is niet meer sticky op mobiel */
.ldp-sidebar{
position: static;
}
.ldp-body {
padding: 40px 0 56px;
}
/* USP strip: 2 kolommen op tablet, border aanpassen */
.ldp-usp-item:nth-child(odd) {
border-right: 1px solid rgba(255, 255, 255, 0.18);
}
.ldp-usp-item:nth-child(even) {
border-right: none;
}
.ldp-usp-item:nth-child(3),
.ldp-usp-item:nth-child(4) {
border-top: 1px solid rgba(255, 255, 255, 0.18);
}
.ldp-form-header {
border-radius: var(--mc-radius-sm) var(--mc-radius-sm) 0 0;
}
.ldp-form-phone {
border-radius: 0 0 var(--mc-radius-sm) var(--mc-radius-sm);
}
}
/* ── Tablet smal / groot mobiel (< 768px) ─────────────────────── */
@media (max-width: 767px) {
#offerte {
scroll-margin-top: 84px; /* 68px navbar + 16px lucht */
}
.ldp-cert-block {
flex-direction: column; /* badges boven tekst */
align-items: center; /* block centreren */
gap: 16px;
}
.ldp-cert-block__badges {
flex-direction: row; /* BRL100 en BRL200 naast elkaar */
justify-content: center; /* badges horizontaal centreren */
}
.ldp-cert-block__text {
text-align: center; /* tekst centreren onder badges */
}
.ldp-hero {
background-image:
linear-gradient(180deg, rgba(0, 45, 92, .92), rgba(0, 87, 168, .55)),
var(--ldp-hero-image-mobile, var(--ldp-hero-image-desktop, var(--ldp-hero-fallback)));
background-position: center top;
}
}
/* ── Klein mobiel (< 576px) ────────────────────────────────────── */
@media (max-width: 575px) {
.ldp-hero__title {
font-size: 28px;
}
.ldp-hero__intro {
font-size: 15px;
}
.ldp_hero__intro__div p{
font-size: 15px;
}
.ldp-btn {
width: auto;
align-self: center;
}
.ldp-seo-block {
padding: 22px 18px;
}
.ldp-form-header {
padding: 18px 18px 14px;
}
.ldp-form-body {
padding: 16px 18px 0;
}
.ldp-form-phone {
padding: 14px 18px;
}
/* FAQ iets compacter op klein scherm */
.ldp-faq__vraag {
font-size: 14px;
padding: 15px 16px;
}
.ldp-faq__antwoord {
padding: 14px 16px 16px;
}
}
/* ============================================
CARD WRAPPER
============================================ */
.onderhoudsabonnement{
margin-bottom: 28px;
}
.mc-subscription-block {
max-width: 1200px;
margin: 0 auto;
}
.mc-card {
background: var(--mc-white);
border-radius: var(--mc-radius-lg);
box-shadow: var(--mc-shadow);
overflow: hidden;
border: 1px solid var(--mc-gray-200);
transition: box-shadow var(--mc-transition);
}
.mc-card:hover {
box-shadow: var(--mc-shadow-lg);
}
/* ============================================
CARD HEADER STRIPE
============================================ */
.mc-card__header {
background: var(--mc-blue);
padding: 1rem 1.5rem 0.9rem;
display: flex;
align-items: center;
gap: 0.65rem;
}
.mc-card__header-icon {
width: 36px;
height: 36px;
background: var(--mc-brand);
border-radius: var(--mc-radius-sm);
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.mc-card__header-icon svg {
width: 20px;
height: 20px;
fill: none;
stroke: #fff;
stroke-width: 1.8;
stroke-linecap: round;
stroke-linejoin: round;
}
.mc-card__header .mc-card__title {
font-size: 1.15rem;
font-weight: 700;
color: var(--mc-white);
margin: 0;
letter-spacing: -0.01em;
margin-bottom: 0 !important;
}
/* ============================================
CARD BODY – tweekolomsindeling
============================================ */
.mc-card__body {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0;
}
@media (max-width: 620px) {
.mc-card__body {
grid-template-columns: 1fr;
}
.mc-card__features {
border-right: none !important;
border-bottom: 1px solid var(--mc-gray-200);
}
}
/* ============================================
LINKERKOLOM: checklist
============================================ */
.mc-card__features {
padding: 1.4rem 1.5rem;
border-right: 1px solid var(--mc-gray-200);
}
.mc-checklist {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 0.65rem;
}
.mc-checklist li {
display: flex;
align-items: flex-start;
gap: 0.55rem;
font-size: 0.93rem;
line-height: 1.45;
color: var(--mc-gray-800);
}
.mc-checklist li.mc-check--active .mc-check-icon {
color: var(--mc-green);
}
.mc-checklist li.mc-check--inactive {
color: var(--mc-gray-400);
}
.mc-checklist li.mc-check--inactive .mc-check-icon {
color: var(--mc-gray-400);
}
.mc-check-icon {
flex-shrink: 0;
margin-top: 1px;
}
.mc-check-icon svg {
width: 17px;
height: 17px;
display: block;
}
/* ============================================
RECHTERKOLOM: beschrijving + CTA
============================================ */
.mc-card__description {
padding: 1.4rem 1.5rem;
display: flex;
flex-direction: column;
justify-content: space-between;
gap: 1.1rem;
}
p.mc-card__desc-text {
font-size: 0.93rem;
line-height: 1.65;
color: var(--mc-muted);
margin: 0;
}
/* ============================================
PRIJS-BADGE (optioneel)
============================================ */
.mc-price-badge {
display: inline-flex;
align-items: baseline;
gap: 0.25rem;
background: var(--mc-blue-light);
border-radius: var(--mc-radius-sm);
padding: 0.35rem 0.75rem;
width: fit-content;
}
.mc-price-badge__amount {
font-size: 1.3rem;
font-weight: 700;
color: var(--mc-blue);
line-height: 1;
}
.mc-price-badge__suffix {
font-size: 0.8rem;
color: var(--mc-blue-dark);
font-weight: 500;
}
/* ============================================
CTA KNOP
============================================ */
.mc-btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
padding: 0.72rem 1.5rem;
border-radius: var(--mc-radius-md);
font-size: 0.97rem;
font-weight: 700;
cursor: pointer;
border: none;
width: 100%;
transition: background var(--mc-transition), transform 0.15s ease;
letter-spacing: 0.01em;
text-decoration: none;
}
.mc-btn:active {
transform: scale(0.98);
}
.mc-btn--cta {
background: var(--mc-accent);
color: var(--mc-white);
}
.mc-btn--cta:hover {
background: var(--mc-accent);
}
.mc-btn--cta svg {
width: 18px;
height: 18px;
fill: none;
stroke: currentColor;
stroke-width: 2.2;
stroke-linecap: round;
stroke-linejoin: round;
transition: transform var(--mc-transition);
}
.mc-btn--cta.mc-btn--open svg {
transform: rotate(180deg);
}
/* ============================================
UITKLAP FORMULIER SECTIE
============================================ */
.mc-form-section {
overflow: hidden;
max-height: 0;
transition: max-height 0.45s cubic-bezier(0.4,0,0.2,1),
opacity 0.35s ease,
padding 0.35s ease;
opacity: 0;
border-top: 0 solid var(--mc-gray-200);
}
.mc-form-section.mc-form-section--open {
max-height: 1200px;
opacity: 1;
border-top: 1px solid var(--mc-gray-200);
padding: 0;
}
.mc-form-section__inner {
padding: 1.5rem;
background: var(--mc-gray-100);
}
p.mc-form-section__label {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.98rem;
font-weight: 700;
color: var(--mc-blue);
margin: 0 0 1rem;
}
.mc-form-section__label svg {
width: 18px;
height: 18px;
fill: none;
stroke: var(--mc-blue);
stroke-width: 2;
stroke-linecap: round;
stroke-linejoin: round;
}
.mc-typo3-content {
background: var(--mc-white);
border: 1px dashed var(--mc-gray-200);
border-radius: var(--mc-radius-md);
padding: 1.25rem 1.25rem;
font-size: 0.9rem;
color: var(--mc-gray-777);
text-align: center;
}
.mc-snippet-hint {
margin-top: 0.75rem;
background: #1e2330;
border-radius: var(--mc-radius-sm);
padding: 0.8rem 1rem;
font-family: 'Consolas', 'Courier New', monospace;
font-size: 0.82rem;
color: #a8d8ff;
white-space: pre;
overflow-x: auto;
line-height: 1.6;
}
.mc-snippet-hint .kw { color: #f8b867; }
.mc-snippet-hint .at { color: #9cdcfe; }
.mc-snippet-hint .val { color: #ce9178; }
.mc-snippet-hint .cm { color: #6a9955; font-style: italic; }
.mc-form-section .mc-form-section__inner .tx-powermail .powermail_fieldwrap{
padding: 0 !important;
overflow: unset;
}
/*
.mc-form-section .mc-form-section__inner .tx-powermail .powermail_fieldwrap.powermail_fieldwrap_type_input{
padding-right: 16px !important;
}*/
.mc-form-section .mc-form-section__inner .tx-powermail .powermail_fieldwrap.powermail_fieldwrap_type_check{
display: flex;
align-items: center;
gap: 10px;
justify-content: space-between;
min-width: 0;
}
.mc-form-section .mc-form-section__inner .tx-powermail .powermail_fieldwrap.powermail_fieldwrap_type_check .control-label{
-ms-flex: none;
flex: none;
max-width: none;
flex-shrink: 1;
word-break: break-word;
color: var(--mc-gray-777);
}
.mc-form-section .mc-form-section__inner .tx-powermail .powermail_fieldwrap.powermail_fieldwrap_type_check .input-field-wrap{
align-items: flex-end;
white-space: nowrap;
flex-shrink: 0;
}
.mc-form-section .mc-form-section__inner .tx-powermail label{
display: block;
font-size: 14px;
font-weight: 600;
color: var(--mc-text);
color: var(--mc-gray-777);
margin-bottom: 5px;
text-align: left;
}
@media (max-width: 374px) {
.mc-form-section .mc-form-section__inner .tx-powermail label{
font-size: 13px;
}
}
.mc-form-section .mc-form-section__inner .tx-powermail .powermail_fieldwrap.powermail_fieldwrap_type_input .input-field-wrap input{
padding: 11px 14px;
border: 1.5px solid var(--mc-border);
border-radius: var(--mc-radius-sm);
font-size: 14px;
color: var(--mc-text);
background: var(--mc-white);
transition: border-color var(--mc-transition), box-shadow var(--mc-transition);
appearance: none;
-webkit-appearance: none;
font-family: inherit;
}
.powermail_fieldset.powermail_fieldset_13 .powermail_fieldwrap{
float: none !important;
width: 100% !important;
max-width: none;
display: block;
padding: 0 !important;
}
.powermail_fieldset.powermail_fieldset_13{
display: flex;
flex-wrap: wrap;
gap: 0px;
}
.powermail_fieldset.powermail_fieldset_13 .form-item {
flex: 0 0 100%;
min-width: 0;
}
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_voorletters) {
flex: 0 0 35%;
}
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_achternaam) {
flex: 0 0 65%;
}
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_straat) {
flex: 0 0 60%;
}
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_nr) {
flex: 0 0 20%;
}
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_toev) {
flex: 0 0 20%;
}
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_postcode) {
flex: 0 0 35%;
}
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_woonplaats) {
flex: 0 0 65%;
}
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_telefoonnr) {
flex: 0 0 100%;
}
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_e_mail) {
flex: 0 0 100%
}
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_voorletters),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_achternaam),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_straat),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_nr),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_toev),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_postcode),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_woonplaats) {
padding-right: 16px !important;
}
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_achternaam),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_toev),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_woonplaats) {
padding-right: 0 !important;
}
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_voorletters),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_achternaam){
margin-top:16px;
}
@media (max-width: 767px) {
/*
.powermail_fieldset.powermail_fieldset_13 .form-item,
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_voorletters),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_achternaam),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_straat),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_nr),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_toev),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_postcode),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_woonplaats) {
flex-basis: 100%;
}
*/
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_voorletters),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_straat),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_nr),
.powermail_fieldset.powermail_fieldset_13 .form-item:has(.powermail_fieldwrap_postcode) {
padding-right: 12px !important;
}
}
.form-item .powermail_fieldwrap_type_submit .btn.btn-primary{
width: 100%;
background: var(--mc-accent) !important;
color: var(--mc-white);
font-weight: 700;
font-size: 15px;
padding: 14px 20px;
border: none;
border-radius: var(--mc-radius-sm);
cursor: pointer;
transition: background var(--mc-transition), transform var(--mc-transition), box-shadow var(--mc-transition);
letter-spacing: 0.2px;
margin-top: 4px;
font-family: inherit;
}
.form-item .powermail_fieldwrap_type_submit .btn.btn-primary:hover{
background: var(--mc-accent-hover);
transform: translateY(-2px);
box-shadow: 0 6px 18px rgba(255, 107, 0, 0.35);
}
.onderhoud-voorwaarden-ul{
margin-top: 16px;
margin-bottom: 0;
padding-inline-start: 20px;
}
.onderhoud-voorwaarden-ul li{
text-align: left;
color: var(--mc-text);
}
.ldp-standaard .ldp-onderhoud-service h2{
font-size: clamp(17px, 2.8vw, 24px);
}
.ldp-mc-26 h2{
font-size: clamp(17px, 2.8vw, 24px);
}
/* ── Card shell ── */
.wp-cards{
margin-bottom: 16px;
}
/* ── Card shell ── */
.wp-card {
border: 1.5px solid var(--mc-gray-200);
border-radius: 16px;
overflow: hidden;
background: var(--white);
box-shadow: 0 2px 12px rgba(2, 66, 163, 0.06);
transition: transform 0.25s ease, box-shadow 0.25s ease;
display: flex;
flex-direction: column;
height: 100%;
}
.wp-card:hover {
transform: translateY(-5px);
box-shadow: 0 12px 36px rgba(2, 66, 163, 0.13);
}
/* ── Title bar ── */
.wp-card__title {
padding: 1.1rem 1.4rem 0.9rem;
border-bottom: 1.5px solid var(--mc-gray-200);
font-size: 1.05rem;
font-weight: 700;
color: var(--brand-dark);
line-height: 1.24;
min-height: 70px;
display: flex;
align-items: center;
}
/* ── Image area ── */
.wp-card__img-wrap {
background: linear-gradient(160deg, #eef4fb 0%, #f9fbfe 100%);
display: flex;
align-items: center;
justify-content: center;
padding: 1.5rem 1.5rem;
min-height: 190px;
position: relative;
overflow: hidden;
}
.wp-card__img-wrap img {
max-height: 160px;
max-width: 100%;
object-fit: contain;
filter: drop-shadow(0 4px 16px rgba(0,87,168,0.10));
transition: transform 0.3s ease;
}
.wp-card:hover .wp-card__img-wrap img {
transform: scale(1.04);
}
/* ── Features list ── */
.wp-card__features {
background: #eef4fb;
padding: 1.1rem 1.4rem;
flex: 1;
}
.wp-card__features ul {
list-style: none;
padding: 0;
margin: 0;
}
.wp-card__features li {
display: flex;
align-items: center;
gap: 0.55rem;
font-size: 0.875rem;
font-weight: 500;
color: var(--text);
padding: 0.3rem 0;
}
.wp-card__features li::before {
content: '';
display: inline-block;
width: 9px;
height: 9px;
border-radius: 50%;
background: #30c060;
flex-shrink: 0;
}
/* ── CTA area ── */
.wp-card__cta {
padding: 1.1rem 1.4rem;
background: var(--white);
border-top: 1.5px solid var(--mc-gray-200);
margin-top: auto;
}
.btn-wp-info {
display: flex;
align-items: center;
width: 100%;
height: 46px;
border-radius: 8px;
background: var(--brand);
color: var(--white);
font-family: inherit;
font-weight: 600;
font-size: 16px;
border: none;
transition: background 0.2s;
text-decoration: none;
overflow: hidden;
}
.btn-wp-info:hover {
background: var(--brand-dark);
color: var(--white);
}
.btn-wp-info__arrow {
display: flex;
align-items: center;
justify-content: center;
width: 46px;
height: 46px;
background: var(--brand-dark);
flex-shrink: 0;
font-size: 1.15rem;
line-height: 1;
}
.btn-wp-info__arrow svg {
display: block;
width: 18px;
height: 18px;
}
.btn-wp-info__label {
flex: 1 1 auto;
min-width: 0;
text-align: center;
padding: 0 0.75rem;
white-space: nowrap;
}
/* ── Badge ── */
.wp-badge {
position: absolute;
top: 12px;
right: 12px;
color: var(--white);
font-size: 0.68rem;
font-weight: 700;
padding: 4px 11px;
border-radius: 20px;
letter-spacing: 0.05em;
text-transform: uppercase;
display: flex;
align-items: center;
gap: 5px;
box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
.wp-badge--hybrid {
background: linear-gradient(135deg, #0057A8, #003E7A);
}
.wp-badge--electric {
background: linear-gradient(135deg, #1fa84e, #146b32);
}
.wp-badge svg {
width: 14px;
height: 14px;
flex-shrink: 0;
}
@media (min-width: 768px) {
.wp-card__title {
min-height: 82px;
}
}
@media (min-width: 768px) and (max-width: 991.98px) {
.wp-card__cta {
padding: 1rem 0.75rem;
}
.btn-wp-info__arrow {
width: 42px;
}
.btn-wp-info__label {
padding: 0 0.5rem;
}
}
.werkgebied-kaart{
width:100%; aspect-ratio: 16 / 9;
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 12px;
}
@media (max-width: 575px), (min-width: 992px) and (max-width: 1199px){
.werkgebied-kaart{
aspect-ratio: 1 / 1;
}
}
.btn-wp-info.btn-card-link:hover{
background: var(--mc-blue);
}
.mc-homepage-additions {
--mc-blue: #0242a3;
--brand: #0057A8;
--brand-dark: #003E7A;
--accent: #FF6B00;
--accent-hover: #e05e00;
--light: #F4F8FC;
--text: #1A2332;
--muted: #5A6A7A;
--white: #fff;
--mc-gray-100: #f5f6f8;
--mc-gray-200: #e8eaed;
--mc-gray-400: #9ea5b0;
--mc-gray-600: #5a6270;
--mc-gray-800: #2c3038;
--mc-gray-777: #777777;
}
.font-condensed {
font-family: 'Titillium Web', sans-serif;
}
.section-label {
font-size: 11px;
font-weight: 700;
letter-spacing: 2px;
text-transform: uppercase;
color: var(--accent);
}
.section-title {
font-family: 'Titillium Web', sans-serif;
font-size: 2.2rem;
font-weight: 800;
text-transform: uppercase;
color: var(--text);
line-height: 1.1;
padding-bottom: 16px;
}
.dienst-card {
border: 1px solid #dce6f0;
border-radius: 10px;
overflow: hidden;
transition: transform 0.2s, box-shadow 0.2s;
background: var(--white);
height: 100%;
}
.dienst-card:hover {
transform: translateY(-4px);
box-shadow: 0 12px 28px rgba(2,66,163,0.1);
}
.card-header-img {
height: 190px;
display: flex;
align-items: center;
justify-content: center;
position: relative;
font-size: 4rem;
color: rgba(255,255,255,0.72);
background-image: var(--dienst-card-image, var(--dienst-card-fallback));
background-size: contain;
background-position: center;
background-repeat: no-repeat;
}
.card-header-img > i {
position: relative;
z-index: 1;
text-shadow: 0 8px 26px rgba(0,0,0,0.24);
}
.card-header-img.airco { --dienst-card-fallback: linear-gradient(135deg, #0057A8, #1a7fd4); }
.card-header-img.warmtepomp { --dienst-card-fallback: linear-gradient(135deg, #003E7A, #0057A8); }
.card-header-img.service { --dienst-card-fallback: linear-gradient(135deg, #e05e00, #FF6B00); }
.card-icon-badge {
position: absolute;
bottom: -24px;
left: 20px;
width: 44px;
height: 44px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
border: 3px solid var(--white);
font-size: 20px;
color: var(--white);
}
.card-icon-badge.blue { background: var(--brand); }
.card-icon-badge.dark { background: var(--brand-dark); }
.card-icon-badge.orange { background: var(--accent); }
.dienst-card .card-body { padding: 32px 20px 20px; border-top: 5px solid var(--mc-blue);}
.dienst-card h3 {
font-family: 'Titillium Web', sans-serif;
font-size: 1.4rem;
font-weight: 800;
text-transform: uppercase;
}
.dienst-card p { font-size: 14px; color: var(--muted); line-height: 1.7; }
.btn-card-link {
font-size: 13px;
font-weight: 700;
color: var(--white);
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 12px;
justify-content: center;
text-align: center;
font-size: 16px;
}
.btn-card-link:hover { color: var(--white); }
.btn-card-link-airco{
background-color: var(--brand);
}
.btn-card-link-warmtepompen{
background-color: var(--brand-dark);
}
.btn-card-link-service{
background-color: var(--accent);
}
.btn-card-link svg{
fill: var(--white);
}
.section-pad{padding: 64px 0;}
#stats { background: var(--brand); }
.stat-item { text-align: center; padding: 20px; border-right: 1px solid rgba(255,255,255,0.2); }
.stat-item:last-child { border-right: none; }
.stat-num {
font-family: 'Titillium Web', sans-serif;
font-size: 3.2rem;
font-weight: 800;
color: var(--white);
line-height: 1;
}
.stat-num span { color: var(--accent); }
.stat-label {
font-size: 11px;
color: rgba(255,255,255,0.75);
font-weight: 600;
letter-spacing: 0.5px;
text-transform: uppercase;
margin-top: 6px;
}
#werkwijze { background: var(--light); }
.step-card {
background: var(--white);
border: 1px solid #dce6f0;
border-radius: 10px;
padding: 28px 24px;
position: relative;
height: 100%;
}
.step-num {
font-family: 'Titillium Web', sans-serif;
font-size: 5rem;
font-weight: 800;
color: #e8edf5;
line-height: 1;
position: absolute;
right: 16px;
top: 8px;
}
.step-icon {
width: 48px;
height: 48px;
background: #e8f1fc;
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.5rem;
color: var(--brand);
margin-bottom: 16px;
}
.step-card h4 {
font-family: 'Titillium Web', sans-serif;
font-size: 1.2rem;
font-weight: 800;
text-transform: uppercase;
color: var(--brand-dark);
}
.step-card p { font-size: 14px; color: var(--muted); line-height: 1.7; margin-bottom: 0;}
#reviews { background: var(--white); }
.review-card {
background: var(--white);
border: 1px solid #dce6f0;
border-radius: 10px;
padding: 24px;
height: 100%;
}
.review-stars { color: var(--accent); font-size: 14px; letter-spacing: 2px; }
.review-card p { font-size: 14px; color: var(--muted); line-height: 1.75; font-style: italic; }
.review-avatar {
width: 38px;
height: 38px;
border-radius: 50%;
background: var(--brand);
display: flex;
align-items: center;
justify-content: center;
font-size: 12px;
font-weight: 700;
color: var(--white);
flex-shrink: 0;
}
.review-name { font-size: 13px; font-weight: 700; color: var(--text); }
.review-loc { font-size: 12px; color: var(--muted); }
#werkgebied { background: var(--brand-dark); }
.wg-tag {
display: inline-block;
background: rgba(255,255,255,0.12);
border: 1px solid rgba(255,255,255,0.2);
color: var(--white);
font-size: 12px;
font-weight: 600;
padding: 5px 14px;
border-radius: 20px;
margin: 4px;
}
.wg-map-placeholder {
background: rgba(255,255,255,0.08);
border: 1px solid rgba(255,255,255,0.15);
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
font-size: 4rem;
color: rgba(255,255,255,0.25);
}
#cta-banner { background: var(--accent); }
#cta-banner h2 {
font-family: 'Titillium Web', sans-serif;
font-size: 2.6rem;
font-weight: 800;
text-transform: uppercase;
color: var(--white);
}
#cta-banner p { color: rgba(255,255,255,0.88); font-size: 1rem; margin-bottom: 16px;}
.btn-cta-white {
background: var(--white);
color: var(--accent);
font-weight: 700;
padding: 13px 28px;
border-radius: 6px;
border: none;
font-size: 15px;
}
.btn-cta-white:hover { background: var(--mc-gray-100); color: var(--accent-hover); }
.btn-cta-outline {
background: transparent;
color: var(--white);
font-weight: 600;
padding: 11px 26px;
border-radius: 6px;
border: 2px solid rgba(255,255,255,0.5);
font-size: 15px;
}
.btn-cta-outline:hover { border-color: var(--white); color: var(--white); }
.d-flex{display: flex;}
.justify-content-center{justify-content: center;}
.flew-wrap{flex-wrap:wrap}
.gap-12{gap: 12px;}
.flex-column {flex-direction: column !important;}
@media (min-width: 576px) {.flex-sm-row {flex-direction: row !important;}
.align-items-center {align-items: center !important;}
.w-auto {width: auto !important;}
}