.cookie-bar {
    --bar-border: hsl(0, 0%, 0%);
    --bar-background: hsl(0, 100%, 100%);
    --bar-text: hsl(0, 0%, 0%);
    --button-accept-border: hsl(0, 0%, 0%);
    --button-accept-background: hsl(0, 0%, 0%);
    --button-accept-text: hsl(0, 100%, 100%);
    --button-deny-border: hsl(0, 0%, 0%);
    --button-deny-background: hsl(0, 100%, 100%);
    --button-deny-text: hsl(0, 0%, 0%);

    position: fixed;
    inset: auto 0 0.50em 0;
    max-width: 80%;
    margin: 0 auto;
    padding: 1.25em 1.50em;
    border: 1px solid var(--bar-border);
    color: var(--bar-text);
    background: var(--bar-background);
    font-size: 0.85em;
    z-index: 9999;
}

.cookie-bar--wide {
    inset: auto 0 0 0;
    max-width: 100%;
}

.cookie-bar--flat {
    display: grid;
    grid-template-columns: 1fr 0.25fr;
    justify-content: center;
}

.cookie-bar--flat .cookie-bar__buttons {
    margin: auto 0;
}

.cookie-bar--flat .cookie-bar__buttons  > *:not(:last-child) {
    margin-bottom: 0.50em;
}

.cookie-bar p {
    margin: 0 0 0.50em 0;
    text-align: justify;
}

.cookie-bar q {
    quotes: "„" "“";
}

.cookie-bar__buttons {
    margin-top: 1.00em;
    text-align: center;
}

.cookie-bar__button {
    display: inline-block;
    padding: 0.50em 1.25em;
    cursor: pointer;
}

div.cookie-bar__buttons > a.cookie-bar__button--accept {
    border: 1px solid var(--button-accept-border);
    color: var(--button-accept-text);
    background: var(--button-accept-background);
}

div.cookie-bar__buttons > a.cookie-bar__button--deny {
    border: 1px solid var(--button-deny-border);
    color: var(--button-deny-text);
    background: var(--button-deny-background);
}
