/* ====== RED ====== */
.fg-red       { color: #e51400 !important; }
.fg-red-light { color: #f86954 !important; }
.fg-red-dark  { color: #a40000 !important; }

.bg-red       { background-color: #e51400 !important; color: #fff !important; }
.bg-red-light { background-color: #f86954 !important; color: #fff !important; }
.bg-red-dark  { background-color: #a40000 !important; color: #fff !important; }

/* ====== GREEN ====== */
.fg-green       { color: #60a917 !important; }
.fg-green-light { color: #9be04a !important; }
.fg-green-dark  { color: #3b6b0f !important; }

.bg-green       { background-color: #60a917 !important; color: #fff !important; }
.bg-green-light { background-color: #9be04a !important; color: #000 !important; }
.bg-green-dark  { background-color: #3b6b0f !important; color: #fff !important; }

/* ====== BLUE ====== */
.fg-blue       { color: #1ba1e2 !important; }
.fg-blue-light { color: #66cfff !important; }
.fg-blue-dark  { color: #0067a3 !important; }

.bg-blue       { background-color: #1ba1e2 !important; color: #fff !important; }
.bg-blue-light { background-color: #66cfff !important; color: #000 !important; }
.bg-blue-dark  { background-color: #0067a3 !important; color: #fff !important; }

/* ====== YELLOW ====== */
.fg-yellow       { color: #f0a30a !important; }
.fg-yellow-light { color: #ffd65c !important; }
.fg-yellow-dark  { color: #c07d00 !important; }

.bg-yellow       { background-color: #f0a30a !important; color: #000 !important; }
.bg-yellow-light { background-color: #ffd65c !important; color: #000 !important; }
.bg-yellow-dark  { background-color: #c07d00 !important; color: #fff !important; }

/* ====== ORANGE ====== */
.fg-orange       { color: #fa6800 !important; }
.fg-orange-light { color: #ff9a52 !important; }
.fg-orange-dark  { color: #b44c00 !important; }

.bg-orange       { background-color: #fa6800 !important; color: #fff !important; }
.bg-orange-light { background-color: #ff9a52 !important; color: #000 !important; }
.bg-orange-dark  { background-color: #b44c00 !important; color: #fff !important; }

/* ====== PINK ====== */
.fg-pink       { color: #e671b8 !important; }
.fg-pink-light { color: #f7a8d5 !important; }
.fg-pink-dark  { color: #a84c84 !important; }

.bg-pink       { background-color: #e671b8 !important; color: #fff !important; }
.bg-pink-light { background-color: #f7a8d5 !important; color: #000 !important; }
.bg-pink-dark  { background-color: #a84c84 !important; color: #fff !important; }

/* ====== PURPLE ====== */
.fg-purple       { color: #7e3878 !important; }
.fg-purple-light { color: #b574b1 !important; }
.fg-purple-dark  { color: #4e224a !important; }

.bg-purple       { background-color: #7e3878 !important; color: #fff !important; }
.bg-purple-light { background-color: #b574b1 !important; color: #000 !important; }
.bg-purple-dark  { background-color: #4e224a !important; color: #fff !important; }

/* ====== BROWN ====== */
.fg-brown       { color: #a0522d !important; }
.fg-brown-light { color: #d8906e !important; }
.fg-brown-dark  { color: #6b2f16 !important; }

.bg-brown       { background-color: #a0522d !important; color: #fff !important; }
.bg-brown-light { background-color: #d8906e !important; color: #000 !important; }
.bg-brown-dark  { background-color: #6b2f16 !important; color: #fff !important; }

/* ====== LIME ====== */
.fg-lime       { color: #a4c400 !important; }
.fg-lime-light { color: #d4f057 !important; }
.fg-lime-dark  { color: #6e8700 !important; }

.bg-lime       { background-color: #a4c400 !important; color: #000 !important; }
.bg-lime-light { background-color: #d4f057 !important; color: #000 !important; }
.bg-lime-dark  { background-color: #6e8700 !important; color: #fff !important; }

/* ====== TEAL ====== */
.fg-teal       { color: #00aba9 !important; }
.fg-teal-light { color: #4fd5d3 !important; }
.fg-teal-dark  { color: #007574 !important; }

.bg-teal       { background-color: #00aba9 !important; color: #fff !important; }
.bg-teal-light { background-color: #4fd5d3 !important; color: #000 !important; }
.bg-teal-dark  { background-color: #007574 !important; color: #fff !important; }

/* ====== CYAN ====== */
.fg-cyan       { color: #00bcd4 !important; }
.fg-cyan-light { color: #62efff !important; }
.fg-cyan-dark  { color: #008fa1 !important; }

.bg-cyan       { background-color: #00bcd4 !important; color: #fff !important; }
.bg-cyan-light { background-color: #62efff !important; color: #000 !important; }
.bg-cyan-dark  { background-color: #008fa1 !important; color: #fff !important; }

/* ====== INDIGO ====== */
.fg-indigo       { color: #3f51b5 !important; }
.fg-indigo-light { color: #7986cb !important; }
.fg-indigo-dark  { color: #2c387e !important; }

.bg-indigo       { background-color: #3f51b5 !important; color: #fff !important; }
.bg-indigo-light { background-color: #7986cb !important; color: #fff !important; }
.bg-indigo-dark  { background-color: #2c387e !important; color: #fff !important; }

/* ====== GRAY ====== */
.fg-gray       { color: #555555 !important; }
.fg-gray-light { color: #aaaaaa !important; }
.fg-gray-dark  { color: #333333 !important; }

.bg-gray       { background-color: #555555 !important; color: #fff !important; }
.bg-gray-light { background-color: #aaaaaa !important; color: #000 !important; }
.bg-gray-dark  { background-color: #333333 !important; color: #fff !important; }

/* ====== WHITE & BLACK ====== */
.fg-white { color: #ffffff !important; }
.fg-black { color: #000000 !important; }

.bg-white { background-color: #ffffff !important; color: #000 !important; }
.bg-black { background-color: #000000 !important; color: #fff !important; }