:root {
--pri-50: hsl(29, 77%, 90%);
--pri-100: hsl(29, 82%, 85%);
--pri-200: hsl(29, 87%, 75%);
--pri-300: hsl(29, 92%, 65%);
--pri-400: hsl(29, 97%, 60%);
--pri-500: hsl(29, 97%, 50%);
--pri-600: hsl(29, 100%, 40%);
--pri-700: hsl(29, 100%, 30%);
--pri-800: hsl(29, 100%, 20%);
--pri-900: hsl(29, 100%, 10%);
} .bg-pri-50 { background-color: hsl(29, 77%, 90%) !important; }
.text-pri-50 { color: hsl(29, 77%, 90%) !important; }
.border-pri-50 { border-color: hsl(29, 77%, 90%) !important; }
.bg-pri-100 { background-color: hsl(29, 82%, 85%) !important; }
.text-pri-100 { color: hsl(29, 82%, 85%) !important; }
.border-pri-100 { border-color: hsl(29, 82%, 85%) !important; }
.bg-pri-200 { background-color: hsl(29, 87%, 75%) !important; }
.text-pri-200 { color: hsl(29, 87%, 75%) !important; }
.border-pri-200 { border-color: hsl(29, 87%, 75%) !important; }
.bg-pri-300 { background-color: hsl(29, 92%, 65%) !important; }
.text-pri-300 { color: hsl(29, 92%, 65%) !important; }
.border-pri-300 { border-color: hsl(29, 92%, 65%) !important; }
.bg-pri-400 { background-color: hsl(29, 97%, 60%) !important; }
.text-pri-400 { color: hsl(29, 97%, 60%) !important; }
.border-pri-400 { border-color: hsl(29, 97%, 60%) !important; }
.bg-pri-500 { background-color: hsl(29, 97%, 50%) !important; }
.text-pri-500 { color: hsl(29, 97%, 50%) !important; }
.border-pri-500 { border-color: hsl(29, 97%, 50%) !important; }
.bg-pri-600 { background-color: hsl(29, 100%, 40%) !important; }
.text-pri-600 { color: hsl(29, 100%, 40%) !important; }
.border-pri-600 { border-color: hsl(29, 100%, 40%) !important; }
.bg-pri-700 { background-color: hsl(29, 100%, 30%) !important; }
.text-pri-700 { color: hsl(29, 100%, 30%) !important; }
.border-pri-700 { border-color: hsl(29, 100%, 30%) !important; }
.bg-pri-800 { background-color: hsl(29, 100%, 20%) !important; }
.text-pri-800 { color: hsl(29, 100%, 20%) !important; }
.border-pri-800 { border-color: hsl(29, 100%, 20%) !important; }
.bg-pri-900 { background-color: hsl(29, 100%, 10%) !important; }
.text-pri-900 { color: hsl(29, 100%, 10%) !important; }
.border-pri-900 { border-color: hsl(29, 100%, 10%) !important; } :root {
--acc-50: hsl(221, 10%, 77%);
--acc-100: hsl(221, 15%, 72%);
--acc-200: hsl(221, 20%, 62%);
--acc-300: hsl(221, 25%, 52%);
--acc-400: hsl(221, 13%, 47%);
--acc-500: hsl(221, 13%, 37%);
--acc-600: hsl(221, 18%, 27%);
--acc-700: hsl(221, 23%, 20%);
--acc-800: hsl(221, 28%, 15%);
--acc-900: hsl(221, 33%, 10%);
} .bg-acc-50 { background-color: hsl(221, 10%, 77%) !important; }
.text-acc-50 { color: hsl(221, 10%, 77%) !important; }
.border-acc-50 { border-color: hsl(221, 10%, 77%) !important; }
.bg-acc-100 { background-color: hsl(221, 15%, 72%) !important; }
.text-acc-100 { color: hsl(221, 15%, 72%) !important; }
.border-acc-100 { border-color: hsl(221, 15%, 72%) !important; }
.bg-acc-200 { background-color: hsl(221, 20%, 62%) !important; }
.text-acc-200 { color: hsl(221, 20%, 62%) !important; }
.border-acc-200 { border-color: hsl(221, 20%, 62%) !important; }
.bg-acc-300 { background-color: hsl(221, 25%, 52%) !important; }
.text-acc-300 { color: hsl(221, 25%, 52%) !important; }
.border-acc-300 { border-color: hsl(221, 25%, 52%) !important; }
.bg-acc-400 { background-color: hsl(221, 13%, 47%) !important; }
.text-acc-400 { color: hsl(221, 13%, 47%) !important; }
.border-acc-400 { border-color: hsl(221, 13%, 47%) !important; }
.bg-acc-500 { background-color: hsl(221, 13%, 37%) !important; }
.text-acc-500 { color: hsl(221, 13%, 37%) !important; }
.border-acc-500 { border-color: hsl(221, 13%, 37%) !important; }
.bg-acc-600 { background-color: hsl(221, 18%, 27%) !important; }
.text-acc-600 { color: hsl(221, 18%, 27%) !important; }
.border-acc-600 { border-color: hsl(221, 18%, 27%) !important; }
.bg-acc-700 { background-color: hsl(221, 23%, 20%) !important; }
.text-acc-700 { color: hsl(221, 23%, 20%) !important; }
.border-acc-700 { border-color: hsl(221, 23%, 20%) !important; }
.bg-acc-800 { background-color: hsl(221, 28%, 15%) !important; }
.text-acc-800 { color: hsl(221, 28%, 15%) !important; }
.border-acc-800 { border-color: hsl(221, 28%, 15%) !important; }
.bg-acc-900 { background-color: hsl(221, 33%, 10%) !important; }
.text-acc-900 { color: hsl(221, 33%, 10%) !important; }
.border-acc-900 { border-color: hsl(221, 33%, 10%) !important; } :root {
--ter-50: hsl(220, 10%, 57%);
--ter-100: hsl(220, 15%, 52%);
--ter-200: hsl(220, 20%, 42%);
--ter-300: hsl(220, 25%, 32%);
--ter-400: hsl(220, 14%, 27%);
--ter-500: hsl(220, 14%, 17%);
--ter-600: hsl(220, 19%, 25%);
--ter-700: hsl(220, 24%, 20%);
--ter-800: hsl(220, 29%, 15%);
--ter-900: hsl(220, 34%, 10%);
} .bg-ter-50 { background-color: hsl(220, 10%, 57%) !important; }
.text-ter-50 { color: hsl(220, 10%, 57%) !important; }
.border-ter-50 { border-color: hsl(220, 10%, 57%) !important; }
.bg-ter-100 { background-color: hsl(220, 15%, 52%) !important; }
.text-ter-100 { color: hsl(220, 15%, 52%) !important; }
.border-ter-100 { border-color: hsl(220, 15%, 52%) !important; }
.bg-ter-200 { background-color: hsl(220, 20%, 42%) !important; }
.text-ter-200 { color: hsl(220, 20%, 42%) !important; }
.border-ter-200 { border-color: hsl(220, 20%, 42%) !important; }
.bg-ter-300 { background-color: hsl(220, 25%, 32%) !important; }
.text-ter-300 { color: hsl(220, 25%, 32%) !important; }
.border-ter-300 { border-color: hsl(220, 25%, 32%) !important; }
.bg-ter-400 { background-color: hsl(220, 14%, 27%) !important; }
.text-ter-400 { color: hsl(220, 14%, 27%) !important; }
.border-ter-400 { border-color: hsl(220, 14%, 27%) !important; }
.bg-ter-500 { background-color: hsl(220, 14%, 17%) !important; }
.text-ter-500 { color: hsl(220, 14%, 17%) !important; }
.border-ter-500 { border-color: hsl(220, 14%, 17%) !important; }
.bg-ter-600 { background-color: hsl(220, 19%, 25%) !important; }
.text-ter-600 { color: hsl(220, 19%, 25%) !important; }
.border-ter-600 { border-color: hsl(220, 19%, 25%) !important; }
.bg-ter-700 { background-color: hsl(220, 24%, 20%) !important; }
.text-ter-700 { color: hsl(220, 24%, 20%) !important; }
.border-ter-700 { border-color: hsl(220, 24%, 20%) !important; }
.bg-ter-800 { background-color: hsl(220, 29%, 15%) !important; }
.text-ter-800 { color: hsl(220, 29%, 15%) !important; }
.border-ter-800 { border-color: hsl(220, 29%, 15%) !important; }
.bg-ter-900 { background-color: hsl(220, 34%, 10%) !important; }
.text-ter-900 { color: hsl(220, 34%, 10%) !important; }
.border-ter-900 { border-color: hsl(220, 34%, 10%) !important; }