/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.2
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/*
    Add your custom styles here
*/
/*--------------------------------------------------------------
## TABLE OF CONTENTS
----------------------------------------------------------------
- ROOT
- TYPOGRAPHY
- BUTTONS
- IMAGES
- HEADER OPMAAK
- FOOTER OPMAAK
- GLOBAL OPMAAK
- CUSTOM CONTAINER OPMAAK
- CUSTOM OPMAAK
- ELEMENTOR WIDGETS OPMAAK
- CUSTOM PLUGIN OPMAAK

----------------------------------------------------------------
## 
--------------------------------------------------------------*/




/*--------------------------------------------------------------
## ROOT
--------------------------------------------------------------*/
@media (max-width:767px) {
    :root {
        --container-default-padding: 32px;
    }
}
@media (min-width: 768px) and (max-width:1024px) {
    :root {
        --container-default-padding: 48px;
    }
}
@media (min-width:1025px) {
    :root {
        --container-default-padding: 64px;
    }
}
/* selection color */
::-moz-selection { /* Code for Firefox */
    color: #fff;
    background: #e40045;
  }::selection {
    color: #fff;
    background: #e40045;
  }

/* .e-con-full >.e-con-inner,
.e-con-boxed >.e-con-inner {
    gap: 60px !important;
} */



/*--------------------------------------------------------------
## TYPOGRAPHY
--------------------------------------------------------------*/

/* CUSTOM TYPOGRAPHY CLASSES */

h1, h2, h3, .hero-ondertitel h4, h4, h5{
    font-family: "MAN Europe Condensed", Sans-serif !important;
    text-transform: uppercase !important;
}

.hero-ondertitel li {
    border-left: 2px solid #e40045;
    padding-left: 15px !important;
}
/* h4 {
    font-family: "MAN Europe", Sans-serif !important;
} */

h1 {
    font-size: 58px !important;
    font-weight: 800;
    text-transform: uppercase;
}

.subpage-title h1{
    font-size: 48px !important;
}

h2 {
    font-size: 48px !important;
    font-weight: 800;
    text-transform: uppercase;
}

h3 {
    font-size: 30px !important;
    line-height: 1.2em !important;
    font-weight: 800;
    margin-bottom: 8px !important;
    text-transform: uppercase;
}

h4 {
    font-size: 24px !important;
    font-weight: 800;
    line-height: 1.3 !important;
}

h5 {
    font-size: 20px !important;
    font-weight: 800;
    line-height: 1.3 !important;
}


p, .elementor-widget-text-editor {
    font-family: "MAN Europe", Sans-serif !important;
    font-size: 16px !important;
    font-weight: 300;
    line-height: 20px !important;
    color: #4e5257;
}

#CybotCookiebotDialogBodyContentTitle {
	font-size: 18px !important;
	color: #002A58 !important;
}

.section-half-overlay-rev:first-child .elementor-widget-text-editor, 
.section-half-overlay-rev:first-child p {
    font-size: 18px;
    font-weight: 700;
    line-height: 33px !important;
    color: #fff;
}


.extra-info .elementor-widget-text-editor {
    font-size: 13px !important;
    font-weight: 300;
    line-height: 21px !important;
}

/* overlay opacity */

.overlay-opacity-1:before {
	opacity: 0.1 !important;
}

.overlay-opacity-2:before {
	opacity: 0.2 !important;
}

.overlay-opacity-3:before {
	opacity: 0.3 !important;
}

.overlay-opacity-4:before {
	opacity: 0.4 !important;
}

.overlay-opacity-5:before {
	opacity: 0.5 !important;
}

.overlay-opacity-6:before {
	opacity: 0.6 !important;
}

.overlay-opacity-7:before {
	opacity: 0.7 !important;
}

.overlay-opacity-8:before {
	opacity: 0.8 !important;
}

.overlay-opacity-9:before {
	opacity: 0.9 !important;
}

/* overlay opacity */



.text-white p{
    color: #fff !important;
}

.text-dark {
    color: #4E5257 !important;
}

.text-blue p, .text-blue{
    color: #002A58 !important;
}

.elementor-widget-text-editor ul {
    margin-bottom: 12px;
}

.elementor-widget-text-editor ul li{
    font-family: "MAN Europe", Sans-serif !important;
    line-height: 25px !important;
    
}

.ondertitel h4 {
    font-family: "MAN Europe Condensed", Sans-serif !important;
    line-height: 1.3 !important;
    text-transform: uppercase !important;
    font-weight: 300 !important;
}

@media (max-width:1350px) {
    .hero-outer h2{
        font-size: 40px !important;
    }
    
    .hero-outer h4{
        font-size: 20px !important;
    }
}




/* CUSTOM TYPOGRAPY RESP */
@media (min-width:768px) and (max-width:1024px) {
    h1 {
        font-size: 48px !important;
        font-weight: 800;
    }
    
    h2 {
        font-size: 38px !important;
        font-weight: 800;
    }
    
    h3, .quote-text p  {
        font-size: 26px !important;
        font-weight: 800;
    }
    
    h4 {
        font-size: 22px !important;
        font-weight: 800;
    }
}
@media (max-width:767px) {
    h1 {
        font-size: 40px !important;
        font-weight: 800;
    }
    
    h2 {
        font-size: 32px !important;
        font-weight: 800;
    }
    
    h3, .quote-text {
        font-size: 24px !important;
        font-weight: 800;
    }
    
    h4 {
        font-size: 21px !important;
        font-weight: 800;
    }

    .hero-outer h2{
        font-size: 32px !important;
    }
    
    .hero-outer h4{
        font-size: 20px !important;
    }
}



.servicepartner .logoimg {
    min-height: 100px;
    max-height: 100px;
    max-width: 70% !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.servicepartner h6 {
    font-weight: 300 !important;
    font-size: 13px !important;
}

@media (max-width:1024px) {

    .servicepartner .logoimg {
        max-width: 50% !important;
    }
}

.title-opsomming {
    margin-top: 5px;
}

.partnerlocatie {
    font-size: 13px !important;
    font-weight: 800;
    line-height: 1.3 !important;
    font-family: "MAN Europe Condensed", Sans-serif !important;
    text-transform: uppercase !important;
}

.elementor p a, .elementor .elementor-widget-text-editor a {
    color: #002A58 !important;
    font-weight: 500 !important;
    text-decoration: underline !important;
}



.usp-section p {
    margin-bottom: 0 !important;
}


/*--------------------------------------------------------------
## BUTTONS
--------------------------------------------------------------*/
/* BTN-B */
.btn-b .elementor-button.elementor-size-sm,
.btn-b .elementor-button.elementor-size-sm:visited,
.dropdown-btn-cont .btn-b {
	background-color: var(--e-global-color-accent);
  border-color: var(--e-global-color-accent);
}
.btn-b .elementor-button.elementor-size-sm:hover,
.btn-b .elementor-button.elementor-size-sm:focus,
.dropdown-btn-cont .btn-b:hover {
		background-color: #fff;
    border-color: var(--e-global-color-accent);
    color: var(--e-global-color-accent);
}

.man-btn a{
    padding: 12px 35px;
    font-size: 15px;
}


.btn-green a,
#contactform_button{
    background-color: #fff !important;
    border-radius: 0;
    font-family: "MAN Europe Condensed", Sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    color: #002A58 !important;
    border: 1px solid #002A58;
    position: relative;
    padding: 13px 34px;
}

.btn-green .elementor-button-text,
#contactform_button .elementor-button-text {
    z-index: 1;
}

.btn-green a::after,
#contactform_button::after {
    content: '';
    width: 5px;
    height: 100%;
    background-color: #e40045;
    position: absolute;
    left: 0;
    top: 0;
    transition: width 180ms ease-in-out;
}

.btn-green a:hover::after,
#contactform_button:hover::after{
    content: '';
    width: 100%;
    transition: width 180ms ease-in-out;
}

/* Livechat button */
.btn-chat {
    position: fixed;
    right: -180px;
    bottom: 50px;
    z-index: 99;
    transition: all 200ms ease-in-out;
}

.btn-chat-in{
    transition: all 200ms ease-in-out;
    right: 0 !important;
}

@media (max-width:1024px) {
    .btn-chat {
        bottom: 0px;
    }
}

.btn-chat a{
    background-color: #fff !important;
    border-radius: 0;
    font-family: "MAN Europe Condensed", Sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    position: relative;
    padding-right: 70px;
    overflow: hidden;
    margin-top: 12px;
    border: solid 2px #639398;
}


.btn-chat .elementor-button-text {
    z-index: 1;
    color: #639398;
    transition: color 180ms ease-in-out;
}


.btn-chat a:hover .elementor-button-text {
    color: #fff;
    transition: color 180ms ease-in-out;
}



.btn-chat .elementor-button-icon {
    position: absolute;
    right: -3px;
    height: 100%;
    top: 0;
    display: flex;
    align-items: center;
    width: 50px;
    background-color: #639398;
    justify-content: center;
    z-index: 9;
    color: #fff;
}

.btn-chat a::after{
    content: '';
    width: 5px;
    height: 100%;
    background-color: #639398;
    position: absolute;
    right: 0;
    top: 0;
    transition: width 180ms ease-in-out;
}

.btn-chat a:hover::after{
    content: '';
    width: 100%;
    transition: width 180ms ease-in-out;
}


.btn-arrow a{
    background-color: transparent !important;
    border-radius: 0;
    font-family: "MAN Europe Condensed", Sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    color: #002A58 !important;
    position: relative;
    padding: 14px 35px;
}

.btn-arrow a:hover{
    color: #F8003E !important;
}


.btn-arrow a:before{
        content: "";
        left: 10px;
        width: 100%;
        position: absolute;
        background: url(/wp-content/uploads/arrow.svg);
        background-repeat: no-repeat;
        height: 15px;
    
}
.btn-blue a{
    background-color: #002A58 !important;
    border-radius: 0;
    font-family: "MAN Europe Condensed", Sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    color: #fff;
    position: relative;
    padding: 14px 35px;
}

.btn-blue .elementor-button-text {
    z-index: 1;
}

.btn-blue a::after{
    content: '';
    width: 5px;
    height: 100%;
    background-color: #e40045;
    position: absolute;
    left: 0;
    top: 0;
    transition: width 180ms ease-in-out;
}

.btn-blue a:hover::after{
    content: '';
    width: 100%;
    transition: width 180ms ease-in-out;
}

.header-section .btn-blue a,
.header-section .btn-green a{
    font-size: 14px !important;
    padding: 12px 24px !important;
}

.header-section .btn-blue .elementor-button-text,
.header-section .btn-white .elementor-button-text {
    z-index: 1;

}

.header-section .btn-shop-green .elementor-button-wrapper{
    height: 38px !important;
}

@media (min-width:1024px) {
	.gradient-bg {
		background: linear-gradient(180deg, rgba(0,0,0,0.5567620798319328) 0%, rgba(0,0,0,0.4298713235294117) 50%, rgba(0,0,0,0) 100%) !important;
	}
}

@media (max-width:1024px) {
	.gradient-bg {
		background: #fff !important;
	}
}


.btn-blue-skewed a{
    background-color: #002A5860 !important;
    border: solid 2px #fff;
    border-radius: 0;
    font-family: "MAN Europe Condensed", Sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    color: #fff;
    position: relative;

    margin-top: 12px;
}
 


.btn-blue-skewed a::after{
    content: '';
    width: 5px;
    height: 100%;
    background-color: #e40045;
    position: absolute;
    left: 0;
    top: 0;
    transition: width 180ms ease-in-out;
}

.btn-blue-skewed a:hover::after{
    content: '';
    width: 100%;
    transition: width 180ms ease-in-out;
}



.btn-blue-outline a{
    background-color: #002A5860 !important;
    border: solid 2px #fff;
    border-radius: 0;
    font-family: "MAN Europe Condensed", Sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    color: #fff;
    position: relative;

}

.btn-blue-outline .elementor-button-text {
    z-index: 1;
}

.btn-blue-outline a::after{
    content: '';
    width: 5px;
    height: 100%;
    background-color: #e40045;
    position: absolute;
    left: 0;
    top: 0;
    transition: width 180ms ease-in-out;
}

.btn-blue-outline a:hover::after{
    content: '';
    width: 100%;
    transition: width 180ms ease-in-out;
}



.btn-white a{
    background-color: #fff !important;
    border: none;
    border-radius: 0;
    font-family: "MAN Europe Condensed", Sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    color: #002A58 !important;
    position: relative;

    padding: 14px 35px;
}

.btn-white .elementor-button-text {
    z-index: 1;
}

.btn-white a::after{
    content: '';
    width: 5px;
    height: 100%;
    background-color: #e40045;
    position: absolute;
    left: 0;
    top: 0;
    transition: width 180ms ease-in-out;
}

.btn-white a:hover::after{
    content: '';
    width: 100%;
    transition: width 180ms ease-in-out;
}

.btn-white a:hover .elementor-button-text{
    color: #fff;
    transition: color 180ms ease-in-out;
}




/* Shop Wit */

.btn-shop a{
    background-color: #fff !important;
    border-radius: 0;
    font-family: "MAN Europe Condensed", Sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    position: relative;

    padding-right: 70px;
    overflow: hidden;
    margin-top: 12px;
}


.btn-shop .elementor-button-text {
    z-index: 1;

    color: #002A58;
    transition: color 180ms ease-in-out;
}


.btn-shop a:hover .elementor-button-text,
.btn-shop-green a:hover .elementor-button-text{
    color: #fff;
    transition: color 180ms ease-in-out;
}



.btn-shop .elementor-button-icon,
.btn-shop-green .elementor-button-icon {
    position: absolute;
    right: -3px;
    height: 100%;
    top: 0;
    display: flex;
    align-items: center;
    width: 50px;
    background-color: #e40045;
    justify-content: center;

    z-index: 9;
    color: #fff;
}

.btn-shop a::after,
.btn-shop-green a::after{
    content: '';
    width: 5px;
    height: 100%;
    background-color: #e40045;
    position: absolute;
    right: 0;
    top: 0;
    transition: width 180ms ease-in-out;
}

.btn-shop a:hover::after,
.btn-shop-green a:hover::after{
    content: '';
    width: 100%;
    transition: width 180ms ease-in-out;
}

/* Shop Groen */

.btn-shop-green a{
    background-color: #639398 !important;
    border-radius: 0;
    font-family: "MAN Europe Condensed", Sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    position: relative;
    padding-right: 70px;
    overflow: hidden;
    font-size: 14px !important;
}


.btn-shop-green .elementor-button-text {
    z-index: 1;
    color: #fff;
    transition: color 180ms ease-in-out;
}

.bg-blue a{
    background-color: #002A58 !important;
    color: #fff !important;
}

.btn-terug a{
    color: #fff !important;
}

.btn-terug a:hover{
    color: #838A92 !important;
}

.btn-terug a .elementor-button-icon{
    transition: color 100ms ease-in-out;
}

.btn-terug a:hover .elementor-button-icon{
    color: #E40045 !important;
    transition: color 100ms ease-in-out;
}

@media (max-width:767px) {
    .btn-blue,
    .btn-blue a,
    .btn-shop a,
    .btn-shop-green a,
    .btn-white a,
    .btn-white,
    .btn-blue-skewed a,
    .btn-green a,
    .btn-green, 
    .btn-blue-outline,
    .btn-blue-outline a{
        width: 100% !important;
    }


}

/*--------------------------------------------------------------
## IMAGES
--------------------------------------------------------------*/






/*--------------------------------------------------------------
## HEADER
--------------------------------------------------------------*/

.nav-menu-home-blue  .menu-item .elementor-item {
    color: #002A58 !important;
}

.nav-menu-home-white  .menu-item .elementor-item {
    color: #fff !important;
}


.menu-mobile li a{
    justify-content: flex-end !important;
    text-align: right !important;
}

.menu-mobile li .elementor-sub-item {
    font-size: 17px !important;
    padding-top: 11px;
    padding-bottom: 11px;
    font-weight: 800 !important;
    text-align: right !important;
}

@media (max-width:1024px) {
    #main-menu-home {
        background-color: #fff;
    }
}

#site-header {
    display: none;
}

.elementor-nav-menu--main .sub-menu .elementor-item-active,
.elementor-nav-menu--main .sub-menu .elementor-item-active:hover {
    border-left: solid 3px #E40045;
    font-weight: 800 !important;
}

nav > ul > li > .elementor-item-active {
    font-weight: 800 !important;
}


#breadcrumbs {
    color: #E40045;
    line-height: 20px !important;
}

#breadcrumbs a{
    font-family: 'MAN Europe';
    color: #fff !important;
    font-weight: 300;
    font-size: 14px;
}

#breadcrumbs .breadcrumb_last{
    font-family: 'MAN Europe';
    color: #fff;
    font-weight: 300;
    font-size: 14px;
}

@media (max-width: 768px) {
    #breadcrumbs .breadcrumb_last,
    #breadcrumbs a{
        font-size: 12px;
    }
}

@media (max-width: 1024px) {
    .subfooter-links ul{
        display: block !important;
    }
}


/*--------------------------------------------------------------
## FOOTER
--------------------------------------------------------------*/

.hero-outer .change-bg::before{
    background-image: url('https://manrollo.com/wp-content/uploads/SES-2.jpeg') !important;
    background-size: cover;
}

.footer-box {
    padding-left: var(--container-default-padding);
    padding-right: var(--container-default-padding);
}

@media (max-width: px) {
    #breadcrumbs .breadcrumb_last,
    #breadcrumbs a{
        font-size: 12px;
    }
}


/*--------------------------------------------------------------
## GLOBAL OPMAAK
--------------------------------------------------------------*/
body {
    max-width: 100vw !important;
    overflow-x: hidden !important;
    overflow-y: visible;
}

#open-open-sol:hover {
    cursor: pointer;
}


.icon-solliciteren {
    opacity: 0;
    transition: opacity 250ms ease-in-out;
}

@media (max-width:767px) {
    .icon-solliciteren {
        opacity: 1;
    }
}


.vacature-box:hover .icon-solliciteren {
    opacity: 1;
    transition: all 250ms ease-in-out;
}

.vacature-box {
    transform: translateY(0px);
    transition: all 250ms ease-in-out;
    box-shadow: 0px 0px 6px 0px rgb(0 0 0 / 9%) !important;
}

.vacature-box:hover {
    transform: translateY(-3px);
    transition: all 250ms ease-in-out;
    box-shadow: 0px 3px 6px 0px rgb(0 0 0 / 11%) !important;
}

.elementor-widget-text-editor ul{
    list-style: none !important;
}

.elementor-widget-text-editor ul li::before {
    content: "\2022"; 
    color: #E40045; 
    font-weight: bold; 
    display: inline-block; 
    width: 1em; 
    margin-left: -1em; 
}

.inner-cont {
    padding: 0;
    margin-top: var(--container-default-padding);
}

.inner-cont:first-child {
    margin-top: 0px !important;
}

.section-half-overlay-motoren img,
.section-half-overlay-motoren-rev img {
    -webkit-filter: drop-shadow(5px 5px 5px #22222220);
    filter: drop-shadow(5px 5px 5px #22222220);
}




/*--------------------------------------------------------------
## CUSTOM CONTAINER OPMAAK
--------------------------------------------------------------*/

.referentie-categorie h6 {
    padding: 4px;
    border-radius: 19px;
    font-size: 12px;
    margin-bottom: 10px;
}


.otgs-development-site-front-end {
    display: none !important;
}

/* Standaard padding */
.elementor-page .cont-wrapper,
.elementor-location-archive {
    padding: var(--container-default-padding) !important;
}

.hero-outer {
    max-width: 100vw !important;
    overflow-x: hidden;
    transform: scale(1.07);
    background-color: #232f58;
    
}

@media (min-width:1600px) {
    .hero-left-cont .e-con-inner{
        align-items: flex-end;
    }
}

.hero-inner {
    padding: calc(1 * var(--container-default-padding));
}

.section-half-overlay::before,
.section-half-overlay-motoren::before {
    width: 65%;
    left: 40%;
    height: 120%;
}

.section-half-overlay-rev::before {
    width: 65%;
    left: -4%;
    height: 120%;
    opacity: 0.85;
}

.section-half-overlay-motoren-rev::before {
    width: 65%;
    left: -4%;
    height: 120%;
    opacity: 0.5;
}

.swiper-pagination-bullet {
    width: 25px;
    height: 25px;
    display: inline-block;
    border-radius: 0;
    background: transparent;
    border: solid 1px #fff;
    opacity: 1;
}

.swiper-pagination-bullet-active {
    background-color: #002A58;
}

@media (max-width:768px) {
    .type-referentie .e-con-inner > .e-con {
        width: 100% !important;
    }
}

.type-referentie .e-con-inner .e-con .elementor-button-wrapper {
    margin-bottom: 100px;
}

.referenties .section-half-overlay-rev {
	background-size: cover !important;
	background-repeat: no-repeat;
	background-position: center !important;
}

.referenties .elementor-swiper-button {
	color: #002A58 !important;
	background-color: #fff;
	border-radius: 40px;
	padding: 5px;
	font-size: 20px !important;
}

.ob-is-glider .swiper-pagination:not(.swiper-pagination-progressbar) {
    width: calc(100% - 2 * var(--container-default-padding));
    max-width: 1500px;
    border-top: solid 1px #fff;
    padding-top: 24px;
    margin-top: 24px;
}

@media (min-width:1024px) {
    .hero-left-cont{
        padding-left: calc(1.6 * var(--container-default-padding));
    }

    .page-id-725 .cont-wrapper {
        padding: 12px var(--container-default-padding) !important;
    }


    .section-half-overlay-motoren,
    .section-half-overlay-motoren-rev {
        margin-top: 16px;
    }

    .first {
        margin-top: 0px !important;
    }
}





.hero-outer .skewed-cont::before, 
.hero-outer .skewed-cont-half::before {

    transition: all 2000ms ease-out;
}

.hero-outer .skewed-cont:hover::before, 
.hero-outer .skewed-cont-half:hover::before {

    transition: all 2000ms ease-out;
}




@media (max-width:2120px) {

    .hero-outer .skewed-cont::before, 
    .hero-outer .skewed-cont-half::before {
        transition: all 700ms ease-out;
    }

    .hero-outer .skewed-cont:hover::before, 
    .hero-outer .skewed-cont-half:hover::before {
        transition: all 700ms ease-out;
    }

    .hero-outer {
        overflow: hidden;
        transform: scale(1.10);
    }
}

@media (max-width:1250px) {
    .hero-outer .skewed-cont::before, 
    .hero-outer .skewed-cont-half::before {
        transition: all 2000ms ease-out;
    }

    .hero-outer .skewed-cont:hover::before, 
    .hero-outer .skewed-cont-half:hover::before {
        transition: all 2000ms ease-out;
    }
}

@media (min-width:768px) and (max-width:1024px) {
    .hero-outer {
        flex-wrap: wrap;
    }

    .hero-left-cont,
    .hero-mid-cont {
        width: 50%;
        height: 600px;
    }

    .hero-left-cont {
        padding-left: 96px;
    }

    .skewed-cont-half{
        width: 100%;
        min-height: 300px;
    }

    .hero-right-cont {
        width: 100%;
    }

    .services-block {
        height: 500px;
    }

    .shop-block {
        padding-left: var(--container-default-padding);
        padding-right: var(--container-default-padding);
    }

    .shop-block::before{
        transform: scale(1.1);
    }



    .section-half-overlay::before{
        width: 105%;
        left: 11%;
    }

    .section-half-overlay-motoren::before {
        width: 106%;
        left: 0;
        top: -80px;
        height: 74%;
    }

    .section-half-overlay-motoren-rev::before {
        width: 106%;
        left: 0;
        top: -80px;
        height: 74%;
    }

    .section-half-overlay-rev::before {
        width: 105%;
        left: -21%;
    }
    
}
@media (max-width:767px) {

    .hero-outer {
        transform: scale(1);
    }


    .hero-left-cont,
    .hero-mid-cont {
        width: 100%;
        min-height: 400px;
    }

    .skewed-cont-half{
        width: 100%;
        min-height: 400px;
    }


    .section-half-overlay-motoren::before {
        height: 85%;
        top: -40px;
        left: 0;
        width: 100%;
    }

    .section-half-overlay-motoren-rev::before {
        height: 85%;
        top: -40px;
        left: 0;
        width: 100%;
    }
}








/*--------------------------------------------------------------
## CUSTOM OPMAAK
--------------------------------------------------------------*/

.usp-section-title {
    padding: var(--container-default-padding);
}

.usp-section {
    padding-left: var(--container-default-padding);
    padding-right: var(--container-default-padding);
    padding-bottom: var(--container-default-padding);
}

@media (min-width:1024px) {
    .usp-section .usp-box {
        border-right: solid 2px #e40045;
    }

    .usp-section .usp-box:last-child {
        border-right: none;
    }


}

@media (min-width:768px) and (max-width:1024px) {
    .usp-section .usp-box {
        border: none;
    }

    .usp-section .usp-box:nth-child(1) {
        border-bottom: solid 1px #e40045;
    }

    .usp-section .usp-box:nth-child(2) {
        border-bottom: solid 1px #e40045;
    }
}

@media (max-width:768px) {
    .usp-section .usp-box {
        border-bottom: solid 2px #e40045;
    }

    .usp-section .usp-box:last-child {
        border-bottom: solid 2px #e40045;
    }
}

.nomargin {
    margin: 0 !important;
}

.header-section{
    padding-top: 5px !important;
    padding-bottom: 5px !important;
    padding-left: var(--container-default-padding);
    padding-right: var(--container-default-padding);
}


.padding-no-vert-padding {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: var(--container-default-padding);
    padding-right: var(--container-default-padding);
}



.parentgrid > .e-con-inner{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(3, 1fr);
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    }


    
    .div1 { grid-area: 1 / 1 / 2 / 2; }
    .div2 { grid-area: 1 / 2 / 2 / 3; }
    .div3 { grid-area: 2 / 1 / 3 / 2; }
    .div4 { grid-area: 2 / 2 / 3 / 3; }
    .div5 { grid-area: 3 / 1 / 4 / 2; }
    .div6 { grid-area: 3 / 2 / 4 / 3; }
    .div7 { grid-area: 1 / 3 / 3 / 5; }
    .div8 { grid-area: 3 / 3 / 4 / 4; }
    .div9 { grid-area: 3 / 4 / 4 / 5; }

    @media only screen and (max-width: 1024px){
        .parentgrid > .e-con-inner{
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            grid-template-rows: repeat(5, 1fr);
            grid-column-gap: 10px;
            grid-row-gap: 10px;
            }
            
            .div1 { grid-area: 1 / 1 / 2 / 2; }
            .div2 { grid-area: 1 / 2 / 2 / 3; }
            .div3 { grid-area: 2 / 1 / 3 / 2; }
            .div4 { grid-area: 2 / 2 / 3 / 3; }
            .div5 { grid-area: 3 / 1 / 4 / 2; }
            .div6 { grid-area: 3 / 2 / 4 / 3; }
            .div7 { grid-area: 4 / 1 / 5 / 2; }
            .div8 { grid-area: 4 / 2 / 5 / 3; }
            .div9 { grid-area: 5 / 1 / 6 / 3; }
    }

.cont-wrapper-map {
    padding: 0 !important;
}

.igm-map-content {
    padding: 24px;
    box-shadow: 0px -1px 10px 0px rgb(0 0 0 / 18%);
    border-left: solid 3px #E40045;
    background-color: #fff;
}

.igm-map-content .map-logo {
    width: 150px;
}

.igm-map-content h4 {
    font-weight: 300;
    color:#002A58;
}

.igm-map-content h2 {
    font-size: 33px !important;
    margin-bottom: 0px;
}

.igm-map-content .map-logo{
    margin-top: 24px;
}

.igm-map-content .btn-blue {
    margin: 24px 0px;
}

.igm-map-content .btn-blue:hover {
    color: #fff !important;
} 

.igm-map-content .btn-blue span {
    z-index: 999;
    position: relative;
}


@media only screen and (min-width: 1024px){
    .map_box.igm_content_left_2_3 {
        width: 100% !important;
        max-width: 100vw !important;
    }

    .igm_content_right_1_3 {
        position: absolute;
        right: var(--container-default-padding);
        top: var(--container-default-padding);
        width: 25% !important;
    }

    #default_1979, #default_3001 {
        font-family: "MAN Europe Condensed", Sans-serif !important;
        text-transform: uppercase !important;
        font-size: 20px !important;
        font-weight: 600;
        color: #002A58;
        background-color: transparent !important;
    }

    .cont-wrapper-map { 
        max-height: 1000px;
    }

    .imapsZoomControl-group {
        position: absolute;
        transform: translate(10px, 10px);
    }
}


/* Referenties */

.page-id-26 .referenties-button, 
.page-id-4565 .referenties-button{
    display: none !important;
}



/*------------------------------------*\
    CTA JOURNEY
\*------------------------------------*/
.cta__journey {
    display: flex;
    justify-content: space-around;
    align-items: flex-start;
    flex-direction: row;
    position: relative;
    width: 100%;
    margin-top: 3rem;
}
.cta__journey--line {
    width: 100%;
    height: 2px;
    background-color: #d2d2d2;
    display: block;
    position: absolute;
    top: 39%;
    left: 0;
}
.cta__journey--item {
    width: calc(100% / 5 - 10px);
    position: relative;
    z-index: 1;
}
.cta__journey--content {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
    color: #002A58;
}
.cta__journey--content h4 {
    margin: 0;
    text-align: center;
    font-size: 18px;
    font-weight: 700;
}

.cta__journey--circle {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background-color: #003873;
    border: solid 4px #F0F1F2;
    margin: 1rem 0;
}
.cta__journey--content p {
    margin: 0;
    width: 100%;
    text-align: center;
    font-size: 16px;
    width: 100%;
    line-height: 1.6 !important;
}

.elementor-field-type-acceptance .elementor-field-option {
    display: flex !important;
}

.elementor-field-type-acceptance input {
    margin-right: 5px;
}

/* CTA RESP */
@media (max-width:1140px) {
	.cta__journey {
	    display: flex;
	    justify-content: flex-start;
	    align-items: flex-start;
	    flex-direction: column;
	    margin-top: 2rem;
	}
	.cta__journey--line {
	    height: 100%;
	    width: 2px;
	    top: 0;
	    left: 12.5px;
	}
	.cta__journey--item {
	    width: 100%;
	}
	.cta__journey--content {
	    display: flex;
	    justify-content: flex-start;
	    align-items: center;
	    flex-direction: row;
	    flex-wrap: wrap;
	}
	.cta__journey--content h4 {
	    order: 1;
	}
	.cta__journey--circle {
	    order: 0;
	    margin-right: 20px;
	    transform: translateY(15px);
        background-color: #003873;
        border-color: #003873;
	}
	.cta__journey--content p {
	    order: 2;
	    width: 100%;
	    text-align: left;
	    margin-left: 45px;
	    margin-top: -10px;
	}
}

/* VACATURE GALLERY GRID*/
.wrapper-vacature-gallery {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-column-gap: 0px;
    grid-row-gap: 0px;
}
    
.wrapper-vacature-gallery .elementor-widget-image:nth-child(1) { grid-area: 1 / 1 / 2 / 2; }
.wrapper-vacature-gallery .elementor-widget-image:nth-child(2) { grid-area: 1 / 2 / 2 / 3; }
.wrapper-vacature-gallery .elementor-widget-image:nth-child(3) { grid-area: 1 / 3 / 2 / 5; }
.wrapper-vacature-gallery .elementor-widget-image:nth-child(4) { grid-area: 2 / 1 / 3 / 3; }
.wrapper-vacature-gallery .elementor-widget-image:nth-child(5) { grid-area: 2 / 3 / 3 / 4; }
.wrapper-vacature-gallery .elementor-widget-image:nth-child(6) { grid-area: 2 / 4 / 3 / 5; }
 
.wrapper-vacature-gallery .elementor-widget-image img {
    height: 100%;
    object-fit: cover;
}

@media (max-width:560px) {
    .wrapper-vacature-gallery {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(4, 1fr);
        }
        
        .wrapper-vacature-gallery .elementor-widget-image:nth-child(1) { grid-area: 1 / 1 / 2 / 2; }
        .wrapper-vacature-gallery .elementor-widget-image:nth-child(3) { grid-area: 1 / 2 / 2 / 3; }
        .wrapper-vacature-gallery .elementor-widget-image:nth-child(4) { grid-area: 2 / 1 / 3 / 3; }
        .wrapper-vacature-gallery .elementor-widget-image:nth-child(2) { grid-area: 3 / 1 / 4 / 2; }
        .wrapper-vacature-gallery .elementor-widget-image:nth-child(5) { grid-area: 3 / 2 / 4 / 3; }
        .wrapper-vacature-gallery .elementor-widget-image:nth-child(6) { grid-area: 4 / 1 / 5 / 3; } 
}

/*--------------------------------------------------------------
## ELEMENTOR WIDGETS OPMAAK
--------------------------------------------------------------*/
/* .nieuws-posts .elementor-post__thumbnail__link, .nieuws-posts .elementor-post__thumbnail, .nieuws-posts .elementor-post__thumbnail img{
    height: 100%;
    object-fit: cover !important;
}

.nieuws-posts article {
    height: 150px;
    align-items: center;
} */

.wpml-ls-item .elementor-item{
    padding-left: 5px !important;
    padding-right: 5px !important;
}

.elementor-widget-menu-anchor {
    position: absolute;
    top: -150px;
}

.single-nieuwsbericht strong {
    color: #002A58 !important;
    font-weight: 700 !important;
}

.message_field_form {
    border: 1px !important;
}

.elementor-field-group .elementor-field-textual:focus {
    box-shadow: none !important;
}

.sollicitatieformulier .elementor-field-group-cv label{
    margin-bottom: 20px !important;
}
/* 

/*--------------------------------------------------------------
## CUSTOM PLUGIN OPMAAK
--------------------------------------------------------------*/







/*--------------------------------------------------------------
## 
--------------------------------------------------------------*/


/* Style the pagination dots */
.swiper-pagination {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
}

.swiper-pagination .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 50%;
    margin: 0 5px;
    transition: background-color 0.3s ease;
}

.swiper-pagination .swiper-pagination-bullet-active {
    background-color: #fff; /* Active dot color */
}



/* redesign-items */

/* full-width image section */
@media (min-width: 1024px) {

    .content-left, .content-right {
        width: 100%;
        max-width: 750px;
        padding-top: 137px; 
        padding-bottom: 137px;
    }
    
    .container-left {
        display: flex;
        flex-direction: row;
        align-items: flex-end;
    }

    .content-left {
        padding-right: 80px;
        height: 100%;
    }

    .content-right{
        padding-left: 80px;
        height: 100%;
    }
}



 @media (min-width: 800px) and (max-width:1500px) {

    .content-left {
        padding-left: 20px;

    }

    .content-right{
        padding-right: 20px;
    }

}


/* full-width first image section */
@media (min-width: 1024px) {

    .content-left-1, .content-right-1 {
        width: 100%;
        max-width: 750px;
        padding-top:80px; 
        padding-bottom: 80px;
    }
    
    .container-left-1 {
        display: flex;
        flex-direction: row;
        align-items: flex-end;
    }

    .content-left-1 {
        padding-right: 80px;
        height: 100%;
    }

    .content-right-1{
        padding-left: 80px;
        height: 100%;
    }
}



 @media (min-width: 800px) and (max-width:1500px) {

    .content-left-1 {
        padding-left: 20px;

    }

    .content-right-1{
        padding-right: 20px;
    }

}

/* quote */
.quote-text {
    font-family: "MAN Europe Condensed", Sans-serif !important;
    text-transform: uppercase !important;
    font-size: 30px !important;
    line-height: 1.2em !important;
    font-weight: 800 !important;
    margin-bottom: 8px !important;
    text-transform: uppercase;

}

.quote-text span{
    font-family: "La Belle Aurore";
    font-size: 48px;
    font-weight: 400;
    line-height: 48px;
    text-transform: none;
    position: relative;
    z-index: 2;
}

.quote-text span:before {
    content: "";
    top: calc(1em + 10px);
    left: 0;
    width: 100%;
    position: absolute;
    background: url(/wp-content/uploads/underline.svg);
    background-repeat: no-repeat;
    background-size:100%;
    height: 15px;
    z-index: 1;
}

/* gradient section */
.blue-gradient-background{
    background: linear-gradient(272deg, #000 -0.17%, #002B58 99.89%);
    position: relative;
}

.blue-gradient-background p, .blue-gradient-background h1, .blue-gradient-background h2, .blue-gradient-background h3, .blue-gradient-background h4 {
    color: #fff !important;
}


.swoosh{
    position: relative;
    overflow: hidden;
}

.swoosh::after {
    background: url(/wp-content/uploads/swoosh.webp);
    background-position: right;
    background-size: contain;
    position: absolute;
    background-repeat: no-repeat;
    content: "";
    width: 70%;
    margin-top: -15px;
    margin-right: -100px;
    height: 181%;
    right: -50px;
    pointer-events: none;
    transform: rotate(351deg);
}

.light-blue-gradient-background{
    background: linear-gradient(249deg, rgba(0, 0, 0, 0.00) 14.87%, #002B58 92.08%), #0D9CCC;
    position: relative;
}

.elementor .light-blue-gradient-background .elementor-widget-text-editor a {
    color: #fff !important;
    text-decoration: underline;
}


.light-blue-gradient-background p, .light-blue-gradient-background h1, .light-blue-gradient-background h2, .light-blue-gradient-background h3, .light-blue-gradient-background h4 {
    color: #fff !important;
}

.light-blue-gradient-background .btn-arrow a{
    color: #fff !important;
}

.homepage-hero h1{
    color: #FFF !important;
text-align: center !important;
text-transform: none !important;
font-size: 112px !important;
font-style: normal;
font-weight: 700 !important;
line-height: 112px; /* 100% */
}

.hero-title{
    padding-bottom: 20vh;
}
@media (max-width:500px) {
    .homepage-hero h1{
        color: #FFF !important;
    text-align: center !important;
    text-transform: none !important;
    font-size: 45px !important;
    font-style: normal;
    font-weight: 700 !important;
    line-height: 45px; /* 100% */
    }

    .hero-title{
        padding-bottom: 5vh;
        padding-top: 20vh;
    }
}
.homepage-hero h1::after {
    content: "";
    top: calc(1em + -8px);
    left: 0;
    width: 100%;
    position: absolute;
    background: url(/wp-content/uploads/underline.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    height: 100%;
    z-index: -1;
}

.homepage-hero h2{
font-size: 32px !important;
text-transform: none !important;
}



.homepage-hero p{
    color: #FFF !important;
}

.homepage-hero .btn-arrow a{
    color: #fff;
    padding: 0px !important;

}
@media (max-width:1500px) {
    .scroll-container{
        display: none;
    }


}

.icon-scroll,
.icon-scroll:before {
  position: absolute;
  left: 50%;
}

.icon-scroll {
  width: 32px;
  height: 60px;
  margin-left: -20px;
  top: 50%;
  margin-top: 0px;
  box-shadow: inset 0 0 0 1px #fff;
  border-radius: 25px;
}

.icon-scroll:before {
  content: '';
  width: 8px;
  height: 8px;
  background: #fff;
  margin-left: -4px;
  top: 8px;
  border-radius: 4px;
  animation-duration: 1.5s;
  animation-iteration-count: infinite;
  animation-name: scroll;
}

@keyframes scroll {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translateY(46px);
  }
}



.swiper-element {
  margin-bottom: 100px !important;
}



@media (min-width:1500px) {
    .desktop-menu, .desktop-buttons{
        display: block;
    }

    .desktop-menu{
        display: flex;
    }
    .resp-menu{
        display: none;
    }


}

@media (max-width:1500px) {
    .desktop-menu, .desktop-buttons{
        display: none;
    }

    .resp-menu{
        display: block;
    }


}


.sec-hero{
    padding-top: 150px;
    padding-bottom: 70px;
}

@media (max-width:1500px) {
    .sec-hero, .homepage-hero{
        padding-left: var(--container-default-padding);
        padding-right: var(--container-default-padding);
    }


    }




    body.elementor-page-3079 {
        padding: 0px !important;
    }


@media (max-width:767px) {
    .vacature-box .elementor-element.e-con-full.e-flex.e-con {
        width: 100%;
    }
    }


    .sec-hero:after {
        background: url(/wp-content/uploads/swoosh.webp);
        background-position: right;
        background-size: contain;
        position: absolute;
        background-repeat: no-repeat;
        content: "";
        width: 100%;
        margin-top: 0;
        margin-right: 0;
        height: 100%;
        pointer-events: none;
        opacity: 50%;
        bottom: -43%;
    }


    @media (max-width:767px) {
        .sec-hero:after {
            background: url(/wp-content/uploads/swoosh.webp);
            background-position: right;
            background-size: contain;
            position: absolute;
            background-repeat: no-repeat;
            content: "";
            width: 100%;
            margin-top: 0;
            margin-right: 0;
            height: 100%;
            pointer-events: none;
            opacity: 50%;
            bottom: -20%;
        }
        }

        .wpml-ls-item + .wpml-ls-item::before {
            content: "|";
            margin: auto; /* Aanpassen van de afstand tussen de talen en de separator */
            color: #ffffff; /* Kleur van de separator */
        
        }