/* =================================== */
/* ============== FARBEN ============== */
/* =================================== */

:root{
    --color-white: #ffffff;
    --color-black: #000000;
    --color-beaver: #9f816c;
    --color-beaver-lo: #9f816c25;
    --color-pastel: #D3DDD6;
    --color-isabell: #f8f0eb;
    --color-charcoal: #89958D;
    --color-rifle: #D3DDD6;
    --color-dark-green: #2D3630;
}

.color-white{
    color: var(--color-white);
}

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

.color-black{
    color: var(--color-black);
}

.background-black{
    background-color: var(--color-black);
}

.color-beaver{
    color: #9f816c;
}

.background-beaver{
    background-color: var(--color-beaver);
}

.color-charcoal{
    color: var(--color-charcoal);
}

.background-charcoal{
    background-color: var(--color-charcoal);
}

.color-rifle{
    color: var(--color-rifle);
}

.background-rifle{
    background-color: var(--color-rifle);
}

.color-pastel{
    color: var(--color-pastel);
}

.background-pastel{
    background-color: var(--color-pastel);
}

.color-isabell{
    color: var(--color-isabell);
}

.background-isabell{
    background-color: var(--color-isabell);
}

.color-dark-green{
    color: var(--color-dark-green);
}

.background-dark-green{
    background-color: var(--color-dark-green);
}

.blur-background{
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(3px);
}

.blur-background-heavy{
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(3px);
}