/* 
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.1
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
*/
.scrolled_logo {
    opacity:  0;
    position: absolute !important;
}

.elementor-location-header {
    position:   fixed !important;
    width:      100%;
    z-index:    9;
    max-height: 111px;
}

.scrolled .elementor-location-header .elementor-section-wrap {
    background-color: #111 !important;
    transform:        translateY(-60px) !important;
}

.scrolled .elementor-location-header .elementor-section-wrap * {
    transition: ease .5s all !important;
}

.scrolled .scrolled_logo {
    opacity:   1;
    transform: translateY(30px) !important;
}

.scrolled .vaste_logo {
    opacity: 0;
}

.scrolled .elementor-location-header nav.elementor-nav-menu--main li a {
    color: #f6f6f6 !important;
}

.elementor-location-header nav.elementor-nav-menu--main {
    transform: translateY(0) !important;
}

.scrolled .elementor-location-header .elementor-section-wrap > div {
    background: #111;
}

.scrolled .elementor-location-header nav.elementor-nav-menu--main {
    transform: translateY(30px) !important;
}


.ginput_container.ginput_container_consent > label {
    width: 93%;
}

.ginput_container.ginput_container_consent > * {
    display: inline-block !important;
}


/*Responsive - Desktop - tablet - mobile*/
.mobiel-tablet, .tablet, .mobiel {
    display: none;
}

/* Tablets in portrait mode (768-980px) */
@media only screen and ( min-width: 768px ) and ( max-width: 980px ) {
    .desktop, .mobiel {
        display: none;
    }

    .tablet, .mobiel-tablet {
        display: block;
    }

    .scrolled .elementor-location-header .elementor-section-wrap {
        background-color: #fff !important;
        transform:        translateY(-20px) !important;
    }

    .scrolled .scrolled_logo {
        opacity:   1;
        transform: translateY(5px) !important;
    }

    .scrolled .elementor-location-header nav.elementor-nav-menu--main {
        transform: translateY(0px) !important;
    }
}

/* Smartphones in landscape mode (480-768px) */
@media only screen and ( min-width: 480px ) and ( max-width: 767px ) {
    .desktop, .tablet {
        display: none;
    }

    .mobiel, .mobiel-tablet {
        display: block;
    }

    .scrolled .elementor-location-header .elementor-section-wrap {
        background-color: #fff !important;
        transform:        translateY(-20px) !important;
    }

    .scrolled .scrolled_logo {
        opacity:   1;
        transform: translateY(5px) !important;
    }

}

/* Smartphones in portrait mode (0-479px) */
@media only screen and ( max-width: 479px ) {

    .scrolled .elementor-location-header .elementor-section-wrap {
        background-color: #fff !important;
        transform:        translateY(-20px) !important;
    }

    .scrolled .scrolled_logo {
        opacity:   1;
        transform: translateY(5px) !important;
    }
}


.gradient--section .e-con-inner:before {
    content:    "" !important;
    height:     50% !important;
    width:      100% !important;
    display:    block !important;
    position:   absolute !important;
    top:        0px !important;
    opacity:    1 !important;
    background: #000 !important;
    left:       0;
    background: linear-gradient(180deg, var(--e-global-color-d866809) 10%, #fff0 100%) !important
}

.gradient--section .e-con-inner:after {
    content:          "";
    height:           50%;
    width:            100%;
    display:          block;
    position:         absolute;
    bottom:           0px;
    left:             0;
    background-color: #f00;
    background:       #000;
    background:       linear-gradient(0deg, var(--e-global-color-d866809) 0%, #fff0 100%);
}

