@charset "UTF-8";

   :root { 
--grid-size-xl: ;
--grid-size-lg: 118rem;
--grid-size-md: 78rem;
--grid-size-sm: ;
--grid-size-xs: ;
--grid-padding: 4rem;
--color-grey: #333;
--color-lightgrey: #aaa;
--color-lightergrey: #f4f4f4;
--color-darkblue: #072d5f;
--color-darkerblue: #03162f;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
*:focus {
outline: none;
}
html {
font-size: 62.5%;
}
body {
font-family: 'Open Sans', sans-serif;
font-size: 1.7rem;
font-weight: 400;
font-smoothing: antialiased;
-webkit-font-smoothing: antialiased; 
font-optical-sizing: auto;
line-height: 2;
text-rendering: optimizeLegibility;
color: var(--color-grey);
} h1,
h2,
h3,
h4 {
margin: 0;
line-height: 1.3;
color: var(--color-darkblue);
}
h1 {
margin-bottom: 2rem;
font-size: 3.6rem;
}
h1.small,
h2.large,
h2 {
margin-bottom: 2rem;
font-size: 2.8rem;
}
h3 {
margin-bottom: .5rem;
font-size: 2.4rem;
}
h4 {
margin-bottom: .5rem;
font-size: 2rem;
} p {
margin: 0 0 2.5rem;
}
p:empty {
display: none;
}
p:last-child {
margin: 0;
}
a {
color: var(--color-grey);
text-decoration: underline;
transition: .3s;
}
small {
font-size: 1.5rem;
line-height: 1.4;
color: var(--color-lightgrey);
} ul,
ol {
margin: 0 0 3rem;
padding-left: 2rem;
} section {
padding: 0 var(--grid-padding);
}
.row-fw,
.row-xl,
.row-lg,
.row-md,
.row-sm,
.row-xs {
width: 100%;
margin: 0 auto;
}
.row-xl {
max-width: var(--grid-size-xl);
}
.row-lg {
max-width: var(--grid-size-lg);
}
.row-md {
max-width: var(--grid-size-md);
}
.row-sm {
max-width: var(--grid-size-sm);
}
.row-xs {
max-width: var(--grid-size-xs);
}
.pt-lg {
padding-top: 11rem;
}
.pt-md {
padding-top: 6rem;
}
.pt-sm {
padding-top: 4rem;
}
.pt-none {
padding-top: 0;
}
.pb-lg {
padding-bottom: 11rem;
}
.pb-md {
padding-bottom: 6rem;
}
.pb-sm {
padding-bottom: 4rem;
}
.pb-none {
padding-bottom: 0;
} .btn {
display: inline-block;
margin: 0 1rem 1rem 0;
padding: 1.5rem 3rem;
background-color: var(--color-darkblue);
border: 0;
border-radius: 5rem;
font-size: 1.5rem;
font-weight: 600;
line-height: 1.3;
color: white;
text-decoration: none !important;
transition: .3s;
}
.btn.white {
background-color: white;
color: var(--color-darkblue);
}
.btn:hover {
background-color: var(--color-darkerblue);
}
.btn.white:hover {
background-color: var(--color-darkblue);
color: white;
} img {
max-width: 100%;
height: auto;
} header {
position: relative;
box-shadow: 0 .3rem .6rem rgba(0, 0, 0, 0.16);
}
header .top {
padding: 0 var(--grid-padding);
}
header .top .container {
padding: 1.5rem 0;
display: flex;
justify-content: space-between;
align-items: center;
}
header .logo-wrapper {
display: flex;
}
header .logo-wrapper img {
width: auto;
height: 6rem;
}
header ul.menu {
list-style-type: none;
margin: 0;
padding: 0;
display: flex;
gap: 3rem;
}
header ul.menu a {
padding: .2rem 0 .1rem;
border-bottom: .1rem solid transparent;
font-size: 1.8rem;
font-weight: 700;
line-height: 1.3;
color: var(--color-darkblue);
text-decoration: none;
}
header ul.menu a:hover,
header ul.menu li.current-menu-item a {
border-color: var(--color-darkblue);
}
header .bottom {
position: absolute;
z-index: 0;
top: 9rem;
width: 100%;
padding: 0 var(--grid-padding);
background: #072D5F;
background: linear-gradient(90deg,rgba(7, 45, 95, 1) 63%, rgba(7, 45, 95, 0) 63%);
font-size: 1.5rem;
line-height: 1.4;
color: white;
}
header .bottom::before {
content: '';
position: absolute;
top: 0;
left: calc(63% - .1rem);
width: 2rem;
height: 100%;
background-color: var(--color-darkblue);
clip-path: polygon(0 0, 100% 0, calc(100% - 1rem) 100%, 0% 100%);
}
header .bottom a {
color: white;
}
header .bottom .container {
max-width: 63%;
min-height: 2rem;
padding: .75rem 0 .75rem calc(50% - calc(var(--grid-size-lg) / 2));
display: flex;
align-items: center;
}
header .hamburger {
position: fixed;
z-index: 10;
right: var(--grid-padding);
width: 4rem;
height: 4rem;
border-radius: 50%;
background-color: white;
display: none;
justify-content: center;
align-items: center;
font-size: 2rem;
line-height: 1;
color: var(--color-darkblue);
cursor: pointer;
}  footer {
margin-top: 1rem;
padding: 0 var(--grid-padding);
background-color: var(--color-darkblue);
font-size: 1.5rem;
line-height: 1.4;
color: white;
}
footer a {
color: white;
text-decoration: none;
}
footer a:hover {
text-decoration: underline;
}
footer .container {
padding: 4rem 0;
} @media (max-width: 1260px) { header ul.menu {
gap: 2rem;
}
}
@media (max-width: 1024px) { :root { 
--grid-padding: 2rem;
} header .menu-hoofdmenu-container {
display: none;
}
header .hamburger {
display: flex;
}
}
@media (max-width: 767px) { body {
font-size: 1.6rem;
line-height: 1.8;
} h1 {
margin-bottom: 1.5rem;
font-size: 2.8rem;
}
h1.small,
h2.large,
h2 {
margin-bottom: 1.5rem;
font-size: 2.4rem;
}
h3 {
font-size: 2rem;
}
h4 {
font-size: 1.8rem;
} .pt-lg {
padding-top: 5rem;
}
.pt-md {
padding-top: 4rem;
}
.pt-sm {
padding-top: 3rem;
}
.pb-lg {
padding-bottom: 5rem;
}
.pb-md {
padding-bottom: 4rem;
}
.pb-sm {
padding-bottom: 3rem;
} .btn {
padding: 1.25rem 2.5rem;
} header .bottom {
background: linear-gradient(90deg,rgba(7, 45, 95, 1) 75%, rgba(7, 45, 95, 0) 75%);
}
header .bottom::before {
left: calc(75% - .1rem);
}
header .bottom .container {
max-width: 75%;
} footer .container {
padding: 2.5rem 0;
}
}
@media (max-width: 499px) { :root { 
--grid-padding: 1.5rem;
}
}.hero,
.hero-extended {
padding: 0;
color: white;
}
.hero a,
.hero-extended a {
color: white;
text-decoration: none;
}
.hero a:hover,
.hero-extended a:hover {
text-decoration: underline;
}
.hero h1,
.hero h2,
.hero h3,
.hero h4,
.hero-extended h1,
.hero-extended h2,
.hero-extended h3,
.hero-extended h4 {
color: white;
}
.hero .btn,
.hero-extended .btn {
margin-left: .5rem;
margin-right: .5rem;
}
.hero,
.hero-extended .top {
padding: 0 var(--grid-padding);
background-size: cover;
background-position: center;
}
.hero .container,
.hero-extended .top .container {
padding: 5rem 0;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
} .hero .container {
min-height: 37rem;
} .hero-extended .top .container {
min-height: 56rem;
}
.hero-extended .bottom {
transform: translateY(-50%);
margin-left: 50%;
padding-right: var(--grid-padding);
background-color: var(--color-darkblue);
font-size: 1.6rem;
line-height: 1.8;
}
.hero-extended .bottom .container {
max-width: calc(var(--grid-size-lg) / 2);
padding: 3rem 0 3rem 3.5rem;
display: flex;
gap: 5rem;
} .hero-text-2-columns {
padding: 0;
}
.hero-text-2-columns .top {
min-height: 37rem;
background-size: cover;
background-position: center;
}
.hero-text-2-columns .bottom .container {
display: grid;
grid-template-columns: 1fr 1fr;
}
.hero-text-2-columns .form-wrapper {
padding-left: var(--grid-padding);
}
.hero-text-2-columns .form-wrapper .inner {
max-width: calc(var(--grid-size-lg) / 2);
margin-left: auto;
padding: 6rem 5rem 5rem 0;
}
.hero-text-2-columns .content-wrapper {
margin-top: -17rem;
padding-right: var(--grid-padding);
background-color: var(--color-darkblue);
}
.hero-text-2-columns .content-wrapper,
.hero-text-2-columns .content-wrapper a,
.hero-text-2-columns .content-wrapper h1,
.hero-text-2-columns .content-wrapper h2,
.hero-text-2-columns .content-wrapper h3,
.hero-text-2-columns .content-wrapper h4 {
color: white;
}
.hero-text-2-columns .content-wrapper a {
text-decoration: none;
}
.hero-text-2-columns .content-wrapper a:hover {
text-decoration: underline;
}
.hero-text-2-columns .content-wrapper .inner {
max-width: calc(var(--grid-size-lg) / 2);
padding: 6rem 0 5rem 5rem;
} @media (max-width: 1260px) { .hero-extended .bottom {
margin-left: 30%;
}
.hero-extended .bottom .container {
max-width: calc(var(--grid-size-lg) * .7);
}
}
@media (max-width: 899px) { .hero-extended .top .container {
min-height: 48rem;
}
.hero-extended .bottom {
margin-left: 20%;
}
.hero-extended .bottom .container {
max-width: calc(var(--grid-size-lg) * .8);
}
}
@media (max-width: 767px) { .hero .container {
min-height: 30rem;
} .hero-extended .bottom {
margin-left: var(--grid-padding);
padding: 0 var(--grid-padding);
}
.hero-extended .bottom .container {
max-width: 100%;
padding: 2rem 0 2rem 1rem;
} .hero-text-2-columns .top {
min-height: 30rem;
}
.hero-text-2-columns .bottom .container {
grid-template-columns: 1fr;
}
.hero-text-2-columns .form-wrapper {
order: 2;
padding: 0 var(--grid-padding);
}
.hero-text-2-columns .form-wrapper .inner {
max-width: inherit;
margin-left: inherit;
padding: 4rem 0;
}
.hero-text-2-columns .content-wrapper {
order: 1;
margin-top: inherit;
padding: 0 var(--grid-padding);        
}
.hero-text-2-columns .content-wrapper .inner {
max-width: inherit;
padding: 4rem 0;
}
}
@media (max-width: 599px) { .hero-extended + section {
padding-top: 4rem;
}
.hero-extended .top .container {
min-height: 37rem;
}
.hero-extended .bottom {
transform: none;
margin-left: inherit;
padding: 0 var(--grid-padding);
}
.hero-extended .bottom .container {
flex-direction: column;
gap: 2.5rem;
padding: 3rem 0;
}
}.content-text-sidebar .container {
display: flex;
gap: 10rem;
}
.content-text-sidebar .content-wrapper {
flex: 1 1 auto;
}
.content-text-sidebar .sidebar-wrapper {
flex: 0 0 30rem;
} .content-video .media {
position: relative;
width: 100%;
height: 0;
padding-top: 56.25%;
}
.content-video .media > * {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
} .content-text-2-columns .content-wrapper {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 10rem;
} section + section.content-form {
margin-top: 2rem;
} @media (max-width: 1024px) { .content-text-sidebar .container {
gap: 6rem;
}
.content-text-sidebar .sidebar-wrapper {
flex: 0 0 26rem;
}
}
@media (max-width: 899px) { .content-text-sidebar .sidebar-wrapper {
flex: 0 0 22rem;
}
}
@media (max-width: 767px) { .content-text-sidebar .container {
flex-direction: column;
gap: 3rem;
}
.content-text-sidebar .content-wrapper,
.content-text-sidebar .sidebar-wrapper {
flex: inherit;
} .content-text-2-columns .content-wrapper {
grid-template-columns: 1fr;
grid-gap: 2.5rem;
}
}.slider-gallery {
padding-left: 0;
padding-right: 0;
}
.slider-gallery .swiper-slide {
width: auto;
height: 30rem;
}
.slider-gallery .swiper-slide img {
width: auto;
height: 100%;
} @media (max-width: 767px) { .slider-gallery .swiper-slide {
height: 26rem;
}
}
@media (max-width: 499px) { .slider-gallery .swiper-slide {
height: 22rem;
}
}.grid-gallery .grid {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 2rem;
}
.grid-gallery .item {
position: relative;
width: 100%;
height: 0;
padding-top: 67%;
}
.grid-gallery .item img {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
} @media (max-width: 767px) { .grid-gallery .grid {
grid-template-columns: 1fr;
}
}
@media (max-width: 499px) { .grid-gallery .grid {
grid-gap: 1.5rem;
}
}.gform-theme--foundation .gform_fields {
grid-gap: 1.5rem 2rem !important;
} .gform-theme--foundation .gfield input,
.gform-theme--foundation .gfield select,
.gform-theme--foundation .gfield textarea {
padding: 1rem 2rem !important;
border: .1rem solid var(--color-lightergrey) !important;
border-radius: 0 !important;
background-color: var(--color-lightergrey) !important;
font-size: 1.5rem !important;
box-shadow: none !important;
} .gform-theme--framework .gform_button {
padding: 1.5rem 3rem !important;
background-color: var(--color-darkblue) !important;
border-radius: 5rem !important;
font-size: 1.5rem !important;
font-weight: 600 !important;
line-height: 1.3 !important;
color: white !important;
transition: .3s !important;
}
.gform-theme--framework .gform_button:hover {
background-color: var(--color-darkerblue) !important;
} .gform-theme--framework .gform_validation_errors {
display: none !important;
}
.gform-theme--framework .gfield_error input,
.gform-theme--framework .gfield_error select,
.gform-theme--framework .gfield_error textarea {
border-color: red !important;
}
.gform-theme--framework .gfield_error .validation_message {
display: none;
}.mobile-menu {
position: fixed;
z-index: 20;
inset: 0;
width: 100%;
height: 100%;
padding: 0;
background-color: white;
font-size: 1.6rem;
color: #999;
display: none;
}
.mobile-menu a {
color: #999;
text-decoration: none;
}
.mobile-menu a:hover,
.mobile-menu ul.menu li.current-menu-item a {
color: var(--color-darkblue);
}
.mobile-menu .header {
padding: 0 var(--grid-padding);
}
.mobile-menu .header .container {
padding: 1.5rem 0;
display: flex;
justify-content: space-between;
align-items: center;
}
.mobile-menu .close {
width: 4rem;
height: 4rem;
display: flex;
justify-content: center;
align-items: center;
font-size: 2rem;
line-height: 1;
color: var(--color-darkblue);
cursor: pointer;
}
.mobile-menu .body {
padding: 0 var(--grid-padding) 5rem;
}
.mobile-menu ul.menu {
list-style-type: none;
margin: 0 0 4rem;
padding: 0;
}
.mobile-menu ul.menu li {
padding: 1.5rem 0;
border-bottom: .1rem solid #ddd;
}
.mobile-menu ul.menu a {
font-size: 2rem;
font-weight: 700;
text-decoration: none;
}/* 
Table of content
* /.other-code.no-grid-padding {
padding-left: 0;
padding-right: 0;
} .cswPlanning {
border-collapse: collapse;
font-size: 1.4rem;
line-height: 1.4;
}
.cswPlanning h2 {
max-width: var(--grid-size-md);
margin: 3rem auto 1rem;
}
.cswPlanning .btn {
margin: 0;
}
.cswPlanning tr:nth-child(odd) {
background-color: var(--color-lightergrey);
}
.cswPlanning td {
min-width: inherit !important;
padding: 2rem;
border: .1rem solid var(--color-lightgrey);
}
.cswPlanning input,
.cswPlanning select,
.cswPlanning textarea {
width: 100%;
padding: 1rem 2rem;
border: .1rem solid var(--color-lightgrey);
font-size: 1.6rem;
} iframe#voorraadFrame {
width: 100%;
margin-bottom: -2.1rem;
border: 0 !important;
}
@media (max-width: 767px) { .cswPlanning h2 {
margin: 1rem auto 1rem;
}
.cswPlanning td {
padding: 1.5rem;
}
}