:root {

    /***Logo's***/
    --logo-standard: url("../../custom/theme/assets/images/Logo_DPW.png");
    --logo-alt: url("../../custom/theme/assets/images/Logo_DPW.png");

    /***Header Image (Van toepassing op visual.twig)***/
    --header-image: url("../../custom/theme/assets/images/DPW_header.png");

    /***Brand Colors***/
    --color-brand-primary: #000;
    --color-brand-primary-rgb: 0, 0, 0;
    --color-brand-secondary: #fff;
    --color-brand-tertiary: #F2931F;
    --color-brand-light: #fff;
    --color-brand-dark: #000;

    /***Font***/
    /* --font-family: 'Roboto', sans-serif; */
    /* --font-family-title: 'Roboto', sans-serif; */
    /* --font-size: 1.6rem; */

    /**** Voor meer settings zie: /themes/base/assets/style/variables.css ****/
}

.ui-dialog .ui-button.button--secondary,
.button--secondary {
    background-color: var(--color-brand-dark);
}

.layout-header-full-width .header_visual,
.layout-header-full-width .header_visual:before {
    height: unset;
    min-height: unset;
    aspect-ratio: 512/145;
    background-position: bottom;
}

.layout-header-full-width .header_visual::before {
  background-size: contain;
}

.flipbook-frame{
    width:100%;
    max-width: 400px;
}

.social-icons{
    padding-left:1em;
}


footer{
    background-color: var(--color-brand-tertiary);
}

.footer_bar {
  background-color: #1695d2;
}

.footer-social-outer{
    width:100%;
    background-color: #ffffff;
}

.footer_social {
    background-color: #ffffff;
    color:#000;
    max-width: 500px;
}

@media (max-width: 600px) {

    .layout-header-full-width .header_visual {
        height: unset;
        min-height: unset;
        aspect-ratio: 1;
    }
    .layout-header-full-width .header_visual:before {
        background-image: url(../images/Registratiepagina-Header-mobiel.jpg);
        height: unset;
        min-height: unset;
        aspect-ratio: 1;
        background-position: left top;
        background-size: cover;
    }

    .video{
        width:85%;
    }

    p{
        padding-right:1.2em;
        max-width:85%;
    }

    .container{
        background-color: var(--color-neutral-white);
    }
}