/* Theme Name: Mediakanjers Theme URI: http://www.mediakanjers.nl Description: MKTheme Child Theme Author: Mediakanjers Author URI: http://www.mediakanjers.nl Template: MKTheme Version: 1.6.0 Text Domain: MKTheme-child */ @import url("style-theme.css"); @import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400;0,600;0,700;0,800;1,400;1,700&display=swap'); body { font-family: 'Open Sans', sans-serif; font-size: 16px; font-weight: 400; line-height: 1.8em; color: #6A6A6A; } body { position: relative; } body.freeze { overflow-y: hidden; } a { text-decoration: none; color: inherit; } #mk-main-area { overflow: hidden; } .mk_plugin_notification + #page_container #main-content { margin-top: -1px; } #cookie-notice .cn-button { background-color: #E03C31 !important; } /* Header */ #full-header { background-color: transparent; } #top-header { background-color: transparent; } #main-header { background-color: transparent; padding-top: 20px; transition: 500ms; -webkit-transition: 500ms; } body.home #full-header { position: absolute; left: 0 ; top: 0; width: 100%; z-index: 999; } body:not(.home) #full-header { position: absolute; left: 0; top: 0; z-index: 999; width: 100%; background-color: #fff; } body.logged-in.admin-bar #full-header { top: 32px; } body.logged-in.admin-bar.paginascroll #full-header { top: 0 !important; } body #full-header { position: fixed !important; width: 100%; top: 0; background-color: rgb(255, 255, 255, 0); transition: 500ms; -webkit-transition: 500ms; } body.home { padding-top: 0 !important; } body.home .mk_logo { visibility: visible; transition: 500ms; -webkit-transition: 500ms; opacity: 1; } body.home .mk_logo2 { visibility: visible; transition: 500ms; -webkit-transition: 500ms; opacity: 0; } body:not(.home) #full-header { background-color: rgb(255, 255, 255, 1); } /* mk_plugin_notification */ .mk_plugin_notification { position: absolute; top: 0px; transition: 500ms; -webkit-transition: 500ms; z-index: 99999999 !important; } .mk_plugin_notification.top .close { bottom: 50%; transform: translateY(50%); -webkit-transform: translateY(50%); border-radius: 0; } .mk_plugin_notification .mk_rij { padding-right: 60px; max-width: 1640px; width: 90%; } .mk_plugin_notification .content a {text-decoration: underline; } .mk_plugin_notification .content a:hover { color: #E03C31; } /* paginascroll */ body.paginascroll #full-header { background-color: rgb(255, 255, 255, 1); } body.paginascroll #full-header .mk_logo { visibility: visible; opacity: 0; } body.paginascroll #full-header .mk_logo2 { visibility: visible; opacity: 1; } body.paginascroll #main-header { padding-top: 0px; } /* body.paginascroll #full-header { margin-top: 0 !important; } body.paginascroll .mk_plugin_notification { transform: translateY(-100%); -webkit-transform: translateY(-100%); } body.paginascroll #mk-main-area { padding-top: 0 !important; } */ body.home.paginascroll .ubermenu.ubermenu-main .ubermenu-item-level-0 > .ubermenu-target { color: #283089; } body.home.paginascroll #full-header li:not(:last-child) a { position: relative; float: left; color: #283089; } body.note_active #shiftnav-toggle-main { position: absolute !important; top: 0 !important; } body.fixedheader #shiftnav-toggle-main { position: fixed !important; margin-top: 0 !important; } /* nieuw */ body.home #mk-main-area { padding-top: 0 !important; } body { padding-top: 0 !important; } .mk_plugin_notification + #page_container #full-header { position: absolute !important; top: 0 !important; } body.fixedheader .mk_plugin_notification + #page_container #full-header { position: fixed !important; } #page_container:first-child { padding-top: 0 !important; } body.paginaloaded #mk-main-area { transition: 500ms; -webkit-transition: 500ms; } body.paginaloaded #page_container { transition: 500ms; -webkit-transition: 500ms; } .mk_plugin_notification.top.hide + #page_container { padding-top: 0 !important; } body.note_hide #shiftnav-toggle-main { margin-top: 0 !important; } @media only screen and (max-width: 980px) { .mk_plugin_notification.top { transition: 0ms !important; -webkit-transition: 0ms !important; } } .logo-landingpage{height: 300px;} /*Info*/ #mk-info { float: right; font-weight: 400; color: #fff; padding: 15px 0; } #mk-info .mk_email, #mk-info .mk_telefoon { display: inline-block; font-size: 15px; } #mk-info .mk_email a, #mk-info .mk_telefoon a { color: inherit; text-decoration: none;} #mk-info .mk_telefoon a::before { content: url('images/tel.svg'); display: inline-block; width: 20px; position: relative; top: 2px; margin-right: 10px; } #mk-info .mk_email a::before { content: url('images/email.svg'); display: inline-block; width: 20px; position: relative; top: 0px; margin-right: 10px; } #mk-info .mk_telefoon + .mk_email, #mk-info .mk_email + .mk_telefoon { margin-left: 20px; } /*logo*/ .mk_logo_container { margin-top: -60px; transition: 500ms; -webkit-transition: 500ms; z-index: 9999; } .mk_logo { width: 420px; display: none; transition: 500ms; -webkit-transition: 500ms; } .mk_logo2 { width: 420px; transition: 500ms; -webkit-transition: 500ms; } body.home .mk_logo { display: block; } body.home .mk_logo2 { position: absolute; top: 0; } body.paginascroll .mk_logo2, body.paginascroll .mk_logo { width: 300px; } body.paginascroll .mk_logo_container { margin-top: -30px; } /* Shiftnav */ #shiftnav-toggle-main { background:#fff !important; color: #fff !important; } #shiftnav-toggle-main-button { font-size: 25px; padding: 20px 10px !important; } #shiftnav-toggle-main-button i:before { content: "\f0c9"; font-family: "Font Awesome 5 Free"; color: #283089; font-weight: 900; } .shiftnav-main-toggle-content { padding: 0px !important; position: relative !important; display: block !important; } .shiftnav-main-toggle-content img { float: left; max-height: 50px; max-width: 80%; margin-top: 5px; width: 205px; } #shiftnav-toggle-main > button { display: none; } .shiftnav::after { display: none !important; } .shiftnav { z-index: 99999999 !important; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); } .shiftnav-name { line-height: 0 !important; } .shiftnav-inner { background-color: #fff !important; text-align: center; } .shiftnav .shiftnav-menu-title a { color: #283089 !important; } .shiftnav .shiftnav-menu-image { text-align: center; padding: 25px 80px !important; } .shiftnav .shiftnav-menu-image img { margin: 0 auto; } .shiftnav ul.shiftnav-menu > li.menu-item:first-child > .shiftnav-target {border-top: 0 !important;} .shiftnav ul.shiftnav-menu > li.menu-item > .shiftnav-target { padding: 10px 25px !important; color: #283089; background-color: #fff !important; border-top: 0 !important; border-bottom: 0 !important;} .shiftnav ul.shiftnav-menu > li.menu-item > .shiftnav-target:hover, .shiftnav ul.shiftnav-menu li.menu-item.current-menu-item > .shiftnav-target {color: #fff; background-color: #283089 !important;} .shiftnav .sub-menu li {border-bottom: 0 !important;} .shiftnav .sub-menu li a.shiftnav-target {color: #283089;} .shiftnav ul.sub-menu > li.menu-item > .shiftnav-target:hover, .shiftnav ul.sub-menu li.menu-item.current-menu-item > .shiftnav-target {color: #fff; background-color: #283089 !important;} .shiftnav ul.shiftnav-menu li.menu-item .sub-menu .shiftnav-target { padding: 10px 25px 10px 35px !important; } .shiftnav-inner #mk-info {float: left; width: 100%; display: block; text-align: center; padding: 20px 0; color: #000;} .shiftnav-inner #mk-info > div {float: left; width: 100%; display: block; margin: 0 !important; } .shiftnav-inner #mk-info .mk_telefoon a::before { content: url('images/tel.svg'); } .shiftnav-inner #mk-info .mk_email a::before { content: url('images/email.svg'); } .shiftnav-inner #mk-info .mk_telefoon + .mk_email, .shiftnav-inner #mk-info .mk_email + .mk_telefoon { margin-top: 10px !important; } .shiftnav-inner iframe {display: block;} /* animatie */ #shiftnav-main ul.shiftnav-menu li.menu-item { opacity: 0; animation-name: inherit; -webkit-animation-name: inherit; animation-timing-function: ease-in-out; animation-fill-mode: both; animation-duration: 500ms; -webkit-animation-duration: 500ms; animation-delay: 100ms; -webkit-animation-delay: 100ms; } #shiftnav-main.shiftnav-open-target ul.shiftnav-menu li.menu-item { opacity: 1; animation-name: fadeRight; -webkit-animation-name: fadeRight; } #shiftnav-main .shiftnav_contentaftermenu { opacity: 0; animation-name: inherit; -webkit-animation-name: inherit; animation-timing-function: ease-in-out; animation-fill-mode: both; animation-duration: 500ms; -webkit-animation-duration: 500ms; animation-delay: 100ms; -webkit-animation-delay: 100ms; } #shiftnav-main.shiftnav-open-target .shiftnav_contentaftermenu { opacity: 1; animation-name: fadeRight; -webkit-animation-name: fadeRight; } @-webkit-keyframes fadeRight{0%{opacity:0;-webkit-transform:translateX(10%)}100%{opacity:1;-webkit-transform:translateX(0)}} @-moz-keyframes fadeRight{0%{opacity:0;-moz-transform:translateX(10%)}100%{opacity:1;-moz-transform:translateX(0)}} @-o-keyframes fadeRight{0%{opacity:0;-o-transform:translateX(10%)}100%{opacity:1;-o-transform:translateX(0)}} @keyframes fadeRight{0%{opacity:0;transform:translateX(10%)}100%{opacity:1;transform:translateX(0)}} /* hamburger */ .hamburger { outline: none;padding: 15px 15px; display: block; cursor: pointer; transition-property: opacity, filter; transition-duration: 0.15s; transition-timing-function: linear; font: inherit; color: inherit; text-transform: none; background-color: transparent; border: 0; margin: 0; overflow: visible; } /* .hamburger:hover {opacity: 0.7; } */ .shiftnav-open .hamburger:hover , .hamburger.is-active:hover { opacity: 0.7; } .hamburger-box { width: 40px; height: 24px; display: block; position: relative; } .hamburger-inner { display: block; top: 50%; margin-top: -2px; } .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { width: 40px; height: 4px; background-color: #fff; border-radius: 4px; position: absolute; transition-property: transform; transition-duration: 0.15s; transition-timing-function: ease; } .hamburger-inner::before, .hamburger-inner::after { content: ""; display: block; } .hamburger-inner::before { top: -10px; } .hamburger-inner::after { bottom: -10px; } /* alle pagina's */ body .hamburger-inner, body .hamburger-inner::before, body .hamburger-inner::after { background-color: #283089; } .shiftnav-open .hamburger-inner, .hamburger.is-active .hamburger-inner, .shiftnav-open .hamburger-inner::before, .hamburger.is-active .hamburger-inner::before, .shiftnav-open .hamburger-inner::after, .hamburger.is-active .hamburger-inner::after { background-color: #283089; } /* Niet de voorpagina */ body:not(.home) .hamburger-inner, body:not(.home) .hamburger-inner::before, body:not(.home) .hamburger-inner::after { background-color: #283089; } /* alle pagina's + scrollen + open! */ body.paginascroll .shiftnav-open .hamburger-inner, body.paginascroll .shiftnav-open .hamburger-inner::before, body.paginascroll .shiftnav-open .hamburger-inner::after { background-color: #283089; } body.paginascroll .hamburger-inner, body.paginascroll .hamburger-inner::before, body.paginascroll .hamburger-inner::after { background-color: #283089; } /* Collapse */ .hamburger--collapse .hamburger-inner { top: auto; bottom: 0; transition-duration: 0.13s; transition-delay: 0.13s; transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } .hamburger--collapse .hamburger-inner::after { top: -20px; transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear; } .hamburger--collapse .hamburger-inner::before { transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); } .shiftnav-open .hamburger--collapse .hamburger-inner, .hamburger--collapse.is-active .hamburger-inner { transform: translate3d(0, -10px, 0) rotate(-45deg); transition-delay: 0.22s; transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } .shiftnav-open .hamburger--collapse .hamburger-inner::after, .hamburger--collapse.is-active .hamburger-inner::after { top: 0; opacity: 0; transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear; } .shiftnav-open .hamburger--collapse .hamburger-inner::before, .hamburger--collapse.is-active .hamburger-inner::before { top: 0; transform: rotate(-90deg); transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1); } /* .shiftnavclosebutton */ .shiftnavclosebutton { display: none; } @media only screen and (max-width: 980px) { .ubermenu-responsive-toggle, .ubermenu.ubermenu-main { display: none !important; } #shiftnav-toggle-main-button { display: block; float: right; } } @media only screen and (max-width: 640px) { #shiftnav-main { width: 100% !important; max-width: 100% !important; -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%); } .shiftnav-open #shiftnav-main.shiftnav-open-target { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } #shiftnav_content { display: none; } body.shiftnav-open { overflow-y: hidden !important; } /* shiftnavclosebutton */ .shiftnavclosebutton { display: block; position: absolute; top: 5px; left: 5px; z-index: 99; transform: scale(0.8); -webkit-transform: scale(0.8); } .shiftnavclosebutton #shiftnav-toggle-main-button { display: block; padding: 10px !important; line-height: 0px; } /* shiftnav-nav */ .shiftnav-nav { text-align: center; } } /* Slider */ .frontpageslider { background: transparent; height: 620px; } .frontpageslider .swiper-wrapper .swiper-slide { background-size: cover; background-position: center; } .frontpageslider h1 { font-size: 70px; font-weight: bold; color: #000; line-height: 1em; } .frontpageslider h1:after { display: none; } .frontpageslider .subtitel { color: #000; float: left; font-size: 30px; font-weight: 300; margin-top: 10px; width: 100%; line-height: 1em; } .frontpageslider .centeren { display: block; width: 70%; margin: 0 auto; text-align: center; } .frontpageslider .centeren .et_pb_column { width: 100%; } .frontpageslider .centeren .subtitel { float: none; display: inline-block; } .frontpageslider .slide-content { margin: 0 auto; max-width: 1200px; width: 80%; height: 100%; } .frontpageslider .slide-module { width: 100%; position: relative; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); } .frontpageslider .swiper-slide h1 { animation-name: inherit; animation-duration: 0.7s; animation-timing-function: ease-in-out; animation-fill-mode: both; animation-delay: 0.2s; opacity: 0 } .frontpageslider .swiper-slide .subtitel { animation-name: inherit; animation-duration: 0.7s; animation-timing-function: ease-in-out; animation-fill-mode: both; animation-delay: 0.6s; opacity: 0 } .frontpageslider .swiper-slide-active h1 { animation-name: fadeTop; opacity: 1; } .frontpageslider .swiper-slide-active .subtitel {animation-name: fadeLeft; opacity: 1; } .frontslideroverlay { display: none; background-image: initial; height: 136px; margin-top: -136px; position: relative; z-index: 9; background-position: center bottom; } /* voorpagina_blokken */ .voorpagina_blokken { float: left; width: calc(100% + 30px); margin: -15px; margin-top: -104px; padding-bottom: 5px;} .voorpagina_blokken .item { overflow: hidden; position: relative; float: left; width: calc(25% - 30px); margin: 15px; background-color: #fff; border-radius: 10px; padding: 30px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); transition: 300ms; -webkit-transition: 300ms; } .voorpagina_blokken .item .titel { line-height: 1em; float: left; width: 100%; color: #283089; font-size: 32px; font-weight: 800; padding-bottom: 30px; transition: 300ms; -webkit-transition: 300ms; } .voorpagina_blokken .item .subtitel { color: #C1C1C1; float: left; width: 100%; font-size: 17px;} .voorpagina_blokken .item .readmore { position: relative; display: inline-block; font-size: 12px; font-weight: 800; color: #E03C31; text-transform: uppercase; } .voorpagina_blokken .item .readmore:after { content: ""; margin: 0 0; display: block; width: 100%; height: 3px; border-radius: 100px; background-color: #E03C31; } .voorpagina_blokken .item .tekst { padding-bottom: 20px; float: left; width: 100%; margin: 0px 0 20px; } .voorpagina_blokken .item .tekst::before { content: ""; margin: 20px 0 20px; display: block; width: 40px; height: 3px; border-radius: 100px; background-color: #E03C31; } .voorpagina_blokken .item .inner { position: relative; float: left; } .voorpagina_blokken .item:hover { color: #fff; } .voorpagina_blokken .item:hover .titel { color: #fff; } .voorpagina_blokken .item::before { content: ""; display: block; position: absolute; top: 0; left: 0; width: 0; height: 100%; background-color: #283089; transition: 300ms; -webkit-transition: 300ms; } .voorpagina_blokken .item:hover::before { width: 100%; } .voorpagina_blokken .item { opacity: 0; animation-name: fadebottom; animation-duration: 0.5s; animation-timing-function: ease-in-out; animation-fill-mode: both; animation-delay: 0s; } .voorpagina_blokken .item:nth-child(1) { animation-delay: 200ms; } .voorpagina_blokken .item:nth-child(2) { animation-delay: 300ms; } .voorpagina_blokken .item:nth-child(3) { animation-delay: 400ms; } .voorpagina_blokken .item:nth-child(4) { animation-delay: 500ms; } /* sustainabilitys_overzicht */ .sustainabilitys_overzicht { float: left; width: calc(100% + 30px); margin: -15px;} .sustainabilitys_overzicht .item { overflow: hidden; position: relative; float: left; width: calc(25% - 30px); margin: 15px; border-radius: 10px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); transition: 300ms; -webkit-transition: 300ms; } .sustainabilitys_overzicht .item .info { position: relative; background-color: #fff; padding: 30px; } .sustainabilitys_overzicht .item .afbeelding { height: 180px; overflow: hidden; background-size: cover; background-position: center; } .sustainabilitys_overzicht .item .afbeelding img { visibility: hidden; } .sustainabilitys_overzicht .item .titel { line-height: 1em; float: left; width: 100%; color: #283089; font-size: 21px; font-weight: 800; transition: 300ms; -webkit-transition: 300ms; } .sustainabilitys_overzicht .item .titel:after { content: ""; margin: 20px 0 20px; display: block; width: 40px; height: 3px; border-radius: 100px; background-color: #E03C31; } .sustainabilitys_overzicht .item .subtitel { float: left; width: 100%; font-size: 17px;} .sustainabilitys_overzicht .item .subtitel:after { content: ""; margin: 15px 0; display: block; width: 40px; height: 3px; border-radius: 100px; background-color: #E03C31; } .sustainabilitys_overzicht .item .readmore { position: relative; display: inline-block; font-size: 12px; font-weight: 800; color: #E03C31; text-transform: uppercase; } .sustainabilitys_overzicht .item .readmore:after { content: ""; margin: 0 0; display: block; width: 100%; height: 3px; border-radius: 100px; background-color: #E03C31; } .sustainabilitys_overzicht .item .tekst { padding-bottom: 20px; } .sustainabilitys_overzicht .item .inner { position: relative; } .sustainabilitys_overzicht .item:hover { color: #fff; } .sustainabilitys_overzicht .item:hover .titel { color: #fff; } .sustainabilitys_overzicht .item .info::before { content: ""; display: block; position: absolute; top: 0; left: 0; width: 0; height: 100%; background-color: #283089; transition: 300ms; -webkit-transition: 300ms; } .sustainabilitys_overzicht .item:hover .info::before { width: 100%; } .mk_kolom.start .sustainabilitys_overzicht .item { opacity: 0; animation-name: fadebottom; animation-duration: 0.5s; animation-timing-function: ease-in-out; animation-fill-mode: both; animation-delay: 0s; } .sustainabilitys_overzicht .item:nth-child(1) { animation-delay: 200ms; } .sustainabilitys_overzicht .item:nth-child(2) { animation-delay: 300ms; } .sustainabilitys_overzicht .item:nth-child(3) { animation-delay: 400ms; } .sustainabilitys_overzicht .item:nth-child(4) { animation-delay: 500ms; } /* sustainability_logo */ .sustainability_logo { float: left; width: calc(100% + 30px); margin: -15px; } .sustainability_logo .item { float: left; width: calc( 33.33% - 30px ); margin: 15px; } .sustainability_logo .item .logo { margin-bottom: 10px; height: 120px; } .sustainability_logo .item .logo img { max-height: 120px; margin: 0 auto; } .sustainability_logo .item .titel { text-align: center; font-size: 16px; color: #283089; font-weight: 700; } /* overzicht_solutions */ .overzicht_solutions { float: left; width: calc(100% + 24px); margin: -12px; } .overzicht_solutions .item { float: left; width: calc(33.333% - 24px); margin: 12px; border-radius: 10px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); background-color: #fff; } .overzicht_solutions .item:nth-child(3n+4) { clear: left; } .overzicht_solutions .item .titel { padding: 30px 20px; line-height: 1em; float: left; width: 100%; color: #283089; font-size: 30px; font-weight: 800; float: left; width: 100%; } .overzicht_solutions .item .afbeelding { overflow: hidden; float: left; } .overzicht_solutions .item .readmore { padding: 30px 20px 20px; float: left; width: 100%; } .overzicht_solutions .item .readmore .knop { display: inline-block; font-size: 12px; font-weight: 800; color: #E03C31; text-transform: uppercase; } .overzicht_solutions .item .readmore .knop:after { content: ""; margin: 0 0; display: block; width: 100%; height: 3px; border-radius: 100px; background-color: #E03C31; } .overzicht_solutions .item .afbeelding img { transform: scale(1); -webkit-transform: scale(1); transition: 500ms; -webkit-transition: 500ms; } .overzicht_solutions .item:hover .afbeelding img { transform: scale(1.1); -webkit-transform: scale(1.1); } .mk_kolom.start .overzicht_solutions .item { opacity: 0; animation-name: fadebottom; animation-duration: 0.5s; animation-timing-function: ease-in-out; animation-fill-mode: both; animation-delay: 0s; } /* overzicht_solutions */ .overzicht_posts { float: left; width: calc(100% + 24px); margin: -12px; } .overzicht_posts .item { position: relative; float: left; width: calc(100% - 24px); margin: 12px; overflow: hidden; border-radius: 10px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); background-color: #fff; } .overzicht_posts .item .details { padding-bottom: 10px; } .overzicht_posts .item .afbeelding { width: 47.25%; float: right; background-position: center; background-size: cover; } .overzicht_posts .item .afbeelding img { visibility: hidden; } .overzicht_posts .item .info { width: 47.25%; float: left; padding: 30px 0 30px 40px; } .overzicht_posts .item .titel { max-width: 600px; line-height: 1em; float: left; width: 100%; color: #283089; font-size: 21px; font-weight: 800; float: left; width: 100%; } .overzicht_posts .item .titel:after { content: ""; margin: 15px 0; display: block; width: 40px; height: 3px; border-radius: 100px; background-color: #E03C31; } .overzicht_posts .item .content { overflow: hidden; padding-bottom: 20px; float: left; width: 100%; } .overzicht_posts .item .bottom { position: absolute; bottom: 30px; left: 40px; } .overzicht_posts .item .readmore .knop { display: inline-block; font-size: 12px; font-weight: 800; color: #E03C31; text-transform: uppercase; } .overzicht_posts .item .readmore .knop:after { content: ""; margin: 0 0; display: block; width: 100%; height: 3px; border-radius: 100px; background-color: #E03C31; } .overzicht_posts .item .popup_vacancy { float: left; background-color: #E03C31; color: #fff; cursor: pointer; padding: 8px 16px; margin-top: 15px; } .overzicht_posts .item .popup_vacancy:hover { background-color: #283089; } .overzicht_posts.careers .details { padding: 0px; } /* press_fotos */ .press_fotos ul { float: left; width: calc(100% + 30px); margin: -15px; padding: 0; } .press_fotos li { list-style: none; float: left; width: calc(25% - 30px); margin: 15px; } .press_fotos li:nth-child(4n+5) { clear: left; } .press_fotos .downloadimg { font-weight: 700; text-align: center; display: block; color: #283089; padding: 10px; } .press_fotos .downloadimg:after { content: url('images/download.svg'); display: inline-block; margin-left: 10px; position: relative; top: 2px; } /* pagination */ .pagination { text-align: center; float: left; width: 100%; } .pagination ul { padding: 0; list-style: none; display: inline-block; margin-top: 50px; } .pagination ul li { float: left; margin: 0 3px; margin-top: 15px; font-weight: 800; color: #283089; } .pagination ul li a { padding: 8px 15px; background-color: transparent; transition: 200ms; -webkit-transition: 200ms; float: left; border: 2px solid #707070; } .pagination ul li a:hover { background-color: #283089; color: #fff; border: 2px solid #283089; } .pagination ul li span:not(.dots) { padding: 8px 15px; background-color: #283089; color: #fff; float: left; border: 2px solid #283089; } .pagination ul li span.dots { padding: 8px 10px; float: left; } .pagination ul li a.next { padding: 10px 0;background: transparent; border: transparent; } .pagination ul li a.next::before { content: url('images/arrowright2.svg'); width: 34px; margin-left: 2px; display: inline-block; position: relative; top:2px; } .pagination ul li a.prev { padding: 10px 0;background: transparent; border: transparent; } .pagination ul li a.prev::before { content: url('images/arrowright2.svg'); width: 34px; margin-right: 2px; display: inline-block; position: relative; top:2px; transform: rotateY(180deg); -webkit-transform: rotateY(180deg);} /* Content */ /* socials */ .mk_footer1 .socials { text-align: left; display: flex; width: 100%; margin-top: 50px; } .mk_footer1 .socials a { transition: 200ms; -webkit-transition: 200ms; text-align: center; float: none; margin-right: 6px; line-height: 35px !important; margin-bottom: 6px; width: 35px; height: 35px; font-size: 21px !important; border-radius: 100px; color: #fff !important; background-color: #283089; display: inline-block; } .mk_footer1 .socials i { display: inline-block !important; position: relative; } .mk_footer1 .socials a:last-child { margin-right: 0; } .mk_footer1 .socials a:hover { color: #fff !important; background-color: #E03C31; } .mk_footer1 .socials a.yt { font-size: 18px !important; } /* social icon style */ .socials i.fas.fa-play { display: flex!important; flex-direction: column; justify-content: center; align-items: center; height: 100%; font-size: 16px; padding-left: 3px;} .socials i.fab.fa-linkedin-in { display: flex!important; flex-direction: column; justify-content: center; align-items: center; height: 100%; font-size: 18px; } .socials i.fab.fa-instagram { display: flex!important; flex-direction: column; justify-content: center; align-items: center; height: 100%; font-size: 20px; padding-bottom: 2px; } .socials i.fab.fa-facebook-f { display: flex!important; flex-direction: column; justify-content: center; align-items: center; height: 100%; font-size: 18px; padding-bottom: 2px;} /* socials */ .mk_mobile_menu .socials { text-align: center; display: inline-block; width: 100%; margin-top: 20px; } .mk_mobile_menu .socials a { transition: 200ms; -webkit-transition: 200ms; text-align: center; float: none; margin-right: 6px; line-height: 35px !important; margin-bottom: 6px; width: 35px; height: 35px; font-size: 21px !important; border-radius: 100px; color: #fff !important; background-color: #283089; display: inline-block; } .mk_mobile_menu .socials i { display: inline-block !important; position: relative; } .mk_mobile_menu .socials a:last-child { margin-right: 0; } .mk_mobile_menu .socials a:hover { color: #fff !important; background-color: #E03C31; } /* mission */ .mission { width: 100%; height: 750px; position: relative; margin-top: 100px; } .mission .items .item { width: 30%; position: absolute; } .mission .items .item:nth-child(n) { opacity: 0; left: 50%; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transition: 1000ms; -webkit-transition: 1000ms; transition-delay: 100ms; } .mission .items .item .titel { line-height: 1em; float: left; width: 100%; color: #283089; font-size: 21px; font-weight: 800; transition: 300ms; -webkit-transition: 300ms; } .mission .items .item .titel:after { content: ""; margin: 20px 0 20px; display: block; width: 40px; height: 3px; border-radius: 100px; background-color: #E03C31; } .mission .items .item .icon { width: 130px; height: 130px; position: absolute; left: 60px; top: -60px; z-index: -1; } .mission .background { z-index: -2; max-width: 30%; position: absolute;top: 30px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); } .mission .background video { position: absolute; top: -8px; left: 49.9%; z-index: -1; width: 105%; height: auto; transform: translateX(-50%); -webkit-transform: translateX(-50%); } .mission .items .item:nth-child(n) .titel { opacity: 0; transition: 500ms; -webkit-transition: 500ms; transition-delay: 3300ms; transform: translateY(30px); -webkit-transform: translateY(30px); } .mission .items .item:nth-child(n) .tekst { opacity: 0; transition: 500ms; -webkit-transition: 500ms; transition-delay: 3600ms; transform: translateX(-30px); -webkit-transform: translateX(-30px); } .mission .items .item:nth-child(n) .icon { border-radius: 500px; background-color: #E03C31; padding: 20px; transition: 500ms; -webkit-transition: 500ms; transition-delay: 3000ms; transform: translateY(100px); -webkit-transform: translateY(100px); } .mission .items .item:nth-child(n) .icon img { display: none; } .mission .items .item:nth-child(n) .icon svg { width: 100%; line-height: 0; position: relative; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); } .mission .items .item:nth-child(n) .icon svg g { opacity: 1; } .mission .items .item:nth-child(n) .icon svg path { transition: 500ms; -webkit-transition: 500ms; } .mission .items .item:nth-child(1) .icon svg path, .mission .items .item:nth-child(2) .icon svg path, .mission .items .item:nth-child(5) .icon svg path { fill:#fff; } .mission .items .item:nth-child(3) .icon svg path, .mission .items .item:nth-child(4) .icon svg path { stroke: #fff;} .mission .items .item:nth-child(2) .icon svg { width: 90%; margin: 0 auto; display: block;} .mission .items .item:nth-child(4) .icon svg { width: 90%; margin: 0 auto; display: block;} .mission .items .item:nth-child(1) { transition-delay: 100ms; } .mission .items .item:nth-child(2) { transition-delay: 600ms; } .mission .items .item:nth-child(3) { transition-delay: 1100ms; } .mission .items .item:nth-child(4) { transition-delay: 1600ms; } .mission .items .item:nth-child(5) { transition-delay: 2100ms; } .mission .items .item:nth-child(1) .icon { transition-delay: 1100ms; } .mission .items .item:nth-child(1) .titel { transition-delay: 1400ms; } .mission .items .item:nth-child(1) .tekst { transition-delay: 1700ms; } .mission .items .item:nth-child(1) .icon svg path { transition-delay: 1100ms; } .mission .items .item:nth-child(2) .icon { transition-delay: 1700ms; } .mission .items .item:nth-child(2) .titel { transition-delay: 2000ms; } .mission .items .item:nth-child(2) .tekst { transition-delay: 2300ms; } .mission .items .item:nth-child(2) .icon svg path { transition-delay: 1700ms; } .mission .items .item:nth-child(3) .icon { transition-delay: 2100ms; } .mission .items .item:nth-child(3) .titel { transition-delay: 2400ms; } .mission .items .item:nth-child(3) .tekst { transition-delay: 2700ms; } .mission .items .item:nth-child(3) .icon svg path { transition-delay: 2100ms; } .mission .items .item:nth-child(4) .icon { transition-delay: 2700ms; } .mission .items .item:nth-child(4) .titel { transition-delay: 3000ms; } .mission .items .item:nth-child(4) .tekst { transition-delay: 3300ms; } .mission .items .item:nth-child(4) .icon svg path { transition-delay: 2700ms; } .mission .items .item:nth-child(5) .icon { transition-delay: 3100ms; } .mission .items .item:nth-child(5) .titel { transition-delay: 3400ms; } .mission .items .item:nth-child(5) .tekst { transition-delay: 3700ms; } .mission .items .item:nth-child(5) .icon svg path { transition-delay: 3100ms; } /* start aniamtion */ .mk_kolom.start .mission.set .items .item:nth-child(n) { opacity: 1; } .mk_kolom.start .mission.set .items .item:nth-child(1) { left: 0; top: 0; transform: translate(0%, 0%); -webkit-transform: translate(0%, 0%); } .mk_kolom.start .mission.set .items .item:nth-child(2) { left: 100%; top: 0; transform: translate(-100%, 0%); -webkit-transform: translate(-100%, 0%); } .mk_kolom.start .mission.set .items .item:nth-child(3) { left: 0; top: calc(100% - 50px); transform: translate(0%, -100%); -webkit-transform: translate(0%, -100%); } .mk_kolom.start .mission.set .items .item:nth-child(4) { left: 50%; top: calc(100% - 0px); transform: translate(-50%, -100%); -webkit-transform: translate(-50%, -100%); } .mk_kolom.start .mission.set .items .item:nth-child(5) { top: calc(100% - 50px); left: 100%; transform: translate(-100%, -100%); -webkit-transform: translate(-100%, -100%); } .mk_kolom.start .mission.set .items .item:nth-child(n) .titel { opacity: 1; transform: translateY(0px); -webkit-transform: translateY(0px); } .mk_kolom.start .mission.set .items .item:nth-child(n) .tekst { opacity: 1; transform: translateX(0px); -webkit-transform: translateX(0px); } .mk_kolom.start .mission.set .items .item:nth-child(n) .icon { background-color: #fff; padding: 0px; transform: translateY(0px); -webkit-transform: translateY(0px); } .mk_kolom.start .mission.set .items .item:nth-child(1) .icon svg path, .mk_kolom.start .mission.set .items .item:nth-child(2) .icon svg path, .mk_kolom.start .mission.set .items .item:nth-child(5) .icon svg path { fill:#E5E5E5;} .mk_kolom.start .mission.set .items .item:nth-child(3) .icon svg path, .mk_kolom.start .mission.set .items .item:nth-child(4) .icon svg path { stroke: #E5E5E5; } .mission .background img { opacity: 0; transition: 500ms; -webkit-transition: 500ms; transition-delay: 1900ms; } .mission .background video { opacity: 1; transition: 500ms; -webkit-transition: 500ms; transition-delay: 1600ms; } /* .mk_kolom.start .mission .background img { opacity: 1; } .mk_kolom.start .mission .background video { opacity: 0; } */ /* activehover */ /* .mission .item.activehover:hover { } */ .mission .item.activehover:nth-child(n):hover .icon { background-color: #E03C31 !important; padding: 20px !important; transform: translateY(-70px) scale(0.8) !important; -webkit-transform: translateY(-70px) scale(0.8) !important; } .mission .item.activehover:nth-child(1):hover .icon svg path, .mission .item.activehover:nth-child(2):hover .icon svg path, .mission .item.activehover:nth-child(5):hover .icon svg path { fill:#fff !important; } .mission .item.activehover:nth-child(3):hover .icon svg path, .mission .item.activehover:nth-child(4):hover .icon svg path { stroke: #fff !important;} @media only screen and (max-width: 980px) { .mission .background { display: none; } .mission .items { float: left; width: 100%; margin-top: -100px; } .mission .items .item:nth-child(n) { margin-top: 100px; position: relative !important; left: 0 !important; top: 0 !important; width: 100% !important; transform: translate(0%, 100px); -webkit-transform: translate(0%, 100px); } .mk_kolom.start .mission.set .items .item:nth-child(n) { transform: translate(0%, 0%); -webkit-transform: translate(0%, 0%); } .mission .items .item .icon { left: calc(100% - 130px); } .mission .item.activehover:nth-child(n):hover .icon { background-color: #E03C31 !important; padding: 20px !important; transform: translateY(0px) scale(0.8) !important; -webkit-transform: translateY(0px) scale(0.8) !important; } } @media only screen and (max-width: 640px) { .mission .items .item .icon { left: calc(100% - 100px); width: 100px; height: 100px; top: -40px; } } /* aboutus */ .about_us .item { display: none; } .about_us .item.active { display: block; } #aboutus { display: none; } #aboutus.active { display: block; } .mk_sectie.aboutusbuttons img { width: auto; } /* Vervolgpagina */ /* contactinfo_overzicht */ .contactinfo_overzicht { float: left; width: calc(100% + 20px); margin: -10px; } .contactinfo_overzicht .item { position: relative; font-size: 17px; float: left; width: calc(25% - 20px); margin: 10px; border-radius: 10px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); background-color: #fff; color: #6A6A6A; padding: 33px 20px 65px 20px; } .contactinfo_overzicht .item .titel { padding-bottom: 5px; max-width: 600px; line-height: 1em; float: left; width: 100%; color: #283089; font-size: 21px; font-weight: 800; float: left; width: 100%; } /* .contactinfo_overzicht .item:nth-child(4n+5) { clear: left; } */ .contactinfo_overzicht .item .land { margin-bottom: 25px; color: #283089; font-size: 21px; } .contactinfo_overzicht .item .afbeelding { margin-bottom: 35px; height: 100px; margin-top: 25px; } .contactinfo_overzicht .item .afbeelding img { max-height: 100px; max-width: 95%; position: relative; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); } .contactinfo_overzicht .item .content { padding-bottom: 1.8em; } .contactinfo_overzicht .item .p { padding-bottom: 1.8em; } .contactinfo_overzicht .mk_button { line-height: 1em; z-index: 9; cursor: pointer; background-color: #E03C31; padding: 12px 20px; border: 0; color: #fff; position: absolute; left: 20px; bottom: 20px; } .contactinfo_overzicht .mk_button::before { display: none; } .contactinfo_overzicht .mk_button::after { display: none; } .contactinfo_overzicht .item.hide { display: none; } .contactinfo_overzicht .item .downarrow { opacity: 0; transition: 500ms; -webkit-transition: 500ms; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%) translateY(100%); } .contactinfo_overzicht .item.active .downarrow { opacity: 1; } .contactinfo_overzicht .item::before { content: url('images/land/romania.svg'); width: 27px; height: 27px; display: block; position: absolute; top: 5px; right:5px; } .contactinfo_overzicht .item.europe::before { content: url('images/land/europe.svg'); } .contactinfo_overzicht .item.netherlands::before { content: url('images/land/netherlands.svg'); } .contactinfo_overzicht .item.germany::before { content: url('images/land/germany.svg'); } .contactinfo_overzicht .item.poland::before { content: url('images/land/poland.svg'); } .contactinfo_overzicht .item.romania::before { content: url('images/land/romania.svg'); } .contactinfo_overzicht .item.ukraine::before { content: url('images/land/ukraine.svg'); } .mk_kolom.start .contactinfo_overzicht:not(.contact_forwarding) .item { opacity: 0; animation-name: fadebottom; animation-duration: 0.5s; animation-timing-function: ease-in-out; animation-fill-mode: both; animation-delay: 0s; } .contactinfo { float: left; width: 50%; border-radius: 10px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); background-color: #fff; padding: 30px; } .contactinfo .contactinfo_overzicht .item:nth-child(n) { clear: none; width: calc(50% - 20px); } .contactinfo .contactinfo_overzicht .item:nth-child(2n+3) { clear: left; } .contactinfo_overzicht_foto { float: right; width: 48%; background-size: cover; background-position: center; } .contactinfo .contactinfo_overzicht { margin: 0; width: 100%; } .contactinfo .titel { padding-bottom: 20px; max-width: 600px; line-height: 1em; float: left; width: 100%; color: #283089; font-size: 21px; font-weight: 800; float: left; width: 100%; } .contactinfo .logo { padding-bottom: 20px; width: 300px; max-width: 100%; } .contactinfo .item { width: 100% !important; height: auto !important; margin: 0 !important; padding: 0 !important; box-shadow: none; } .contactinfo .item:not(:last-child) { padding-bottom: 20px !important; } .contactinfo .item::before { display: none; } .contactinfo .item > * { float: left; position: relative; top: 0; left: 0; padding-bottom: 10px !important; } .contactinfo .item .content { width: 200px; height: auto !important; } .contactinfo .item .p { width: calc( 100% - 200px - 170px ); } .contactinfo .item .mk_button { width: 170px !important; line-height: 1em; padding: 14px 20px; } .contactinfo .item .subtitel { font-weight: 800; width: 100%; } @media only screen and (max-width: 1600px) { .contactinfo .item .content { width: 180px; } .contactinfo .item .p { width: calc( 100% - 180px - 170px ); } } @media only screen and (max-width: 1500px) and (min-width: 980px) { .contactinfo .item .content { width: 200px; } .contactinfo .item .p { width: calc( 100% - 200px ); } } @media only screen and (max-width: 768px) { .contactinfo .item .content { width: 200px; } .contactinfo .item .p { width: calc( 100% - 200px ); } } @media only screen and (max-width: 560px) { .contactinfo .item .content { width: 100%; } .contactinfo .item .p { width: 100%; } } /* contactinfo_overzicht_titel */ .contactinfo_overzicht_titel { margin: 30px 0; float: left; width: 100%; } .contactinfo_overzicht_titel:first-child { margin-top: 0; } .contactinfo_overzicht_titel .mk_titel_inner { display: inline-block; position: relative; } .contactinfo_overzicht_titel .mk_titel_inner::before { content: ""; width: 100vw; height: 2px; top: calc(50% - 1px); background-color: #283089; position: absolute; display: block; right: calc(100% + 10px);} .contactinfo_overzicht_titel .mk_titel_inner::after { content: ""; width: 100vw; height: 2px; top: calc(50% - 1px); background-color: #283089; position: absolute; display: block; left: calc(100% + 10px);} /* contactkeuze */ .contactkeuze { float: left; width: calc(100% + 40px); margin-left: -20px; margin-top: 5px; } .contactkeuze ul { float: left; width: 100%; padding: 0; } .contactkeuze ul li { color: #283089; cursor: pointer; position: relative; float: left; width: 100%; list-style: none; padding: 4px 20px; font-size: 16px; font-weight: 700; transition: 300ms; -webkit-transition: 300ms; } .contactkeuze ul li div:nth-child(1) { float: left; } .contactkeuze ul li div:nth-child(2) { position: relative; float: right; color: #E03C31; font-size: 12px; font-weight: 900; letter-spacing: 1px; } .contactkeuze ul li div:nth-child(2):after { opacity: 1; content: url(images/rightarrow2.svg); opacity: 1; top: 4px; line-height: 0; display: inline-block; width: 24px; margin-left: 10px; position: relative; transition: 300ms; -webkit-transition: 300ms; } .contactkeuze ul li div:nth-child(2):before { opacity: 0; position: absolute; content: url(images/rightarrow2-wit.svg); opacity: 1; top: 5px; right: 0; line-height: 0; display: inline-block; width: 24px; transition: 300ms; -webkit-transition: 300ms; } .contactkeuze ul li:hover { background-color: #283089; color: #fff; } .contactkeuze ul li:hover div:nth-child(2):after { opacity: 0; transform: rotateZ(90deg); -webkit-transform: rotateZ(90deg); } .contactkeuze ul li:hover div:nth-child(2):before { opacity: 1; transform: rotateZ(90deg); -webkit-transform: rotateZ(90deg); } .contactkeuze ul li.active { background-color: #283089; color: #fff; } .contactkeuze ul li.active div:nth-child(2):after { opacity: 0; transform: rotateZ(90deg); -webkit-transform: rotateZ(90deg); } .contactkeuze ul li.active div:nth-child(2):before { opacity: 1; transform: rotateZ(90deg); -webkit-transform: rotateZ(90deg); } .contactkeuze li[item=europe] { display: none; } .contactkeuze li[item=poland] { display: none; } /* contactforwarding */ #contactforwarding { padding: 0; height: 0; overflow: hidden; transition: 1000ms; -webkit-transition: 1000ms; } #contactforwarding .mk_rij { padding: 75px 0; } .mk_sectie.contactpijl .mk_rij::before { content: ""; transform: translateX(50%); -webkit-transform: translateX(50%); transition: 300ms; -webkit-transition:300ms; width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 0px solid #283089; position: absolute; bottom: -50px; right: 12%; } .mk_sectie.contactpijl.active .mk_rij::before { border-bottom: 30px solid #283089; } /* contactfilter */ .contactfilter { position: absolute; right: 0;top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); } .contactfilter select { font-size: 20px; min-width: 200px; border-radius: 5px; outline: none; cursor: pointer; border: 0; padding: 15px 40px 15px 15px; color: #fff; background-color: #283089; } .contactfilter select option {font-size: 16px; } #ourteam { padding: 0; height: 0; overflow: hidden; transition: 1000ms; -webkit-transition: 1000ms; } #ourteam .mk_rij { padding: 75px 0; } /* medewerkers_overzicht */ .medewerkers_overzicht { float: left; width: calc(100% + 20px); margin: -10px; } .medewerkers_overzicht .item { float: left; width: calc(25% - 20px); margin: 10px; } .medewerkers_overzicht .item:nth-child(4n+5) { clear: left; } .medewerkers_overzicht .item { background-color: #fff; text-align: center; border-radius: 10px; padding: 20px; color: #6A6A6A; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);} .medewerkers_overzicht .item .titel { color: #283089; font-size: 21px; font-family: 'Open Sans', sans-serif; font-weight: 700; padding-top: 20px; } .medewerkers_overzicht .item .photo img { margin: 0 auto; } .medewerkers_overzicht .item .function:after { content: ""; display: block; width: 40px; height: 2px; background-color: #E03C31; margin: 10px auto; } .medewerkers_overzicht .item .email { text-align: left; } .medewerkers_overzicht .item .email::before { content: url('images/email2.svg'); width: 20px; display: inline-block; margin-right: 20px; } .medewerkers_overzicht .item .phone { text-align: left; } .medewerkers_overzicht .item .phone::before { content: url('images/tel2.svg'); width: 20px; display: inline-block; margin-right: 20px; } .medewerkers_overzicht .medewerkers { float: left; width: 100%; } .medewerkers_overzicht .medewerkers:not(.active) { display: none; } /* Formulieren */ /* Grafity Forms opmaak V1 */ .gform_wrapper { margin: 0 !important; width: calc(100% + 16px) !important; } .gform_wrapper .gform_heading { margin: 0; display: none;} .gform_wrapper:not(.gravity-theme) .gform_fields { padding: 0; width: calc(100% + 16px); } .gform_wrapper.gravity-theme .gform_fields { padding: 0; display: block !important; } .gform_wrapper:not(.gravity-theme) .gform_fields .gfield { margin-top:0; margin-bottom: 16px; float: left; clear: none; width: 50%; padding-right: 16px; list-style: none; } .gform_wrapper.gravity-theme .gform_fields .gfield { margin-top:0; margin-bottom: 10px; float: left; clear: none; width: 100%; padding-right: 16px; padding-bottom: 0; list-style: none; display: block; } .gform_wrapper.gravity-theme .gfmc-container { float: left; width: 100% !important; display: block; } .gform_wrapper.gravity-theme .gfmc-container:not(:last-child) { padding-bottom: 60px; } .gform_wrapper.gravity-theme .gfield.gfmc-field { width: calc(50% + 16px) !important; margin-right: -16px; max-width: 100% !important; } .gform_wrapper .gform_fields .gfield { margin-top:0; margin-bottom: 16px; float: left; clear: none; width: 50%; padding-right: 16px; list-style: none; } .gform_wrapper .gform_fields .gfield.gf_half { width: 50%; } .gform_wrapper .gform_fields .gfield.gf_full { width: 100%; clear: both; } .gform_wrapper .gform_fields .gfield.gf_third { width: 33.33%; } .gf_clear { clear: left !important; } .gform_wrapper .gform_fields .gfield.gf_hide { visibility: hidden; opacity: 0; height: 0; padding: 0; margin: 0; } .gform_wrapper.gravity-theme .gfield_label { margin-bottom: 2px; font-size: 16px !important; font-weight: 400 !important; } .gform_wrapper.gravity-theme .ginput_complex label { font-size: 16px !important; } /* .gform_wrapper .gform_fields .gfield .gfield_label { display: none; } .gform_wrapper .gform_fields .gfield.gf_label .gfield_label { display: block; } */ .gform_wrapper .gform_fields .gfield .ginput_container { margin: 0; padding: 0; } .gform_wrapper .gform_fields .gfield .ginput_container_address label span { color: #E03C31 !important; font-size: 13px; font-weight: 700; } .gform_wrapper .gform_fields .gfield .ginput_container_address { position: relative; } .gform_wrapper .gform_fields .gfield .ginput_container_address:after { content: url('images/select.svg'); display: block; position: absolute; right: 15px; bottom:23px; width: auto; line-height: 0; } .gform_wrapper .gform_fields .gfield.gf_title .gfield_label { color: #283089; font-size: 30px !important; padding-bottom: 20px; font-weight: 800 !important; } .gform_wrapper .gform_fields .gfield.gf_title .gfield_required { display: none !important; } .gform_wrapper .gform_fields .gfield .ginput_container_select { position: relative; } .gform_wrapper .gform_fields .gfield .ginput_container_select::after { content: url('images/select.svg'); display: block; position: absolute; right: 15px; bottom:23px; width: auto; line-height: 0; } .gform_wrapper.gravity-theme .gsection { border-bottom: 0 !important; padding-bottom: 20px !important; color: #283089; font-size: 30px; } .gform_wrapper .gfield_required { color: #E03C31 !important; } .gform_wrapper input[type=text], .gform_wrapper select, .gform_wrapper textarea { outline: none !important; font-family: 'Open Sans', sans-serif; line-height: 1.8em !important; border: 1px solid #707070;background: #fff; padding: 12px 15px !important; border-radius: 0px; display: block; width: 100% !important; font-size: 16px !important;} .gform_wrapper input[type=text]:hover, .gform_wrapper select:hover, .gform_wrapper textarea:hover {border: 1px solid #444;} .gform_wrapper .gform_footer { padding: 0 !important; margin: 0 !important; } .gform_wrapper.gravity-theme .gform_footer { padding-right: 16px !important; padding-top: 16px !important; } .gform_wrapper .mk_button {padding: 15px 20px 15px 20px !important; cursor: pointer; border: 0; float: right; background-color: #E03C31; color: #fff; } .gform_wrapper .mk_button:hover { padding: 15px 20px 15px 20px !important; border: 0; } .gform_fileupload_multifile button { cursor: pointer; padding: 5px 10px; border: 0; border-radius: 0; background-color: #E03C31; color: #fff; } .gform_wrapper li.gfield.gfield_error.gfield_contains_required div.gfield_description{padding-left: 15px;} .gform_wrapper li.gfield.gfield_error.gfield_contains_required div.ginput_container, .gform_wrapper li.gfield.gfield_error.gfield_contains_required label.gfield_label{margin: 0 15px;} .gform_wrapper .validation_message{font-weight: 400 !important;} textarea, input, select { -webkit-appearance: none; } #ui-datepicker-div { margin-top: 0 !important; } body div#ui-datepicker-div[style] { margin-top: 5px !important; } /* Footer */ #main-footer { background-color: #fff; padding-top: 30px; position: relative; } #main-footer .mk_sectie { padding: 30px 0 !important; } #main-footer .mk_sectie .mk_kolom_1_1 { width: calc(100% + 30px); margin: -15px; } #main-footer .mk_sectie h4 { color: #E03C31; font-size: 29px; } #main-footer .mk_sectie h4:after { content: ""; display: block; margin: 20px 0; width: 37px; height: 3px; border-radius: 100px; background-color: #E03C31; } .mk_footer:nth-child(n) { width: calc(25% - 30px); margin: 15px; float: left; color: #fff; } .mk_footer:nth-child(1) { width: calc(20% - 30px); } .mk_footer:nth-child(2) { width: calc(30% - 30px); } .mk_footer:nth-child(3) { width: calc(50% - 30px); } /* #footer-bottom */ #footer-bottom { background-color: #fff; padding: 15px 0 5px 0; font-size: 15px; } #footer-bottom .container { position: relative; width: calc(80% + 20px); max-width: 1220px; margin: 0 auto; } /* footerlinks */ /* #footer-info { float: none !important; display: inline-block; padding-bottom: 10px; text-align: left; color: #fff; opacity: 0.8; margin: 0 10px; } #footer-info a { color: #fff; } */ #footer-info { float: left; width: 100%; } #footer-info a { float: left; display: block; position: relative; width: auto; color: #283089; display: block; line-height: 2em; clear: left; } #footer-info a:after { content: ""; position: absolute; bottom: 2px; left: 0; display: block; width: 0; height: 2px; border-radius: 100px; background-color: #283089; transition: 200ms; -webkit-transition: 200ms; } #footer-info a:hover:after { width: 100%; } .mk_footer1 a { font-weight: 400 !important; padding: 0 !important; font-size: 16px !important; float: left; display: block; position: relative; width: auto; color: #283089; display: block; line-height: 2em !important; clear: left; } .mk_footer1 ul.menu a:after { content: ""; position: absolute; bottom: 2px; left: 0; display: block; width: 0; height: 2px; border-radius: 100px; background-color: #283089; transition: 200ms; -webkit-transition: 200ms; } .mk_footer1 ul.menu a:hover:after { width: 100%; } .mk_footer1 .ubermenu-responsive-toggle { display: none !important; } .mk_footer1 .ubermenu-item.ubermenu-item-level-0 { width: 100%; } .mk_footer1 .ubermenu.ubermenu-main { float: left !important; margin: 0 !important; display: block !important; visibility: visible !important; max-height: inherit !important; } /* requestquotation */ #requestquotation { box-shadow: 0 0 10px rgb(0, 0, 0, 0.2); cursor: pointer; padding: 20px; z-index: 999; border-radius: 300px; width: 130px; height: 130px; position: fixed; bottom: 20px; right: 40px; background-color: #E03C31; } #requestquotation::before { content: url('images/request.svg'); width: 40px; margin: 0 auto; display: block; margin-bottom: 5px; } #requestquotation span { color: #fff; text-align: center; font-weight: 700; line-height: 1em; display: block; font-size: 15px; } #requestquotation { animation-name: inherit; animation-duration: 0.5s; animation-timing-function: ease-in-out; animation-delay: 0s; transition: 200ms; -webkit-transition: 200ms; } #requestquotation:hover { animation-name: wiggle; background-color: #283089; } body.page-id-784 #requestquotation, body.page-id-355 #requestquotation { display: none; } @-webkit-keyframes wiggle { 0%{ transform: rotateZ(0deg); } 25%{ transform: rotateZ(10deg); } 75%{ transform: rotateZ(-10deg); } 100%{ transform: rotateZ(0deg); } } @-moz-keyframes wiggle { 0%{ transform: rotateZ(0deg); } 25%{ transform: rotateZ(10deg); } 75%{ transform: rotateZ(-10deg); } 100%{ transform: rotateZ(0deg); } } @-o-keyframes wiggle { 0%{ transform: rotateZ(0deg); } 25%{ transform: rotateZ(10deg); } 75%{ transform: rotateZ(-10deg); } 100%{ transform: rotateZ(0deg); } } @keyframes wiggle { 0%{ transform: rotateZ(0deg); } 25%{ transform: rotateZ(10deg); } 75%{ transform: rotateZ(-10deg); } 100%{ transform: rotateZ(0deg); } } @media only screen and (max-width: 1400px) { #requestquotation { padding: 10px; width: 120px; height: 120px; } #requestquotation span { font-size: 14px; } } @media only screen and (max-width: 980px) { #requestquotation { padding: 10px; width: 90px; height: 90px; bottom: 10px; right: 10px; } #requestquotation span { font-size: 12px; } #requestquotation::before { width: 25px; margin-bottom: 0px; margin-top: -4px; } } /* solutions_menu */ .solutions_menu { float: left; width: 100%; } .solutions_menu .item { float: left; width: 100%; color: #283089; display: block; line-height: 2em; } .solutions_menu .item .titel { display: inline-block; position: relative; } .solutions_menu .item .titel:after { content: ""; position: absolute; bottom: 2px; left: 0; display: block; width: 0; height: 2px; border-radius: 100px; background-color: #283089; transition: 200ms; -webkit-transition: 200ms; } .solutions_menu .item:hover .titel:after { width: 100%; } /* footerbottom background-image: url('images/earth.jpg'); */ #main-footer .mk_sectie.footerbottom { overflow: hidden; background-position: top center; height: 20vw; max-height: 250px; padding: 0 !important; } /* body.home #main-footer .mk_sectie.footerbottom { height: 30vw; max-height: 400px; } #main-footer .mk_sectie.footerbottom.high { height: 30vw; max-height: 400px; } */ .footerbottom video { width: 100vw; height: auto; position: absolute; top: 0%; left: 50%; transform: translateX(-50%); -webkit-transform: translateX( -50%); } .footerbottom .video_earth { position: absolute; top: 0; left: 0; width: 100%; } .footerbottom .video_earth iframe { width: 140vw; height: 33vw; position: absolute; top: 0; left: 50%; background-color: #fff; transform: translateX(-50%); } /* footer_contact */ .footer_contact { float: left; width: calc(100% + 20px); margin: -10px; padding-bottom: 50px; } .footer_contact .info { float: left; width: calc(33.333% - 20px); margin: 10px; color: #283089; } /* mk_logo_footer */ .mk_logo_footer { margin-top: 50px; } .mk_logo_footer img { margin: 0 auto; max-width: 450px; float: right; width: 100%; } .blokdetails::before { content: ""; display: block; width: 100%; height: 50px; background-color: #E03C31; top: -50px; position: absolute; left: 0; } .blokdetails::after { line-height: 0; content: url('images/beeldmerk.svg'); display: block; position: absolute; top: -20px; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); } .blokdetails_items { float: left; width: calc(100% + 30px); margin: -15px; } .blokdetails_items .item { float: left; width: calc(20% - 30px); margin: 15px; height: 70px; text-align: center; } .blokdetails_items .item .inner { height: 70px; display: inline-block; text-align: left; } /* .blokdetails_items .item:nth-child(2) { width: calc(21% - 30px); } .blokdetails_items .item:nth-child(3) { width: calc(19% - 30px); } .blokdetails_items .item:nth-child(4) { width: calc(24% - 30px); } */ .blokdetails_items .item .icon { width: 70px; height: 70px; max-height: 70px; float: left; } .blokdetails_items .item .icon img { position: relative; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); } .blokdetails_items .item .content { float: left; color: #E03C31; position: relative; font-weight: 800; text-transform: uppercase; padding-left: 10px; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); } .blokdetails_items .item .content .aantal { font-size: 43px; line-height: 0.9em; margin-bottom: -10px; } .blokdetails_items .item .content span.soort { font-size: 20px; } .landkaart { overflow: hidden; width: 100vw; } .landkaart .kaart { width: 100%; height: 66.5vw; position: relative; z-index: 9; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); background-color: #fff; } .landkaart .kaart .europa { position: absolute; top: 31.9%; left: 54.5%; width: 119.7%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); } .landkaart .kaart .europa svg { width: 100%; } .landkaart .kaart .europa svg path { fill: #DEDEDE; } /* .landkaart .kaart .landen { } */ .landkaart .kaart .landen > div { pointer-events: none; user-select: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); } .landkaart .kaart .landen > div svg { width: 100%; } .landkaart .kaart .landen > div svg path { fill: #C2C8DB; position: relative; z-index: 9; pointer-events: auto; transition: 200ms; -webkit-transition: 200ms; } .landkaart .kaart .landen > div svg path:hover { fill: #283089; } .landkaart .kaart .landen > div.active svg path { fill: #283089; } .landkaart .kaart .landen .nederland { width: 8.15%; top: 42.95%; left: 36.75%; } .landkaart .kaart .landen .duitsland { width: 18.8%;top: 48.4%; left: 47.4%; } .landkaart .kaart .landen .polen { width: 21.3%; top: 41.7%; left: 65.4%; } .landkaart .kaart .landen .oekraine { width: 38.1%; top: 48.4%; left: 92.4%; } .landkaart .kaart .landen .roemenie { width: 22.35%; top: 67.9%; left: 81.7%; } .landkaart .kaart .landen .duitsland svg path { fill: #DEDEDE; } .landkaart .kaart .landen > .duitsland svg path:hover { fill: #DEDEDE; } .landkaart .kaart .landen > .duitsland.active svg path { fill: #DEDEDE; } .landkaart .kaart .landen > .oekraine.active svg path { fill: #DEDEDE; } /* points */ /* .pointers { } */ .pointers > div {z-index: 1; cursor: pointer; width: 25px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); } .pointers svg { display: block; transition: 500ms; -webkit-transition: 500ms; margin-top: 0px; } .pointers .titel { white-space: nowrap; overflow: hidden; transition: 500ms; -webkit-transition: 500ms; text-shadow: 0 0 5px rgba(0, 0, 0, 0.6); color: #fff; font-size: 18px; font-weight: 800; height: 0; opacity: 0; visibility: hidden; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); transform: translateX(-50%); } .pointers > div:hover { z-index: 10; } .pointers > div:hover svg { margin-top: -30px; } .pointers > div:hover .titel { height: 30px; opacity: 1; visibility: visible; } .pointers .amsterdam { top: 43%; left: 36%; margin-top: -35px; } .pointers .oekraine { top: 56%; left: 77%; margin-top: -35px; } /* .locatie_popup_outer { display: none; } */ .locatie_popup_outer { z-index: 999; pointer-events: none; visibility: hidden; opacity: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4); transition: 500ms; -webkit-transition: 500ms; } .locatie_popup_outer.active { visibility: visible; opacity: 1; pointer-events: auto; } .locatie_popup_outer .locatie_popup { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -40%); transform: translate(-50%, -40%); background-color: #fff;padding: 40px;border-radius: 10px; box-shadow: 0 0 5px rgb(0 0 0 / 20%); transition: 500ms; -webkit-transition: 500ms; } .locatie_popup { visibility: hidden; opacity: 0; max-height: 100%; overflow: auto; } .locatie_popup.active { visibility: visible; opacity: 1; transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .locatie_popup .locatie_titel { display: none; color: #283089; font-size: 21px; font-weight: 800; transition: 500ms; -webkit-transition: 500ms; } .locatie_popup .close { position: absolute; right: 10px; width: 20px; top: 10px; cursor: pointer; transform: scale(1); -webkit-transform: scale(1); transition: 500ms; -webkit-transition: 500ms; } .locatie_popup .close:hover { transform: scale(1.1); -webkit-transform: scale(1.1); } .locatie_popup.items1 { max-width: 380px; width: 100%; } .locatie_popup.items2 { max-width: 720px; width: 100%; } .locatie_popup.items3 { max-width: 1150px; width: 100%; } .locatie_popup .locatie_inner { float: left; width: calc(100% + 30px); margin: -15px; } .locatie_popup.items1 .locatie_inner .item { float: left; width: calc(100% - 30px); margin: 15px; position: relative; } .locatie_popup.items2 .locatie_inner .item { float: left; width: calc(50% - 30px); margin: 15px; position: relative; } .locatie_popup.items2 .locatie_inner .item:nth-child(2n+3) { clear: left; } .locatie_popup.items3 .locatie_inner .item { float: left; width: calc(33.333% - 30px); margin: 15px; position: relative; } .locatie_popup.items3 .locatie_inner .item:nth-child(3n+4) { clear: left; } .locatie_popup .locatie_inner .item .titel { color: #283089; font-size: 21px; font-weight: 800; text-transform: uppercase; } .locatie_popup .locatie_inner .item .land { margin-bottom: 20px; } .locatie_popup .locatie_inner .item .afbeelding { margin-bottom: 20px; height: 100px; } .locatie_popup .locatie_inner .item .afbeelding img { max-width: 90%; max-height: 100px; position: relative; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); } .locatie_popup.items2 .locatie_inner .item:nth-child(2n+1)::before { content: ""; opacity: 0.3; height: 100%; width: 1px; background-color: #707070; position: absolute; right: 0px; top: 0; } .locatie_popup.items3 .locatie_inner .item:nth-child(3n+1)::before { content: ""; opacity: 0.3; height: 100%; width: 1px; background-color: #707070; position: absolute; right: 0px; top: 0; } .locatie_popup.items3 .locatie_inner .item:nth-child(3n+2)::before { content: ""; opacity: 0.3; height: 100%; width: 1px; background-color: #707070; position: absolute; right: 0px; top: 0; } @media only screen and (max-width: 1000px) { .landkaart .kaart { min-width: 1000px; min-height: 665px; left: 0px; transform: none; -webkit-transform: none; overflow: hidden; } .landkaart { overflow-x: auto; } } @media only screen and (max-width: 950px) { .landkaart .kaart { left: -50px; } /* swipe */ /* //.landkaart { position: relative; } */ #kaart .landkaart::before { content: url('images/swipeknop.svg'); display: block; width: 60px; position: absolute; bottom: 15px; left: 15px; z-index: 99; } } @media only screen and (max-width: 850px) { .locatie_popup.items3 { max-width: 720px; border-radius: 0; } .locatie_popup.items3 .locatie_inner .item:nth-child(n) { width: calc(50% - 30px); clear: none; } .locatie_popup.items3 .locatie_inner .item:nth-child(2n+3) { clear: left; } .locatie_popup.items3 .locatie_inner .item:nth-child(2n+1)::before { content: ""; opacity: 0.3; height: 100%; width: 1px; background-color: #707070; position: absolute; right: 0px; top: 0; } .locatie_popup.items3 .locatie_inner .item:nth-child(n)::before { display: none; } } @media only screen and (max-width: 800px) { .landkaart .kaart { left: 0px; margin-left: -150px; } } @media only screen and (max-width: 700px) { .landkaart { height: 550px; } .landkaart .kaart { top: -80px; } } @media only screen and (max-width: 600px) { .locatie_popup.items2 { max-width: 380px; border-radius: 0; } .locatie_popup.items2 .locatie_inner .item:nth-child(n) { width: calc(100% - 30px); } .locatie_popup.items2 .locatie_inner .item:nth-child(2n+1)::before { display: none; } .locatie_popup.items3 { max-width: 380px; } .locatie_popup.items3 .locatie_inner .item:nth-child(n) { width: calc(100% - 30px); } .locatie_popup.items3 .locatie_inner .item:nth-child(3n+1)::before { display: none; } } @media only screen and (max-width: 380px) { .landkaart .kaart { left: 0; margin-left: -250px; } .locatie_popup { border-radius: 0; } } /* fleet_overzicht */ .fleet_menu { float: left; width: calc(100%); margin: 0; border: 1px solid #283089; margin-bottom: 60px; } .fleet_menu .item { float: left; width: 33.333%; margin: 0; cursor: pointer; padding: 10px 20px; text-align: center; color: #283089; font-weight: 800; transition: 200ms; -webkit-transition: 200ms; } .fleet_menu .item:not(:last-child) { border-right: 1px solid #283089; } .fleet_menu .item.active, .fleet_menu .item:hover { background-color: #283089; color: #fff; } .fleet_overzicht { float: left; width: calc(100% + 30px); margin: -15px; } .fleet_overzicht .fleet { float: left; width: 100%; } .fleet_overzicht .fleet:not(:last-child) { margin-bottom: 40px; } .fleet_overzicht .item { float: left; width: calc(33.333% - 30px); margin: 15px; } .fleet_overzicht .item:nth-child(3n+4) { clear: left; } .fleet_overzicht .item .kop { color: #283089; font-weight: 800; } .fleet_overzicht .item .titel { font-size: 23px; font-weight: 800; color: #283089; } .fleet_overzicht .item .titel:after { content: ""; display: block; margin: 20px 0 20px 0; width: 40px; height: 3px; border-radius: 100px; background-color: #E03C31; } .fleet_overzicht .item .truck { margin-bottom: 20px; } /* solution_tabs */ .solution_tabs { margin-bottom: 20px; } .solution_tabs .menu { float: left; width: 290px; } .solution_tabs .menu .item { cursor: pointer; padding: 25px 20px; height: 78px; background-color: #002257; font-weight: 800; transition: 300ms; -webkit-transition: 300ms; } .solution_tabs .menu .item .icon { float: left; display: block; line-height: 0; margin-right: 20px; margin-top: -6px; } .solution_tabs .menu .item .icon span:nth-child(2) { display: none; } .solution_tabs .menu .item .icon svg, .solution_tabs .menu .item .icon img { width: 40px; height: 40px; } .solution_tabs .menu .item .titel { line-height: 1.2em; position: relative; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); padding-left: 60px; } .solution_tabs .menu .item:hover, .solution_tabs .menu .item.active { background-color: #fff; color: #E03C31; } /* .solution_tabs .menu .item:hover .icon svg * { fill: #283089; stroke:#283089; } */ .solution_tabs .menu .item:hover .icon span:nth-child(1) { display: none; } .solution_tabs .menu .item:hover .icon span:nth-child(2) { display: block; } .solution_tabs .menu .item.active .icon span:nth-child(1) { display: none; } .solution_tabs .menu .item.active .icon span:nth-child(2) { display: block; } .solution_tabs .content { float: left; width: calc(100% - 290px); background-color: #fff; height: 624px; } .solution_tabs .content .item { display: none; float: left; width: 100%; position: relative; } .solution_tabs .content .item.active { display: block; } .solution_tabs .content .afbeelding { float: right; width: 655px; height: 624px; position: absolute; right: 0; background-position: center; background-size: cover; } .solution_tabs .content .tekst { position: relative; color: #6A6A6A; float: left; width: calc(100% - 655px); height: 624px; padding: 40px 60px; } .solution_tabs .content .tekst .titel { padding-bottom: 5px; max-width: 600px; line-height: 1em; float: left; width: 100%; color: #E03C31; font-size: 27px; font-weight: 800; float: left; width: 100%; } .solution_tabs .content .tekst .titel:after { content: ""; width: 90px; height: 5px; border-radius: 100px; background-color: #E03C31; display: block; margin: 30px 0; background-color: #E03C31; } .solution_tabs .content .tekst .info { float: left; width: 100%; overflow: hidden; } /* .solution_tabs .content .tekst .inner { overflow: hidden; max-height: 331px; } */ .solution_tabs .content .tekst .readmore { position: absolute; bottom: 40px; left: 60px; display: inline-block; font-size: 12px; font-weight: 800; color: #E03C31; text-transform: uppercase; } .solution_tabs .content .tekst .readmore:after { content: ""; margin: 0 0; display: block; width: 100%; height: 3px; border-radius: 100px; background-color: #E03C31; } /* scrolldown.svg */ .scrolldown { cursor: pointer; position: relative; margin-top: 50px; float: left; } .scrolldown::before { content: url('images/scrolldown.svg'); display: block; } .scrolldown { animation-name: scrolldown; animation-duration: 0.6s; animation-timing-function: ease-in-out; animation-iteration-count:infinite; animation-fill-mode: both; animation-delay: 0s; } .mk_sectie.shadowoverlay.overlapbottom .mk_module:last-child .scrolldown { margin-bottom: -30px; margin-left: 70px; } @-webkit-keyframes scrolldown{0%{ transform: translateY(0px); } 50%{ transform: translateY(-10px); } 100%{ transform: translateY(0px); }} @-moz-keyframes scrolldown{0%{ transform: translateY(0px); } 50%{ transform: translateY(-10px); } 100%{ transform: translateY(0px); }} @-o-keyframes scrolldown{0%{ transform: translateY(0px); } 50%{ transform: translateY(-10px); } 100%{ transform: translateY(0px); }} @keyframes scrolldown{0%{ transform: translateY(0px); } 50%{ transform: translateY(-10px); } 100%{ transform: translateY(0px); }} @media only screen and (max-width: 1200px) { .mk_sectie.shadowoverlay.overlapbottom .mk_module:last-child .scrolldown { margin-left: 30px; } } @media only screen and (max-width: 640px) { .scrolldown { margin-left: 0 !important; left: calc(50% - 14px); } } /* video */ .video_header_holder { position: absolute; height: 100%; width: 100%; overflow: hidden; } /* .video_header_inner { position: relative; top: calc(50% - 5px); transform: translateY(-50%); -webkit-transform: translateY(-50%); } */ .video_header_inner { padding: 0 !important; position: static !important; } .video_header_inner iframe { position: absolute; z-index: 9; top: 50%; left: 50%; width: 100%; width: 100vw; height: 56vw; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); } .video_header_overlay { position: absolute; height: 100%;width: 100%; background-color: transparent; z-index: 99; } .video_header_holder .video_onder_layer img { position: absolute; max-width: 999999px; top: 50%; left: 50%; width: 100vw; height: 56vw; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); } .videorow { position: absolute;left: 0; width: 100%; max-width: 100%; height: 100%; z-index: 1; padding: 0; top: 0; } /* popup */ .popup_body { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 999999; background-color: rgba(0,0,0,0.4); opacity: 0; transition: 200ms; -webkit-transition: 200ms; } .popup_body.hide { display: none !important; } .popup_body .popup_container { overflow-y: auto; height: auto; overflow-x: hidden; max-height: 750px; position: absolute; max-width: 900px; width: 100%; background-color: #fff; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); box-shadow: 0 0 5px rgba(0,0,0,0.4); border-radius: 10px; } .popup_body .popup_close { position: absolute; right: 0; z-index: 9; top: 0; padding: 15px; cursor: pointer; } .popup_body .popup_close img { width: 20px; transform: scale(1); -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transition: 200ms; -webkit-transition: 200ms; } .popup_body .popup_close:hover img { transform: scale(1.2); -webkit-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); } .popup_body { opacity: 0; animation-name: inherit; animation-duration: 0.3s; animation-timing-function: ease-in-out; animation-fill-mode: both; animation-delay: 0s; } .popup_body.open { animation-name: fade; } .popup_body .popup_container { opacity: 0; animation-name: inherit; animation-duration: 0.3s; animation-timing-function: ease-in-out; animation-fill-mode: both; animation-delay: 0.2s; } .popup_body.open .popup_container{ animation-name: fadebottom_popup; } .popup_content { padding: 30px; float: left; width: 100%; } @-webkit-keyframes fadebottom_popup{0%{opacity:0;margin-top: 30px;}100%{opacity:1;margin-top: 0px;}} @-moz-keyframes fadebottom_popup{0%{opacity:0;margin-top: 30px;}100%{opacity:1;margin-top: 0px;}} @-o-keyframes fadebottom_popup{0%{opacity:0;margin-top: 30px;}100%{opacity:1;margin-top: 0px;}} @keyframes fadebottom_popup{0%{opacity:0;margin-top: 30px;}100%{opacity:1;margin-top: 0px;}} @media only screen and (max-width: 900px) and (max-height: 750px) { .popup_body .popup_container { border-radius: 0px; } } @media only screen and (max-width: 600px) { .popup_body .popup_container { border-radius: 0px; max-height: 100%; height: 100%; } } #offer_popup .popup_container { max-width: 660px; height: auto !important; border-radius: 10px !important; } #offer_popup h4 { font-size: 22px; } #request_a_quote > * { float: left; } #request_a_quote select { border: 1px solid #707070; background-color: #fff; padding: 12px 15px; width: 190px; font-size: 16px; } #request_a_quote .select { position: relative; } #request_a_quote .select::before { content: url('images/select.svg'); width: 11px; right: 15px; line-height: 0; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); } #request_a_quote .to { font-size: 22px; font-weight: 800; color: #283089; line-height: 42px; padding: 0 10px; } #request_a_quote .request_a_quote { cursor: pointer; background-color: #E03C31; color: #fff; font-size: 17px; line-height: 42px; padding: 0 10px; font-weight: 600; float: right } /* under_construction */ .under_construction { overflow: hidden; padding-top: 140px; padding-bottom: 100px; } .under_construction::before { content: url('images/questionmark.png'); display: block; position: absolute; z-index: 1; left: 72%; top: 57%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); } .under_construction h2 { font-size: 42px; } .under_construction .mk_rij:first-child::before { position: absolute; right: -190px; top: -60px; font-weight: 900; text-align: center; content: "History in progress"; width: 150px; line-height: 26px; font-size: 28px; padding: 64px 15px; display: block; background-color: #E03C31; color: #fff; border-radius: 100px; } .under_construction .undercon_img img { width: 200%; max-width: 200%; left: 50%; position: relative; transform: translateX(-41%); -webkit-transform: translateX(-41%); } /* .history .full { animation-name: history; animation-duration: 3s; animation-timing-function: ease-in-out; animation-fill-mode: both; animation-iteration-count:infinite; animation-delay: 0s; } @-webkit-keyframes history {0%{ width: 0%; } 50%{ width: 100%; } 100%{ width: 0%; }} @-moz-keyframes history {0%{ width: 0%; } 50%{ width: 100%; } 100%{ width: 0%; }} @-o-keyframes history {0%{ width: 0%; } 50%{ width: 100%; } 100%{ width: 0%; }} @keyframes history {0%{ width: 0%; } 50%{ width: 100%; } 100%{ width: 0%; }} */ /* overzicht_history */ .overzicht_history .mk_sectie { height: 100vh; } .overzicht_history .mk_rij { max-width: 1200px; top: 50%; transform: translateY(-50%); margin-top: 50px; } .overzicht_history { height: 100vh; overflow: hidden; background-color: #283089; } .overzicht_history .item:first-child { position: relative; top: 0; left: 0; width: 100%; background-color: #fff; z-index: 9; } .overzicht_history .item:not(:first-child) { visibility: hidden; opacity: 0; position: absolute; top: 0; left: 0; width: 100%; background-color: #fff; z-index: 9; transition: 500ms; -webkit-transition: 500ms; } .overzicht_history .item:not(:first-child).active { opacity: 1; visibility: visible; } .overzicht_history .item:nth-last-child(2) { opacity: 1; visibility: visible; z-index: 1; } .overzicht_history .item:nth-last-child(2).active { opacity: 1; visibility: visible; z-index: 9; } .overzicht_history.fixed .overzicht_history_inner { position: fixed; bottom: 0; width: 100%; } /* history */ .history { left: -5%; width: 120%; max-width: 900px; margin: 0 auto; position: relative; } .omdraaien .history { left: -10%; } .history .full { position: absolute;top: 0; left: 0; width: 0%; height: 100%; overflow: hidden; } .history .full img { max-width: 900px; height: 100%; } .history .name { font-size: 14px; font-weight: 900; width: auto; position: absolute; bottom: 0; right: 20%; line-height: 1.2em; } .history .name span { font-weight: 400; display: block; } .history .drag { position: absolute !important; bottom: 10px; left: 10px; width: 0px; height: 100px; cursor:move; z-index: 99; } .history .drag .inner { position: relative; transform: translateX(-50%); -webkit-transform: translateX(-50%); z-index: 99; width: 100px; height: 100px; border-radius: 100px; background-color: #E03C31; color: #fff; text-align: center; } .history .drag .inner span {position: absolute; top: 46px;font-size: 15px; width: 77px; text-transform: uppercase; font-weight: 900; line-height: 18px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); } @media only screen and (min-width: 1400px) { .overzicht_history.new .history { width: calc(120% + 100px); left: calc(-5% - 50px); } .overzicht_history.new .omdraaien .history { left: calc(-10% - 50px); } .overzicht_history.new .history .drag .inner { left: 50px; } } .history video { max-width: 80%; width: 500px; height: auto; } /* historyinfo */ .historyinfo { position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); } .historyinfo .inner { float: left; width: 400px; padding: 40px 30px; background-color: #fff; border-radius: 20px; color: #283089; box-shadow: 0 0 10px rgba(0,0,0,0.2); } .historyinfo .jaar { padding-bottom: 30px; font-size: 88px; line-height: 1em; color: transparent; -webkit-text-stroke: 2px #E03C31; text-transform: uppercase; font-weight: 800; letter-spacing: 4px; } .historyinfo .titel { font-size: 24px; color: #283089; font-weight: 800; padding-bottom: 20px; } .historyinfo .omschrijving { color: #6A6A6A; font-size: 20px; padding-bottom: 20px; } .historyinfo .stats .statitem { float: left; width: 100%; height: 45px; } .historyinfo .stats .statitem:not(:last-child) { margin-bottom: 10px; } .historyinfo .stats .statitem img { width: 45px; margin-right: 10px; float: left; position: relative; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); display: block; } .historyinfo .stats .statitem span { position: relative; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); display: block; } @media only screen and (max-width: 980px), screen and (max-height: 750px) { .overzicht_history .mk_rij { top: 0; transform: none; -webkit-transform: none; } .overzicht_history .mk_rij { margin-top: 20px; } .historyinfo { position: relative; top: 0; transform: none; -webkit-transform: none; } .historyinfo .inner { width: 100%; max-width: 400px; background-color: transparent; box-shadow: none; } .historyinfo .jaar { padding-bottom: 20px; font-size: 63px;} .historyinfo .titel { font-weight: 600; font-size: 21px; } .historyinfo .omschrijving { padding-bottom: 40px; } .overzicht_history_inner .item .mk_sectie.blauw .historyinfo .inner, .overzicht_history_inner .item .mk_sectie.blauw .historyinfo .titel, .overzicht_history_inner .item .mk_sectie.blauw .historyinfo .omschrijving { color: #fff; } .historyinfo .stats .statitem img { margin: 0 auto; float: none; width: auto; height: 50px; } .historyinfo .stats .statitem { width: 33.333%; } .historyinfo .stats .statitem span { display: block; width: 100%; text-align: center; font-weight: 600; font-size: 16px; } .history { max-width: 80%; left: 0 !important; } /* .history .full img, .history .line img { max-height: 40vh; } */ /* onder elkaar */ .overzicht_history .item:nth-child(n) { position: relative !important; opacity: 1 !important; visibility: visible !important; } .historyinfo .inner { margin-top: 0 !important; transform: none !important; } .overzicht_history, .overzicht_history .mk_sectie { height: auto !important; } .overzicht_history.fixed .overzicht_history_inner { position: relative; } .overzicht_history .mk_kolom_1_2:nth-child(1) { margin-top: 0 !important; margin-right: 0 !important; margin-left: 0 !important; transform: none !important; } .fixed .historynav { position: fixed !important; } } @media only screen and (max-width: 980px){ /* .history .drag .inner */ .history .drag { cursor: pointer; } .history .drag .inner { width: 60px; height: 60px; background-color: #E03C31; border-radius: 100px; } .history .drag .inner span { display: none; } .history .drag .inner img { display: none; } .history .full { transition: 500ms; -webkit-transition: 500ms; } .history .drag .inner::before { content: "show"; display: block; position: absolute; width: auto; top:50%; left:50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); text-transform: uppercase; font-weight: 900; line-height: 18px; font-size: 15px; } } /* li historynav */ .historynav { z-index: 999; position: absolute; right: 0; top: 0; height: 100vh; } .historynav ul { position: absolute; top: 50%; right: 20px; transform: translateY(-50%); -webkit-transform: translateY(-50%); z-index: 999; } .historynav li { position: relative; cursor: pointer; list-style: none; width: 20px; height: 20px; margin: 5px 0; } .historynav li::before { position: absolute; transition: 500ms; -webkit-transition: 500ms; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); width: 14px; height: 14px; background-color: #E03C31; border-radius: 100px; border:2px solid #fff; content: ""; display: block; } .historynav li.active::before, .historynav li:hover::before { width: 20px; height: 20px; } .historynav li span { visibility: hidden; opacity: 0; white-space: nowrap; position: absolute; right: 25px; top: 50%; transform: translateY(-50%) translateX(100%); -webkit-transform: translateY(-50%) translateX(100%); background-color: #fff; border-radius: 100px; line-height: 1.5em; padding: 0 7px; transition: 200ms; -webkit-transition: 200ms; } .historynav li.active span, .historynav li:hover span { visibility: visible; opacity: 1; transform: translateY(-50%) translateX(0%); -webkit-transform: translateY(-50%) translateX(0%); } @media only screen and (max-width: 1750px) { .overzicht_solutions .item .titel { font-size: 1.6vw; } } .button_history_progress { position: absolute; z-index: -1; right: -50px; top: -60px; font-weight: 900; text-align: center; width: 210px; height: 210px; line-height: 26px; font-size: 28px; padding: 50px 15px; display: block; background-color: #E03C31; color: #fff; border-radius: 200px; } @media only screen and (max-width: 980px) { .button_history_progress { position: relative; top: 0; right: 0; float: none; display: inline-block; } .historynav { display: none; } } /* owl-dots */ .history_slider { float: left; width: calc(100% + 10px); margin-left: -5px; padding: 0 80px; } .history_slider .item { float: left; width: 100%; padding: 5px; } .history_slider .owl-dots .owl-dot { width: 16px; height: 16px; background-color: #EEEEEE; border-radius: 100px; margin-right: 10px; } .history_slider .owl-dots .owl-dot.active { background-color: #E03C31; } .history_slider .year { font-size: 88px; line-height: 1em; color: transparent; -webkit-text-stroke: 2px #E03C31; text-transform: uppercase; font-weight: 800; letter-spacing: 4px; } .history_slider img { border-radius: 25px; } .mk_titel.letters.big h2 span { display: block; } @media only screen and (max-width: 768px) { .mk_titel.letters.big h1, .mk_titel.letters.big h2 { font-size: 13vw; } .mk_titel.groot h3, .mk_titel.groot h4 { font-size: 10vw; } } /* cookietabels */ .cookietabels .mk_tekst_inner { overflow: auto; } .cookietabels table { width: 100%; min-width: 800px; } .cookietabels table thead { text-align: left; } .cookietabels tbody td { width: 15%; word-break: break-word; } .cookietabels tbody td:nth-child(3) { width: 40%; } @media only screen and (max-width: 1650px) { /* .overzicht_solutions .item .titel { font-size: 24px; } */ body { font-size: 15px; } .voorpagina_blokken { margin-top: -98px; } .voorpagina_blokken .item .titel { font-size: 28px; } .voorpagina_blokken .item .subtitel { font-size: 16px; } .gform_wrapper.gravity-theme .gfield_label, .gform_wrapper.gravity-theme .ginput_complex label { font-size: 15px !important; } .mk_tekst.groot { font-size: 21px; } .mk_sectie.shadowoverlay .mk_module.maxwidth_750.groot > div { max-width: 700px; } h1 { font-size: 28px; } h2 { font-size: 28px; } h3 { font-size: 28px; } h4 { font-size: 19px; } .mk_sectie.paginatitel .mk_titel h1, .mk_sectie.paginatitel .mk_titel h2, .mk_titel.letters h1, .mk_titel.letters h2 { font-size: 80px; } .mk_titel.groot h1, .mk_titel.groot h2 { font-size: 60px; } .mk_logo_container {margin-top: -50px; } #main-header { padding-top: 10px; } #menu-topmenu li:last-child a, .ubermenu.ubermenu-main .ubermenu-item-level-0 > .ubermenu-target { font-size: 17px; } .mk_logo2, .mk_logo { width: 380px; } .contactkeuze ul li, .contactinfo_overzicht .item { font-size: 16px; } .contactinfo_overzicht .item .land, .contactinfo_overzicht .item .titel { font-size: 19px; } .sustainabilitys_overzicht .item .titel { font-size: 19px; } .mk_footer1 a { font-size: 15px !important; } } @media only screen and (max-width: 1400px) { /* .overzicht_solutions .item .titel { font-size: 22px; } */ body { font-size: 14px; } .voorpagina_blokken { margin-top: -90px; } .voorpagina_blokken .item .titel { font-size: 24px; } .voorpagina_blokken .item .subtitel { font-size: 15px; } .gform_wrapper.gravity-theme .gfield_label, .gform_wrapper.gravity-theme .ginput_complex label { font-size: 14px !important; } .mk_tekst.groot { font-size: 18px; } .mk_sectie.shadowoverlay .mk_module.maxwidth_750.groot > div { max-width: 650px; } h1 { font-size: 24px; } h2 { font-size: 24px; } h3 { font-size: 24px; } h4 { font-size: 17px; } .mk_sectie.paginatitel .mk_titel h1, .mk_sectie.paginatitel .mk_titel h2, .mk_titel.letters h1, .mk_titel.letters h2 { font-size: 70px; } .mk_titel.groot h1, .mk_titel.groot h2 { font-size: 50px; } .mk_logo_container {margin-top: -40px; } #main-header { padding-top: 0px; } #menu-topmenu li:last-child a, .ubermenu.ubermenu-main .ubermenu-item-level-0 > .ubermenu-target { font-size: 16px; } .mk_logo2, .mk_logo { width: 300px; } .contactkeuze ul li, .contactinfo_overzicht .item { font-size: 14px; } .contactinfo_overzicht .item .land, .contactinfo_overzicht .item .titel { font-size: 17px; } .sustainabilitys_overzicht .item .titel { font-size: 17px; } .mk_footer1 a { font-size: 14px !important; } } /* ---------------- */ /* press page */ .mk_sectie.presspage .mk_rij { max-width: 1280px; overflow: hidden; border-radius: 10px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); background-color: #fff; padding: 50px 70px; } .mk_sectie.presspage .mk_rij .mk_kolom { position: relative; } .mk_sectie.presspage h2 { color: #283089; } .mk_sectie.presspage a { position: relative; display: inline-block; color: #E03C31 !important; text-decoration: none !important; } .mk_sectie.presspage a:after { content: ""; width: 0; height: 2px; background-color: #E03C31; position: absolute; left: 0; bottom: 2px; transition: 200ms; -webkit-transition: 200ms; } .mk_sectie.presspage a:hover:after { width: 100%; } .mk_sectie.presspage .date::before { content: url('images/clock.svg'); display: inline-block; margin-right: 10px; position: relative; top: 4px; } .mk_sectie.presspage .date { color: #283089; float: left; margin-right: 40px; line-height: 30px; } .mk_sectie.presspage .source { float: left; color: #283089; line-height: 30px; } .mk_sectie.presspage .mk_galerij .mk_galerij_inner { float: left; width: calc(100% + 20px); margin: -10px; } .mk_sectie.presspage .mk_galerij .mk_galerij_inner .item { float: left; width: calc(25% - 20px); margin: 10px; } .mk_sectie.presspage .mk_galerij .mk_galerij_inner .item:nth-child(4n+5) { clear: left; } .mk_sectie.presspage .mk_galerij .mk_galerij_inner .item a { width: 100%; } /* .socialshare */ .socialshare { display: block; padding: 10px 0 20px 0; text-align: center; max-width: 33%; margin: 0 auto; } .socialshare .titel { font-weight: 700; color:#6A6A6A; float: left; margin-right: 15px;padding-bottom: 10px; display: block; width: 100%; } .socialshare .buttons { float: left; clear: left; width: 100%; } .socialshare a { display: inline-block; position: relative; cursor: pointer; width: 40px; height: 40px; line-height: 40px; background-color: #283089; color: #fff; border-radius: 100%; margin: 0 3px; } .socialshare a:after { display: none; } .socialshare a i { line-height: 40px; } .socialshare a i:before { font-size: 21px; color: #fff; line-height: 40px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); } .socialshare a:hover { background-color: #E03C31; } .socialshare a:hover i:before { color: #fff; } /* .socialshare a.whatsapp { padding-top: 7px; } */ .socialshare a.whatsapp i:before { font-size:25px !important; } .previouspost { float: left; font-weight: 700; position: absolute; bottom: 25px; left: 0; } .previouspost::before { content: url('images/post.svg'); width: 30px; display: inline-block; margin-right: 10px; line-height: 0; position: relative; top: 9px; } .nextpost { float: right; font-weight: 700; position: absolute; bottom: 25px; right: 0; } .nextpost::after { content: url('images/post2.svg'); width: 30px; display: inline-block; margin-left: 10px; line-height: 0; position: relative; top: 9px; } /* ---------------- */ .otgs-development-site-front-end { display: none !important; } /* */ .mk_menu { width: calc(100% - 280px); } #top-header ul.menu li.hide { visibility: hidden; opacity: 0; width: 0; height: 0px; } @media only screen and (max-width: 1500px) { .solution_tabs .content { height: auto; } .solution_tabs .content .afbeelding { width: 100%; position: relative; height: 45vw; } .solution_tabs .content .tekst { width: 100%; } .solution_tabs .content .tekst .titel { max-width: 100%; } .blokdetails_items .item { height: auto; } .blokdetails_items .item .inner { height: auto; } .blokdetails_items .item .icon { width: 100%; } .blokdetails_items .item .icon img { margin: 0 auto; } .blokdetails_items .item .content { width: 100%; padding-left: 0; text-align: center; padding-top: 22px; top: 0; transform: none; -webkit-transform: none; } .blokdetails_items .item .titel { line-height: 1em; padding-top: 8px; } } @media only screen and (max-width: 1330px) { .contactinfo_overzicht .item:nth-child(n) { width: calc(33.333% - 20px); } .medewerkers_overzicht .item:nth-child(n) { clear: none; width: calc(33.33% - 20px); } .medewerkers_overzicht .item:nth-child(3n+4) { clear: left; } } @media only screen and (max-width: 1200px) { .voorpagina_blokken .item:nth-child(n) { width: calc(50% - 30px); } .sustainabilitys_overzicht .item:nth-child(n) { width: calc(50% - 30px); clear: none; } .sustainabilitys_overzicht .item:nth-child(2n+3) { clear: left; } } @media only screen and (max-width: 1100px) { .overzicht_solutions .item:nth-child(n) { width: calc(50% - 24px); clear: none; } .overzicht_solutions .item:nth-child(2n+3) { clear: left; } .overzicht_solutions .item .titel { font-size: 2.4vw; } .mk_sectie.paginatitel .mk_titel h1, .mk_sectie.paginatitel .mk_titel h2, .mk_titel.letters h1, .mk_titel.letters h2 { font-size: 6vw; } .mk_logo2, .mk_logo { width: 260px; } body.paginascroll .mk_logo2, body.paginascroll .mk_logo { width: 260px; } .mk_menu { width: calc(100% - 220px); } .mk_menu ul > li > a { font-size: 17px; } .contactinfo { width: 100%; } .contactinfo_overzicht_foto { display: none; } .fleet_overzicht .item:nth-child(n) { clear: none; width: calc(50% - 30px); } .fleet_overzicht .item:nth-child(2n+3) { clear: left; } } @media only screen and (max-width: 1050px) and (min-width: 980px) { .mk_logo_container { margin-top: -60px; } body.paginascroll .mk_logo_container { margin-top: -50px; } } @media only screen and (max-width: 1150px) and (min-width: 980px) { .sustainability_logo .item { width: calc( 50% - 30px ); } } @media only screen and (max-width: 1100px) and (min-width: 980px) { .gform_wrapper .gform_fields .gfmc-container .gfield.gf_third { width: 100% !important; } } @media only screen and (max-width: 1030px) { .contactinfo_overzicht .item:nth-child(n) { width: calc(50% - 20px); } } @media only screen and (max-width: 980px) { body.paginascroll .mk_logo_container { margin-top: -20px; } body.paginascroll .mk_logo2, body.paginascroll .mk_logo { width: 260px; } /* #full-header { display: none; } */ .mk_sectie.voorpaginaheader h1 { font-size: 8vw; } .mk_titel.letters h1, .mk_titel.letters h2 { font-size: 70px; } /* fix theme */ .mk_kolom_1_4:nth-child(-n+2) { margin-bottom: 30px; } /* Header */ /* #main-header { display: none; } */ #mk-info { padding: 0; } .mk_logo_container { margin-top: -15px; } #main-header { padding-top: 10px; } .mk_logo2, .mk_logo, body.paginascroll .mk_logo2, body.paginascroll .mk_logo { width: 240px; } /* footer */ .mk_footer:nth-child(n) { width: calc(50% - 30px); height: auto !important; } .mk_footer:nth-child(3) { clear: left; height: auto !important; width: calc(100% - 30px); } .mk_logo_footer { margin-top: 20px; } .mk_logo_footer img { float: none; } .blokdetails_items .item:nth-child(n) { width: calc(33.333% - 30px); } .overzicht_posts .item { height: auto !important; } .overzicht_posts .item .afbeelding { width: 100%; } .overzicht_posts .item .info { width: 100%; height: auto !important; padding: 30px; } .overzicht_posts .item .bottom { position: relative; float: left; left: 0; bottom: 0; } .overzicht_posts .item .content { height: 126px !important; margin-bottom: 25px; padding-bottom: 0 !important; } #main-footer { padding-top: 20px; } .medewerkers_overzicht .item:nth-child(n) { clear: none; width: calc(50% - 20px); } .medewerkers_overzicht .item:nth-child(2n+3) { clear: left; } .gform_wrapper.gravity-theme .gfield.gfmc-field { width: calc(100% + 16px) !important; max-width: calc(100% + 16px) !important; } .gform_wrapper.gravity-theme .gfield.gfmc-field:not(:last-child) { margin-bottom: 30px; } .gform_wrapper.gravity-theme .gfmc-container:not(:last-child) { padding-bottom: 30px; } .mk_knop.back .mk_button { margin-bottom: 10px; } } @media only screen and (max-width: 767px) { #top-header { display: none !important; } #main-header { padding: 0; } body #full-header { padding: 10px 0; } .mk_logo2, .mk_logo { width: 220px !important; } body.paginascroll .mk_logo_container { margin-top: -0px; } .mk_logo_container { margin-top: 0px; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); height: auto !important; } /* #footer-bottom */ #footer-bottom { padding: 15px 0; } /* #footer-info:nth-child(n) { text-align: center; width: 100%; padding-bottom: 0; margin: 0; } */ .solution_tabs .menu { width: 100%; } .solution_tabs .content { width: 100%; } .solution_tabs .content .afbeelding { height: 52vw; } .overzicht_solutions { text-align: center; } .overzicht_solutions .item:nth-child(n) { max-width: 500px; width: calc(100% - 24px); clear: left; text-align: left; float: none; display: inline-block; } .overzicht_solutions .item .titel { font-size: 3.5vw } .aboutusbuttons .mk_rij:not(:last-child) { display: none; } .aboutusbuttons .mk_rij:last-child { width: 100%; } #request_a_quote .request_a_quote { width: 100%; margin-top: 10px; text-align: center; } #offer_popup .popup_container { max-width: 488px; } .gform_wrapper .gform_fields .gfmc-container .gfield.gf_third { width: 100% !important; } } @media only screen and (max-width: 640px) { /* Titels */ h1, h2 { font-size: 8vw; } .mk_titel.letters h1, .mk_titel.letters h2 { font-size: 10vw; } .mk_sectie.paginatitel .mk_titel h1, .mk_sectie.paginatitel .mk_titel h2, .mk_titel.letters h1, .mk_titel.letters h2 { font-size: 8vw; } .mk_sectie.voorpaginaheader h1 { font-size: 9vw; } .mk_titel.medium h1, .mk_titel.medium h2 { font-size: 10vw; } .mk_titel.capitale .mk_titel_inner > h1, .mk_titel.capitale .mk_titel_inner > h2 { font-size: 8vw; } .gform_wrapper ul.gform_fields li.gfield { width: 100%; } .voorpagina_blokken .item:nth-child(n) { width: calc(100% - 30px); } .voorpagina_blokken .item .inner, .voorpagina_blokken .item .titel, .voorpagina_blokken .item .subtitel { height: auto !important; } .blokdetails_items .item:nth-child(n) { width: calc(50% - 30px); } .sustainabilitys_overzicht .item:nth-child(n) { width: calc(100% - 30px); } .solution_tabs .content .tekst { padding: 40px; } .solution_tabs .content .tekst .readmore { left: 40px; } #main-footer { padding-top: 0; } .contactinfo_overzicht .item:nth-child(n) { width: calc(100% - 20px); } .history_slider { padding: 60px 0 0 0; } .history_slider .owl-prev { top: 40px; left: calc(100% - 100px); } .history_slider .owl-next { top: 40px; } .medewerkers_overzicht .item:nth-child(n) { clear: left; width: calc(100% - 20px); max-width: 400px; margin: 10px auto; float: none; } .fleet_menu .item { float: left; width: 100%; border: 0 !important; } .fleet_overzicht .item:nth-child(n) { width: calc(100% - 30px); } .gform_wrapper .gform_fields .gfield.gf_half { width: 100%; } .sustainabilitys_overzicht .item .inner { height: auto !important; } } @media only screen and (max-width: 540px) { #offer_popup .popup_container { max-width: 360px; width: 90%; } #request_a_quote .select {width: 100%; } #request_a_quote select { width: 100%; } #request_a_quote .to { width: 100%; } } @media only screen and (max-width: 530px) { .footer_contact .info { width: calc(100% - 20px); } } @media only screen and (max-width: 479px) { /* Header */ #mk-info { line-height: 1.4em; float: none; } .mk_telefoon .mk-info-tekst { display: block; } .mk_mobiel .mk-info-tekst { display: none; } .mk_telefoon, .mk_email, .mk_mobiel { width: 100%; text-align: center; } .mk-info-phone { margin-right: 0px; } /* footer */ .mk_footer:nth-child(n) { width: calc(100% - 30px); } .overzicht_solutions .item .titel { font-size: 5vw; } .mk_sectie.paginatitel .mk_titel h1, .mk_sectie.paginatitel .mk_titel h2, .mk_titel.letters h1, .mk_titel.letters h2 { font-size: 10vw; } .solution_tabs .content .tekst { padding: 25px; } .solution_tabs .content .tekst .readmore { left: 25px; } .contactinfo .contactinfo_overzicht .item:nth-child(n) { width: calc(100% - 20px); } .mk_sectie.overlapbottom + .mk_sectie:not(.box) .mk_rij:nth-child(1) { padding: 20px 0; } .sustainability_logo .item { width: calc( 50% - 30px ); } } @media only screen and (max-width: 379px) { .mk_logo2, .mk_logo { width: 200px !important; } } #indicator { display: none; } @media (max-width: 1200px) { #indicator { display: block; } }