$black: #000 !default;
$gray: #D3D3D3 !default;
$light-gray: #ECECEC !default;
$white: #FFF !default;
$red: #E23838 !default;
$orange: #F78200 !default;
$yellow: #FFB900 !default;
$green: #5EBD3E !default;
$blue: #009CDF !default;
$indigo: #31457D !default;
$violet: #973999 !default;
$teal: #2D9FA2 !default;

$heading-color: #333 !default;
$copy-color: #333 !default;
$primary-color: $red !default;
$secondary-color: $yellow !default;
$tertiary-color: $blue !default;
$success-color: #2FAC58 !default;
$info-color: #25327C !default;
$danger-color: #E83D48 !default;
$warning-color: #EAC435 !default;

.black { color: $black !important; }
.gray { color: $gray !important; }
.light-gray { color: $light-gray !important; }
.grey { color: $gray !important; }
.light-grey { color: $light-gray !important; }
.white { color: $white !important; }
.red { color: $red !important; }
.orange { color: $orange !important; }
.yellow { color: $yellow !important; }
.green { color: $green !important; }
.blue { color: $blue !important; }
.indigo { color: $indigo !important; }
.violet { color: $violet !important; }
.teal { color: $teal !important; }
.copy-color { color: $copy-color !important; }
.primary { color: $primary-color !important; }
.secondary { color: $secondary-color !important; }
.tertiary { color: $tertiary-color !important; }
.primary-color { color: $primary-color !important; }
.secondary-color { color: $secondary-color !important; }
.tertiary-color { color: $tertiary-color !important; }
.success { color: $success-color !important; }
.info { color: $info-color !important; }
.danger { color: $danger-color !important; }
.warning { color: $warning-color !important; }

.black-bg { background-color: $black !important; }
.gray-bg { background-color: $gray !important; }
.light-gray-bg { background-color: $light-gray !important; }
.grey-bg { background-color: $gray !important; }
.light-grey-bg { background-color: $light-gray !important; }
.white-bg { background-color: $white !important; }
.red-bg { background-color: $red !important; }
.orange-bg { background-color: $orange !important; }
.yellow-bg { background-color: $yellow !important; }
.green-bg { background-color: $green !important; }
.blue-bg { background-color: $blue !important; }
.indigo-bg { background-color: $indigo !important; }
.violet-bg { background-color: $violet !important; }
.teal-bg { background-color: $teal !important; }
.primary-bg { background-color: $primary-color !important; }
.secondary-bg { background-color: $secondary-color !important; }
.tertiary-bg { background-color: $tertiary-color !important; }
.primary-color-bg { background-color: $primary-color !important; }
.secondary-color-bg { background-color: $secondary-color !important; }
.tertiary-color-bg { background-color: $tertiary-color !important; }
.success-bg { background-color: $success-color !important; }
.info-bg { background-color: $info-color !important; }
.danger-bg { background-color: $danger-color !important; }
.warning-bg { background-color: $warning-color !important; }