html { scroll-behavior: smooth; }
html, body { height: 100%; }
body { display: flex; flex-direction: column; font-family: 'Helvetica Neue LT Light', Arial, Helvetica, sans-serif; font-size: 1.1em; color: #000; }
body.cn { font-size: 1.4em; }
h1, .h1 { font-family: 'Helvetica Neue LT Heavy', Arial, Helvetica, sans-serif; }
h2, .h2 { font-family: 'Helvetica Neue LT Heavy', Arial, Helvetica, sans-serif; font-size: 2.6rem; }
h3, .h3 { font-family: 'Helvetica Neue LT Heavy', Arial, Helvetica, sans-serif; }
h4, .h4 { font-family: 'Helvetica Neue LT Heavy', Arial, Helvetica, sans-serif; }
h4.product-usp-title { font-weight: 600; font-size: 22px; line-height: 24px; }
h1.main-title,
h2.main-title,
.main-title { padding-left: 30px; text-indent: -30px; text-transform: lowercase; }
@media (max-width: 991.9px) {
h2, .h2 { font-size: 2rem; }
}
input { -webkit-appearance: none; -moz-appearance: none; appearance: none; }
main { margin-top: 62px; }
a { color: #000; transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; }
.pe--product-intro a,
p a { color: #1c8ccb; }
a:hover { color: #0093d1; text-decoration: none; }
ul { list-style-type: square; }
.form-control::placeholder { font-style: italic; color: #aaa; }
.small { font-size: 12px; line-height: 14px; }
.bg-grey { background: #eee; }
.anchor-offset { position: relative; top: -60px; visibility: hidden; }
/* ---- on hold ----
.xs-editmode.preview .anchor-id { margin: 0 0 5px; visibility: visible; }
.anchor-id { display: inline-block; background: #0084bc; color: #fff !important; padding: 0 10px; font-size: 10px; border: 1px dashed #76c8ea; visibility: hidden; }*/
.anchor-id { display: none; }
.btn-primary.focus, .btn-primary:focus { background-color: #1c8ccb; border-color: #1c8ccb; }
.bg-secondary a:hover { color: #fff; }
.bg-secondary a.btn-outline-primary:hover { color: #000; }
.bg-secondary { background: #1e434b !important; }
.bg-attention { background: #0093d1; }
.text-attention { font-family: 'Helvetica Neue LT Thin', Arial, Helvetica, sans-serif; font-size: 28px; line-height: 36px; letter-spacing: 0.9px; }
.text-attention .dropcap { float: left; padding: 0 14px 0 0; font-family: 'Helvetica Neue LT Heavy', Arial, Helvetica, sans-serif; font-size: 50px; line-height: 50px; }
.text-attention b,
.text-attention .attention-bold { font-family: 'Helvetica Neue LT Heavy', Arial, Helvetica, sans-serif; }
.bg-attention .form-control { background-color: #0093d1 !important; color: #fff; }
.bg-attention ::placeholder { color: #fff; }
.bg-attention .btn-primary { border-color: #fff; }
.bg-attention .btn-primary:hover { background: #fff; color: #000 !important; }
.bg-attention .btn-primary:hover .fal { color: #0093d1 !important; }
.attention-bar { position: fixed; bottom: -100px; width: 100%; z-index: 80; transition: all .7s ease 0s; box-shadow: 0 -2px 3px 0 rgb(0 0 0 / 10%); }
.scrolled .attention-bar { bottom: 0; }
.attention-title { font-size: 20px; font-weight: 600; }
.attention-bar-content { font-size: 16px; line-height: 22px; }
.attention-bar .fas { font-size: 12px; }
.attention-close { position: absolute; right: 20px; top: calc(50% - 10px); color: #cbe3ef; cursor: pointer; }
.breadcrumbcontainer { text-transform: lowercase; font-size: 14px; }
.breadcrumb-link.home { white-space: nowrap; }
.breadcrumb-item+.breadcrumb-item { padding-left: .3em; }
.breadcrumb-item+.breadcrumb-item::before { padding-right: .3em; color: #000; }
@media (max-width: 990px) {
.breadcrumbcontainer { flex-wrap: wrap; }
.breadcrumb-item { padding-left: 0; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.breadcrumb-item+.breadcrumb-item::before { padding-left: .1rem; }
}
@media (max-width: 600px) {
.attention-bar a { display: block; }
}
@media (max-width: 470px) {
.breadcrumb-item { max-width: 72px; }
}
/**
* NAVIGATION
*/
.xs-editmode header .navbar { margin: 35px 0 0; }
.primary-nav,
.secondary-nav { font-family: 'Helvetica Neue LT Heavy', Arial, Helvetica, sans-serif; font-size: 16px; color: #000; }
.primary-nav .dropdown-menu { padding: 1em 0; background: transparent; z-index: 50; }
.navbar { max-height: 100vh; background-color: #fff; overflow-y: auto; }
.navbar-light .navbar-toggler { border: 0; color: #000; padding-left: 0; padding-right: 0; }
.navbar-light .navbar-toggler-icon { background: none; color: #000; font-size: 26px; }
.navbar-light .navbar-nav .nav-link { color: rgba(0,0,0,1); }
.navbar-nav .nav-item:last-child a { border: none; }
.navbar-toggler-icon { display: flex; justify-content: center; align-items: center; }
.navbar-toggler:focus { outline: none; }
.navbar-collapse { height: calc(100vh - 80px); }
.scrolled .navbar { box-shadow: 0 3px 3px 0 rgba(0,0,0,.1); }
.searchtoggle { display: none; }
.searchfields-wrapper { font-size: 16px; }
.searchfields-wrapper .form-control { font-family: 'Helvetica Neue LT Light', sans-serif; font-size: 0.9em; color: #000; }
.searchtoggle .far.fa-search { font-size: 1.2em; }
.searchtoggle .far.fa-times { font-size: 1.4em; }
.searchbutton { border: none; background: transparent; }
.custom-menu-item a { display: block; }
.custom-menu-item:last-child { border-bottom: none !important; }
.menu-item-element,
.menu-item-caption { font-family: 'Helvetica Neue LT Light', sans-serif; font-size: 14px; line-height: 18px; }
.dropdown-menu img { max-width: 100px; }
.custom-menu-image { align-self: center; height: auto !important; }
.navbar-logo img { height: 33px; max-width: 170px; margin-top: 3px; margin-bottom: 10px; }
.collapse-header { font-weight: 600; }
.collapse-header::after { content:"\f077"; font-family: "Font Awesome 5 Pro"; float: right; font-size: 19px; line-height:24px; margin-right: 12px; border:0; }
.collapse-header.collapsed::after { content:"\f078"; }
.downloads-link a { color: #1c8ccb; }
@media (max-width: 991.9px) {
.dropdown-toggle::after,
.dropdown-toggle-custom::after { content:"\f078"; font-family: "Font Awesome 5 Pro"; float: right; font-size: 19px; line-height:24px; margin-right: 12px; border:0; }
.nav-item.show .dropdown-toggle::after,
.nav-item.show .dropdown-toggle-custom::after { content:"\f077"; }
.nav-item.dropdown:not(.language-switch) { border-bottom: 1px solid #dee2e6; }
.navbar-light .navbar-nav.secondary-nav .nav-link { text-transform: capitalize; }
.searchfields-wrapper { margin: 20px 0; padding: 10px 0; border-bottom: 1px solid #dee2e6; border-top: 1px solid #dee2e6; }
.dropdown-menu { padding: 0 0; border: 0px; }
.primary-nav .dropdown-menu { padding: 0 0; border: 0px; }
.language-switch a { text-transform: uppercase !important; }
.language-switch .dropdown-toggle::after { margin-right: 30px; }
.language-switch .dropdown-item { padding: 0.25rem 0; }
}
@media (min-width: 992px) {
.navbar { overflow-y: initial; }
.navbar-collapse { height: auto; }
.primary-nav .dropdown,
.primary-nav .dropleft,
.primary-nav .dropright,
.primary-nav .dropup { position: unset; }
.primary-nav .dropdown-menu { position: absolute; left: 0px; width: 100%; border: 0; border-radius: 0; margin: 0 0 0 0; }
.primary-nav .nav-item.dropdown .nav-link { border-bottom: 4px solid #fff ; }
.primary-nav .nav-item.dropdown:hover .nav-link { border-bottom: 4px solid #1c8ccb ; }
.nav-link { margin: 0.9rem 0 0; padding: 3px 1rem 1px; }
.fullwidth { display: flex; width: 100%; }
.fullwidth #searchform { flex: 1 0 auto; }
.fullwidth .nav-item:first-child { display: none; }
.searchtoggle { display: inline; }
#searchform { display: none; }
.searchtoggle { cursor: pointer; }
.fullwidth .searchtoggle .fa-search { display: none; }
.searchtoggle .fa-times { display: none; }
.fullwidth .searchtoggle .fa-times { display: inline; }
.dropdown-menu img { max-width: 250px; }
.primary-nav .nav-link { border-right: 1px solid #c2c9ce }
.secondary-nav { text-transform: uppercase; font-size: 0.75rem; line-height: 0.8rem; }
.secondary-nav .nav-link { border-right: 1px solid #c2c9ce }
.secondary-nav .language-menu { font-size: 0.75rem; }
.secondary-nav .dropdown-menu { min-width: 9em; }
/* uitklap verbergen voor CN, redirect in htaccess */
.cn #navbarDropdownPanel74.dropdown-menu { display: none; }
/* Backdrop */
.primary-nav .nav-item.dropdown:hover .dropdown-menu { display: block; margin: -10px 0 0; padding: 30px 0 0; z-index: 130; }
.primary-nav .nav-item.dropdown:hover .dropdown-menu .container { position: relative; z-index: 20; }
/* .primary-nav .nav-item.dropdown:hover .dropdown-menu:after {
content: ' '; position: absolute; left: 0; top: 0; width: 100%; height: CALC(100vh - 44px);
background: rgb(255,255,255); background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 25%, rgba(255,255,255,0.8) 50%);
z-index: 10;
} */
.primary-nav-backdrop {
position: fixed; left: 0; top: 0; width: 100%; height: 100vh;
background: rgb(255,255,255); background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 25%, rgba(255,255,255,0.8) 50%);
z-index: 120; display: none;
}
.navbar-expand-lg .navbar-nav .nav-link {
padding-right: .6rem;
padding-left: .6rem;
}
}
@media (max-width: 992px) {
.primary-nav .nav-item.dropdown .nav-link,
.primary-nav .nav-item.dropdown:hover .nav-link { border: none; }
.nav-item a.dropdown-toggle-custom { display: flex; justify-content: space-between; }
.dropdown-toggle-custom::after { content:"\f107"; font-family: "Font Awesome 5 Pro"; }
.nav-item.show .dropdown-toggle-custom::after { content:"\f106"; }
}
.button-myhuisman { display: block; height: 20px; margin: 3px 0 0; font-size: 14px; line-height: 26px;}
.button-myhuisman img { height: 100%; }
.button-myhuisman:hover { color: #000 !important; }
@media (max-width: 1150px) {
.button-myhuisman { display: none; }
}
@media (max-width: 990px) {
.button-myhuisman { display: block; margin: 27px 0 20px; height: 30px; }
}
/* Tables */
.pe--history-article table td { vertical-align: top; }
/* Zoom hover image */
.hover-image { position: relative; overflow: hidden; cursor: pointer; }
.hover-image img { transition: all .4s ease-in-out; }
.hover-image:hover img { transform: scale(1.1,1.1) ; }
.overlay-caption { position: relative; filter: drop-shadow(0 2px 2px #0007); /* schaduw voor lichte achtergrond */ z-index: 20; }
.pe--market .overlay-caption { font-size: 30px; }
.pe--market .hover-image::after {
content: ""; position: absolute; bottom: 0; left: 0; right: 0; height: 90px; width: 100%;
background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(0,0,0,0.5) 100%); z-index: 10;
}
.image-container { position: relative; }
.image-container::after {
content: ""; position: absolute; bottom: 0; left: 15px; right: 15px; height: 90px; width: calc(100% - 30px);
background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(0,0,0,0.5) 100%); z-index: 10;
}
/* BUTTONS */
.btn { border-radius: 0px; padding: .375rem 1.2rem; background: #0093d1; cursor: pointer; font-family: inherit }
.btn.focus, .btn:focus { box-shadow: none; }
.btn-primary{color:#000 !important;background-color:#fff;border-color:#c2c9ce;}
.btn-primary:hover{color:#fff !important;background-color:#0093d1;border-color:#0093d1 }
.btn-primary:focus,.btn-primary.focus{box-shadow:0 0 0 .0rem #c2c9ce; color:#fff !important;}
.btn-primary.disabled,.btn-primary:disabled{color:#c2c9ce;background-color:#d2cbb6;border-color:#c2c9ce;}
.btn-primary:not(:disabled):not(.disabled):active,.btn-primary:not(:disabled):not(.disabled).active,.show>.btn-primary.dropdown-toggle{color:#c2c9ce;background-color:#fff;border-color:#c2c9ce}
.btn-primary:not(:disabled):not(.disabled):active:focus,.btn-primary:not(:disabled):not(.disabled).active:focus,.show>.btn-primary.dropdown-toggle:focus{box-shadow:0 0 0 .1rem #c2c9ce;color:#0093d1!important;}
.btn-outline-primary{color:#fff;background-color:transparent;border-color:#c2c9ce;}
.btn-outline-primary:hover{color:#000;background-color:#fff;border-color:#c2c9ce }
.btn-outline-primary:focus,.btn-outline-primary.focus{box-shadow:0 0 0 .0rem #c2c9ce}
.btn-outline-primary.disabled,.btn-outline-primary:disabled{color:#c2c9ce;background-color:#d2cbb6;border-color:#c2c9ce}
.btn-outline-primary:not(:disabled):not(.disabled):active,.btn-outline-primary:not(:disabled):not(.disabled).active,.show>.btn-outline-primary.dropdown-toggle{color:#c2c9ce;background-color:#fff;border-color:#c2c9ce}
.btn-outline-primary:not(:disabled):not(.disabled):active:focus,.btn-outline-primary:not(:disabled):not(.disabled).active:focus,.show>.btn-outline-primary.dropdown-toggle:focus{box-shadow:0 0 0 .1rem #c2c9ce}
.btn-outline-primary:hover .svg-inline--fa { color: #0192d0; }
.btn-primary .fal, .btn-primary .far, .btn-primary .fab,
.link-arrow .fal, .link-arrow .far, .link-arrow .fab { color: #0192d0; }
.btn-primary:hover .fal, .btn-primary:hover .far, .btn-primary:hover .fab,
.link-arrow:hover .fal, .link-arrow:hover .far, .link-arrow:hover .fab { color: #fff; }
.btn-secondary,
.btn-secondary.focus,
.btn-secondary:focus { background: #0192d0; border-color: #0192d0; color: #fff; }
.bg-secondary .text-blue { color: #28b8ff !important; }
.btn-link-white{color:#fff;background-color:transparent;border-color:transparent;}
.btn-link-white:hover{color:#fff;background-color:transparent;border-color:#0093d1; }
.btn-link-white:focus,.btn-link-white.focus{box-shadow:0 0 0 .0rem #c2c9ce}
.btn-link-white.disabled,.btn-link-white:disabled{color:#c2c9ce;background-color:#d2cbb6;border-color:#c2c9ce}
.btn-link-white:not(:disabled):not(.disabled):active,.btn-link-white:not(:disabled):not(.disabled).active,.show>.btn-link-white.dropdown-toggle{color:#fff;background-color:transparent;border-color:#0093d1}
.btn-link-white:not(:disabled):not(.disabled):active:focus,.btn-link-white:not(:disabled):not(.disabled).active:focus,.show>.btn-link-white.dropdown-toggle:focus{box-shadow:0 0 0 .0rem #c2c9ce}
.bg-dark .btn-link-white:hover { border-color: transparent; }
a.link-arrow { display: flex; justify-content: space-between; align-items: center }
a.link-arrow:hover { background-color: #0093d1; color: #fff; text-decoration: none; }
.link-arrow h5 { margin-bottom: 0; }
.text-blue { color: #0192d0 !important; }
.border-bottom-blue { border-bottom: 1px solid #cce9f6; }
@media (min-width: 992px) {
.border-top-blue { border-top: 1px solid #cce9f6; }
}
.triangle-white {
position: absolute;
right: 1px;
bottom: 5vw;
transform: rotate(90deg);
width: 0;
height: 0;
border-left: 15vw solid transparent;
border-bottom: 15vw solid transparent;
border-right: 15vw solid #fff;
transform-origin: CALC(20vw - 3px) CALC(10vw + 3px);
}
.tagline {
position: absolute;
left: 7.25vw;
top: 7.25vw;
width: 60vw;
max-width: 920px;
z-index: 5;
filter: drop-shadow(1px 1px 1px #0005); /* schaduw voor lichte achtergrond */
}
.scroll-suggest {
position: absolute;
left:50vw;
bottom: 2vw;
width: 30px;
height:58px;
z-index: 5;
background: url('/images/scroll-suggest.png') no-repeat;
}
@media (max-width: 992px) {
.scroll-suggest { display: none; }
}
.overlay-caption {
position: absolute;
bottom: 0px;
left: 25px;
}
@media (min-width: 992px) {
.pe--vervolg-visual .tagline-vervolg { width: 50vw; }
}
.pe--vervolg-visual .triangle-white {
position: absolute;
right:0;
bottom:0;
transform: rotate(90deg);
width: 0;
height: 0;
border-left: 18vw solid transparent;
border-bottom: 18vw solid transparent;
border-right: 18vw solid white;
transform-origin: CALC(25vw - 3px) CALC(11vw + 3px);
}
.pe--vervolg-visual .tagline-vervolg {
position: absolute;
left: 6vw;
top: 4vw;
width: 39vw;
max-width: 500px;
z-index: 5;
filter: drop-shadow(2px 2px 2px #0005); /* schaduw voor lichte achtergrond */
}
.pe--vervolg-visual .scroll-suggest {
position: absolute;
left: 50vw;
bottom: 2vw;
width: 30px;
height:58px;
z-index: 5;
background: url('images/scroll-suggest.png') no-repeat;
}
.xs-editmode.preview .visual-wrapper { margin: 0 0 5px; padding: 2px; border: 3px dashed #ccc; }
.xs-editmode.preview .visual-wrapper .triangle-white { display: none; }
p { margin: 0; }
.newsitem-date { font-size: 15px; }
.newsitem-intro { }
.newsitem-image img { max-width: 100%; }
.bg-dark { background-color: #1e434b !important; }
.news-card { display: flex; flex-direction: column; justify-content: space-between; }
.news-card .btn { width: fit-content }
.news-headline { font-size: 1.3rem; line-height: 1.7rem; }
.news-headline-byline { font-size: 0.8rem; text-transform: lowercase; }
.news-headline.px-md-3,
.news-headline-byline.px-md-3 { padding: 0 !important; }
.fact.fact1 { width: 100%; padding: 0 20%; }
.fact { width: 50%; display: flex; margin-bottom: 50px; }
.fact-icon { width:70px; }
.fact-icon img { width: 100%; }
.fact-txt { width: 53%; padding: 0 10px; font-size: 0.8rem; line-height: 1.1rem; }
@media (max-width: 991.9px) {
.fact.fact1 .fact-icon { width: 120px !important; }
.fact.fact1 .fact-txt { font-size: 1.2rem; line-height: 1.2rem; }
.fact.fact1 .fact-txt h4 { font-size: 2.2rem; line-height: 2.2rem; }
}
@media (min-width: 992px) {
.fact.fact1 { width: 20%; padding: 0 0; }
.fact { width: 20%; margin-bottom: 0px; }
}
.wide-grid .container-fluid .row,
.wide-grid .container-fluid .row .col-md-4,
.wide-grid .container-fluid .row .col-md-6 { padding-right: .5rem; padding-left: .5rem; }
/**
* MARKETS
**/
/* .pe--markets-container .pe--market .col-md-4 {
padding-right: .25rem;
padding-left: .25rem;
} */
.alternated .pe--product-intro:nth-child(2n+0) .product-intro-image { order: 2; }
.alternated .pe--product-intro:nth-child(2n+0) .product-intro-text { order: 1; }
.left .pe--product-intro .product-intro-image { order: 1; }
.left .pe--product-intro .product-intro-text { order: 2; }
.right .pe--product-intro .product-intro-image { order: 2; }
.right .pe--product-intro .product-intro-text { order: 1; }
@media (max-width: 991.9px) {
.alternated .pe--product-intro:nth-child(2n+0) .product-intro-image { order: 1; }
.alternated .pe--product-intro:nth-child(2n+0) .product-intro-text { order: 2; }
.pe--location-specific .product-intro-image { margin: 0 0 10px; }
}
/**
* SEARCH RESULT
*/
.xsearch-result { cursor: pointer; }
.xsearch-result:hover h2 { color: #0093d1; }
/**
* REFERENCES -------------------------------------------------- niet helemaal uitgewerkt want mogelijk deprecated ---------------------------------
*/
.reference { position:relative; }
.reference .pagename { color:#fff; }
.reference-search-wrapper { display:flex; justify-content:space-between; width:100%; margin:10px 0 18px; background:#e5e5e5; }
.reference-search-input { width:calc(100% - 70px); padding:5px 10px; font-size:18px; border:0; background:#e5e5e5; }
.reference-search-button { height:36px; width:36px; border:0; background:#78caf0 url('../images/ref-search-icon.png') 5px 6px no-repeat; cursor:pointer; }
.reference-search-button:hover { background:#046494 url('../images/ref-search-icon.png') 5px 6px no-repeat; }
.reference-filters-wrapper { display:flex; justify-content:space-between; }
.reference-filter { position:relative; }
.reference-filter-handler {
width: 140px; padding:5px 10px; color:#7c7c7c; border: 1px solid #dedede;
background: url('../images/referentie-filter-arrow.png') 90% center no-repeat; cursor:pointer; z-index:5;
}
.reference-filter:hover .reference-filter-handler { z-index: 10; }
.reference-filter-content-wrapper { position:absolute; top:37px; left:0; box-shadow:3px 4px 4px 0 rgba(0, 0, 0, 0.3); display:none; z-index:101; }
.reference-filter:last-child .reference-filter-content-wrapper { left: unset; right: 0; }
.reference-filter-content { width: 250px; max-height: 230px; overflow:scroll; overflow-x:hidden; padding:10px; border: 1px solid #e5e5e5; background:#fff; }
.reference-filter-option { display:flex; font-size: 15px; line-height: 27px; }
label.reference-filter-option:hover { cursor: pointer; color: #1e8bbe; text-decoration: underline; }
.reference-filter-option input { margin: 3px 8px 0 0; }
.reference-filter-button-wrapper { padding:8px 8px; background:#fff; }
.reference-filter-button.button { display:inline-block; }
.reference-filter:hover .reference-filter-handler { box-shadow:3px 4px 4px 0 rgba(0, 0, 0, 0.3); }
.reference-filter:hover .reference-filter-content-wrapper { display:block; }
.reference-active-filters-container { display:flex; flex-wrap:wrap; }
.reference-active-filter { margin:0 10px 18px 0; padding:5px 30px 5px 10px; background:#0192d0 url('../images/active-referentie-close.png') right 10px center no-repeat; color:#fff; cursor:pointer; }
.reference-reset-filter { margin:0 10px 18px 0; padding:5px 10px 5px 26px; background: url('../images/active-referentie-close.png') left 10px center no-repeat; color:#fff; cursor:pointer; }
.reference-list { display:flex; justify-content:space-between; }
.reference-image-wrapper { flex:0 0 300px; background:#0192d0; }
.reference-image-wrapper img { width: 100%; }
.reference-content-wrapper { flex:0 0 420px; }
.reference-content-wrapper .padding { padding:30px; }
.reference-content-wrapper.ref-list .padding { padding:15px; }
.reference-content-wrapper h2 { margin: 0 0 15px; font: 400 22px/24px 'Open Sans',arial, sans-serif; color: #185a85; }
.reference-content-meta { font-size: 18px; }
.pe--reference.tpl--product .triangle-white {
bottom: 68px;
border-left: 20px solid transparent;
border-bottom: 60px solid transparent;
border-right: 60px solid #fff;
transform-origin: 16px 65px;
}
.pe--reference.tpl--product .reference-title { font-size: 16px; line-height: 20px; }
@media (max-width: 991.9px) {
.reference-filters-wrapper { flex-flow: column; }
.reference-filter-handler { width: auto; margin: 0 0 10px; background: url(../images/referentie-filter-arrow.png) 96% center no-repeat; }
.reference-filter-content { width: auto; }
.reference-filter-content-wrapper { top: 37px; width: 100%; }
.reference-filter-content { width: auto; }
}
/* --------------------------------------------------------------------------------------------------------------------------------- */
.section-fold-title { font-size: 22px; }
.section-fold-toggle { cursor: pointer; }
.section-fold-toggle.collapsed::before { margin: 0 12px 0 0; font-family:'Font Awesome 5 Pro'; content:"\f078"; }
.section-fold-toggle::before { margin: 0 12px 0 0; font-family:'Font Awesome 5 Pro'; content:"\f077"; }
/**
* PRODUCT
*/
.mfp-title { font-size: 14px; }
.mfp-counter { display: none; }
.downloadlink { color: #0192d0 !important; }
.popup-gallery figure { margin: 0; }
.overlay-caption { position: absolute; bottom: 0; width: calc(100% - 50px); left: 25px; font-size: 20px; }
.videowrapper { position: relative; height: 0; padding: 0 0 57.25%; }
.videowrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
@media (min-width: 992px) {
.video-slider { margin-top: -111px; margin-left: 15px; }
.videowrapper { padding: 0 0 68.25%; }
}
.slick-dots li button:before { font-size: 10px !important; font-family:'Font Awesome 5 Pro' !important; font-weight: 600; content:"\f111" !important; color: #1e434b !important; }
.wide-grid.popup-gallery .slick-track { min-width: 100%; }
/**
* DOWNLOADS
*/
.media-center-outro { display: none; }
.download-brochure-form-download-link-wrapper { color:#046494; padding:10px 0; display: none; }
.req_field,
.download-form-error-wrapper { padding: 10px 0; color: #ea2538; font-size: 14px; }
.download-brochure-form-wrapper .pe--downloads-wrapper { width: calc(100% - 20px); }
.product-download-brochure-form-wrapper {
position: fixed; top: calc(50vh - 270px); left: calc(50vw - 45%); width: 90%;
padding: 26px; background: #fff; box-shadow: 0 4px 5px 0 rgba(0, 0, 0, .2); z-index: 99999;
display: none;
}
@media (min-width: 768px) {
.product-download-brochure-form-wrapper {
left: calc(50vw - 370px); width: 740px;
}
}
.product-download-brochure-form-backdrop { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background-color: rgba(0, 0, 0, .3); z-index: 1040; display: none; }
.product-download-button { display: none; }
.product-download-loader { display: none; }
/**
* FORMS
*/
.form-control:focus { box-shadow: 0 0 0 0.05rem rgba(0,123,255,.25); }
.form-check-label { position: relative; display: block; padding-left: 23px; cursor: user-select: none; }
.form-check-label input { position: absolute; height: 0; width: 0; opacity: 0; cursor: pointer; }
.checkmark { position: absolute; top: 5px; left: 0; height: 15px; width: 15px; box-shadow: inset 0px 0px 0px 1px #1e434b; border-radius: 3px; }
.form-check-label:hover input ~ .checkmark { ; }
.form-check-label input:checked ~ .checkmark { background-color: #1e434b ; }
.checkmark:after { content: ''; position: absolute; display: none; }
.form-check-label input:checked ~ .checkmark:after { display: block; }
.form-check-label .checkmark:after { left: 6px; top: 2px; width: 4px; height: 9px; border: solid white; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.blue-card {
width: 100%;
padding: 40px 40px 40px;
background: url('/images/bg-blue-transparent.png') bottom right no-repeat;
color: #fff;
}
.blue-card-image { width: 100%; }
.blue-card-buttons .btn-link-white { cursor: pointer; }
.slick-slide { font-size: 1rem; }
.blue-card .btn-primary { background-color: #2c9dd5; border-color: #fff; color: #fff !important; }
.blue-card .btn-primary .fa-arrow-right:before { color: #fff; }
.blue-card .btn-primary:hover { color: #000 !important; background-color: #fff; border-color: #0192d0; }
.blue-card .btn-primary:hover .fa-arrow-right:before { color: #0192d0; }
@media (min-width: 992px) {
.innovation-images-slides-wrapper { margin-top: -62px; }
.blue-card {
position: absolute;
background: url('/images/bg-blue-transparent.png') bottom right no-repeat;
width: 470px;
margin-left: 15px;
padding: 40px 40px 40px;
color: #FFF;
display: flex;
flex-direction: column;
justify-content: space-between;
}
}
.slick-slide:focus { outline: none; }
.slick-prev, .slick-next { top: 40% !important; }
.slick-prev:before { font-family:'Font Awesome 5 Pro' !important; content:"\f053" !important; color: #000 !important; }
.slick-next:before { font-family:'Font Awesome 5 Pro' !important; content:"\f054" !important; color: #000 !important; }
/* MAPS */
.map-location { font-family: 'Helvetica Neue LT Light', sans-serif; }
.map-location-title { font-family: 'Helvetica Neue LT Heavy', sans-serif; font-size: 16px; }
.map-location-subtitle { margin: 0 0 10px; font-size: 14px; }
.gm-style-iw h2 { font-size: 18px; }
.gm-style-iw .map-location { display: flex; }
.gm-style-iw .map-location-image { align-self: start; margin: 0 10px 0 0; }
.map-wrapper { position: relative; }
#map { height: 700px; }
.map-title-wrapper { margin: -1px 0 -61px; }
.map-title-filler { position: absolute; top: 0; left: 0; width: calc((100vw - 300px) / 2); height: 53px; background: #fff; z-index: 10; }
.map-title-container { position: relative; display: inline-block; z-index: 10; }
.map-title { padding: 0 20px 15px 0; background: #fff; }
.map-title-angle { position: absolute; top: 0; right: -64px; width: 0; height: 0; border-top: 53px solid #fff; border-right: 64px solid transparent; }
.map-legend-container { position: absolute; bottom: 0; right: 0; width: calc((100vw - 300px) / 2); height: 33px; background: #fff; z-index: 10; }
.map-legend-angle { position: absolute; bottom: 0; right: calc((100vw - 300px) / 2); width: 0; height: 0; border-bottom: 33px solid #fff; border-left: 33px solid transparent; }
.map-legend { font-family: 'Helvetica Neue LT Heavy', sans-serif; font-size: 13px; }
.map-legend.location { background: url('../images/marker.png') 2px 2px / 15px auto no-repeat; }
.map-legend.agency { background: url('../images/marker-agency.png') 2px 2px / 15px auto no-repeat; }
.address { font-size: 15px; line-height: 19px; }
.map-info-row { }
.map-info-row-data { width: 150px; font-family: 'Helvetica Neue LT Heavy', sans-serif; font-size: 16px; color: #0192d0; }
.map-info-row-data.size-xl { font-size: 24px; line-height: 22px; }
.map-info-row-data.size-l { font-size: 20px; line-height: 18px; }
.map-info-row-data.size-m { font-size: 16px; line-height: 14px; }
.map-info-row-data.size-s { font-size: 12px; line-height: 12px; }
@media (min-width: 768px) {
.map-title-filler { width: calc((100vw - 680px) / 2); }
}
@media (min-width: 992px) {
.map-title-wrapper { margin: -1px 0 -72px; }
.map-title-filler { height: 64px; width: calc((100vw - 500px) / 2); }
.map-title-angle { border-top: 64px solid #fff; }
}
@media (max-width: 400px) {
.map-title-angle { right: -45px; border-top: 54px solid #fff; border-right: 45px solid transparent; }
.map-location { width: 100% !important; }
.map-info-row { flex-flow: column nowrap; }
.map-info-row-data { width: 100%; padding: 5px 0 0 !important; text-align: left !important; }
.map-info-row-legend { width: 100%; margin: 0 0 5px !important; padding: 0 !important; text-align: left !important; }
.map-legend-container { width: calc(100% - 33px); }
.map-legend-angle { right: unset; left: -33px; }
}
.xsearch-result-message { font-size: 15px; }
.xsearch-result-title { font-size: 20px; }
.xsearch-snippet { font-size: 15px; line-height: 18px; }
.xsearch-url { font-size: 14px; line-height: 18px; text-decoration: underline; }
/* pagination */
.page-link { color: #333; }
.page-item.active .page-link { background: #0093d1; color: #fff; border-color: #0093d1; }
.non-footer { flex: 1 0 auto; }
footer { flex-shrink: 0; }
.logo-footer { width: 180px; margin: -16px 0 0; }
footer a { font-size: 1rem; color: #fff; }
footer .h4 { text-transform: lowercase; }
.social-links .btn { width: 37px; padding: .3rem .5rem; border-color: #fff; }
.social-links .btn:hover i { color: #0093d1; }
.copyright { font-size: 0.8rem; color: #64737a; }
/* FLYOVER BANNER */
.flyover-banner { bottom: -240px; right: 20px; font-size: 20px; line-height: 24px; filter: drop-shadow(1px 2px 2px rgb(0, 0, 0, 0.4)); }
.flyover-banner-payoff { position: absolute; top: 10px; left: 0; max-width: 230px; padding: 10px; background: #fff; font-family: 'Helvetica Neue LT Heavy'; font-size: 18px; }
.flyover-banner-payoff-angle { position: absolute; top: 0; right: -25px; width: 0; height: 0; border-top: 44px solid #fff; border-right: 25px solid transparent; }
.flyover-banner-content { width: 230px; height: 165px; }
.flyover-banner-intro { font-weight: 300; }
.flyover-banner-title { font-family: 'Helvetica Neue LT Heavy', sans-serif; }
.flyover-banner-content a { font-size: 18px; }
.flyover-banner-content a .fal { }
.flyover-banner-right-top { width: 50px; height: 110px; }
.flyover-banner-right-bottom { position: absolute; bottom: 0; right: 0; width: 0; height: 0; border-top: 55px solid #0093d1; border-right: 50px solid transparent; }
.flyover-banner-close { position: absolute; right: 12px; top: 6px; color: #cbe3ef; cursor: pointer; z-index: 90; }
.flyover-banner-close:hover { color: #0093d1; }
.flyover-banner:hover { cursor: pointer; }
.flyover-banner:hover .flyover-banner-content { background: #fff !important; color: #0093d1; }
.flyover-banner:hover .flyover-banner-right-top { background: #fff !important; }
.flyover-banner:hover .flyover-banner-right-bottom { border-top: 55px solid #fff; }
.flyover-banner:hover a { color: #0093d1 !important; }
.flyover-banner-full { bottom: -240px; right: 20px; width: 540px; height: 165px; font-size: 20px; line-height: 24px; filter: drop-shadow(1px 2px 2px rgb(0, 0, 0, 0.4)); }
.flyover-banner-full-image { position: absolute; top: 0; left: 0; z-index: 10; }
.flyover-banner-full-title { position: relative; width: 180px; font-family: 'Helvetica Neue LT Heavy', sans-serif; font-size: 24px; z-index: 20; }
.flyover-banner-full-payoff { position: relative; width: 180px; font-size: 15px; line-height: 18px; z-index: 20; }
.flyover-banner-full-logo { position: absolute; bottom: 10px; right: 10px; width: 25%; z-index: 50; }
@media (max-width: 768px) {
.flyover-banner { bottom: -400px; }
.flyover-banner-full { width: calc(100% - 40px); max-width: 540px; }
.flyover-banner-full-image { height: 100%; object-fit: none; }
}
.share-buttons-container {
display: flex;
padding: 0 12px 0 0;
position: relative;
}
.share-buttons-container:hover .share-menu {
display: block;
}
.share-menu {
position: absolute;
top: 20px;
right: 6px;
z-index: 5;
width: 102px;
box-shadow: 3px 3px 0 0 rgb(0 0 0 / 20%);
border: 1px solid #c0c0c0;
background: #FFF;
display: none;
cursor: pointer;
}
.share-menu a {
display: block;
padding: 6px;
border-top: 1px solid #F2F2F2;
}
.fa-share-square,
a.share-button:hover { color: #0093d1 !important; }
.share-button .share-button-icon {
width: 20px;
margin-right: 5px;
text-align: center;
}
.permalink-wrapper {
position: fixed;
top: 24%;
right: 0;
left: 0;
width: 465px;
margin: 0 auto;
padding: 20px;
background: #fff;
box-shadow: 0 4px 6px 2px rgba(0, 0, 0, 0.2);
z-index: 999;
display: none;
}
.permalink-box {
margin: 5px 0 0;
padding: 6px;
width: 100%;
border: 1px solid #c0c0c0;
box-sizing: border-box;
}
.permalink-close {
position: absolute;
top: 15px;
right: 20px;
cursor: pointer;
}
#permabox-backdrop {
position: fixed;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: #000;
opacity: .4;
z-index: 200;
display: none;
}
/* Magnific Popup CSS */
.mfp-bg {
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1042;
overflow: hidden;
position: fixed;
background: #0b0b0b;
opacity: 0.8; }
.mfp-wrap {
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1043;
position: fixed;
outline: none !important;
-webkit-backface-visibility: hidden; }
.mfp-container {
text-align: center;
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
padding: 0 8px;
box-sizing: border-box; }
.mfp-container:before {
content: '';
display: inline-block;
height: 100%;
vertical-align: middle; }
.mfp-align-top .mfp-container:before {
display: none; }
.mfp-content {
position: relative;
display: inline-block;
vertical-align: middle;
margin: 0 auto;
text-align: left;
z-index: 1045; }
.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {
width: 100%;
cursor: auto; }
.mfp-ajax-cur {
cursor: progress; }
.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
cursor: -moz-zoom-out;
cursor: -webkit-zoom-out;
cursor: zoom-out; }
.mfp-zoom {
cursor: pointer;
cursor: -webkit-zoom-in;
cursor: -moz-zoom-in;
cursor: zoom-in; }
.mfp-auto-cursor .mfp-content {
cursor: auto; }
.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none; }
.mfp-loading.mfp-figure {
display: none; }
.mfp-hide {
display: none !important; }
.mfp-preloader {
color: #CCC;
position: absolute;
top: 50%;
width: auto;
text-align: center;
margin-top: -0.8em;
left: 8px;
right: 8px;
z-index: 1044; }
.mfp-preloader a {
color: #CCC; }
.mfp-preloader a:hover {
color: #FFF; }
.mfp-s-ready .mfp-preloader {
display: none; }
.mfp-s-error .mfp-content {
display: none; }
button.mfp-close,
button.mfp-arrow {
overflow: visible;
cursor: pointer;
background: transparent;
border: 0;
-webkit-appearance: none;
display: block;
outline: none;
padding: 0;
z-index: 1046;
box-shadow: none;
touch-action: manipulation; }
button::-moz-focus-inner {
padding: 0;
border: 0; }
.mfp-close {
width: 44px;
height: 44px;
line-height: 44px;
position: absolute;
right: 0;
top: 0;
text-decoration: none;
text-align: center;
opacity: 0.65;
padding: 0 0 18px 10px;
color: #FFF;
font-style: normal;
font-size: 28px;
font-family: Arial, Baskerville, monospace; }
.mfp-close:hover,
.mfp-close:focus {
opacity: 1; }
.mfp-close:active {
top: 1px; }
.mfp-close-btn-in .mfp-close {
color: #333; }
.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
color: #FFF;
right: 6px;
text-align: right;
padding-right: 6px;
width: 100%; }
.mfp-counter {
position: absolute;
top: 0;
right: 0;
color: #CCC;
font-size: 12px;
line-height: 18px;
white-space: nowrap; }
.mfp-arrow {
position: absolute;
opacity: 0.65;
margin: 0;
top: 50%;
margin-top: -55px;
padding: 0;
width: 90px;
height: 110px;
-webkit-tap-highlight-color: transparent; }
.mfp-arrow:active {
margin-top: -54px; }
.mfp-arrow:hover,
.mfp-arrow:focus {
opacity: 1; }
.mfp-arrow-left {
left: 0;
}
.mfp-arrow-left:after { content: "\f104"; font-family: "Font Awesome 5 Pro"; font-weight: 900; font-size: 34px; color: #fff; }
.mfp-arrow-right {
right: 0;
}
.mfp-arrow-right:after { content: "\f105"; font-family: "Font Awesome 5 Pro"; font-size: 34px; color: #fff; }
.mfp-iframe-holder {
padding-top: 40px;
padding-bottom: 40px; }
.mfp-iframe-holder .mfp-content {
line-height: 0;
width: 100%;
max-width: 900px; }
.mfp-iframe-holder .mfp-close {
top: -40px; }
.mfp-iframe-scaler {
width: 100%;
height: 0;
overflow: hidden;
padding-top: 56.25%; }
.mfp-iframe-scaler iframe {
position: absolute;
display: block;
top: 0;
left: 0;
width: 100%;
height: 100%;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
background: #000; }
/* Main image in popup */
img.mfp-img {
width: auto;
max-width: 100%;
height: auto;
display: block;
line-height: 0;
box-sizing: border-box;
padding: 0;
margin: 0 auto; }
/* The shadow behind the image */
.mfp-figure {
line-height: 0; }
.mfp-figure:after {
content: '';
position: absolute;
left: 0;
top: 40px;
bottom: 40px;
display: block;
right: 0;
width: auto;
height: auto;
z-index: -1;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
background: #444; }
.mfp-figure small {
color: #BDBDBD;
display: block;
font-size: 12px;
line-height: 14px; }
.mfp-figure figure {
margin: 0; }
.mfp-bottom-bar {
margin-top: -36px;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
padding: 30px 14px 10px;
background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(0,0,0,0.5) 100%);
cursor: auto; }
.mfp-title {
text-align: left;
line-height: 18px;
color: #F3F3F3;
word-wrap: break-word;
padding-right: 36px; }
.mfp-image-holder .mfp-content {
max-width: 100%; }
.mfp-gallery .mfp-image-holder .mfp-figure {
cursor: pointer; }
@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
/**
* Remove all paddings around the image on small screen
*/
.mfp-img-mobile .mfp-image-holder {
padding-left: 0;
padding-right: 0; }
.mfp-img-mobile img.mfp-img {
padding: 0; }
.mfp-img-mobile .mfp-figure:after {
top: 0;
bottom: 0; }
.mfp-img-mobile .mfp-figure small {
display: inline;
margin-left: 5px; }
.mfp-img-mobile .mfp-bottom-bar {
background: rgba(0, 0, 0, 0.6);
bottom: 0;
margin: 0;
top: auto;
padding: 3px 5px;
position: fixed;
box-sizing: border-box; }
.mfp-img-mobile .mfp-bottom-bar:empty {
padding: 0; }
.mfp-img-mobile .mfp-counter {
right: 5px;
top: 3px; }
.mfp-img-mobile .mfp-close {
top: 0;
right: 0;
width: 35px;
height: 35px;
line-height: 35px;
background: rgba(0, 0, 0, 0.6);
position: fixed;
text-align: center;
padding: 0; } }
@media all and (max-width: 900px) {
.mfp-arrow {
-webkit-transform: scale(0.75);
transform: scale(0.75); }
.mfp-arrow-left {
-webkit-transform-origin: 0;
transform-origin: 0; }
.mfp-arrow-right {
-webkit-transform-origin: 100%;
transform-origin: 100%; }
.mfp-container {
padding-left: 6px;
padding-right: 6px; } }