/*dit is de rose kleur:  #E74591 !important;*/

.hidden {
    display: none;
    visibility: hidden;
}

.BiennaleBlack {
    font-family: BiennaleBlack;
}

h1, h2, h3, h4, h5 {
    font-family: BiennaleBlack;
}

.BiennaleBlack {
    font-family: BiennaleBlack;
}

.bgbijleden_title {
    font-family: BiennaleBlack;
    font-size: 12px;
}

.bgbijleden-titlediv {
    border-bottom:solid;
    border-bottom-color: var(--brand-color) !important;
}

.maintitle {
    color: var(--main-title-color);
    font-family: BiennaleBlack;
    font-size: xx-large;
}

.subtitle {
    color: var(--main-title-color);
    font-family: BiennaleBlack;
    font-size: large;
}

.subtitle_small {
    color: var(--main-title-color);
    font-family: BiennaleBlack;
    font-size: smaller;
}

.bgtopbar {
    background-color: var(--brand-color) !important;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    border-color: var(--brand-color) !important;
    border: none;
}


.bgforms {
    background-color: var(--form-background-color) !important;
    border-radius: 15px;
    border: none;
}

.bgbedrag {
    background-color: var(--bedrag-background-color) !important;
    border-radius: 15px;
}

.bgbijleden {
    background-color: var(--bijleden-background-color) !important;
    border-radius: 15px;
}

.bgbijledenCells {
    font-size: 14px;
}

.bginteresses {
    background-color: var(--interesses-background-color) !important;
    border-radius: 15px;
}

.bgbutton {
    background-color: var(--brand-color) !important;
    border-radius: 15px;
    border: none;
    height: fit-content;
    color: white;
    font-family: BiennaleBlack;
}
    .bgbutton:hover {
        color: lightgrey;
    }

.bgbutton_small {
    background-color: var(--brand-color) !important;
    border-radius: 15px;
    border: none;
    height: fit-content;
    color: white;
    font-family: BiennaleBlack;
    font-size: x-small;
}
    .bgbutton_small:hover {
        color: lightgrey;
    }


.bgautofields {
    max-width: 100%;
    width: 100%;
    background-color: var(--autofields-background) !important;
}

    .bgautofields:hover {
        color: lightgrey;
    }

    .bgautofields:focus {
        outline: none !important;
        border: none !important;
        border-color: none !important;
        border-width: 0px !important;
        box-shadow: none !important;
    }


.bgfixedbedrag {
    background-color: var(--autofields-background) !important;
}

    .bgfixedbedrag:hover {
        color: lightgrey;
    }

.bgcheckboxbuttons {
    height: fit-content;
    background-color: var(--checkboxfields-background) !important;
    color: white !important;
    font-family: BiennaleBlack;
}

.bgcheckboxbuttons_checked {
    height: fit-content;
    background-color: var(--brand-color) !important;
    color: white !important;
    font-family: BiennaleBlack;
}

    .bgcheckboxbuttons_checked:hover {
        color: lightgrey;
    }


.bgcheckboxbuttons_bedragkeuze {
    height: fit-content;
    width: fit-content;
    font-size: small;
    background-color: var(--checkboxfields-background) !important;
    color: white !important;
    width: 100px;
    font-family: BiennaleBlack;
}

    .bgcheckboxbuttons_bedragkeuze:hover {
        color: lightgrey;
    }

.bgcheckboxbuttons_bedragkeuze_checked {
    height: fit-content;
    width: fit-content;
    font-size: small;
    background-color: var(--brand-color) !important;
    color: white !important;
    width: 100px;
    font-family: BiennaleBlack;
}

    .bgcheckboxbuttons_bedragkeuze_checked:hover {
        color: lightgrey;
    }

.bgfabuttons {
    background-color: var(--bijleden-background-color) !important;
    border: 0;
    font-family: BiennaleBlack;
}

    .bgfabuttons:hover {
        color: lightgrey;
    }



.form-control:focus {
    border-color: var(--main-title-color);
    border-width: 2px;
    box-shadow: var(--box-shadow);
}

.form-control-sm:focus {
    border-color: var(--main-title-color);
    border-width: 2px;
    box-shadow: var(--box-shadow);
}

.iti {
    width: 100%;
    display: block;
}

.table-responsive {
    font-size: 14px !important;
}

.form-label {
    margin-bottom: 0 !important;
}


input[type="checkbox"] {
    width: 1.75em;
    height: 1.75em;
}

    input[type="checkbox"]:checked {
        width: 1.75em;
        height: 1.75em;
        background-color: var(--brand-color) !important;
    }


.checkboxlabel {
    padding-left: 5px;
    padding-top: 4px;
}