html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } body { margin: 0; }  figcaption, figure, footer, header, main, nav, section { display: block; } video { display: inline-block; vertical-align: baseline; } [hidden] { display: none; } a { background-color: transparent; color: #CCFFCC; } a:active, a:hover { outline: 0; }  strong { font-weight: bold; } h1 { margin: .67em 0; } img { border: 0; } svg:not(:root) { overflow: hidden; } figure { margin: 1em 40px; } button, input, textarea { margin: 0; font: inherit; color: inherit; } button { overflow: visible; } button { text-transform: none; } button, input[type=submit] { -webkit-appearance: button; cursor: pointer; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } input { line-height: normal; } textarea { overflow: auto; } @media print { *, *:before, *:after { color: #000 !important; text-shadow: none !important; background: transparent !important; -webkit-box-shadow: none !important; box-shadow: none !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; }  img { page-break-inside: avoid; } img { max-width: 100% !important; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } } @font-face { font-family: 'Glyphicons Halflings'; src: url('../fonts/glyphicons-halflings-regular.eot'); src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg'); font-display: block; } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } html { font-size: 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } body { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 16px; line-height: 1.42857143; color: #333; background-color: #fff; } input, button, textarea { font-family: inherit; font-size: inherit; line-height: inherit; } a { color: #337ab7; text-decoration: none; } a:hover, a:focus { color: #f28b28; text-decoration: underline; } a:focus { outline: thin dotted; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } figure { margin: 0; } img { vertical-align: middle; } h1, h2, h3, .h1, .h2, .h3 { color: inherit; } h1, .h1, h2, .h2, h3, .h3 { margin-top: 20px; margin-bottom: 10px; } p { margin: 0 0 10px; } ul, ol { margin-top: 0; margin-bottom: 10px; } ul ul { margin-bottom: 0; } .container { padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; } @media (min-width: 768px) { .container { width: 750px; } } @media (min-width: 992px) { .container { width: 970px; } } @media (min-width: 1200px) { .container { width: 1170px; } } .row { margin-right: -15px; margin-left: -15px; }  .col-md-3, .col-sm-6, .col-xs-12 { position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px; } .col-xs-12 { float: left; } .col-xs-12 { width: 100%; } @media (min-width: 768px) {  .col-sm-6 { float: left; } .col-sm-6 { width: 50%; } } @media (min-width: 992px) {  .col-md-3 { float: left; } .col-md-3 { width: 25%; } } .open > a { outline: 0; } .nav { padding-left: 0; margin-bottom: 0; list-style: none; } .nav > li { position: relative; display: block; } .nav > li > a { position: relative; display: block; padding: 10px 15px; } .nav > li > a:hover, .nav > li > a:focus { text-decoration: none; background-color: #eee; } .nav .open > a, .nav .open > a:hover, .nav .open > a:focus { background-color: #eee; border-color: #337ab7; } .nav > li > a > img { max-width: none; } .tab-content > .active { display: block; visibility: visible; } @-webkit-keyframes progress-bar-stripes { from { background-position: 40px 0; } to { background-position: 0 0; } } @-o-keyframes progress-bar-stripes { from { background-position: 40px 0; } to { background-position: 0 0; } } @keyframes progress-bar-stripes { from { background-position: 40px 0; } to { background-position: 0 0; } } .media { margin-top: 15px; } .media:first-child { margin-top: 0; } .media { overflow: hidden; zoom: 1; } .panel { margin-bottom: 20px; background-color: #fff; border: 1px solid transparent; border-radius: 4px; -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05); box-shadow: 0 1px 1px rgba(0, 0, 0, .05); } .clearfix:before, .clearfix:after, .container:before, .container:after, .row:before, .row:after, .nav:before, .nav:after { display: table; content: " "; } .clearfix:after, .container:after, .row:after, .nav:after { clear: both; } .show { display: block !important; } .hidden { display: none !important; visibility: hidden !important; } @-ms-viewport { width: device-width; }
@charset "utf-8"; .hebdem{ display:none; visibility:hidden; } .white { color: #FFFFFF; } body { line-height: 1.5; letter-spacing: 0.3px; color: #333; font-family: 'Open Sans', sans-serif; } a { text-decoration: none !important; color: #336699; } a:hover { color: #ef7537; } a img { border: none; } img { max-width: 100%; } iframe { border: none !important; width: 100%; overflow: hidden; } h1, h2, h3 { margin: 0 0 20px 0; } h2 > span, h3 > span { color: #FF9900; }  ol, ul, li { margin: 0; padding: 0; } ::selection { background: #336699; color: #FFF; text-shadow: none; } ::-moz-selection { background: #336699; color: #FFF; text-shadow: none; } ::-webkit-selection { background: #336699; color: #FFF; text-shadow: none; } p, ul, ol, form { margin-bottom: 30px; } #wrapper { position: relative; float: none; width: 1220px; margin: 0 auto; background-color: #fff; box-shadow: 0 0 10px rgba(0,0,0,0.1); -moz-box-shadow: 0 0 10px rgba(0,0,0,0.1); -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.1); } .t-margin { margin-top: 30px !important; } .t-margin-small { margin-top: 30px !important; } .t-margin-large { margin-top: 80px !important; } .hidden { display: none !important; } .center { text-align: center !important; } .color { color: #336699 !important; } @-webkit-keyframes BgAnimated { from {background-position:0 0;} to {background-position:0 400px;} } @-moz-keyframes BgAnimated { from {background-position:0 0;} to {background-position:0 400px;} } @-ms-keyframes BgAnimated { from {background-position:0 0;} to {background-position:0 400px;} } @-o-keyframes BgAnimated { from {background-position:0 0;} to {background-position:0 400px;} } @keyframes BgAnimated { from {background-position:0 0;} to {background-position:0 400px;} } .section { position: relative; margin: 50px 0 50px 0; padding: 80px 0 80px 0; background-color: #fff; border-top: 0px solid #f1f1f1; border-bottom: 0px solid #f1f1f1; overflow: hidden; } .section .container { z-index: 2; } .col-1-third { width: 30.63%; }  .col-1-third { display: block; position: relative; margin-right: 4%; margin-bottom: 40px; float: left; } .col-last { margin-right: 0 !important; clear: right; } #header { position: relative; background-color: #FFF; border-bottom: 1px solid #F5F5F5; } #header .container { position: relative; } #header.wide-header { border-bottom-color: #EEE; } body.full-wide #header.wide-header .container { width: 100%; padding: 0 30px; } #logo { position: relative; float: left; font-family: 'Open Sans', sans-serif; font-size: 20px; line-height: 100%; margin-right: 10px; margin-top: 9px; } #header.wide-header #logo { padding-right: 0; margin-right: 20px; } #logo a { display: block; color: #000; } #logo img { display: block; max-width: 100%; } #logo a.logo-style { display: block; } #main-menu { float: right; height: 100px; } #header.wide-header #main-menu > ul { float: left; padding-right: 0; margin-right: 0; } #main-menu-trigger { opacity: 0; pointer-events: none; cursor: pointer; font-size: 21px; position: absolute; top: 50%; margin-top: -25px; width: 50px; height: 50px; line-height: 50px; text-align: center; -webkit-transition: opacity .3s ease; -o-transition: opacity .3s ease; transition: opacity .3s ease; } #main-menu ul { list-style: none; height: 100px; margin: 0; } #main-menu > ul { float: left; } #main-menu ul li { position: relative; float: left; margin-left: 2px; } #main-menu ul li:first-child { margin-left: 0; } #main-menu ul li a { display: block; height: 100px; line-height: 100px; padding: 0 13px; color: #212121; font-weight: 400; font-size: 16px; letter-spacing: 1px; text-transform: uppercase; -webkit-transition: height .4s ease, line-height .4s ease, margin .4s ease, padding .4s ease; -o-transition: height .4s ease, line-height .4s ease, margin .4s ease, padding .4s ease; transition: height .4s ease, line-height .4s ease, margin .4s ease, padding .4s ease; } #main-menu ul li span { display: none; } #main-menu ul li i { position: relative; font-size: 14px !important; top: 1px; line-height: 99px; width: 14px; text-align: center; margin-right: 6px; -webkit-transition: line-height .4s ease; -o-transition: line-height .4s ease; transition: line-height .4s ease; } #main-menu > ul > li:hover a, #main-menu > ul > li.current a { color: #336699; } #main-menu li:hover > ul { display: block; } #main-menu ul ul { display: none; position: absolute; width: 320px; background-color: #FFF; box-shadow: 0px 9px 2px 9px rgba(0, 0, 0, 0.02); border: 1px solid #EEE; height: auto; z-index: 199; top: 100px; left: 0; margin: 0; padding: 10px 0; } #main-menu ul ul ul { top: -2px !important; left: 218px; } #main-menu ul ul.menu-pos-invert { left: auto; right: 0; } #main-menu ul ul ul.menu-pos-invert { right: 218px; } #main-menu ul ul li { float: none; margin: 0; } #main-menu ul ul li:first-child { border-top: 0; } #main-menu ul ul a { font-size: 16px; font-weight: 500; height: 40px !important; line-height: 40px !important; color: #F2F2F2; padding-top: 0 !important; padding-bottom: 0 !important; border: 0 !important; letter-spacing: 0.5px; font-family: 'Open Sans', serif; text-transform: uppercase; -webkit-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } #main-menu ul ul li:hover > a { background-color: #F9F9F9; } #main-menu ul ul i { line-height: inherit; } #main-menu ul ul i { line-height: inherit; } #main-menu > div > ul > li:hover a, #main-menu > div > ul > li.current a { color: #336699; } #main-menu.m-bg > ul > li > a { height: 44px; line-height: 44px; margin: 28px 0; border-radius: 2px; } #main-menu.m-bg > ul > li > a i { line-height: 43px; } #main-menu.m-bg > ul > li:hover > a { color: #fff; background-color: var(--link-kleur) ; } #main-menu.m-bg > ul > li.current > a { color: #fff; background-color: var(--link-kleur) ; } #side-panel-trigger { float: right; margin: 40px 10px 40px 25px; } #side-panel-trigger a { display: block; position: relative; width: 20px; height: 20px; font-size: 18px; line-height: 20px; text-align: center; color: var(--link-kleur) ; -webkit-transition: color .3s ease-in-out; -o-transition: color .3s ease-in-out; transition: color .3s ease-in-out; } #side-panel-trigger a { color: #777; font-size: 18px; line-height: 18px; } ul#lang { float: right !important; margin-left: 5px; } ul#lang > li > a > div { text-transform: none !important; } ul#lang:hover li div { border: none; } #main-menu > ul#lang > li:hover > a, #main-menu > ul#lang > li.current > a { background: transparent; border-color: transparent !important; color: #212121; } ul#lang li ul li div { text-transform: uppercase !important; } #header, #header-wrap, #logo img, #main-menu:not(.m-left-align), #main-menu:not(.m-bg) > ul { height: 100px; -webkit-transition: height .4s ease, opacity .3s ease; -o-transition: height .4s ease, opacity .3s ease; transition: height .4s ease, opacity .3s ease; } #logo img { height: 83px; } #main-menu > ul > li > ul { -webkit-transition: top .4s ease; -o-transition: top .4s ease; transition: top .4s ease; } body:not(.top-search-open) #header-wrap #logo, body:not(.top-search-open) #main-menu > ul, body:not(.top-search-open) #main-menu > .container > ul, body:not(.top-search-open) #side-panel-trigger { opacity: 1; -webkit-transition: height .4s ease, margin .4s ease, opacity .2s .2s ease; -o-transition: height .4s ease, margin .4s ease, opacity .2s .2s ease; transition: height .4s ease, margin .4s ease, opacity .2s .2s ease; } #header-wrap { position: relative; } #header.sticky-header #header-wrap { z-index: 199; position: fixed; top: 0; left: 0; width: 100%; background-color: #FFF; box-shadow: 0 1px 2px 2px rgba(0, 0, 0, 0.03); -webkit-backface-visibility: hidden; } #header.sticky-header, #header.sticky-header #header-wrap, #header.sticky-header:not(.sticky-style-2) #logo img, #header.sticky-header #main-menu, #header.sticky-header #main-menu > ul, #header.sticky-header #main-menu > ul > li > a { height: 60px; } #header.sticky-header:not(.sticky-style-2) #logo img { height: 67px; } #header.sticky-header:not(.sticky-style-2) #logo { margin-top: -4px; } #header.sticky-header #main-menu > ul > li > a { line-height: 60px; } #header.sticky-header #main-menu > ul > li > a i { line-height: 59px; } #header.sticky-header #main-menu > ul > li > ul { top: 60px; } #header.sticky-header #side-panel-trigger { margin-top: 20px !important; margin-bottom: 20px !important; } #header.sticky-header #main-menu.m-bg > ul > li > a { margin: 0; border-radius: 0; color: #212121; background-color: transparent; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } @media (min-width: 992px) { } body.side-panel-main { overflow-x: hidden; } body.side-panel-main #side-panel { position: fixed; top: 0; right: -300px; z-index: 399; width: 300px; height: 100%; background-color: #f2f2f2; overflow: hidden; } body.side-panel-main #wrapper, body.side-panel-main #header.sticky-header .container { right: 0; } body.side-panel-main #side-panel .side-panel-wrap { position: absolute; top: 0; left: auto; bottom: 0; right: 0; width: 300px; height: 100%; overflow-y: hidden; padding: 75px 40px; } body.side-panel-main #side-panel .side-panel-wrap a { color: #777; } body.side-panel-main #side-panel .side-panel-wrap a:hover { color: #333; } body.side-panel-main #side-panel .side-panel-wrap a i { margin-right: 10px; } body.side-panel-main #side-panel .widget { margin-top: 40px; padding-top: 40px; border-top: 1px solid #E5E5E5; } body.side-panel-main #side-panel .widget:first-child { padding-top: 0; border-top: 0; margin: 0; } body.side-panel-main.side-panel-open #side-panel { right: 0; } body.side-panel-main.side-panel-open #wrapper, body.side-panel-main.side-panel-open #header.sticky-header .container { right: 300px; } body.side-panel-main #side-panel-trigger { display: block; cursor: pointer; z-index: 11; margin-right: 0 !important; } body.side-panel-main #side-panel-trigger-close a { display: block; position: absolute; z-index: 12; top: 0; left: auto; right: 0; width: 50px; height: 50px; font-size: 22px; line-height: 50px; color: #333; text-align: center; } body.side-panel-main #side-panel, body.side-panel-main #wrapper, body.side-panel-main.side-panel-open #header.sticky-header .container { -webkit-transition: right .4s ease; -o-transition: right .4s ease; transition: right .4s ease; } body.side-panel-main .full-overlay { opacity: 0; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(255,255,255,0.8); z-index: -1; pointer-events: none; -webkit-backface-visibility: hidden; -webkit-transition: opacity .3s ease; -o-transition: opacity .3s ease; transition: opacity .3s ease; } body.side-panel-main.side-panel-open .full-overlay { opacity: 1; z-index: 298; pointer-events: auto; } #content { position: relative; overflow: hidden; background-color: #FFF; } #content p { line-height: 1.8; } #content .container { position: relative; } #portfolio-filter { display: inline-block; margin: 30px auto 100px; float: none; list-style: none; text-align: center; } #portfolio-filter li { float: left; position: relative; } #portfolio-filter li a { display: block; position: relative; padding: 5px 18px; font-family: Dosis, arial, sans-serif; font-size: 15px; letter-spacing: 3px; text-transform: uppercase; line-height: 15px; color: #999; } #portfolio-filter li a:hover { color: #336699; } #portfolio-filter li.activeFilter a { color: #222 !important; border-bottom: 1px solid #336699; padding: 5px 18px; } #portfolio { position: relative; margin: 0 -12px -12px 0; } body:not(.device-touch) #portfolio { -webkit-transition: height .4s linear; -o-transition: height .4s linear; transition: height .4s linear; } .portfolio-item { position: relative; float: left; width: 276px; margin: 0 12px 12px 0; } .portfolio-overlay { position: absolute; top: 0; left: 0; width: 80%; height: 80%; top: 10%; left: 10%; opacity: 0; z-index: 2; text-align: center; background-color: rgba(0,0,0,0.8); } body:not(.device-touch):not(.device-xs):not(.device-xxs) .portfolio-overlay { -webkit-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out; } .portfolio-item:hover .portfolio-overlay { opacity: 1; width: 100%; height: 100%; top: 0; left: 0; } .portfolio-overlay a { position: absolute; top: 50%; left: 50%; width: 40px !important; height: 40px !important; margin: -18px 0 0 -70px; font-size: 22px; line-height: 40px; text-align: center; color: #fff; -webkit-backface-visibility: hidden; } body:not(.device-touch):not(.device-xs):not(.device-xxs) .portfolio-overlay a.left-icon { -webkit-transition: color .2s linear, background-color .2s linear, margin-left .2s linear, opacity .2s linear; -o-transition: color .2s linear, background-color .2s linear, margin-left .2s linear, opacity .2s linear; transition: color .2s linear, background-color .2s linear, margin-left .2s linear, opacity .2s linear; } body:not(.device-touch):not(.device-xs):not(.device-xxs) .portfolio-overlay a.right-icon { -webkit-transition: color .2s linear, background-color .2s linear, margin-right .2s linear, opacity .2s linear; -o-transition: color .2s linear, background-color .2s linear, margin-right .2s linear, opacity .2s linear; transition: color .2s linear, background-color .2s linear, margin-right .2s linear, opacity .2s linear; } .portfolio-overlay a.right-icon { left: auto; right: 50%; margin-left: 0; margin-right: -70px; } .portfolio-overlay a:hover { color: #f28b28; } .portfolio-item:hover .portfolio-overlay a.left-icon { margin-left: -50px; } .portfolio-item:hover .portfolio-overlay a.right-icon { margin-right: -50px; } #posts { position: relative; } .entry { position: relative; margin: 0 0 60px; padding: 0 0 15px; } #reviews { position: relative; } .product { position: relative; float: left; margin: 0 20px 30px 0; width: 270px; border: 1px solid transparent; -webkit-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; } .product:hover { border: 1px solid #777; } .feat-box { position: relative; margin-top: 20px; padding: 0 0 0 80px; } .feat-box:first-child { margin-top: 0; } .feat-box .feat-box-icon { display: block; position: absolute; width: 60px; height: 60px; top: 0; left: 0; } .feat-box .feat-box-icon a, .feat-box .feat-box-icon i, .feat-box .feat-box-icon img { display: block; position: relative; width: 100%; height: 100%; color: #336699; } .feat-box .feat-box-icon i, .feat-box .feat-box-icon img { border-radius: 50%; border: solid 2px #eee; } .feat-box .feat-box-icon i { font-style: normal; font-size: 25px; font-weight: normal; text-align: center; line-height: 56px; } .feat-box h2, .feat-box h3 { margin-bottom: 0; color: var(--tekst-grijs); } .feat-box p { margin: 8px 0 0 0; color: var(--tekst-grijs); } .feat-box h2 + .feat-box-icon, .feat-box h3 + .feat-box-icon { margin-top: 20px !important; }  .social-icon { display: block; float: left; margin: 4px 11px 7px 0; text-align: center !important; font-size: 28px; color: #FFF; cursor: pointer; font-style: normal; }  body:not(.device-touch) .social-icon { -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .social-icon { margin: 0 10px 5px 0; width: 40px; height: 40px; font-size: 20px; line-height: 38px !important; color: #555; text-shadow: none; border: 1px solid #AAA; overflow: hidden; } .social-icon i { display: block; position: relative; line-height: 38px; } body:not(.device-touch) .social-icon i { -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .social-icon:hover { color: #222 !important; border-color: transparent; } .toggle { display: block; position: relative; padding-bottom: 10px; margin: 0 0 10px 0; border-bottom: 1px dashed #ddd; } .toggle .togglet, .toggle .toggleta { display: block; position: relative; line-height: 40px; padding: 0 0 0 34px; margin: 0; font-size: 14px; font-weight: 400; color: #336699; text-transform: uppercase; cursor: pointer; } .toggle .togglet i { position: absolute; top: 0; left: 0; width: 16px; text-align: center; font-size: 21px; line-height: 40px; } .toggle .togglet i.toggle-open, .toggle .toggleta i.toggle-closed { display: none; } .toggle .toggleta i.toggle-open { display: block; } .toggle .togglec { display: block; position: relative; padding: 10px 0; } .tabs { position: relative; margin: 0 0 30px 0; } ul.tab-nav { margin: 0; border-bottom: 1px solid #DDD; list-style: none; } ul.tab-nav li { float: left; border: 1px solid transparent; border-bottom: 0; border-left: 0; height: 51px; } ul.tab-nav li:first-child { margin-left: 0; } ul.tab-nav li a { display: block; padding: 0 15px; color: #aaa; height: 50px; line-height: 47px; background-color: #fff; border: 1px solid transparent; font-size: 13px; text-transform: uppercase; font-weight: bold; } ul.tab-nav li.ui-tabs-active a { position: relative; top: 1px; color: var(--link-kleur) ; background-color: #FFF; border: 1px solid #ddd; border-top: 3px solid #f4f4f4; border-bottom: none; border-radius: 2px; } ul.tab-nav li a i { position: relative; top: 2px; font-size: 17px; margin-right: 5px !important; } ul.tab-nav li a > i { margin-top: -5px; } .pricing-box { margin: 0 10px 0 10px; position: relative; border: 1px solid rgba(0,0,0,0.075); border-radius: 1px; text-align: center; } .pricing-title { padding: 50px 0; background-color: #336699; border-bottom: 1px solid rgba(0, 0, 0, 0.5); border-radius: 3px 3px 0 0; } .pricing-price { position: relative; padding: 15px 0 18px; color: #336699; font-weight: 300; font-size: 45px; line-height: 1; background-color: #f8f8f8; } .pricing-price:after { content: ''; position: absolute; width: 100%; border-top: 2px dashed rgba(0,0,0,0.03); top: auto; bottom: 0; left: 0; } .pricing-price span { display: inline-block; vertical-align: top; margin: 7px 3px 0 0; font-size: 28px; font-weight: normal; } .pricing-price span.price-tenure, .pricing-price span.price-unit { vertical-align: baseline; font-size: 16px; font-weight: normal; color: var(--tekst-grijs); margin: 0 3px 0 3px; } .counter { font-size: 36px; font-weight: 300; color: var(--link-kleur) ; font-family: 'Open Sans', sans-serif; } .widget .counter { opacity: 0.7; } @-webkit-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .input-block-level { display: block; width: 100% !important; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #gotoTop { display: none; z-index: 299; position: fixed; width: 60px; height: 50px; background-color: #000; background-color: rgba(0,0,0,0.2); font-size: 25px; line-height: 45px; text-align: center; color: #fff; top: auto; left: auto; right: 30px; bottom: 50px; cursor: pointer; } body:not(.device-touch) #gotoTop { transition: background-color .2s linear; -webkit-transition: background-color .2s linear; -o-transition: background-color .2s linear; } .full-wide #gotoTop { bottom: 30px; } #gotoTop:hover { background-color: #336699; } #footer { position: relative; background-color: #fff; border-top: 10px solid rgba(0,0,0,0.1); } #footer .footer-widgets-wrap { position: relative; padding: 80px 0; } #footer .footer-widgets-wrap .footer-about { padding-bottom: 20px; } #footer .footer-widgets-wrap .footer-about p { padding: 0 0 15px; font-size: 16px; line-height: 30px; letter-spacing: 1px; } #footer.footer-gray { background-color: #f8f8f8; } .footer-widgets-wrap .col-1-third { margin-bottom: 0; } #copyrights { padding: 60px 0; color: #777; background-color: #fff; border-top: 1px solid #eee; font-size: 14px; line-height: 1.8; letter-spacing: 2px; } #copyrights a:first-child { margin-left: 0; } .widget { position: relative; margin-top: 50px; } .widget:first-child { margin-top: 0; } .widget p { font-size: 15px; } .widget_links ul, .widget_links li { list-style: none; margin: 0; } .widget_links li a { display: inline-block; padding: 0 0 15px; border: none !important; color: #999; font-size: 12px; text-transform: uppercase; } .widget_links li a:hover { color: #000; } .widget_links > ul > li:first-child { border-top: 0 !important; } .widget_links > ul { margin-top: -4px !important; } .full-wide #wrapper { width: 100%; margin: 0; box-shadow: none; } body:not(.no-transition) #wrapper { position: relative; opacity: 0; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes cubemove { 25% { -webkit-transform: translateX(82px) rotate(-90deg) scale(0.3) } 50% { -webkit-transform: translateX(82px) translateY(82px) rotate(-180deg) scale(0.3) } 75% { -webkit-transform: translateX(0px) translateY(82px) rotate(-270deg) scale(0.5) } 100% { -webkit-transform: rotate(-360deg) scale(1) } } @keyframes cubemove { 25% { transform: translateX(82px) rotate(-90deg) scale(0.3); -webkit-transform: translateX(82px) rotate(-90deg) scale(0.3); } 50% { transform: translateX(82px) translateY(82px) rotate(-180deg) scale(0.5); -webkit-transform: translateX(82px) translateY(82px) rotate(-180deg) scale(0.5); } 75% { transform: translateX(0px) translateY(82px) rotate(-270deg) scale(0.7); -webkit-transform: translateX(0px) translateY(82px) rotate(-270deg) scale(0.7); } 100% { transform: rotate(-360deg) scale(1); -webkit-transform: rotate(-360deg) scale(1); } } .dark, .dark h1, .dark h2, .dark h3 { color: #FFFFFF; } .dark a:hover { color: #EEE; } body.dark, .dark #wrapper, .dark #content, body.side-panel-main.dark #side-panel, body.side-panel-main #side-panel.dark { background-color: #282828; } body.side-panel-main.dark #side-panel .side-panel-wrap a, body.side-panel-main #side-panel.dark .side-panel-wrap a { color: #aaa; } body.side-panel-main.dark #side-panel .side-panel-wrap a:hover, body.side-panel-main #side-panel.dark .side-panel-wrap a:hover { color: #ccc; } .dark .section, .section.dark { background-color: #282828; border-color: rgba(255,255,255,0.1); } .dark #header:not(.transparent-header), #header.dark:not(.transparent-header) { background-color: #253645; border-bottom: 1px solid rgba(255,255,255,0.05); } .dark #header.sticky-header:not(.transparent-header) #header-wrap:not(.not-dark), #header.dark.sticky-header:not(.transparent-header) #header-wrap:not(.not-dark) { background-color: #ffffff; } .dark #header.wide-header #header-wrap:not(.not-dark), #header.wide-header.dark #header-wrap:not(.not-dark) { border-bottom-color: rgba(255,255,255,0.15); } .dark #logo a { color: #CCC; } .dark #header.wide-header #header-wrap:not(.not-dark) #logo, #header.wide-header.dark #header-wrap:not(.not-dark) #logo { border-right-color: rgba(255,255,255,0.15); } .dark #header-wrap:not(.not-dark) #main-menu > ul > li > a, .dark #header-wrap:not(.not-dark) #main-menu > .container > ul > li > a, .dark #header-wrap:not(.not-dark) #side-panel-trigger a, .dark #header-wrap:not(.not-dark) #side-panel-trigger a:hover { color: #333333; } .dark #header.wide-header #header-wrap:not(.not-dark) #main-menu > ul, #header.wide-header.dark #header-wrap:not(.not-dark) #main-menu > ul { border-right-color: rgba(255,255,255,0.15); } .dark #header-wrap:not(.not-dark) #main-menu > ul > li:hover a, .dark #header-wrap:not(.not-dark) #main-menu > ul > li.current a, .dark #header-wrap:not(.not-dark) #main-menu > .container > ul > li:hover a, .dark #header-wrap:not(.not-dark) #main-menu > .container > ul > li.current a { color: #336699; } .dark #main-menu:not(.not-dark) ul ul, #main-menu.dark ul ul { background-color: #ffffff; border-color: #dddddd; } .dark #main-menu:not(.not-dark) ul ul li, #main-menu.dark ul ul li { border-top-color: #eeeeee; } .dark #main-menu:not(.not-dark) ul ul li:first-child, #main-menu.dark ul ul li:first-child { border-top: 0; } .dark #main-menu:not(.not-dark) ul ul a, #main-menu.dark ul ul a { color: #333333 !important; } .dark #main-menu:not(.not-dark) ul ul li:hover > a, #main-menu.dark ul ul li:hover > a { background-color: rgba(51,102,153,0.08); color: #336699 !important; } .dark #main-menu.m-bg:not(.not-dark) > ul > li:hover > a, #main-menu.dark.m-bg > ul > li:hover > a { color: #EEE; background-color: var(--link-kleur) ; } .dark #main-menu.m-bg:not(.not-dark) > ul > li.current > a, #main-menu.dark.m-bg > ul > li.current > a { color: #EEE; } .dark #portfolio-filter { border-color: rgba(255,255,255,0.08); } .dark #portfolio-filter li a { color: #999; border-left-color: rgba(255,255,255,0.08); } .dark #portfolio-filter li a:hover { color: #EEE; } .dark #portfolio-filter li.activeFilter a { color: #FFF; } .dark .entry { border-bottom-color: rgba(255,255,255,0.08); } .dark .events .entry { background-color: rgba(0,0,0,0.2); border-bottom-color: rgba(0,0,0,0.1); } .dark .feat-box h3 { color: #CCC; } .dark .feat-box p { color: #888; } .dark .social-icon { color: #DDD !important; border-color: #DDD; } .dark .social-icon i:last-child { color: #FFF !important; } .dark .social-icon:hover { color: #FFF !important; border-color: transparent; } .dark .toggle .togglet, .dark .toggle .toggleta { color: #CCC; } .dark ul.tab-nav { border-bottom-color: #494949; } .dark ul.tab-nav li { border-color: #494949; } .dark ul.tab-nav li:first-child { border-left-color: #494949; } .dark ul.tab-nav li a { color: #DDD; background-color: rgba(0,0,0,0.15); } .dark ul.tab-nav li.ui-tabs-active a { background-color: #383838; } .dark .pricing-box { border-color: rgba(255,255,255,0.1); background-color: rgba(0,0,0,0.2); box-shadow: 0 1px 1px rgba(0,0,0,0.1); } .dark .pricing-title { background-color: rgba(255,255,255,0.03); text-shadow: 1px 1px 1px rgba(0,0,0,0.15); border-bottom-color: rgba(255,255,255,0.1); } .dark .pricing-title .balk-titel { color: #DDD; } .dark .pricing-price { color: #EEE; background-color: rgba(255,255,255,0.01); } .dark .pricing-price:after { border-top-color: rgba(255,255,255,0.1); }  .dark .counter { text-shadow: 1px 1px 1px rgba(0,0,0,0.1); } #footer.dark, .dark #footer { background-color: #181818; color: #CCC; } .dark #copyrights { background-color: rgba(0,0,0,0.2); color: rgba(255,255,255,0.25); border-top: 1px solid var(--link-kleur) ; } .dark .footer-widgets-wrap a { color: #CCC; } .dark .footer-widgets-wrap a:hover { color: #999; }  body.side-panel-main.dark #side-panel .widget, body.side-panel-main #side-panel.dark .widget { border-top-color: rgba(255,255,255,0.1); } body.side-panel-main.dark #side-panel #side-panel-trigger-close a, body.side-panel-main #side-panel.dark #side-panel-trigger-close a { color: #FFF; } .dark .widget p { opacity: 0.8; } .dark .widget_links li a { color: #CCC; } .dark .widget_links li a:hover { color: #AAA; } .dark code { color: #DF6F72; background-color: rgba(0,0,0,0.3); } .dark .nav > li > a:hover, .dark .nav > li > a:focus, .dark .nav .open > a, .dark .nav .open > a:hover, .dark .nav .open > a:focus { background-color: rgba(0,0,0,0.2); } .dark .panel { background-color: rgba(0,0,0,0.2); } @media (max-width: 991px) { .dark #main-menu:not(.not-dark) ul li, .dark #main-menu:not(.not-dark) ul ul, .dark #main-menu:not(.not-dark) ul ul li { border-top-color: rgba(255,255,255,0.1) !important; } body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu ul li, body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu ul ul, body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu ul ul li { border-top-color: #EEE !important; } body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > ul > li:hover a, body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > ul > li.current a, body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > div > ul > li:hover a, body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > div > ul > li.current a { color: #336699 !important; } body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu ul ul a, body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > ul > li:hover ul a, body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > ul > li.current ul a, body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > div > ul > li:hover ul a, body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > div > ul > li.current ul a { color: var(--link-kleur) !important; } }
.fa { display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; transform: translate(0, 0); } @-webkit-keyframes fa-spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } @keyframes fa-spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(359deg); transform: rotate(359deg); } }  .icon-screen-smartphone, .icon-bulb, .icon-arrow-down, .icon-plus { font-family: 'Simple-Line-Icons'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; } @media (min-width: 992px) and (max-width: 1199px) { #wrapper { width: 1000px; } .portfolio-item { width: 226px; } .product { width: 220px; } } @media (max-width: 991px) { #wrapper { width: 100%; margin: 0; box-shadow: none; } #header.wide-header .container { padding: 0 15px !important; margin: 0 auto; width: 750px !important; } #header, #header-wrap { height: auto !important; } #header.sticky-header #header-wrap { position: relative; } #logo { display: block; height: 90px; float: none; margin: 10px auto 0 !important; max-width: none; text-align: center; border: 0 !important; padding: 0 !important; } #logo a.logo-style { display: inline-block; } #main-menu { display: block; float: none; height: auto !important; } #main-menu-trigger { opacity: 1; pointer-events: auto; top: 25px; margin-top: 0; left: 0; z-index: 1; } #main-menu .container #main-menu-trigger { top: 5px; left: 0; } #main-menu > ul, #main-menu > div > ul { display: none; float: none !important; border: 0 !important; padding: 0 !important; margin: 0 !important; -webkit-transition: none; -o-transition: none; transition: none; } #main-menu > div > ul { margin-top: 60px !important; } body:not(.top-search-open) #main-menu-trigger { opacity: 1; -webkit-transition: opacity .2s .2s ease, top .4s ease; -o-transition: opacity .2s .2s ease, top .4s ease; transition: opacity .2s .2s ease, top .4s ease; } body.side-panel-main #side-panel-trigger a { right: 90px; } #main-menu ul { height: auto !important; } #main-menu ul li { float: none; margin: 0 !important; text-align: left !important; border-top: 1px solid #EEE; } #main-menu ul li:first-child { border-top: 0; } #main-menu ul li a { height: 50px !important; line-height: 50px !important; padding: 0 5px !important; border: none !important; margin: 0 !important; } #main-menu.m-bg > ul > li:hover > a, #main-menu.m-bg > ul > li.current > a { background-color: transparent !important; color: #444; text-shadow: none; } #main-menu ul li i, #main-menu.m-bg > ul > li > a i { line-height: 49px; } #main-menu ul ul { position: relative; width: auto; background-color: transparent !important; box-shadow: none; border: 0; border-top: 1px solid #EEE; z-index: 1; top: 0 !important; padding-left: 15px; } #main-menu ul ul ul { top: 0 !important; left: 0; } #main-menu ul ul.menu-pos-invert { left: 0; right: 0; } #main-menu ul ul ul.menu-pos-invert { right: 0; } #main-menu ul ul li { float: none; margin: 0; border-top: 1px solid #EEE; } #main-menu ul ul a { height: 44px !important; line-height: 44px !important; padding-left: 5px !important; font-size: 13px !important; text-transform: none; font-weight: 400; } #main-menu ul ul a i { line-height: 43px; } #main-menu ul ul li:hover > a { background-color: transparent !important; font-weight: 600; padding-left: 5px; color: #1ABC9C !important; } #main-menu ul ul i { line-height: inherit; } #side-panel-trigger { position: absolute; top: 0; left: auto; right: 20px; margin: 40px 0; border: none; -webkit-transition: margin .4s ease; -o-transition: margin .4s ease; transition: margin .4s ease; } #main-menu > div > #side-panel-trigger { margin: 20px 0 !important; } #portfolio:not(.portfolio-1) { margin: 0 -12px -12px 0 !important; } #portfolio:not(.portfolio-1) .portfolio-item { width: 232px; margin: 0 12px 12px 0; } .product { width: 226px; } @media (max-width: 767px) { .flat-banner.flat-banner-dark h3 { line-height: 1.6; } } } @media (max-width: 767px) { body { padding: 0 !important; } #wrapper { width: 100% !important; } #gotoTop { display: none !important; }  .col-1-third { width: 100%; margin-right: 0; float: none; margin-bottom: 50px !important; } #portfolio-filter { margin-bottom: 20px; } #portfolio-filter li { margin-bottom: 20px; } #portfolio-filter li a { text-align: center; padding: 5px 18px !important; border: 1px solid transparent; } #portfolio-filter li a:hover { color: #1ABC9C; } } @media (min-width: 480px) and (max-width: 767px) { .container, #header.wide-header .container { width: 470px !important; } #portfolio:not(.portfolio-1) { margin: 0 -6px -6px 0; } #portfolio:not(.portfolio-1) .portfolio-item { margin: 0 6px 6px 0; } #portfolio:not(.portfolio-1) .portfolio-item { width: 217px; } } @media (max-width: 479px) { .container, #header.wide-header .container { width: 310px !important; } body.side-panel-main #side-panel-trigger { right: -35px !important; } #portfolio:not(.portfolio-1) { margin: 0 !important; } #portfolio:not(.portfolio-1) .portfolio-item { width: 280px; } ul.tab-nav li { float: none; width: 100%; border-right: none; } ul.tab-nav li.ui-tabs-active a { border: 1px solid #ddd; } }
:root { --goud-op-wit: #cc7a00; --kleur-marine: #16324a; --tekst-grijs: #333333; --menu-kleur: #212121; --menu-sub-kleur: var(--kleur-marine); --menu-hover-achtergrond: var(--kleur-marine); --menu-hover-tekst: #fff; --menu-lijn: 1px solid var(--scheidingslijn-kleur); --menu-lijn-kleur: var(--scheidingslijn-kleur); --footer-achtergrond: var(--vak-creme); --footer-ruimte-boven-computer: 60px; --footer-ruimte-boven-mobiel: 40px; --footer-tekstkleur: #333; --tekst-letterafstand: 0.3px; --onderbalk-kleur: #6b6b6b; --onderbalk-letterafstand: 1px; --veld-achtergrond: var(--vak-creme); --veld-rand: 1px solid var(--scheidingslijn-kleur); --veld-hoeken: 10px; --veld-hoogte: 44px; --veld-tekstvak-hoogte: 102px; --veld-opvulling: 0 12px; --veld-tekstvak-opvulling: 10px 12px; --veld-lettergrootte: 16px; --veld-tekstkleur: #333; --veld-placeholder: #6b6b6b; --veld-focus: #336699; --veld-afstand: 14px; --formulier-groep-afstand: 22px; --keuze-afstand: 12px; --keuze-maat: 20px; --keuze-kleur: #336699; --melding-hoeken: 10px; --melding-opvulling: 12px 16px; --melding-fout-tekst: #7a4300; --melding-fout-achtergrond: #fdf1e2; --melding-gelukt-tekst: #176a63; --melding-gelukt-achtergrond: #e7f4f2; --kop-lettertype: Dosis, arial, sans-serif; --kop-gewicht: 400; --kop-kleur: var(--tekst-grijs); --kop-h5-kleur: var(--tekst-grijs); --kop-h6-kleur: var(--tekst-grijs); --kop-h1-maat-computer-klein: 44px; --kop-h1-maat-computer-hoofd: 40px; --kop-h1-maat-mobiel-klein: 30px; --kop-h1-maat-mobiel-hoofd: 26px; --kop-h2-maat-computer-klein: 32px; --kop-h2-maat-computer-hoofd: 28px; --kop-h2-maat-mobiel-klein: 26px; --kop-h2-maat-mobiel-hoofd: 23px; --kop-h3-maat-computer-klein: 30px; --kop-h3-maat-computer-hoofd: 27px; --kop-h3-maat-mobiel-klein: 24px; --kop-h3-maat-mobiel-hoofd: 21px; --kop-h4-maat-computer-klein: 27px; --kop-h4-maat-computer-hoofd: 24px; --kop-h4-maat-mobiel-klein: 22px; --kop-h4-maat-mobiel-hoofd: 20px; --kop-h5-maat-computer-klein: 24px; --kop-h5-maat-computer-hoofd: 22px; --kop-h5-maat-mobiel-klein: 21px; --kop-h5-maat-mobiel-hoofd: 19px; --kop-h6-maat-computer-klein: 22px; --kop-h6-maat-computer-hoofd: 20px; --kop-h6-maat-mobiel-klein: 20px; --kop-h6-maat-mobiel-hoofd: 18px; --kop-h1-hoofd: 1; --kop-h2-hoofd: 0; --kop-h3-hoofd: 1; --kop-h4-hoofd: 1; --kop-h5-hoofd: 1; --kop-h6-hoofd: 1; --kop-h1-maat-computer: calc(var(--kop-h1-maat-computer-klein) + (var(--kop-h1-maat-computer-hoofd) - var(--kop-h1-maat-computer-klein)) * var(--kop-h1-hoofd)); --kop-h1-maat-mobiel: calc(var(--kop-h1-maat-mobiel-klein) + (var(--kop-h1-maat-mobiel-hoofd) - var(--kop-h1-maat-mobiel-klein)) * var(--kop-h1-hoofd)); --kop-h2-maat-computer: calc(var(--kop-h2-maat-computer-klein) + (var(--kop-h2-maat-computer-hoofd) - var(--kop-h2-maat-computer-klein)) * var(--kop-h2-hoofd)); --kop-h2-maat-mobiel: calc(var(--kop-h2-maat-mobiel-klein) + (var(--kop-h2-maat-mobiel-hoofd) - var(--kop-h2-maat-mobiel-klein)) * var(--kop-h2-hoofd)); --kop-h3-maat-computer: calc(var(--kop-h3-maat-computer-klein) + (var(--kop-h3-maat-computer-hoofd) - var(--kop-h3-maat-computer-klein)) * var(--kop-h3-hoofd)); --kop-h3-maat-mobiel: calc(var(--kop-h3-maat-mobiel-klein) + (var(--kop-h3-maat-mobiel-hoofd) - var(--kop-h3-maat-mobiel-klein)) * var(--kop-h3-hoofd)); --kop-h4-maat-computer: calc(var(--kop-h4-maat-computer-klein) + (var(--kop-h4-maat-computer-hoofd) - var(--kop-h4-maat-computer-klein)) * var(--kop-h4-hoofd)); --kop-h4-maat-mobiel: calc(var(--kop-h4-maat-mobiel-klein) + (var(--kop-h4-maat-mobiel-hoofd) - var(--kop-h4-maat-mobiel-klein)) * var(--kop-h4-hoofd)); --kop-h5-maat-computer: calc(var(--kop-h5-maat-computer-klein) + (var(--kop-h5-maat-computer-hoofd) - var(--kop-h5-maat-computer-klein)) * var(--kop-h5-hoofd)); --kop-h5-maat-mobiel: calc(var(--kop-h5-maat-mobiel-klein) + (var(--kop-h5-maat-mobiel-hoofd) - var(--kop-h5-maat-mobiel-klein)) * var(--kop-h5-hoofd)); --kop-h6-maat-computer: calc(var(--kop-h6-maat-computer-klein) + (var(--kop-h6-maat-computer-hoofd) - var(--kop-h6-maat-computer-klein)) * var(--kop-h6-hoofd)); --kop-h6-maat-mobiel: calc(var(--kop-h6-maat-mobiel-klein) + (var(--kop-h6-maat-mobiel-hoofd) - var(--kop-h6-maat-mobiel-klein)) * var(--kop-h6-hoofd)); --kop-h1-regelhoogte-computer: 1.2; --kop-h1-regelhoogte-mobiel: 1.5; --kop-h2-regelhoogte-computer: 1.3; --kop-h2-regelhoogte-mobiel: 1.5; --kop-h3-regelhoogte-computer: 1.35; --kop-h3-regelhoogte-mobiel: 1.5; --kop-h4-regelhoogte-computer: 1.4; --kop-h4-regelhoogte-mobiel: 1.5; --kop-h5-regelhoogte-computer: 1.5; --kop-h5-regelhoogte-mobiel: 1.5; --kop-h6-regelhoogte-computer: 1.5; --kop-h6-regelhoogte-mobiel: 1.5; --kop-h1-letterafstand-computer: 2px; --kop-h1-letterafstand-mobiel: 2px; --kop-h2-letterafstand-computer: 1px; --kop-h2-letterafstand-mobiel: 2px; --kop-h3-letterafstand-computer: 1px; --kop-h3-letterafstand-mobiel: 2px; --kop-h4-letterafstand-computer: 1px; --kop-h4-letterafstand-mobiel: 2px; --kop-h5-letterafstand-computer: 1px; --kop-h5-letterafstand-mobiel: 1px; --kop-h6-letterafstand-computer: 1px; --kop-h6-letterafstand-mobiel: 1px; --kop-h1-hoofdletters: uppercase; --kop-h2-hoofdletters: none; --kop-eerste-letter: uppercase; --kop-h3-hoofdletters: uppercase; --kop-h4-hoofdletters: uppercase; --kop-h5-hoofdletters: uppercase; --kop-h6-hoofdletters: uppercase; --kop-hero-hoofdletters: uppercase; --kop-inleiding-letterafstand: 1px; --kop-inleiding-kleur: var(--tekst-grijs); --kop-h1-maat: var(--kop-h1-maat-computer); --kop-h1-regelhoogte: var(--kop-h1-regelhoogte-computer); --kop-h1-letterafstand: var(--kop-h1-letterafstand-computer); --kop-h2-maat: var(--kop-h2-maat-computer); --kop-h2-regelhoogte: var(--kop-h2-regelhoogte-computer); --kop-h2-letterafstand: var(--kop-h2-letterafstand-computer); --kop-h3-maat: var(--kop-h3-maat-computer); --kop-h3-regelhoogte: var(--kop-h3-regelhoogte-computer); --kop-h3-letterafstand: var(--kop-h3-letterafstand-computer); --kop-h4-maat: var(--kop-h4-maat-computer); --kop-h4-regelhoogte: var(--kop-h4-regelhoogte-computer); --kop-h4-letterafstand: var(--kop-h4-letterafstand-computer); --kop-h5-maat: var(--kop-h5-maat-computer); --kop-h5-regelhoogte: var(--kop-h5-regelhoogte-computer); --kop-h5-letterafstand: var(--kop-h5-letterafstand-computer); --kop-h6-maat: var(--kop-h6-maat-computer); --kop-h6-regelhoogte: var(--kop-h6-regelhoogte-computer); --kop-h6-letterafstand: var(--kop-h6-letterafstand-computer); } @media (max-width: 767px) { :root { --kop-h1-maat: var(--kop-h1-maat-mobiel); --kop-h1-regelhoogte: var(--kop-h1-regelhoogte-mobiel); --kop-h1-letterafstand: var(--kop-h1-letterafstand-mobiel); --kop-h2-maat: var(--kop-h2-maat-mobiel); --kop-h2-regelhoogte: var(--kop-h2-regelhoogte-mobiel); --kop-h2-letterafstand: var(--kop-h2-letterafstand-mobiel); --kop-h3-maat: var(--kop-h3-maat-mobiel); --kop-h3-regelhoogte: var(--kop-h3-regelhoogte-mobiel); --kop-h3-letterafstand: var(--kop-h3-letterafstand-mobiel); --kop-h4-maat: var(--kop-h4-maat-mobiel); --kop-h4-regelhoogte: var(--kop-h4-regelhoogte-mobiel); --kop-h4-letterafstand: var(--kop-h4-letterafstand-mobiel); --kop-h5-maat: var(--kop-h5-maat-mobiel); --kop-h5-regelhoogte: var(--kop-h5-regelhoogte-mobiel); --kop-h5-letterafstand: var(--kop-h5-letterafstand-mobiel); --kop-h6-maat: var(--kop-h6-maat-mobiel); --kop-h6-regelhoogte: var(--kop-h6-regelhoogte-mobiel); --kop-h6-letterafstand: var(--kop-h6-letterafstand-mobiel); } } h1, h2, h3 { font-family: var(--kop-lettertype); font-weight: var(--kop-gewicht); color: var(--kop-kleur); } h1 { font-size: var(--kop-h1-maat); line-height: var(--kop-h1-regelhoogte); letter-spacing: var(--kop-h1-letterafstand); text-transform: var(--kop-h1-hoofdletters); } h2 { font-size: var(--kop-h2-maat); line-height: var(--kop-h2-regelhoogte); letter-spacing: var(--kop-h2-letterafstand); text-transform: var(--kop-h2-hoofdletters); } h1::first-letter, h2::first-letter, h3::first-letter { text-transform: var(--kop-eerste-letter); } h3 { font-size: var(--kop-h3-maat); line-height: var(--kop-h3-regelhoogte); letter-spacing: var(--kop-h3-letterafstand); text-transform: var(--kop-h3-hoofdletters); } @media (max-width: 767px) { h1:not(.slider-caption *), h2:not(.slider-caption *), h3:not(.slider-caption *) { overflow-wrap: break-word; } h1:not(.slider-caption *) { font-size: var(--kop-h1-maat) !important; text-transform: var(--kop-h1-hoofdletters) !important; } h2:not(.slider-caption *) { font-size: var(--kop-h2-maat) !important; text-transform: var(--kop-h2-hoofdletters) !important; } h3:not(.slider-caption *) { font-size: var(--kop-h3-maat) !important; text-transform: var(--kop-h3-hoofdletters) !important; } } :root { --titelbalk-achtergrond: #f8f8f8; --titelbalk-rand-onder: 1px solid #eee; --titelbalk-padding-computer: 70px 0; --header-ruimte-onder-logo-mobiel: 1px; --titelbalk-padding-mobiel: 13px 0 14px; --titelbalk-titelkleur: #414141; --titelbalk-h1-regelhoogte-mobiel: 1.5; --broodkruimel-lettergrootte: 12px; --broodkruimel-afstand-computer: 18px; --broodkruimel-afstand-mobiel: 0; --broodkruimel-padding-boven-mobiel: 11px; --broodkruimel-kleur-link: #336699; --broodkruimel-kleur-link-hover: var(--link-kleur); --broodkruimel-kleur-actief: var(--tekst-grijs); --broodkruimel-scheidingsteken-kleur: #ccc; --titelbalk-ruimte-onder: 40px; } #main-title { position: relative; padding: var(--titelbalk-padding-computer); background-color: var(--titelbalk-achtergrond); border-bottom: var(--titelbalk-rand-onder); } #main-title .container { position: relative; } #main-title h1 { padding: 0; margin: 0; color: var(--titelbalk-titelkleur); } .breadcrumb { list-style: none; border-radius: 4px; font-size: var(--broodkruimel-lettergrootte); padding: 0; margin: 0; background-color: transparent; } .breadcrumb > li + li:before { padding: 0 5px; color: var(--broodkruimel-scheidingsteken-kleur); content: "/\00a0"; } .breadcrumb a { color: var(--broodkruimel-kleur-link); } .breadcrumb a:hover { color: var(--broodkruimel-kleur-link-hover); } .breadcrumb > .active { color: var(--broodkruimel-kleur-actief); } .content-wrap { position: relative; padding: var(--titelbalk-ruimte-onder) 0 30px 0; } @media (min-width: 768px) { #main-title .breadcrumb { margin-top: var(--broodkruimel-afstand-computer); } } @media (max-width: 767px) { #main-title { padding: var(--titelbalk-padding-mobiel); text-align: center; } #main-title h1 { line-height: var(--titelbalk-h1-regelhoogte-mobiel); } #main-title .breadcrumb { position: relative; margin-top: var(--broodkruimel-afstand-mobiel); padding-top: var(--broodkruimel-padding-boven-mobiel); } .breadcrumb a, .link-kolommen .link-aanraak { position: relative; } .breadcrumb a::after { content: ""; position: absolute; left: -4px; right: -4px; top: 50%; height: 44px; transform: translateY(-50%); } #content .content-wrap > .container:first-child > :first-child, #content .content-wrap > .container.t-margin:first-child, #content > .content-wrap.t-margin:first-child, body:not(:has(.colored-box1)) .flat-banner:not(#r159) > :is(a.button):first-child, body:not(:has(.colored-box1)) .flat-banner:not(#r159) > .container > :is(a.button):first-child, body:not(:has(.colored-box1)) .flat-banner:not(#r159) > .cta-rij:first-child, body:not(:has(.colored-box1)) .flat-banner:not(#r159) > .container > .cta-rij:first-child > a.button:first-child, body:not(:has(.colored-box1)) .flat-banner:not(#r159) > .cta-rij:first-child > a.button:first-child { margin-top: 0 !important; }  .container:has(.flat-banner:not(.footer-stick):last-child) + .container + .content-wrap:not(#r167a):not(#r167b):not(#r167c):not(#r167d):not(#r167e):not(#r167f):not(#r167g), body *:has(> .flat-banner:not(.footer-stick)) + .content-wrap:not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e), body .flat-banner:not(.footer-stick):not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e) ~ .content-wrap:not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e) { padding-top: 0 !important; } } :root { --band-blauw: #336699; --band-tekstkleur: #fff; --band-padding-donker: 30px 200px 30px 30px; --band-padding-mobiel: 30px 20px; --balk-titel-maat-computer: var(--kop-h6-maat-computer); --balk-titel-maat-mobiel: var(--kop-h6-maat-mobiel); --balk-titel-letterafstand-computer: 1px; --balk-titel-letterafstand-mobiel: 2px; --balk-titel-regelhoogte: 1.5; --balk-titel-kleur: #fff; --vak-knop-onder: 36px; --vak-knop-marge: 5px; --balk-padding: 30px; --sluitband-overlap: 80px; } .flat-banner { position: relative; padding: 30px 200px 30px 0; } .flat-banner h3 { margin-bottom: 0; } .flat-banner a.button { position: absolute; top: 65%; margin: 0; margin-top: -18px; left: auto; right: 0; } .flat-banner a.button.button-small, .flat-banner a.button.button-large { margin-top: -15px; } .flat-banner-uppercase, #footer .formulier input.input-block-level::placeholder, #footer .formulier textarea.input-block-level::placeholder { text-transform: uppercase; }  .flat-banner.flat-banner-dark a.button { right: 30px; } .flat-banner.flat-banner-dark { border: 0 !important; background-color: var(--band-petrol); background-image: linear-gradient(to bottom, var(--band-petrol-licht), var(--band-petrol)); padding: var(--band-padding-donker); border-radius: 3px; } .flat-banner-full { border-radius: 0 !important; border-left: 0 !important; border-right: 0 !important; padding: 65px 0 !important; padding-top: var(--band-padding-boven, 65px) !important; padding-bottom: var(--band-padding-onder, 65px) !important; } .flat-banner-full a.button { right: 15px !important; } .flat-banner.flat-banner-center { text-align: center; padding: 30px 12px; } .flat-banner.flat-banner-center a.button { position: relative; top: 0; margin: 20px 0 0; left: 0 !important; right: 0; } @media (max-width: 991px) { .flat-banner:not(.flat-banner-full) { padding: var(--band-padding-mobiel) !important; } } @media (max-width: 991px) { .flat-banner a.button { position: relative !important; top: 0 !important; margin: 20px 0 0 !important; left: 0 !important; right: 0; } } .cta-contact-details { margin-top: 15px; } .cta-rij { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; } .cta-rij > * { margin: 0 !important; } .center .cta-rij, .flat-banner-center .cta-rij { justify-content: center; } @media (max-width: 767px) { body:not(:has(.colored-box1)) .flat-banner:not(#r159) .cta-rij, body:not(:has(.colored-box1)) .flat-banner:not(#r159) .cta-rij > :last-child, body:not(:has(.colored-box1)) .flat-banner:not(#r159) > .container > :last-child, body:not(:has(.colored-box1)) .section:not(#r159) > .container > .center > :last-child, body *:has(+ .flat-banner):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) > :last-child, body *:has(+ .flat-banner):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) > :last-child > :last-child, body *:has(+ .flat-banner):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) > :last-child > :last-child > :last-child, body *:has(+ .flat-banner):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) > :has(+ .clear:last-child) > :last-child > :last-child, body *:has(+ .clear + .flat-banner):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h), body *:has(+ .clear + .flat-banner):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) > :last-child, body *:has(+ .clear + .flat-banner):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) > :last-child > :last-child, body *:has(+ .clear + .flat-banner):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) > :last-child > :last-child > :last-child, body *:has(+ .stappen-blok):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) > :last-child, body *:has(+ .clear + .stappen-blok):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) > :last-child > :last-child > :last-child, body *:has(+ .clear + .container > .flat-banner:first-child):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h), body *:has(+ .clear + .container > .flat-banner:first-child):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) > :last-child, body *:has(+ div > .flat-banner:first-child):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h), body *:has(+ div > .flat-banner:first-child):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) > :last-child, body *:has(+ div > .flat-banner:first-child):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) > :has(+ .clear:last-child), body *:has(+ div > .flat-banner:first-child):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) > :last-child > :last-child, body *:has(+ div > .flat-banner:first-child):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) > :last-child > :has(+ .clear:last-child), body *:has(+ div > .flat-banner:first-child):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) > :has(+ .clear:last-child) > :last-child, body *:has(+ div > .flat-banner:first-child):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) > :last-child > :last-child > :last-child, .container:has(> .flat-banner:not(.footer-stick):last-child):has(+ .flat-banner) > .flat-banner:last-child:not(#r167a):not(#r167b):not(#r167c):not(#r167d):not(#r167e):not(#r167f):not(#r167g), *:has(> .container > .flat-banner:not(.footer-stick):last-child):has(+ .flat-banner) > .container > .flat-banner:last-child:not(#r167a):not(#r167b):not(#r167c):not(#r167d):not(#r167e):not(#r167f):not(#r167g), .pricing-box > .flat-banner:last-child:not(#r167a):not(#r167b):not(#r167c):not(#r167d):not(#r167e):not(#r167f):not(#r167g), body:not(:has(#slider)) .container:has(+ .citaat-band) > :last-child:not(#r175a):not(#r175b):not(#r175c):not(#r175d), #footer .footer-widgets-wrap > div { margin-bottom: 0 !important; } } @media (max-width: 767px) { .cta-contact-details:not(#r165a):not(#r165b):not(#r165c) { margin-top: 27px !important; } } @media (max-width: 767px) { .cta-contact-details a:not(#r165a):not(#r165b):not(#r165c) { display: block; white-space: nowrap; width: fit-content; margin-left: auto; margin-right: auto; } } @media (max-width: 767px) { .cta-contact-details .cta-streep + a { margin-top: 20px; } } .flat-banner.flat-banner-dark h2, .flat-banner.flat-banner-dark h3 { color: var(--band-tekstkleur); } .dark .flat-banner > span, .dark .flat-banner > .container > span { color: rgba(255,255,255,0.8); } .dark .flat-banner.flat-banner-dark:not(.flat-banner-flat) { background-color: rgba(0,0,0,0.3); }  .flat-banner-dark .cta-contact-details a { color: var(--band-tekstkleur); } .pricing-title { padding: var(--balk-padding) 0; } .pricing-title .balk-titel { display: flex; align-items: center; justify-content: center; min-height: 2lh; margin: 0; font-family: var(--kop-lettertype); font-weight: var(--kop-gewicht); font-size: var(--balk-titel-maat-computer); line-height: var(--balk-titel-regelhoogte); letter-spacing: var(--balk-titel-letterafstand-computer); text-transform: uppercase; color: var(--balk-titel-kleur); text-align: center; text-wrap: balance; } @media (max-width: 767px) { .pricing-title .balk-titel { font-size: var(--balk-titel-maat-mobiel); letter-spacing: var(--balk-titel-letterafstand-mobiel); overflow-wrap: break-word; } }  section.url h2, section.url p, section.url a:not(.button):not(#r284):not(#r284b):not(#r284c):hover { color: #fff; } :root { } body:has(#slider) .content-wrap .footer-stick { margin-bottom: calc(var(--sluitband-overlap) * -1) !important; } @media (min-width: 768px) {  body:not(:has(#slider)) .container:has(+ .clear + .footer-stick) .entry:last-child:not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g), body:not(:has(#slider)) .container:has(+ .footer-stick) .entry:last-child:not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g), body:not(:has(#slider)) .content-wrap:has(+ .container > .clearfix > .flat-banner:first-child):not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g), body *:has(+ .flat-banner-flat):not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e) > :last-child, body *:has(+ .flat-banner-flat):not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e) > :last-child > :last-child, body *:has(+ .clear + .container > .flat-banner-flat:first-child):not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e), body *:has(+ div > .flat-banner-flat:first-child):not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e), body *:has(+ div > .flat-banner-flat:first-child):not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e) > :last-child, body .content-wrap:has(.flat-banner-flat:not(.footer-stick)):not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e) { padding-bottom: 0 !important; } } @media (max-width: 767px) { body:not(:has(.colored-box1)) .flat-banner:not(#r159), body:not(:has(.colored-box1)) .section:has(> .container > .center > h2.white):not(#r159), body:not(:has(.colored-box1)) .section.dark:has(> .container > .center > h2):not(#r159) { padding-top: 40px !important; padding-bottom: 40px !important; } body:not(:has(.colored-box1)) .entry:not(#r159):not(:has(+ .flat-banner)):not(:has(+ .clear + .flat-banner)):not(:has(~ .entry)):not(:last-child) { margin-bottom: 40px !important; padding-bottom: 0 !important; } body .flat-banner:not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h), body .flat-banner:not(.footer-stick):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) + *:not(.clear):not(.common-height):not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) { margin-top: 38px !important; } } @media (min-width: 768px) {  body:not(:has(#slider)) *:has(+ .flat-banner):not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g) > :last-child, body:not(:has(#slider)) *:has(+ .flat-banner):not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g) > :last-child > :last-child, body:not(:has(#slider)) *:has(+ .flat-banner):not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g) > :has(+ .clear:last-child) > :last-child > :last-child, body:not(:has(#slider)) *:has(+ .clear + .flat-banner):not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g), body:not(:has(#slider)) *:has(+ .clear + .flat-banner):not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g) > :last-child, body:not(:has(#slider)) *:has(+ .clear + .flat-banner):not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g) > :last-child > :last-child, body:not(:has(#slider)) *:has(+ .clear + .flat-banner):not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g) > :last-child > :last-child > :last-child, body:not(:has(#slider)) *:has(+ .stappen-blok):not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g) > :last-child, body:not(:has(#slider)) .container:has(> .flat-banner:not(.footer-stick):last-child):has(+ .flat-banner) > .flat-banner:last-child:not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g), body:not(:has(#slider)) *:has(> .container > .flat-banner:not(.footer-stick):last-child):has(+ .flat-banner) > .container > .flat-banner:last-child:not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g), body:not(:has(#slider)) .container:has(+ .clear + .footer-stick) .toggle:last-child:not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g), body:not(:has(#slider)) *:has(+ .flat-banner:not(.footer-stick)) > .flat-banner:not(.footer-stick):last-child:not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g), body:not(:has(#slider)) *:has(+ .flat-banner:not(.footer-stick)) > :last-child > :last-child > .flat-banner:not(.footer-stick):last-child:not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g), body *:has(+ .flat-banner-flat):not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e) > :last-child, body *:has(+ .clear + .container > .flat-banner-flat:first-child):not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e), body *:has(+ .clear + .container > .flat-banner-flat:first-child):not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e) > :last-child, body *:has(+ div > .flat-banner-flat:first-child):not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e), body *:has(+ div > .flat-banner-flat:first-child):not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e) > :last-child, body *:has(+ div > .flat-banner-flat:first-child):not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e) > :has(+ .clear:last-child), body *:has(+ div > .flat-banner-flat:first-child):not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e) > :last-child > :last-child, body *:has(+ div > .flat-banner-flat:first-child):not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e) > :last-child > :has(+ .clear:last-child), body *:has(+ div > .flat-banner-flat:first-child):not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e) > :has(+ .clear:last-child) > :last-child, body *:has(+ div > .flat-banner-flat:first-child):not(#r164a):not(#r164b):not(#r164c):not(#r164d):not(#r164e) > :last-child > :last-child > :last-child { margin-bottom: 0 !important; } } @media (min-width: 768px) { body:not(:has(#slider)) .flat-banner:not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g) { margin-top: 38px !important; } body:not(:has(#slider)) .flat-banner:not(.footer-stick):last-child:not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g) { margin-bottom: 48px !important; } body:not(:has(#slider)) *:has(> .flat-banner:not(.footer-stick)) + .content-wrap:not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g), body:not(:has(#slider)) .flat-banner:not(.footer-stick) ~ .content-wrap:not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g), body:not(:has(#slider)) *:has(> * > .flat-banner:not(.footer-stick):last-child) + .container:empty + .content-wrap:not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g) { padding-top: 0 !important; } body:not(:has(#slider)) *:has(> * > .flat-banner:not(.footer-stick):last-child) + .container:empty + .content-wrap > :first-child:not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g), body:not(:has(#slider)) *:has(> .flat-banner:not(.footer-stick):last-child) + .content-wrap > :first-child:not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g) { margin-top: 0 !important; } body:not(:has(#slider)) .flat-banner:not(.footer-stick):not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g) + *:not(.clear):not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g), body:not(:has(#slider)) .flat-banner.footer-stick:not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g), body:not(:has(#slider)) *:has(> .flat-banner:not(.footer-stick):last-child) + .flat-banner:not(.footer-stick):not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g), body:not(:has(#slider)) *:has(> :last-child > :last-child > .flat-banner:not(.footer-stick):last-child) + .flat-banner:not(.footer-stick):not(#r171a):not(#r171b):not(#r171c):not(#r171d):not(#r171e):not(#r171f):not(#r171g) { margin-top: 48px !important; } } @media (min-width: 768px) { body:not(:has(#slider)) .container:has(+ .citaat-band) > :last-child:not(#r175a):not(#r175b):not(#r175c):not(#r175d) { margin-bottom: 0 !important; } } @media (max-width: 767px) {  body .flat-banner:not(.footer-stick):last-child:not(#r163d):not(#r163e):not(#r163f):not(#r163g):not(#r163h) { margin-bottom: 40px !important; } } @media (min-width: 768px) { body:has(#slider) .flat-banner.footer-stick { margin-top: -14px; } body:has(#slider) .flat-banner.footer-stick { --band-padding-onder: calc(40px + var(--sluitband-overlap)); } body:has(#slider) .flat-banner.footer-stick { --band-padding-boven: 40px; } } @media (max-width: 767px) {  body:has(#slider) #content .col-1-third, body:has(#slider) #content .footer-stick .container, .faq-blok > h2 { text-align: center; } } :root { --knop-achtergrond: #336699; --knop-hover-op-wit: #0a494c; --knop-hover-op-blauw: #264d73; --knop-achtergrond-hover: var(--knop-hover-op-wit); --knop-tekstkleur: #fff; --knop-lettergrootte: 14px; --knop-gewicht: 400; --knop-letterafstand: 1px; --knop-hoogte: 40px; --knop-padding-zij: 22px; --knop-radius: 2px; --band-petrol-licht: #0e676c; --band-petrol: #0a494c; --band-antraciet-licht: #4a4a4a; --band-antraciet: #404040; --knop-donker-achtergrond: #f2b544; --knop-donker-tekst: #153746; --knop-donker-hover: #fed484; --link-kleur: #336699; --link-kleur-hover: #264d73; --link-kleur-donker: var(--knop-donker-achtergrond); --link-kleur-donker-hover: #ffffff; --link-onderlijn-donker-dikte: 2px; --link-kleur-op-blauw: #8fb8e0; --link-kleur-op-blauw-hover: #b5d0ec; --link-onderlijn: 1px solid rgba(51, 102, 153, 0.45); --link-onderlijn-hover: rgba(38, 77, 115, 0.7); --link-onderlijn-donker: rgba(143, 184, 224, 0.5); --link-onderlijn-donker-hover: rgba(181, 208, 236, 0.7); } .button { display: inline-block; position: relative; cursor: pointer; outline: none; white-space: nowrap; margin: 5px; padding: 0 var(--knop-padding-zij); font-size: var(--knop-lettergrootte); height: var(--knop-hoogte); line-height: var(--knop-hoogte); background-color: var(--knop-achtergrond); color: var(--knop-tekstkleur); font-weight: var(--knop-gewicht); text-transform: uppercase; letter-spacing: var(--knop-letterafstand); border: none; border-radius: var(--knop-radius); } .button:focus { color: var(--knop-tekstkleur); } body:not(.device-touch) .button { transition: all .2s ease-in-out; } .button:hover { background-color: var(--knop-achtergrond-hover); color: var(--knop-tekstkleur); } .button:is(a[href], input, button):not(.button-desc) { padding: 0 var(--knop-padding-zij); height: var(--knop-hoogte); line-height: var(--knop-hoogte); font-size: var(--knop-lettergrootte); font-weight: var(--knop-gewicht); letter-spacing: var(--knop-letterafstand); text-transform: uppercase; border-radius: var(--knop-radius); background-color: var(--knop-achtergrond) !important; color: var(--knop-tekstkleur); border: 0; } .button:is(a[href], input, button):not(.button-desc):hover, .button:is(a[href], input, button):not(.button-desc):focus { background-color: var(--knop-achtergrond-hover) !important; color: var(--knop-tekstkleur); } @media (max-width: 991px) { .button:is(a[href], input, button):not(.button-desc):not(.button-reveal) { height: auto; min-height: var(--knop-hoogte); line-height: 20px; padding-top: 10px; padding-bottom: 10px; white-space: normal; max-width: 100%; box-sizing: border-box; } } .button-light { background-color: #EEE; color: #6f6f6f; } .button-light:focus { color: #6f6f6f; } .button i { position: relative; top: -1px; line-height: 1; margin-right: 5px; } .breadcrumb > li { display: inline-block; } .button.button-reveal { padding: 0 28px; overflow: hidden; } .button.button-reveal i { display: block; position: absolute; top: 0; left: -32px; width: 32px; height: var(--knop-hoogte); line-height: var(--knop-hoogte); margin: 0; text-align: center; } .button.button-reveal span { display: inline-block; position: relative; left: 0; } body:not(.device-touch) .button.button-reveal i, body:not(.device-touch) .button.button-reveal span { transition: left 0.3s ease, right 0.3s ease; } .button.button-reveal.button-small { padding: 0 22px; } .button.button-reveal.button-small i { left: -26px; width: 26px; height: 34px; line-height: 34px; } .button.button-reveal.button-large { padding: 0 32px; } .button.button-reveal.button-large i { left: -38px; width: 38px; height: 46px; line-height: 46px; } .button.button-reveal:hover i { left: 0; } .button.button-reveal:hover span { left: 13px; } .button.button-reveal.button-small:hover span { left: 10px; } .button.button-reveal.button-large:hover span { left: 16px; } @media (max-width: 767px) { body:not(:has(.colored-box1)) .flat-banner > .container:has(> a.button:first-child):not(#r160) { display: flex; flex-wrap: wrap; gap: 20px 10px; } body:not(:has(.colored-box1)) .flat-banner > .container:has(> a.button:first-child):not(#r160) > :not(a.button) { flex: 0 0 100%; } } section.url { background-color: var(--band-antraciet); background-image: linear-gradient(to bottom, var(--band-antraciet-licht), var(--band-antraciet)); color: #fff; }  .button.knop-donker, .flat-banner-dark:not(.flat-banner-flat) .button, .gemeente-band-donker .button, .contact-kaart-antraciet .button { --knop-achtergrond: var(--knop-donker-achtergrond); --knop-achtergrond-hover: var(--knop-donker-hover); --knop-tekstkleur: var(--knop-donker-tekst); } section.url a:not(.button):not(#r284) { color: var(--knop-donker-achtergrond); } .content-wrap a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)), .flat-banner a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)), #footer a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)) { color: var(--link-kleur); border-bottom: var(--link-onderlijn); } .content-wrap a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)):hover, .flat-banner a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)):hover, #footer a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)):hover, ul#portfolio-filter li a:hover, ul#portfolio-filter li a:focus-visible { color: var(--link-kleur-hover); border-bottom-color: var(--link-onderlijn-hover); } .flat-banner-dark a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)):hover { color: var(--link-kleur-donker-hover); border-bottom-color: var(--link-onderlijn-donker-hover); } .flat-banner-dark:not(.flat-banner-flat), .contact-kaart, .gemeente-band-donker { --link-onderlijn-donker: currentColor; --link-onderlijn-donker-hover: currentColor; } .flat-banner-dark:not(.flat-banner-flat) a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)), .content-wrap .contact-kaart a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)), .content-wrap.gemeente-band-donker .reviews-alle a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)) { border-bottom-width: var(--link-onderlijn-donker-dikte); } .flat-banner-dark:not(.flat-banner-flat) a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)):focus-visible { color: var(--link-kleur-donker-hover); } .inline-link { color: var(--link-kleur); text-decoration: underline !important; } .inline-link:hover { color: var(--link-kleur-hover); } .content-wrap .inline-link, #footer .inline-link { text-decoration: none !important; } @media (max-width: 991px) { .content-wrap a:not(.button) { overflow-wrap: anywhere; } } :root { --label-kleur: var(--link-kleur); --label-rand: 2px solid var(--link-kleur); } ul#portfolio-filter li a { color: var(--link-kleur); border: 0; border-bottom: var(--link-onderlijn); } :root { --lijst-icoon-kleur: var(--goud-op-wit); --lijst-icoon-afstand: 6px; --lijst-markering-kleur: var(--link-kleur); --checklist-icoon-afstand: 8px; --stappenlijst-icoon-afstand: 6px; --checklist-item-afstand: 12px; --stappenlijst-item-afstand: 10px; --gerelateerd-item-afstand: 8px; --checklist-padding: 40px 40px 30px; --checklist-padding-compact: 24px 26px; --checklist-kolommen: 2; --checklist-kolomafstand: 40px; --checklist-titel-afstand: 25px; --linklijst-kolommen: 4; --linklijst-kolommen-tablet: 2; --linklijst-kolommen-mobiel: 1; --linklijst-kolomafstand: 28px; --linklijst-rijafstand: 40px; --linklijst-rijafstand-mobiel: 34px; --citaat-basis-padding: 10px 20px; --citaat-basis-marge-onder: 30px; --citaat-basis-lettergrootte: 16px; --citaat-basis-cursief: italic; --citaat-basis-kleur: #767676; --citaat-basis-alinea-afstand: 15px; --lijst-markering: disc; --lijst-inspringing: 20px; --lijst-item-ruimte: 8px; --lijst-lettergrootte: 16px; --lijst-regelhoogte: 24px; --lijst-tekstkleur: #333; --lijst-lettertype: 'Open Sans', sans-serif; --lijst-marge-onder: 30px; --vak-creme: #faf8f1; --vak-blauw: #edf0f4; --vak-groen: #eff2e4; --vak-hoeken: 10px; --vak-schaduw: 0 1px 2px rgba(0,0,0,.18), 0 6px 6px -4px rgba(0,0,0,.30); --vak-label-grootte: 14px; --vak-label-gewicht: 600; --vak-label-letterafstand: 1.5px; --vak-label-kleur: #333; --afbeelding-hoeken: 10px; --scheidingslijn-dikte: 2px; --scheidingslijn-kleur: #c9d3de; --fotoblok-afstand: 30px; --citaat-padding: 22px 26px; --citaat-padding-mobiel: 18px 20px; --citaat-marge: 28px; --citaat-lettergrootte: 17px; --citaat-regelhoogte: 26px; --citaat-tekstkleur: #333; } ul:not([class]):not(nav ul, .widget ul, .pricing-features ul, .pakket-inbegrepen ul) { list-style-type: var(--lijst-markering); list-style-position: outside; padding: 0 0 0 var(--lijst-inspringing); margin: 0 0 var(--lijst-marge-onder); font-family: var(--lijst-lettertype); font-size: var(--lijst-lettergrootte); line-height: var(--lijst-regelhoogte); color: var(--lijst-tekstkleur); } ul:not([class]):not(nav ul, .widget ul, .pricing-features ul, .pakket-inbegrepen ul) > li { margin: 0 0 var(--lijst-item-ruimte); padding: 0; font-size: var(--lijst-lettergrootte); line-height: var(--lijst-regelhoogte); color: var(--lijst-tekstkleur); } @media (max-width: 767px) {  .gsm-midden ul:not([class]):not(nav ul, .widget ul, .pricing-features ul, .pakket-inbegrepen ul) { padding-left: 0; list-style-position: inside; text-align: center; } } .checklist-box { padding: var(--checklist-padding); } .checklist-box h3 { text-align: center; letter-spacing: 1px; margin-bottom: var(--checklist-titel-afstand); } .checklist-list { list-style: none; margin: 0; padding: 0; columns: var(--checklist-kolommen); column-gap: var(--checklist-kolomafstand); } .checklist-list li { break-inside: avoid; margin-bottom: var(--checklist-item-afstand); } .checklist-list li i { color: var(--link-kleur); font-size: 1.25em; margin-right: var(--checklist-icoon-afstand); } .vak { border: 0; border-radius: var(--vak-hoeken); box-shadow: var(--vak-schaduw); } .vak-creme { background-color: var(--vak-creme); } img.afbeelding, .afbeelding img { border: 0; border-radius: var(--afbeelding-hoeken); box-shadow: none; }  body:not(:has(#slider)) .content-wrap:has(.footer-stick) { padding-bottom: 0; } .formulier::after { content: ""; display: table; clear: both; } .formulier .formulier-groep { margin: 0 0 var(--formulier-groep-afstand); } .formulier input.input-block-level, .formulier textarea.input-block-level { display: block; box-sizing: border-box; width: 100%; height: var(--veld-hoogte); margin: 0 0 var(--veld-afstand); padding: var(--veld-opvulling); font-family: 'Open Sans', sans-serif; font-size: var(--veld-lettergrootte); line-height: 24px; color: var(--veld-tekstkleur); background-color: var(--veld-achtergrond); border: var(--veld-rand); border-radius: var(--veld-hoeken); box-shadow: none; outline: 0; -webkit-appearance: none; appearance: none; } .formulier textarea.input-block-level { height: auto; min-height: var(--veld-tekstvak-hoogte); padding: var(--veld-tekstvak-opvulling); resize: vertical; } .formulier .formulier-groep > input:last-child, .formulier .formulier-groep > textarea:last-child { margin-bottom: 0; } .formulier input.input-block-level::placeholder, .formulier textarea.input-block-level::placeholder { color: var(--veld-placeholder); opacity: 1; } .formulier input.input-block-level:focus, .formulier textarea.input-block-level:focus { border-color: var(--veld-focus); box-shadow: 0 0 0 1px var(--veld-focus); outline: 0; } .formulier .cf-turnstile { margin: 0 0 var(--formulier-groep-afstand); } .formulier + .form-feedback { clear: both; margin: var(--formulier-groep-afstand) 0 0; padding: var(--melding-opvulling); border: 0; border-radius: var(--melding-hoeken); font-size: 15px; line-height: 1.5; }  .formulier + .form-feedback:empty, .prijsblok > .row::before, .prijsblok > .row::after, .reviews-rij::-webkit-scrollbar, .flat-banner-dark:not(.flat-banner-flat) .container > p:empty { display: none; } .formulier + .form-feedback.success { color: var(--melding-gelukt-tekst); background-color: var(--melding-gelukt-achtergrond); } .formulier + .form-feedback.error { color: var(--melding-fout-tekst); background-color: var(--melding-fout-achtergrond); } :root { --afvink-rand: #767676; }  .formulier input.button[type="submit"]:focus { outline: 2px solid var(--veld-focus); outline-offset: 2px; } #main-menu a:focus, #main-menu-trigger:focus { outline: 0; } #main-menu a:focus-visible, #main-menu-trigger:focus-visible { outline: 2px solid var(--veld-focus); outline-offset: -2px; } @media (max-width: 991px) { html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu ul li a, html body #header.sticky-header #header-wrap #main-menu ul li a { font-size: 17px !important; } html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu ul ul li a, html body #header.sticky-header #header-wrap #main-menu ul ul li a { font-size: 17px !important; letter-spacing: 1px; color: var(--menu-sub-kleur) !important; } html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu ul li, html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu ul ul li, html body #header.sticky-header #header-wrap #main-menu ul li, html body #header.sticky-header #header-wrap #main-menu ul ul li { border-top-color: var(--menu-lijn-kleur) !important; } html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu ul ul li:hover > a, html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu ul ul li > a:active, html body #header.sticky-header #header-wrap #main-menu ul ul li:hover > a, html body #header.sticky-header #header-wrap #main-menu ul ul li > a:active { color: var(--menu-sub-kleur) !important; background-color: transparent !important; } html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > ul > li > a:hover, html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > ul > li.current > a, html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > ul > li.submenu-open > a, html body #header.sticky-header #header-wrap #main-menu > ul > li > a:hover, html body #header.sticky-header #header-wrap #main-menu > ul > li.current > a, html body #header.sticky-header #header-wrap #main-menu > ul > li.submenu-open > a { color: var(--menu-sub-kleur); background-color: transparent; } html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > ul > li:hover > a:after, html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > ul > li.submenu-open > a:after, html body #header.sticky-header #header-wrap #main-menu > ul > li:hover > a:after, html body #header.sticky-header #header-wrap #main-menu > ul > li.submenu-open > a:after { color: var(--menu-sub-kleur); } #main-menu a, #main-menu-trigger { -webkit-tap-highlight-color: transparent; } html body #header #main-menu-trigger { color: #212121; } } @media (max-width: 991px) { html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > ul > li:hover > a, html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > ul > li.current > a, html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > ul > li.submenu-open > a, html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > ul > li:hover ul a, html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > ul > li.current ul a, html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > ul > li.submenu-open ul a, html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu > ul > li ul li a:active, html body #header.sticky-header #header-wrap #main-menu > ul > li:hover > a, html body #header.sticky-header #header-wrap #main-menu > ul > li.current > a, html body #header.sticky-header #header-wrap #main-menu > ul > li.submenu-open > a, html body #header.sticky-header #header-wrap #main-menu > ul > li:hover ul a, html body #header.sticky-header #header-wrap #main-menu > ul > li.current ul a, html body #header.sticky-header #header-wrap #main-menu > ul > li.submenu-open ul a, html body #header.sticky-header #header-wrap #main-menu > ul > li ul li a:active { color: var(--menu-sub-kleur) !important; } } @media (max-width: 991px) { html body #header.sticky-header #header-wrap #main-menu > ul > li > a { color: var(--menu-kleur); } html body #header.sticky-header #header-wrap #main-menu ul li { color: #333; } html body #header.sticky-header:not(.sticky-style-2) #logo img { width: 222px !important; height: 83px; } html body #header.sticky-header:not(.sticky-style-2) #logo { margin-top: 0; } } @media (min-width: 992px) { html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu.m-bg > ul > li:hover > a, html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu.m-bg > ul > li.current > a, html body #header.sticky-header #main-menu.m-bg > ul > li:hover > a, html body #header.sticky-header #main-menu.m-bg > ul > li.current > a { color: var(--menu-hover-tekst) !important; background-color: var(--menu-hover-achtergrond) !important; } html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu ul ul li a, html body #header.sticky-header #main-menu ul ul li a { color: var(--menu-sub-kleur) !important; } html body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #main-menu ul ul li:hover > a, html body #header.sticky-header #main-menu ul ul li:hover > a { color: var(--menu-sub-kleur) !important; background-color: var(--vak-creme); } html body #header.sticky-header #main-menu.m-bg > ul > li > a { color: var(--menu-kleur); } } @media (max-width: 767px) { #logo { height: calc(83px + var(--header-ruimte-onder-logo-mobiel)); } } #footer, #footer.footer-gray { background-color: var(--footer-achtergrond); border-top: 0; } #footer .footer-widgets-wrap { padding-top: var(--footer-ruimte-boven-computer); } @media (max-width: 767px) { #footer .footer-widgets-wrap { padding-top: var(--footer-ruimte-boven-mobiel); } }  #footer .footer-widget-title, .reviews-samenvatting { margin-bottom: 20px; } #footer .footer-widgets-wrap .footer-about p, #footer .footer-widgets-wrap .widget p, #footer .footer-widget-text { font-size: 16px; line-height: 1.5; letter-spacing: var(--tekst-letterafstand); color: var(--footer-tekstkleur); } #footer .footer-widget-text { margin: 0 0 20px; } @media (min-width: 768px) { #footer .footer-social { width: 200px; } } #copyrights { background-color: #fff; border-top: 1px solid #eee; color: var(--onderbalk-kleur); font-size: 14px; letter-spacing: var(--onderbalk-letterafstand); text-align: center; } #copyrights .container { text-align: center; } #footer .formulier { --veld-achtergrond: #fff; } #footer .formulier .button { margin: 0; } @media (min-width: 768px) and (max-width: 1199px) { #footer .footer-widgets-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 300px minmax(0, 1fr); column-gap: 29px; } #footer .footer-widgets-wrap::before, #footer .footer-widgets-wrap::after { display: none; } #footer .footer-widgets-wrap > div { float: none; width: auto; margin: 0; } } @media (min-width: 768px) and (max-width: 991px) { #footer .footer-widgets-wrap { grid-template-columns: minmax(0, 1fr) 300px 200px; column-gap: 15px; } } @media (max-width: 767px) { main:has(+ footer) > section:last-of-type .content-wrap { padding-bottom: 0 !important; } } #gotoTop { display: flex !important; align-items: center; justify-content: center; right: 10px !important; bottom: 65px !important; left: auto !important; top: auto !important; width: 45px !important; height: 45px !important; line-height: 1 !important; font-size: 20px !important; border-radius: 50%; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(8px); transition: opacity .2s ease, transform .2s ease, background-color .2s linear; } #gotoTop.is-visible { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0); } @media (max-width: 991px) { #footer .footer-widget-text a, #copyrights a { display: inline-block; padding: 12px 6px; margin: -12px -6px; } #footer .social-icon { width: 44px; height: 44px; line-height: 42px !important; margin-right: 6px; } #footer .social-icon i { line-height: 42px; } } @media (max-width: 767px) { #footer .footer-widgets-wrap { padding-bottom: 20px; } #footer .footer-widgets-wrap .footer-about p { margin-bottom: 0; padding-bottom: 0; } #footer .footer-widget-text { display: flex; flex-direction: column; align-items: flex-start; margin-bottom: 0; } #footer .widget_links > br { display: none; } #footer .footer-widget-text a { padding: 2px 6px 12px; margin: 0 -6px 2px; } #footer .footer-social { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 25px; } #footer .footer-social .social-icon { width: auto; height: auto; aspect-ratio: 1 / 1; margin: 0; float: none; display: flex; align-items: center; justify-content: center; line-height: 1 !important; } #footer .footer-social .social-icon i { width: auto; height: auto; font-size: 32px; line-height: 1; } } @media (max-width: 991px) { #footer .footer-widget-text a, #copyrights a { display: inline; padding: 0; margin: 0; position: relative; border-bottom: 0 !important; text-decoration: underline !important; text-decoration-thickness: 1px !important; text-decoration-color: rgba(51, 102, 153, 0.45); text-underline-offset: 3px; } #footer .footer-widget-text a:hover, #copyrights a:hover { text-decoration-color: rgba(38, 77, 115, 0.7); } #footer .footer-widget-text a::after, #copyrights a::after { content: ""; position: absolute; left: -6px; right: -6px; top: 50%; height: 44px; transform: translateY(-50%); } } @media (max-width: 767px) { #footer .footer-widget-text a { margin-bottom: 30px; } } #copyrights { padding: 40px 0; } @media (max-width: 767px) { #copyrights { padding: 24px 0; } } #copyrights .container { line-height: 1.5; } #copyrights p { margin: 0 0 16px; }  li > ul:not([class]):not(nav ul, .widget ul, .pricing-features ul, .pakket-inbegrepen ul), ul:not([class]):not(nav ul, .widget ul, .pricing-features ul, .pakket-inbegrepen ul) > li:last-child, .formulier, .formulier .formulier-groep > :last-child, #copyrights p:last-child, .gemeente-sectie .stappen, .gemeente-sectie .prijsblok, .gemeente-sectie .realisaties, .gemeente-sectie .reviews, .gemeente-sectie .faq-blok, .gemeente-sectie .kaarten, .intro-tekst > :last-child, .stap-inhoud > :last-child, .gemeente-sectie .link-kolommen ul:not([class]), .gemeente-sectie .link-kolommen ul:not([class]) > li:last-child { margin-bottom: 0; } :root { --realisatie-afstand: 24px; --review-breedte: 300px; } .realisaties-raster { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--realisatie-afstand); margin: 0 0 var(--realisatie-afstand); } .realisatie-kaart { display: flex; flex-direction: column; overflow: hidden; color: var(--lijst-tekstkleur); text-decoration: none; } .realisatie-kaart:hover { color: var(--link-kleur-hover); } .realisatie-kaart img, .intro-foto img, .faq-beeld-kolom img { display: block; width: 100%; height: auto; } .realisatie-tekst { display: block; padding: 14px 18px 16px; text-align: left; } .realisatie-naam, .realisatie-plaats, .realisatie-sector { display: block; } .realisatie-naam { font-size: 16px; font-weight: 600; line-height: 24px; } .realisatie-plaats, .realisatie-sector, .review-wie { font-size: 14px; line-height: 22px; color: var(--tekst-grijs); } .reviews-rij { display: flex; gap: var(--realisatie-afstand); margin: 0 -4px 20px; padding: 4px 4px 16px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 4px; } .review-kaart { flex: 0 0 var(--review-breedte); margin: 0; padding: 18px 20px; scroll-snap-align: start; text-align: left; } .review-tekst { margin: 0 0 12px; } .stappen, .prijsblok, .realisaties, .reviews, .faq-blok { margin-bottom: 40px; } .prijsblok > .row { display: flex; flex-wrap: wrap; } .prijsblok .pricing-box { height: 100%; } .prijsblok-btw { margin: 20px 0; font-size: 14px; } .checklist-box h2 { text-align: center; letter-spacing: 1px; margin-bottom: var(--checklist-titel-afstand); } @media (min-width: 768px) and (max-width: 991px) { .realisaties-raster { grid-template-columns: repeat(2, minmax(0, 1fr)); } .realisaties-b .realisatie-tablet-uit { display: none; } } @media (min-width: 992px) { .realisaties-vier .realisaties-raster { grid-template-columns: repeat(4, minmax(0, 1fr)); } } @media (max-width: 767px) { .stappen, .prijsblok, .realisaties, .reviews, .faq-blok { margin-bottom: 34px; } .gsm-midden, .checklist-box { text-align: center; } body:not(:has(.colored-box1)) .flat-banner-center > .container:has(> a.button:first-child):not(#r160), .gsm-midden .cta-rij { justify-content: center; } .realisaties-raster { grid-template-columns: minmax(0, 1fr); gap: 16px; } .realisaties-b .realisatie-tekst { text-align: center; } .flat-banner > .container > p:empty, .cta-contact-details .cta-streep:not(#r165a):not(#r165b):not(#r165c), body:not(:has(.colored-box1)) .flat-banner > .container:has(> a.button:first-child):not(#r160)::before, body:not(:has(.colored-box1)) .flat-banner > .container:has(> a.button:first-child):not(#r160)::after, #footer .footer-widget-text br:nth-of-type(2), #footer .footer-widget-text br:nth-of-type(n+4), .realisaties-b .realisatie-extra { display: none; } .review-kaart { flex-basis: 85%; text-align: center; } } .gemeente-sectie { --sectie-ruimte-computer: 50px; --sectie-ruimte-mobiel: 40px; --kaart-afstand: 24px; --kaart-padding: 22px; --stap-nummer-achtergrond: var(--kleur-marine); --contact-kaart-achtergrond: var(--band-antraciet); --intro-kolom-afstand: 48px; } .gemeente-sectie { padding: var(--sectie-ruimte-computer) 0; } .gemeente-sectie > .container > :first-child { margin-top: 0; } .gemeente-sectie > .container > :last-child, .gemeente-sectie > .container > section:last-child > :last-child { margin-bottom: 0; } .gemeente-sectie .checklist-box { margin: 0; } .intro-blok { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: var(--intro-kolom-afstand); align-items: start; } .intro-foto { margin: 0 0 var(--kaart-afstand); border-radius: var(--vak-hoeken); box-shadow: var(--vak-schaduw); overflow: hidden; } .contact-kaart { padding: 30px; border-radius: var(--vak-hoeken); box-shadow: var(--vak-schaduw); background-color: var(--contact-kaart-achtergrond); color: #ffffff; } .contact-kaart p { margin: 0 0 12px; color: #ffffff; } .contact-kaart .cta-rij { margin: 24px 0 0; } .contact-kaart .contact-kaart-label { font-size: 14px; font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase; } .contact-kaart .contact-kaart-regel { font-size: 20px; line-height: 28px; } @media (max-width: 767px) { .contact-kaart { padding: 18px 20px; } .contact-kaart .cta-rij { margin-top: 14px; margin-bottom: 6px; } .contact-kaart .contact-kaart-regel { line-height: 26px; } } .kaarten-raster { display: grid; gap: var(--kaart-afstand); } .kaarten-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .kaart { padding: var(--kaart-padding); text-align: left; overflow-wrap: anywhere; } .kaart > :last-child { margin-bottom: 0; } .stap-kaart { padding: 0; overflow: hidden; } .stap-nummer { padding: 14px var(--kaart-padding); background-color: var(--stap-nummer-achtergrond); color: #ffffff; font-size: 14px; letter-spacing: 1.5px; line-height: 22px; } .stap-nummer-getal { font-size: 22px; font-weight: 600; letter-spacing: 1px; } .stap-inhoud { padding: var(--kaart-padding); } @media (min-width: 992px) { .kaarten-stappen .stap-inhoud > h3 { min-height: 2lh; } } .prijsblok .pricing-box { display: flex; flex-direction: column; } .prijsblok .prijsvak-wit { flex: 1 1 auto; padding: 12px 16px; min-height: calc(2lh + 24px); display: flex; align-items: center; justify-content: center; border-top: 1px solid var(--kaart-rand); background-color: #ffffff; text-align: center; font-size: 14px; line-height: 22px; } .prijsblok .prijsvak-wit p { margin: 0; font-size: 14px; line-height: 22px; } .prijsblok-starterregel { margin: var(--kaart-afstand) 0 0; } .gemeente-sectie .prijsblok > .cta-rij { margin-top: var(--kaart-afstand); margin-bottom: 0; } .link-kolommen ul { columns: 3; column-gap: var(--intro-kolom-afstand); margin-bottom: 0; } .link-kolommen li { break-inside: avoid; } .link-groepen { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--intro-kolom-afstand); align-items: start; }  .link-groepen ul { columns: 1; } @media (max-width: 991px) { .kaarten-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 767px) { .gemeente-sectie { padding: var(--sectie-ruimte-mobiel) 0; } .gemeente-sectie:has(+ .gemeente-band-donker) > .container, .pagina-gemeente-b .gemeente-sectie:has(+ .gemeente-band-donker) > .container, .content-wrap.gemeente-sectie.gemeente-band-donker > .container { padding-bottom: var(--sectie-ruimte-mobiel); } .intro-blok { grid-template-columns: minmax(0, 1fr); gap: 32px; }  .gemeente-sectie:has(> .container > .intro-foto) { padding-top: 0; } .gemeente-sectie > .container:has(> .intro-foto) { display: flex; flex-direction: column; } .gemeente-sectie > .container:has(> .intro-foto) > .intro-blok { display: contents; } .gemeente-sectie > .container > .intro-foto { --intro-foto-ruimte-mobiel: 20px; order: -2; margin: 0 -15px var(--intro-foto-ruimte-mobiel); border-radius: 0; box-shadow: none; } .gemeente-sectie > .container:has(> .intro-foto) .contact-kaart-groep { order: -1; margin-bottom: var(--sectie-ruimte-mobiel); } .gemeente-sectie > .container:has(> .intro-blok):not(:has(> .intro-foto)) { display: flex; flex-direction: column; } .gemeente-sectie > .container:not(:has(> .intro-foto)) > .intro-blok { display: contents; } .gemeente-sectie > .container:not(:has(> .intro-foto)) > .intro-blok .contact-kaart-groep { order: -1; margin-bottom: var(--sectie-ruimte-mobiel); } .kaarten-4 { grid-template-columns: minmax(0, 1fr); gap: 16px; } .kaart { text-align: center; } .checklist-list, .link-kolommen ul { columns: 1; } .link-groepen { grid-template-columns: minmax(0, 1fr); } } .pagina-gemeente-b .content-wrap p, .pagina-gemeente-b .content-wrap li { text-wrap: pretty; } @media (max-width: 767px) { .pagina-gemeente-b .gemeente-sectie { --sectie-ruimte-mobiel: 20px; --kaart-afstand: 20px; --realisatie-afstand: 20px; --kaart-padding: 20px; } #footer .footer-widgets-wrap .footer-about, .pagina-gemeente-b .gemeente-sectie > .container { padding-bottom: 0; }  .pagina-gemeente-b .gemeente-sectie > .container > :last-child, .pagina-gemeente-b .stappen, .pagina-gemeente-b .prijsblok, .pagina-gemeente-b .realisaties, .pagina-gemeente-b .reviews, .pagina-gemeente-b .faq-blok { margin-bottom: 0; } .pagina-gemeente-b p:has(+ .cta-rij), .pagina-gemeente-b p:has(+ .row), .pagina-gemeente-b p:has(+ .realisaties) { margin-bottom: 20px; } .contact-kaart p, .pagina-gemeente-b .contact-kaart p:has(+ .cta-rij) { margin-bottom: 6px; } .pagina-gemeente-b .realisaties-raster { gap: var(--realisatie-afstand); } .pagina-gemeente-b .checklist-box { padding: 20px 40px; } } .content-wrap .contact-kaart a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)) { color: var(--link-kleur-donker); border-bottom-color: var(--link-onderlijn-donker); } .content-wrap .contact-kaart a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)):hover { color: var(--link-kleur-donker-hover); border-bottom-color: var(--link-onderlijn-donker-hover); } .stap-nummer-label { margin-right: 2px; } .gemeente-sectie .prijsblok > .row { margin-left: -25px; margin-right: -25px; } @media (min-width: 992px) { .kaarten-rij { grid-template-rows: auto 1fr; row-gap: 0; } .kaarten-rij > .kaart { display: grid; grid-row: span 2; grid-template-rows: subgrid; } } @media (min-width: 768px) { .kaarten-twee { grid-template-columns: repeat(2, minmax(0, 1fr)); } .kaarten-twee > .kaart-breed { grid-column: 1 / -1; } .checklist-hang .checklist-list li { position: relative; padding-left: calc(var(--checklist-icoon-afstand) + 1.25em); margin-bottom: 0; padding-bottom: var(--checklist-item-afstand); } .checklist-hang .checklist-list li i { position: absolute; left: 0; top: 0.1em; } } @media (max-width: 767px) { .link-kolommen ul:not([class]) { list-style: none; padding-left: 0; } .link-kolommen ul:not([class]) > li { display: flex; align-items: center; justify-content: center; min-height: 44px; margin-bottom: 0; } .link-kolommen .link-aanraak::after { content: ""; position: absolute; top: -10px; right: -12px; bottom: -10px; left: -12px; } } .reviews-rij { scrollbar-width: none; } .reviews-rij { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--realisatie-afstand); margin: 0 0 20px; padding: 0; overflow: visible; } .review-kaart { display: flex; flex-direction: column; flex: none; } .review-sterren { margin: 0 0 8px; font-size: 20px; line-height: 24px; letter-spacing: 2px; color: var(--knop-donker-achtergrond); } .review-tekst { flex: 1 1 auto; } .reviews-alle { margin: 0; } @media (max-width: 991px) { .reviews-rij { display: flex; margin: 0 -15px 20px; padding: 4px 15px 16px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 15px; } .review-kaart { flex: 0 0 72%; scroll-snap-align: start; } } @media (max-width: 767px) { .review-kaart { flex-basis: 78%; } } .gemeente-sectie { --kaart-rand: #dfe3e6; --kaart-petrol: #128287; --kaart-petrol-onder: #0f686c; } .gemeente-sectie .vak-creme { background-color: #ffffff; border: 1px solid var(--kaart-rand); } .content-wrap.gemeente-sectie-petrol, .flat-banner.flat-banner-dark.flat-banner-petrol { background-color: var(--band-petrol); background-image: linear-gradient(to bottom, var(--band-petrol-licht), var(--band-petrol)); } .content-wrap.gemeente-sectie-antraciet { background-color: var(--band-antraciet); background-image: linear-gradient(to bottom, var(--band-antraciet-licht), var(--band-antraciet)); } .contact-kaart.contact-kaart-antraciet { background-color: var(--band-antraciet); background-image: linear-gradient(to bottom, var(--band-antraciet-licht), var(--band-antraciet)); } .flat-banner-petrol .cta-contact-details a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)), .content-wrap .contact-kaart.contact-kaart-antraciet a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)) { color: var(--link-kleur-donker); border-bottom-color: currentColor; } .flat-banner-petrol .cta-contact-details a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)):hover, .content-wrap .contact-kaart.contact-kaart-antraciet a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)):hover { color: var(--link-kleur-donker-hover); border-bottom-color: currentColor; } .button.knop-donker:focus-visible, .flat-banner-dark:not(.flat-banner-flat) .button:focus-visible, .gemeente-band-donker .button:focus-visible, .contact-kaart-antraciet .button:focus-visible { outline: 2px solid #ffffff; outline-offset: 2px; } .gemeente-band-donker .vak-creme { border-color: #ffffff; } .gemeente-band-donker .container > section > h2, .gemeente-band-donker .reviews-samenvatting, .gemeente-band-donker .reviews-samenvatting strong, .content-wrap .kaart-petrol h3, .content-wrap .kaart-petrol p { color: #ffffff; } .flat-banner-dark a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)), .content-wrap.gemeente-band-donker .reviews-alle a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)) { color: var(--link-kleur-donker); border-bottom-color: var(--link-onderlijn-donker); } .content-wrap.gemeente-band-donker .reviews-alle a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)):hover { color: var(--link-kleur-donker-hover); border-bottom-color: var(--link-onderlijn-donker-hover); } .content-wrap .kaart-petrol { background-color: var(--kaart-petrol); background-image: linear-gradient(to bottom, var(--kaart-petrol), var(--kaart-petrol-onder)); } .content-wrap .kaart-petrol a:not(.button):not(.social-icon):not(:has(> img)):not(:has(> svg)):not(:has(> i:only-child)) { color: #ffffff; border-bottom-color: rgba(255, 255, 255, 0.75); } .faq-blok .toggle .togglet { font-size: 15px; } .faq-raster { display: grid; grid-template-columns: minmax(0, 60fr) minmax(0, 40fr); gap: var(--intro-kolom-afstand); align-items: center; } .faq-beeld-kolom { border-radius: var(--vak-hoeken); box-shadow: var(--vak-schaduw); overflow: hidden; } @media (max-width: 991px) { .faq-raster { grid-template-columns: minmax(0, 1fr); gap: 24px; } .faq-beeld-kolom { width: 100%; max-width: 440px; margin: 0 auto; } } .gemeente-tekst-kolommen { column-count: 2; column-gap: var(--intro-kolom-afstand); } .gemeente-tekst-kolommen p { break-inside: avoid; } .gemeente-tekst-kolommen .kolomstart { break-before: column; margin-top: 0; } .alinea-gesplitst { display: contents; } .gemeente-tekst-kolommen > p:last-child, .gemeente-tekst-kolommen > .alinea-gesplitst:last-child > p:last-child { margin-bottom: 0; } .geen-afbreking { white-space: nowrap; } @media (max-width: 767px) { .gemeente-tekst-kolommen { column-count: 1; } .gemeente-tekst-kolommen .kolomstart { break-before: auto; } .alinea-gesplitst { display: block; margin-bottom: 30px; } .alinea-gesplitst > p { display: inline; margin: 0; } .gemeente-tekst-kolommen > .alinea-gesplitst:last-child { margin-bottom: 0; } }  .cta-contact-details .cta-streep { color: var(--knop-donker-achtergrond); }
@font-face { font-family: 'Dosis'; font-style: normal; font-weight: 300; font-display: swap; src: url(/fonts/dosis-v34-latin-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Dosis'; font-style: normal; font-weight: 400; font-display: swap; src: url(/fonts/dosis-v34-latin-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Dosis'; font-style: normal; font-weight: 700; font-display: swap; src: url(/fonts/dosis-v34-latin-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 300; font-stretch: 100%; font-display: swap; src: url(/fonts/open-sans-v44-latin-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 400; font-stretch: 100%; font-display: swap; src: url(/fonts/open-sans-v44-latin-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 600; font-stretch: 100%; font-display: swap; src: url(/fonts/open-sans-v44-latin-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 700; font-stretch: 100%; font-display: swap; src: url(/fonts/open-sans-v44-latin-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } .dark .feat-box p { color: #c9c9c9; } .dark .feat-box h2 { color: #CCC; } .dark .widget h3 { color: #DDD; } ul#portfolio-filter { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 28px; padding: 0 15px; } ul#portfolio-filter li { float: none; margin: 0; } ul#portfolio-filter li a { padding: 6px 2px !important; } ul#portfolio-filter li.activeFilter a { color: var(--tekst-grijs) !important; border-bottom: 2px solid #336699; padding-bottom: 5px !important; } #side-panel-trigger a { width: 24px; height: 24px; line-height: 24px; } img[width] { height: auto; } ul.tab-nav li a { color: #767676; } ul.tab-nav li.ui-tabs-active a { color: #7A5619; } @media (max-width: 991px) { #main-menu.nav-open > ul, #main-menu ul li.submenu-open > ul { display: block !important; } } body #wrapper { opacity: 1 !important; } .hero-scroll-indicator { display: none; } @media (max-width: 767px) { .hero-scroll-indicator { display: block; width: fit-content; margin: 16px auto 4px; color: rgba(255, 255, 255, 0.55); line-height: 0; animation: hero-scroll-bounce 2.4s ease-in-out infinite; } .hero-scroll-indicator:hover { color: rgba(255, 255, 255, 0.85); } } @keyframes hero-scroll-bounce { 0%, 100% { transform: translateY(0); opacity: 0.55; } 50% { transform: translateY(6px); opacity: 0.9; } } @media (prefers-reduced-motion: reduce) { .hero-scroll-indicator { animation: none; } } .flat-banner-dark h3 + p { color: #fff; } .text-rotater { color: #17a2a8; } .text-rotater .t-rotate { display: inline-block; max-width: 100%; max-height: 1.2em; overflow: hidden; vertical-align: top; } @media (max-width: 767px) { .text-rotater .t-rotate { max-height: 2.6em; } } #logo img, .logo-style img { width: 222px !important; aspect-ratio: 222 / 83; object-fit: contain; transition: height .4s ease, width .4s ease, opacity .3s ease; } #header.sticky-header:not(.sticky-style-2) #logo img { width: 179px !important; } @media (max-width: 991px) {  body #main-menu li:hover > ul { display: none; } #portfolio-filter { display: flex; flex-wrap: wrap; justify-content: center; } #portfolio-filter li { float: none; } } @media (max-width: 479px) { body.side-panel-main #side-panel-trigger { right: 0 !important; } } .whatsapp-float { position: fixed; right: 10px; bottom: 10px; width: 45px; height: 45px; border-radius: 100px; background-color: #27d974; box-shadow: 0 0 30px rgba(0, 0, 0, 0.3); display: flex; align-items: center; justify-content: center; z-index: 500; transition: transform .15s ease; } .whatsapp-float:hover { transform: scale(1.05); } .lightbox-overlay { position: fixed; inset: 0; z-index: 9999; display: none; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0.9); } .lightbox-overlay.lightbox-open { display: flex; } body.lightbox-locked { overflow: hidden; } .lightbox-img { max-width: 90vw; max-height: 90vh; object-fit: contain; box-shadow: 0 0 40px rgba(0, 0, 0, 0.5); } .lightbox-close, .lightbox-prev, .lightbox-next { position: absolute; background: none; border: none; color: #fff; cursor: pointer; line-height: 1; } .lightbox-close { top: 20px; right: 30px; font-size: 40px; } .lightbox-prev, .lightbox-next { top: 50%; transform: translateY(-50%); font-size: 30px; padding: 10px 16px; } .lightbox-prev { left: 10px; } .lightbox-next { right: 10px; } .lightbox-close:hover, .lightbox-prev:hover, .lightbox-next:hover { color: #ef7537; } @media (max-width: 767px) { .t-margin-large:not(.no-t-margin) { margin-top: 60px !important; } .section:not(.nopadding):not(.no-t-padding) { padding-top: 60px !important; } .section:not(.nopadding):not(.no-b-padding) { padding-bottom: 60px !important; } .content-wrap:has(> .container.clearfix:first-child > .post-grid.grid-3) > .container.clearfix:first-child { padding-bottom: 0 !important; }  body:not(:has(.colored-box1)) .col-1-third > p:last-child:not(#r160), body:not(:has(.colored-box1)) .col-1-third > div:last-child > p:last-child:not(#r160) { margin-bottom: 10px !important; } } @media (max-width: 767px) { .url input { font-size: 16px !important; } } @media (max-width: 767px) { .container, #header.wide-header .container { width: 100% !important; } } svg.ico { display: inline-block; fill: currentColor; overflow: visible; } svg.ico-fa { vertical-align: -0.1429em; } svg.ico-sl { vertical-align: -0.0625em; }  body.side-panel-main #side-panel .side-panel-wrap a { color: var(--tekst-grijs); } @media (max-width: 991px) { h1, h2, h3 { overflow-wrap: break-word; } body.side-panel-main #side-panel-trigger a { width: 44px; height: 44px; line-height: 44px; margin: -12px; } } body.side-panel-main #side-panel .side-panel-wrap a div, body.side-panel-main #side-panel .side-panel-wrap .side-panel-regel div { font-size: 14px; } body.side-panel-main { --zijpaneel-breedte: min(320px, 88vw); } body.side-panel-main #side-panel { width: var(--zijpaneel-breedte); right: calc(-1 * var(--zijpaneel-breedte)); } body.side-panel-main #side-panel .side-panel-wrap { width: var(--zijpaneel-breedte); } body.side-panel-main.side-panel-open #side-panel { right: 0; } body.side-panel-main.side-panel-open #wrapper, body.side-panel-main.side-panel-open #header.sticky-header .container { right: var(--zijpaneel-breedte); } .side-panel-title { font-family: Dosis, arial, sans-serif; font-weight: 400; color: #333; text-transform: uppercase; margin: 0 0 56px; font-size: 17px; line-height: 25.5px; letter-spacing: 2px; } @media (min-width: 768px) { .side-panel-title { font-size: 24px; line-height: 1.4; letter-spacing: 1px; } } body.side-panel-main #side-panel .side-panel-regel { display: inline-block; padding: 0 0 15px; border: none; color: var(--tekst-grijs); font-size: 12px; text-transform: uppercase; cursor: default; } body.side-panel-main #side-panel .side-panel-regel i { margin-right: 10px; } body.side-panel-main #side-panel .side-panel-tel { margin-bottom: 12px; } @media (max-width: 991px) { body.side-panel-main #side-panel .side-panel-wrap a, body.side-panel-main #side-panel .side-panel-regel { display: block; padding-top: 13px; padding-bottom: 13px; margin-top: -13px; margin-bottom: -13px; } } @media (max-width: 767px) {  body:not(:has(.colored-box1)) .col-1-third:not(#r159), body .col-1-third:not(#r161b):not(#r161c) { margin-bottom: 30px !important; }  body:not(:has(.colored-box1)) .entry:not(#r159) > :last-child, body .col-1-third > p:last-child:not(#r161b):not(#r161c), body .col-1-third > div:last-child > p:last-child:not(#r161b):not(#r161c) { margin-bottom: 0 !important; } .content-wrap:has(.colored-box1) .flat-banner.footer-stick { margin-top: 30px !important; } .content-wrap:has(.colored-box1) .flat-banner { padding-top: 40px !important; padding-bottom: 40px !important; } .content-wrap:has(.colored-box1) .flat-banner.footer-stick { padding-bottom: calc(40px + var(--sluitband-overlap)) !important; }  #portfolio .portfolio-item:last-child { margin-bottom: 0; } } @media (max-width: 991px) { #logo { text-align: left; } #main-menu-trigger { left: auto; right: 15px; width: 44px; text-align: right; } } @media (max-width: 991px) { #side-panel-trigger, #side-panel, .full-overlay { display: none !important; } } @media (max-width: 767px) { h1, h2, h3 { text-wrap: balance; } ul#portfolio-filter { row-gap: 16px; } ul#portfolio-filter li a { position: relative; } ul#portfolio-filter li a::after { content: ""; position: absolute; left: -4px; right: -4px; top: 50%; height: 44px; transform: translateY(-50%); } input[type="text"], input[type="email"], input[type="tel"], input[type="url"] { min-height: 44px !important; font-size: 16px !important; } } @media (max-width: 767px) { .url input#url { margin-bottom: 8px; } } @media (max-width: 767px) { } @media (max-width: 991px) { #main-menu-trigger { font-size: 26px; } } @media (max-width: 767px) { body:not(:has(.colored-box1)) .section.dark:has(> .container > .center > h2):not(#r159), body div:has(.pricing-box) + div:has(.pricing-box):not(#r161a):not(#r161b), .pricing-box + .pricing-box:not(#r161a) { margin-top: 40px !important; }  body:not(:has(.colored-box1)) .entry:not(#r159):last-child, body:not(:has(.colored-box1)) .entry:not(#r159):has(~ .entry) { margin-bottom: 0 !important; padding-bottom: 0 !important; } } @media (max-width: 767px) { body:not(:has(.colored-box1)) .col-md-3.col-sm-6:has(.pricing-box):not(#r160), body .container.t-margin:not(#r161b):not(#r161c), body div.clearfix.t-margin:not(#r161b):not(#r161c) { margin-top: 0 !important; } } @media (max-width: 767px) { .pricing-box:not(#r161a) { margin-left: 0 !important; margin-right: 0 !important; } .pricing-box h3 br { display: none; } } @media (max-width: 767px) { body div:has(.pricing-box) + div:has(.pricing-box):not(#r161a):not(#r161b):not(#r161c):not(#r161d) { margin-top: 34px !important; } } :root { --feat-box-afstand: 70px; } @media (max-width: 767px) { body .content-wrap:has(> .wlm-pillars):not(#r163):not(#r163b):not(#r163c) { padding-top: 4px !important; } } @media (max-width: 767px) { } @media (max-width: 767px) { } @media (max-width: 767px) { body .entry:not(:last-child):not(:has(~ .entry)):not(#r161b):not(#r161c) { margin-bottom: 34px !important; } } @media (max-width: 767px) { } @media (min-width: 768px) { } @media (min-width: 768px) { } @media (min-width: 768px) { } @media (min-width: 768px) { } @media (min-width: 768px) { } @media (min-width: 768px) and (max-width: 1023px) { } @media (min-width: 992px) and (max-width: 1199px) { } section.url { padding: 10px 25px 25px 20px; }