:root {
    --color-teal-default: #008290;
    --color-teal-50: #f2f9f9;
    --color-teal-100: #e6f3f4;
    --color-teal-200: #bfe0e3;
    --color-teal-300: #99cdd3;
    --color-teal-400: #4da8b1;
    --color-teal-500: #008290;
    --color-teal-600: #007582;
    --color-teal-700: #00626c;
    --color-teal-800: white;
    --color-teal-900: #008290;
    --color-white-default: #fff;
    --color-white-500: #fff;
    --color-black-default: black;
    --color-gray-100: transparent;
    --color-gray-300: rgb(212, 212, 212);
    --color-gray-400: rgb(163, 163, 163);
    --color-gray-500: rgb(115, 115, 115);
    --color-gray-600: rgb(82, 82, 82);
    --color-gray-700: rgb(64, 64, 64);
    --color-gray-800: #f2f9f9;
    --tick-background-image: url('../images/tick-teal.png');
}


body.light.sporting-index {
    --color-teal-default: rgb(0, 74, 135);
    --color-teal-50: #6da5b8;
    --color-teal-100: #8acfe5;
    --color-teal-200: #def1f8;
    --color-teal-300: #afdcef;
    --color-teal-400: #56b6dc;
    --color-teal-500: rgb(0, 74, 135);
    --color-teal-600: white;
    --color-teal-700: #404040;
    --color-teal-800: rgb(0, 74, 135);
    --color-teal-900: white;
    --color-white-default: #1f324a;
    --color-white-500: white;
    --color-black-default: black;
    --color-gray-100: rgb(102, 102, 102);
    --color-gray-300: transparent;
    --color-gray-400: rgb(163, 163, 163);
    --color-gray-500: rgb(102, 102, 102);
    --color-gray-600: white;
    --color-gray-700: white;
    --color-gray-800: white;
    --tick-background-image: url('../images/tick-gray.png');
}