:root {
    --site-width: 88.375rem;
    --block-spacing: clamp(2.813rem,4vw + 1rem,5.625rem);
    --white: #fff;
    --black: #000;
    --red: #d21f1f;
    --green: #5aad28;
    --yellow: #ffca06;
    --yellow-darker: #ffb700;
    --dark-blue-darker: #002039;
    --grey-light: #dedede;
    --grey-lighter: #e8e8e8;
    --grey: #888;
    --error: var(--red);
    --success: var(--green);
    --body-color: var(--black);
    --heading-color: var(--black);
    --primary-color: var(--yellow);
    --primary-color-hover: var(--yellow-darker);
    --secondary-color: var(--black);
    --secondary-color-hover: var(--yellow);
    --tertiary-color: var(--grey-lighter);
    --tertiary-color-hover: var(--black);
    --border-color: var(--grey-light);
    --placeholder-color: var(--grey);
    --black-opacity-1: rgba(0,0,0,.1);
    --error-opacity-05: rgba(210,31,31,.05);
    --body-font: "Raleway";
    --heading-font: "Raleway";
    --h1-size: 1.75rem;
    --h2-size: 1.5rem;
    --h3-size: 1.25rem;
    --h4-size: 1.125rem;
    --body-size: 1rem;
    --ease-in: cubic-bezier(0.5,0,0.75,0);
    --ease-out: cubic-bezier(0.25,1,0.5,1);
    --ease-in-out: cubic-bezier(0.76,0,0.24,1)
}

#searchButtonKlantHistorie
{
    padding: .6rem 1.5rem .7rem;
}

#leadGegevensGoogleMaps 
{
    float: right;
}

.progress-container {
    width: 100%;
    background-color: #e0e0e0;
    border-radius: 10px;
    overflow: hidden;
}

.progress-bar {
    height: 20px;
    background-color: var(--primary-color);
    transition: width 0.3s ease-in-out;
}

.img-container {
    width: 15rem;
}

    .img-container img {
        width: 100%;
        max-height: 300px;
        object-fit: contain;
    }