/*
Theme Name: Mamoda Webdesign
Theme URI: https://mamoda.nl
Author: Mamoda Nederland
Author URI: https://mamoda.nl
Description: Thema van Mamoda
Requires at least: 6.4
Tested up to: 6.6
Requires PHP: 7.0
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: Mamoda
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/

.sticky-header {
    position: sticky;
    top: 0;
    transition: background-color 0.3s ease, color 0.3s ease;
    z-index: 1000;
}

.sticky-header.scrolled {
    background-color: white; /* Achtergrondkleur wanneer gescrold */
    color: black; /* Tekstkleur wanneer gescrold */
}

.sticky-header.scrolled .navbar-nav .nav-link {
    color: black; /* Nav-link kleur aanpassen */
}

/* Video op volledig scherm */
.video-background {
    position: fixed;
    /* Zorg ervoor dat de video altijd op de achtergrond staat */
    top: 0;
    left: 0;
    width: 100vw;
    /* Gebruik viewport breedte */
    height: 100vh;
    /* Gebruik viewport hoogte */
    object-fit: cover;
    /* Zorg ervoor dat de video het hele gebied bedekt */
    z-index: -1;
    /* Zorg ervoor dat de video achter de inhoud ligt */
}

header {
    position: relative;
    /* Zorg ervoor dat de header ook de volle hoogte van het scherm heeft */
}

/* Stijl voor de titel boven de video */
.video-title {
    position: absolute;
    top: 25%;
    /* Plaats de titel op ongeveer een kwart van de hoogte */
    left: 50%;
    /* Centreer de titel horizontaal */
    transform: translate(-50%, -50%);
    /* Zorg ervoor dAat de titel precies in het midden staat */
    color: white;
    /* Maak de tekst wit */
    font-size: 3rem;
    /* Pas de grootte van de titel aan */
    text-align: center;
    /* Centreer de tekst */
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
    /* Optioneel: schaduw voor betere zichtbaarheid */
}


a {
    color: #ffffff;
    font-size: 1rem;
}

/* Zorg ervoor dat het menu goed wordt weergegeven */
.navbar-nav .nav-item {
    margin-right: 150px; /* Voeg wat ruimte toe tussen de menu-items */
}

/* Standaard styling voor de links */
.navbar-nav .nav-link {
    color: #ffffff; /* Standaard tekstkleur */
    font-size: 5rem; /* Grootte van het lettertype */
    text-decoration: none; /* Verwijder onderstreping */
}

/* Hover effect voor de links */
.navbar-nav .nav-link:hover {
    color: #000000; /* Kleur bij hover */
    text-decoration: none; /* Verwijder onderstreping bij hover */
}

/* Actieve link styling (optioneel) */
.navbar-nav .nav-link.active {
    color: #000; /* Kleur voor de actieve link */
    font-weight: bold; /* Maak de actieve link vet */
}


.col-md-1 {
    margin: 20%;
}

h1,
h1 {
    font-family: 'gotham-bold';
    font-size: 5rem;
    color: black;
    font-weight: 900;
}


.wpforms-container input.wpforms-field-medium, .wpforms-container select.wpforms-field-medium, .wpforms-container .wpforms-field-row.wpforms-field-medium, .wp-core-ui div.wpforms-container input.wpforms-field-medium, .wp-core-ui div.wpforms-container select.wpforms-field-medium, .wp-core-ui div.wpforms-container .wpforms-field-row.wpforms-field-medium{
    max-width: 100% !important;
}

/* Centrerende styling voor de eerste kolom */
.col-md-10.col-lg-4 {
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Verwijder achtergrond van tweede kolom als dat nodig is */
.col-md-10.col-lg-6 .p-4 {
    background: none; /* Geen achtergrondkleur */
}

.acf-input .acf-input-prepend, .acf-input .acf-input-append{
	height:-4% !important;
}