/*
COLORS according to serafin's style guide pallette
"fill" added to each one so that it works properly with SVG...
*/
.link-color {
  color: #086274;
  fill: #086274;
}
.link-color-bg {
  background-color: #086274;
  fill: #086274;
}
/* GRAYS (N1 - N4) from lightest to darkest */
.neutral-lightest {
  color: whitesmoke;
  fill: whitesmoke;
}
.neutral-lighter {
  color: #ebebeb;
  fill: #ebebeb;
}
.neutral-light {
  color: #e4e4e4;
  fill: #e4e4e4;
}
.neutral {
  color: #d2d2d2;
  fill: #d2d2d2;
}
.neutral-dark {
  color: #808080;
  fill: #808080;
}
.neutral-darker {
  color: #4d4d4d;
  fill: #4d4d4d;
}
.neutral-disabled {
  color: #d2d2d2;
  fill: #d2d2d2;
}
.neutral-lightest-bg {
  background-color: whitesmoke;
  fill: whitesmoke;
}
.neutral-lighter-bg {
  background-color: #ebebeb;
  fill: #ebebeb;
}
.neutral-light-bg {
  background-color: #e4e4e4;
  fill: #e4e4e4;
}
.neutral-bg {
  background-color: #d2d2d2;
  fill: #d2d2d2;
}
.neutral-dark-bg {
  background-color: #808080;
  fill: #808080;
}
.neutral-darker-bg {
  background-color: #4d4d4d;
  fill: #4d4d4d;
}
.neutral-lightest-border {
  border-color: whitesmoke;
}
.neutral-lighter-border {
  border-color: #ebebeb;
}
.neutral-light-border {
  border-color: #e4e4e4;
}
.neutral-border {
  border-color: #d2d2d2;
}
.neutral-dark-border {
  border-color: #808080;
}
.neutral-darker-border {
  border-color: #4d4d4d;
}
/* BLUES (B1 - B4) - from lightest to darkest */
.primary-lightest {
  color: #e1e7ed;
  fill: #e1e7ed;
}
.primary-light {
  color: #89e3f9;
  fill: #89e3f9;
}
.primary {
  color: #3ebede;
  fill: #3ebede;
}
.primary-dark {
  color: #1e92af;
  fill: #1e92af;
}
.primary-darker {
  color: #0e5061;
  fill: #0e5061;
}
.primary-lightest-bg {
  background-color: #e1e7ed;
  fill: #e1e7ed;
}
.primary-light-bg {
  background-color: #89e3f9;
  fill: #89e3f9;
}
.primary-bg {
  background-color: #3ebede;
  fill: #3ebede;
}
.primary-dark-bg {
  background-color: #1e92af;
  fill: #1e92af;
}
.primary-darker-bg {
  background-color: #0e5061;
  fill: #0e5061;
}
.primary-spin-1-bg {
  background-color: #3ea3de;
  fill: #3ea3de;
}
.primary-spin-2-bg {
  background-color: #3e89de;
  fill: #3e89de;
}
.primary-spin-3-bg {
  background-color: #3e6ede;
  fill: #3e6ede;
}
.primary-spin-4-bg {
  background-color: #3e53de;
  fill: #3e53de;
}
.primary-light-border {
  border-color: #89e3f9;
}
.primary-border {
  border-color: #3ebede;
}
.primary-dark-border {
  border-color: #1e92af;
}
.primary-darker-border {
  border-color: #0e5061;
}
/* GREENS (G1 - G4) - from lightest to darkest */
.accent-1-lightest {
  color: #dae7dd;
  fill: #dae7dd;
}
.accent-1-light,
.accent-1-1 {
  color: #8cf88c;
  fill: #8cf88c;
}
.accent-1,
.accent-1-2 {
  color: #51dc51;
  fill: #51dc51;
}
.accent-1-dark,
.accent-1-3 {
  color: #22b322;
  fill: #22b322;
}
.accent-1-darker,
.accent-1-4 {
  color: #188018;
  fill: #188018;
}
.accent-1-lightest-bg {
  background-color: #dae7dd;
  fill: #dae7dd;
}
.accent-1-light-bg {
  background-color: #8cf88c;
  fill: #8cf88c;
}
.accent-1-bg {
  background-color: #51dc51;
  fill: #51dc51;
}
.accent-1-dark-bg {
  background-color: #22b322;
  fill: #22b322;
}
.accent-1-darker-bg {
  background-color: #188018;
  fill: #188018;
}
.accent-1-spin-1-bg {
  background-color: #51dc68;
  fill: #51dc68;
}
.accent-1-spin-2-bg {
  background-color: #51dc7f;
  fill: #51dc7f;
}
.accent-1-spin-3-bg {
  background-color: #51dc97;
  fill: #51dc97;
}
.accent-1-spin-4-bg {
  background-color: #51dcae;
  fill: #51dcae;
}
.accent-1-light-border {
  border-color: #8cf88c;
}
.accent-1-border {
  border-color: #51dc51;
}
.accent-1-dark-border {
  border-color: #22b322;
}
.accent-1-darker-border {
  border-color: #188018;
}
/* ORANGES (O1 - O4) - from lightest to darkest */
.accent-2-light,
.accent-2-1 {
  color: #fcac6b;
  fill: #fcac6b;
}
.accent-2,
.accent-2-2 {
  color: #f47b19;
  fill: #f47b19;
}
.accent-2-dark,
.accent-2-3 {
  color: #d14019;
  fill: #d14019;
}
.accent-2-darker,
.accent-2-4 {
  color: #9e3113;
  fill: #9e3113;
}
.accent-2-light-bg {
  background-color: #fcac6b;
  fill: #fcac6b;
}
.accent-2-bg {
  background-color: #f47b19;
  fill: #f47b19;
}
.accent-2-dark-bg {
  background-color: #d14019;
  fill: #d14019;
}
.accent-2-darker-bg {
  background-color: #9e3113;
  fill: #9e3113;
}
.accent-2-spin-1-bg {
  background-color: #f4a019;
  fill: #f4a019;
}
.accent-2-spin-2-bg {
  background-color: #f4c419;
  fill: #f4c419;
}
.accent-2-spin-3-bg {
  background-color: #f4e919;
  fill: #f4e919;
}
.accent-2-spin-4-bg {
  background-color: #dbf419;
  fill: #dbf419;
}
.accent-2-light-border {
  border-color: #fcac6b;
}
.accent-2-border {
  border-color: #f47b19;
}
.accent-2-dark-border {
  border-color: #d14019;
}
.accent-2-darker-border {
  border-color: #9e3113;
}
/* MAGENTAS (M1 - M4) - from lightest to darkest */
.accent-3-light,
.accent-3-1 {
  color: #fc5091;
  fill: #fc5091;
}
.accent-3,
.accent-3-2 {
  color: #c80850;
  fill: #c80850;
}
.accent-3-dark,
.accent-3-3 {
  color: #a40541;
  fill: #a40541;
}
.accent-3-darker,
.accent-3-4 {
  color: #70032d;
  fill: #70032d;
}
.accent-3-light-bg {
  background-color: #fc5091;
  fill: #fc5091;
}
.accent-3-bg {
  background-color: #c80850;
  fill: #c80850;
}
.accent-3-dark-bg {
  background-color: #a40541;
  fill: #a40541;
}
.accent-3-darker-bg {
  background-color: #70032d;
  fill: #70032d;
}
.accent-3-spin-1-bg {
  background-color: #c80830;
  fill: #c80830;
}
.accent-3-spin-2-bg {
  background-color: #c80810;
  fill: #c80810;
}
.accent-3-spin-3-bg {
  background-color: #c82008;
  fill: #c82008;
}
.accent-3-spin-4-bg {
  background-color: #c84008;
  fill: #c84008;
}
.accent-3-light-border {
  border-color: #fc5091;
}
.accent-3-border {
  border-color: #c80850;
}
.accent-3-dark-border {
  border-color: #a40541;
}
.accent-3-darker-border {
  border-color: #70032d;
}
/* PURPLES (P1 - P4) - from lightest to darkest */
.accent-4-light,
.accent-4-1 {
  color: #e477ff;
  fill: #e477ff;
}
.accent-4,
.accent-4-2 {
  color: #cc00ff;
  fill: #cc00ff;
}
.accent-4-dark,
.accent-4-3 {
  color: #8100a1;
  fill: #8100a1;
}
.accent-4-darker,
.accent-4-4 {
  color: #530067;
  fill: #530067;
}
.accent-4-light-bg {
  background-color: #e477ff;
  fill: #e477ff;
}
.accent-4-bg {
  background-color: #cc00ff;
  fill: #cc00ff;
}
.accent-4-dark-bg {
  background-color: #8100a1;
  fill: #8100a1;
}
.accent-4-darker-bg {
  background-color: #530067;
  fill: #530067;
}
.accent-4-spin-1-bg {
  background-color: #f600ff;
  fill: #f600ff;
}
.accent-4-spin-2-bg {
  background-color: #ff00dd;
  fill: #ff00dd;
}
.accent-4-spin-3-bg {
  background-color: #ff00b2;
  fill: #ff00b2;
}
.accent-4-spin-4-bg {
  background-color: #ff0088;
  fill: #ff0088;
}
.accent-4-light-border {
  border-color: #e477ff;
}
.accent-4-border {
  border-color: #cc00ff;
}
.accent-4-dark-border {
  border-color: #8100a1;
}
.accent-4-darker-border {
  border-color: #530067;
}
/* YELLOWS (Y1 - Y2) - from lightest to darkest */
.accent-5-lightest {
  color: #f3ede0;
  fill: #f3ede0;
}
.accent-5,
.accent-5-1 {
  color: #f9f08f;
  fill: #f9f08f;
}
.accent-5-dark,
.accent-5-2 {
  color: #ffb400;
  fill: #ffb400;
}
.accent-5-darkest,
.accent-5-3 {
  color: #8c7631;
  fill: #8c7631;
}
.accent-5-lightest-bg {
  background-color: #f3ede0;
  fill: #f3ede0;
}
.accent-5-bg {
  background-color: #f9f08f;
  fill: #f9f08f;
}
.accent-5-dark-bg {
  background-color: #ffb400;
  fill: #ffb400;
}
.accent-5-darkest-bg {
  background-color: #8c7631;
  fill: #8c7631;
}
.accent-5-border {
  border-color: #f9f08f;
}
.accent-5-dark-border {
  border-color: #ffb400;
}
.accent-5-darkest-border {
  border-color: #8c7631;
}
/* REDS - ADP RED and BADGE COLOR RED */
.accent-6-lightest {
  color: #f1e1e7;
  fill: #f1e1e7;
}
.accent-6-light,
.accent-6-1 {
  color: #f2b7b7;
  fill: #f2b7b7;
}
.accent-6,
.accent-6-2 {
  color: #d40f0f;
  fill: #d40f0f;
}
.accent-6-dark,
.accent-6-3 {
  color: #940a0a;
  fill: #940a0a;
}
.accent-6-lightest-bg {
  background-color: #f1e1e7;
  fill: #f1e1e7;
}
.accent-6-light-bg {
  background-color: #f2b7b7;
  fill: #f2b7b7;
}
.accent-6-bg {
  background-color: #d40f0f;
  fill: #d40f0f;
}
.accent-6-dark-bg {
  background-color: #940a0a;
  fill: #940a0a;
}
.accent-6-spin-1-bg {
  background-color: #d4300f;
  fill: #d4300f;
}
.accent-6-spin-2-bg {
  background-color: #d4510f;
  fill: #d4510f;
}
.accent-6-spin-3-bg {
  background-color: #d4720f;
  fill: #d4720f;
}
.accent-6-light-border {
  border-color: #f2b7b7;
}
.accent-6-border {
  border-color: #d40f0f;
}
.accent-6-dark-border {
  border-color: #940a0a;
}
/* AQUA (A1 - A4) - from lightest to darkest */
.accent-7-light,
.accent-7-1 {
  color: #7fe9ce;
  fill: #7fe9ce;
}
.accent-7,
.accent-7-2 {
  color: #2adbad;
  fill: #2adbad;
}
.accent-7-dark,
.accent-7-3 {
  color: #20a482;
  fill: #20a482;
}
.accent-7-darker,
.accent-7-4 {
  color: #156e57;
  fill: #156e57;
}
.accent-7-5 {
  color: #2adbcb;
  fill: #2adbcb;
}
.accent-7-6 {
  color: #2acedb;
  fill: #2acedb;
}
.accent-7-7 {
  color: #2ab0db;
  fill: #2ab0db;
}
.accent-7-8 {
  color: #2a93db;
  fill: #2a93db;
}
.accent-7-light-bg {
  background-color: #7fe9ce;
  fill: #7fe9ce;
}
.accent-7-bg {
  background-color: #2adbad;
  fill: #2adbad;
}
.accent-7-dark-bg {
  background-color: #20a482;
  fill: #20a482;
}
.accent-7-darker-bg {
  background-color: #156e57;
  fill: #156e57;
}
.accent-7-spin-1-bg {
  background-color: #2adbcb;
  fill: #2adbcb;
}
.accent-7-spin-2-bg {
  background-color: #2acedb;
  fill: #2acedb;
}
.accent-7-spin-3-bg {
  background-color: #2ab0db;
  fill: #2ab0db;
}
.accent-7-spin-4-bg {
  background-color: #2a93db;
  fill: #2a93db;
}
.accent-7-light-border {
  border-color: #7fe9ce;
}
.accent-7-border {
  border-color: #2adbad;
}
.accent-7-dark-border {
  border-color: #20a482;
}
.accent-7-darker-border {
  border-color: #156e57;
}
.white {
  color: #ffffff;
  fill: #ffffff;
}
.white-bg {
  background-color: #ffffff;
  fill: #ffffff;
}
.black {
  color: #000000;
  fill: #000000;
}
.black-bg {
  background-color: #000000;
  fill: #000000;
}
