/*
Theme Name: Verbouwkosten.com
Author: De Ro Pauline & De Ro Maxime
Description: Verbouwkosten.com main theme.
Requires at least: 6.1
Tested up to: 6.1
Requires PHP: 7.0
Version: 1.2.7
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Update URI: https://wp.bobex.com/bbx_plugins_fetcher/theme.php?theme=verbouwkosten.com
Text Domain: vbk
Template: bobex-core
*/

:root {
    --color-base: #F5F5F5;
    --color-base-2: #FFFFFF;
    --color-contrast: #333333;
    --color-contrast-2: #403F44;
    --color-accent: #30773D;
    --color-accent-2: #DBF0DF;
    --color-accent-3: #FE9000;
    --color-accent-4: #0000FF;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    background-color: var(--color-base);
    color: var(--color-contrast);
    width: 100vw;
    overflow-x: hidden;
}

a {
    text-decoration: none;
}

h1 {
    font-family: 'Poppins-Regular', sans-serif;
    color: var(--color-accent);
}

h2 {
    font-family: 'Poppins-Regular', sans-serif;
    color: var(--color-accent);
}

h3 {
    font-family: 'Poppins-Regular', sans-serif;
    color: var(--color-accent);
}

h4, .h4 {
    font-family: 'Poppins-Medium', sans-serif;
    color: var(--color-contrast);
}

p {
    font-family: 'Roboto-Regular', sans-serif;
    color: var(--color-contrast-2);
}

br + br {
    display: none;
}

.text-white, .text-white * {
    color: var(--color-base-2);
}

.cta {
    font-family: 'Poppins-Medium', sans-serif;
    font-size: 16px;
    color: var(--color-base-2);
    background-color: var(--color-accent-3);
    padding: 12px;
    border: 1px solid var(--color-accent-3);
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s;
}

.cta:hover {
    background-color: var(--color-base-2);
    color: var(--color-accent-3);
    border: 1px solid var(--color-accent-3);
}

@media screen and (max-width: 768px) {
    .cta {
        margin-top: 1rem;
        width: 100%;
    }
}


.is-provider-youtube iframe {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 900px;
    height: auto;
    aspect-ratio: 16/9;
}

.site-header__logo img {
    max-width: 100%;

}


#ez-toc-container .ez-toc-list.ez-toc-list-open {
    height: auto;
}

#ez-toc-container .ez-toc-toggle {
    display: unset !important;
}