@font-face {
    font-family: "Parslay";
    src: url("../fonts/ParslayRegular.otf") format("opentype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Behind The Nineties";
    src: url("../fonts/Behind-The-Nineties.otf") format("opentype");
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: "Behind The Nineties";
    src: url("../fonts/Behind-The-Nineties-Rg.otf") format("opentype");
    font-weight: normal;
    font-style: normal;
}

:root {
    --color-primary: #953d20;
    --color-secondary: #ebe1d5;

    --font-family: "DM Sans", sans-serif;
    --font-parslay: "Parslay", cursive;
    --font-nineties: "Behind The Nineties", sans-serif;
}

body {
    font-family: var(--font-family);
    background-color: var(--color-secondary);
}

.font-body {
    font-family: var(--font-family);
}

.font-parslay {
    font-family: var(--font-parslay);
}

.font-nineties {
    font-family: var(--font-nineties);
}

a {
    text-decoration: none;
    color: inherit;
}

.bg-color-primary {
    background-color: var(--color-primary);
    color: #ffffff;
}

.bg-color-secondary {
    background-color: var(--color-secondary);
    color: var(--color-primary);
}

.text-color-primary {
    color: var(--color-primary);
}

.text-color-secondary {
    color: var(--color-secondary);
}

.border-color-primary {
    border-color: var(--color-primary);
}

.border-color-secondary {
    border-color: var(--color-secondary);
}

.btn-color-primary {
    color: #fff;
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

.btn-color-primary:hover,
.btn-color-primary:focus,
.btn-color-primary:active,
.btn-color-primary.active,
.show > .btn-color-primary.dropdown-toggle {
    color: #fff;
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

.btn-color-primary:disabled,
.btn-color-primary.disabled {
    color: #fff;
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    opacity: 0.65;
}

/* HEADER */
#header {
    transition:
        color 0.3s ease,
        border-color 0.3s ease;
}

#header * {
    --bs-border-color: currentColor;
}