:root {
    --body-color: #0d0f16;
    --dark-color: #000000;
    --secondary-color: #ca9043;
    --primary-color: #fbfaf6;
    --extra-color-1: #03172c;
    --extra-color-2: #2f7675;
    --extra-color-3: #ecf3f8;
    --extra-color-4: #ebbd57;
    --header-bg: #f3f3f3;
    --heading-color: #f1f5f9;
    --extra-color-5: #0a295e;
    --extra-color-6: #9ba6b1;
    --extra-color-7: #ddb049;
    --extra-color-8: #ffffff;
    --extra-color-9: #18405f;
    --extra-color-10: #387e7e;
    --extra-color-11: #202c4e;
    --extra-color-12: #30244e;
    --extra-color-13: #153739;
    --extra-color-14: #422429;
    --extra-color-15: #ca9043;
    --extra-color-16: #dc2828;
    --extra-color-17: #878792;
}
.body-color {
    color: var(--body-color);
}
.dark-color {
    color: var(--dark-color);
}
.secondary-color {
    color: var(--secondary-color);
}
.primary-color {
    color: var(--primary-color);
}
.extra-color-1 {
    color: var(--extra-color-1);
}
.extra-color-2 {
    color: var(--extra-color-2);
}
.extra-color-3 {
    color: var(--extra-color-3);
}
.extra-color-4 {
    color: var(--extra-color-4);
}
.nav-color {
    color: var(--nav-color);
}
.extra-color-5 {
    color: var(--extra-color-5);
}
.extra-color-6 {
    color: var(--extra-color-6);
}
.extra-color-7 {
    color: var(--extra-color-7);
}
.extra-color-8 {
    color: var(--extra-color-8);
}
.extra-color-9 {
    color: var(--extra-color-9);
}
.extra-color-10 {
    color: var(--extra-color-10);
}
.extra-color-11 {
    color: var(--extra-color-11);
}
.extra-color-12 {
    color: var(--extra-color-12);
}
.extra-color-13 {
    color: var(--extra-color-13);
}
.extra-color-14 {
    color: var(--extra-color-14);
}
.extra-color-15 {
    color: var(--extra-color-15);
}
.extra-color-16 {
    color: var(--extra-color-16);
}
.extra-color-17 {
    color: var(--extra-color-17);
}
.heading-color {
    color: var(--heading-color);
}
.light-text {
    color: var(--light-text);
}
.header-bg {
    background-color: var(--header-bg);
}
.body-bg {
    background-color: var(--body-color);
}
.dark-bg {
    background-color: var(--dark-color);
}
.secondary-bg {
    background-color: var(--secondary-color);
}
.primary-bg {
    background-color: var(--primary-color);
}
.extra-bg-1 {
    background-color: var(--extra-color-1);
}
.extra-bg-2 {
    background-color: var(--extra-color-2);
}
.extra-bg-3 {
    background-color: var(--extra-color-3);
}

.extra-bg-4 {
    background-color: var(--extra-color-4);
}

.extra-bg-5 {
    background-color: var(--extra-color-5);
}

.extra-bg-6 {
    background-color: var(--extra-color-6);
}
.extra-bg-7 {
    background-color: var(--extra-color-7);
}
.extra-bg-8 {
    background-color: var(--extra-color-8);
}
.extra-bg-9 {
    background-color: var(--extra-color-9);
}
.extra-bg-10 {
    background-color: var(--extra-color-10);
}
.extra-bg-11 {
    background-color: var(--extra-color-11);
}
.extra-bg-12 {
    background-color: var(--extra-color-12);
}
.extra-bg-13 {
    background-color: var(--extra-color-13);
}
.extra-bg-14 {
    background-color: var(--extra-color-14);
}
.extra-bg-15 {
    background-color: var(--extra-color-15);
}