$color-black: #000;
$color-black-opacity-88: rgba(0, 0, 0, .88);
$color-black-opacity-64: rgba(0, 0, 0, .64);
$color-black-opacity-40: rgba(0, 0, 0, .4);
$color-black-opacity-20: rgba(0, 0, 0, .2);

$color-white: #fff;
$color-white-opacity-88: rgba(255, 255, 255, .88);
$color-white-opacity-64: rgba(255, 255, 255, .64);
$color-white-opacity-40: rgba(255, 255, 255, .4);

$color-coral: #f55;
$color-coral-64: #ff8383;
$color-coral-40: #fbb;
$color-coral-11: #fee;
$color-coral-6: #fff6f6;

$color-grey: #1f1f1f;
$color-grey-64: #5c5c5c;
$color-grey-40: #999;
$color-grey-11: #e5e5e5;
$color-grey-6: #f2f2f2;

$color-yellow: #fc5;
$color-yellow-64: #ffda83;
$color-yellow-40: #ffe8b1;
$color-yellow-11: #fff9ee;
$color-yellow-6: #fffcf6;

$color-green-11: #e7f3ec;
$color-green-6: #f3f9f5;

$color-lime: #4c4;
$color-lime-64: #77da77;
$color-lime-40: #a9e8a9;
$color-lime-11: #ecf9ec;
$color-lime-6: #f5fcf5;

/* colors below are deprecated */
$color-green: #184;
$color-green-64: #51a877;
$color-green-40: #92c9a9;

$color-red: #e52130;
$color-red-64: #ec5d68;
$color-red-40: #f399a0;
$color-red-11: #fce8ea;
$color-red-6: #fdf4f4;

/* colors below are deprecated */
$color-sale: var(--color-red);
$color-red: #93221c;
$color-primary: $color-coral;
$color-primary-hover: #f66;
$color-primary-shadow: #c33;

$color-secondary: #567;
$color-secondary-hover: #9ab;

$color-special-divider: #bcd;

$color-text-main: #124;
$color-text-hover: #556;
$color-text-shadow: #113;
$color-text-invert: $color-white;

$color-utility-failure: $color-primary;
$color-utility-failure-light: #fdd;
$color-utility-help: $color-special-divider;
$color-utility-help-light: #f0f4f7;
$color-utility-warning: $color-yellow;
$color-utility-warning-light: #fec;
$color-utility-success: $color-lime;
$color-utility-success-light: #dfd;

$color-default-page-bg: #f8f8f8;
$color-light-bg: $color-white;
$color-translucent-bg: rgba($color-text-main, .6);