:root {
    --primary: #4f2d7f;
    --secondary: #ffffff;
    --tertiary: #f2f1ef;
    --quaternary: #ce2c2c;
    --dark: #333333;
    --light: #FFFFFF;
    --gray: #7D7D7D;
}

body {
    background-color: var(--light);
    color: var(--dark);
}

.bg-p {
    background-color: var(--primary) !important;
}

.bg-s {
    background-color: var(--secondary) !important;
}

.bg-t {
    background-color: var(--tertiary) !important;
}

.bg-q {
    background-color: var(--quaternary) !important;
}

.bc-p {
    border-color: var(--primary) !important;
    border-width: 2px !important;
}

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

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

.text-t {
    color: var(--tertiary) !important;
}

.text-q {
    color: var(--quaternary) !important;
}

.btn-p {
    background-color: var(--primary) !important;
    color: var(--secondary) !important;
    border: none;
}

.btn-p:hover {
    background-color: lighten(var(--primary), 10%);
    color: var(--secondary);
}