:root {
  --fps-text-color: hsl(0, 0%, 0%);

  --fps-color-primary-text: hsl(0, 0%, 100%);
  --fps-color-primary: hsl(66, 100%, 40%);
  --fps-color-primary-h: 66;
  --fps-color-primary-s: 100%;
  --fps-color-primary-l: 40%;
  --fps-color-primary-hover-text: hsl(0, 0%, 100%);
  --fps-color-primary-hover: #aabd00;
  --fps-color-primary-disabled-text: hsl(0, 0%, 100%);
  --fps-color-primary-disabled: #6e7a00;

  --fps-border-color: hsl(0, 0%, 90%);

  --fps-input-border-color: hsl(210, 14%, 83%);
  --fps-input-placeholder-color: hsl(0, 0%, 77%);
  --fps-input-disabled-color: hsl(0, 0%, 91%);
  --fps-input-disabled-color-text: hsl(0, 0%, 33%);

  --fps-box-header-background-color: hsl(200, 18%, 26%);
  --fps-box-header-text-color: hsl(0, 0%, 100%);

  --fps-nav-background-color: hsl(200, 19%, 18%);
  --fps-nav-background-color-hover: #192124;
  --fps-nav-text-color: hsl(0, 0%, 100%);
  --fps-nav-bar-background-color: hsl(200, 18%, 26%);
  --fps-nav-bar-background-color-hover: #2a363c;
  --fps-nav-bar-text-color: hsl(0, 0%, 100%);

  --fps-sub-nav-bar-background-color: hsl(66, 100%, 40%);
  --fps-sub-nav-bar-background-color-hover: #9cad00;
  --fps-sub-nav-bar-text-color: hsl(0, 0%, 100%);

  /* Colors */

  --fps-color-white-text: hsl(0, 0%, 0%);
  --fps-color-white: hsl(0, 0%, 100%);
  --fps-color-white-h: 0;
  --fps-color-white-s: 0%;
  --fps-color-white-l: 100%;
  --fps-color-white-hover-text: hsl(0, 0%, 100%);
  --fps-color-white-hover: hsl(0, 0%, 90%);
  --fps-color-white-disabled-text: hsl(0, 0%, 100%);
  --fps-color-white-disabled: hsl(0, 0%, 80%);

  --fps-color-black-text: hsl(0, 0%, 100%);
  --fps-color-black: hsl(0, 0%, 10%);
  --fps-color-black-h: 0;
  --fps-color-black-s: 0%;
  --fps-color-black-l: 0%;
  --fps-color-black-hover-text: hsl(0, 0%, 100%);
  --fps-color-black-hover: hsl(0, 0%, 5%);
  --fps-color-black-disabled-text: hsl(0, 0%, 100%);
  --fps-color-black-disabled: hsl(0, 0%, 0%);

  --fps-color-red-text: hsl(0, 0%, 100%);
  --fps-color-red: hsl(6, 78%, 57%);
  --fps-color-red-h: 6;
  --fps-color-red-s: 78%;
  --fps-color-red-l: 57%;
  --fps-color-red-hover-text: hsl(0, 0%, 100%);
  --fps-color-red-hover: hsl(6, 78%, 50%);
  --fps-color-red-disabled-text: hsl(0, 0%, 100%);
  --fps-color-red-disabled: hsl(6, 78%, 37%);

  --fps-color-green-text: hsl(0, 0%, 100%);
  --fps-color-green: hsl(145, 63%, 49%);
  --fps-color-green-h: 145;
  --fps-color-green-s: 63%;
  --fps-color-green-l: 49%;
  --fps-color-green-hover-text: hsl(0, 0%, 100%);
  --fps-color-green-hover: hsl(145, 63%, 42%);
  --fps-color-green-disabled-text: hsl(0, 0%, 100%);
  --fps-color-green-disabled: hsl(145, 63%, 29%);

  --fps-color-dark-green-text: hsl(0, 0%, 100%);
  --fps-color-dark-green: hsl(145, 63%, 42%);
  --fps-color-dark-green-h: 145;
  --fps-color-dark-green-s: 53%;
  --fps-color-dark-green-l: 42%;
  --fps-color-dark-green-hover-text: hsl(0, 0%, 100%);
  --fps-color-dark-green-hover: hsl(145, 63%, 35%);
  --fps-color-dark-green-disabled-text: hsl(0, 0%, 100%);
  --fps-color-dark-green-disabled: hsl(145, 63%, 31%);

  --fps-color-blue-text: hsl(0, 0%, 100%);
  --fps-color-blue: hsl(204, 70%, 53%);
  --fps-color-blue-h: 204;
  --fps-color-blue-s: 70%;
  --fps-color-blue-l: 53%;
  --fps-color-blue-hover-text: hsl(0, 0%, 100%);
  --fps-color-blue-hover: hsl(204, 70%, 46%);
  --fps-color-blue-disabled-text: hsl(0, 0%, 100%);
  --fps-color-blue-disabled: hsl(204, 70%, 33%);

  --fps-color-dark-blue-text: hsl(0, 0%, 100%);
  --fps-color-dark-blue: hsl(204, 61%, 45%);
  --fps-color-dark-blue-h: 204;
  --fps-color-dark-blue-s: 70%;
  --fps-color-dark-blue-l: 53%;
  --fps-color-dark-blue-hover-text: hsl(0, 0%, 100%);
  --fps-color-dark-blue-hover: hsl(204, 69%, 39%);
  --fps-color-dark-blue-disabled-text: hsl(0, 0%, 100%);
  --fps-color-dark-blue-disabled: hsl(203, 70%, 27%);

  --fps-color-orange-text: hsl(0, 0%, 100%);
  --fps-color-orange: hsl(37, 90%, 51%);
  --fps-color-orange-h: 37;
  --fps-color-orange-s: 90%;
  --fps-color-orange-l: 51%;
  --fps-color-orange-hover-text: hsl(0, 0%, 100%);
  --fps-color-orange-hover: hsl(37, 90%, 44%);
  --fps-color-orange-disabled-text: hsl(0, 0%, 100%);
  --fps-color-orange-disabled: hsl(37, 90%, 40%);

  --fps-color-light-purple-text: hsl(0, 0%, 100%);
  --fps-color-light-purple: hsl(283, 53%, 60%);
  --fps-color-light-purple-h: 283;
  --fps-color-light-purple-s: 39%;
  --fps-color-light-purple-l: 53%;
  --fps-color-light-purple-hover-text: hsl(0, 0%, 100%);
  --fps-color-light-purple-hover: hsl(283, 47%, 55%);
  --fps-color-light-purple-disabled-text: hsl(0, 0%, 100%);
  --fps-color-light-purple-disabled: hsl(284, 42%, 52%);

  --fps-color-purple-text: hsl(0, 0%, 100%);
  --fps-color-purple: hsl(283, 39%, 53%);
  --fps-color-purple-h: 283;
  --fps-color-purple-s: 39%;
  --fps-color-purple-l: 53%;
  --fps-color-purple-hover-text: hsl(0, 0%, 100%);
  --fps-color-purple-hover: hsl(283, 39%, 46%);
  --fps-color-purple-disabled-text: hsl(0, 0%, 100%);
  --fps-color-purple-disabled: hsl(283, 39%, 42%);

  --fps-color-dark-purple-text: hsl(0, 0%, 100%);
  --fps-color-dark-purple: hsl(284, 37%, 43%);
  --fps-color-dark-purple-h: 283;
  --fps-color-dark-purple-s: 39%;
  --fps-color-dark-purple-l: 53%;
  --fps-color-dark-purple-hover-text: hsl(0, 0%, 100%);
  --fps-color-dark-purple-hover: hsl(284, 40%, 38%);
  --fps-color-dark-purple-disabled-text: hsl(0, 0%, 100%);
  --fps-color-dark-purple-disabled: hsl(284, 41%, 35%);

  --fps-color-yellow-text: hsl(0, 0%, 100%);
  --fps-color-yellow: hsl(48, 89%, 50%);
  --fps-color-yellow-h: 48;
  --fps-color-yellow-s: 89%;
  --fps-color-yellow-l: 50%;
  --fps-color-yellow-hover-text: hsl(0, 0%, 100%);
  --fps-color-yellow-hover: hsl(48, 89%, 46%);
  --fps-color-yellow-disabled-text: hsl(0, 0%, 100%);
  --fps-color-yellow-disabled: hsl(48, 89%, 42%);

  --fps-color-grey-text: hsl(0, 0%, 100%);
  --fps-color-grey: hsl(199, 18%, 40%);
  --fps-color-grey-h: 199;
  --fps-color-grey-s: 18%;
  --fps-color-grey-l: 40%;
  --fps-color-grey-hover-text: hsl(0, 0%, 100%);
  --fps-color-grey-hover: hsl(199, 18%, 33%);
  --fps-color-grey-disabled-text: hsl(0, 0%, 100%);
  --fps-color-grey-disabled: hsl(199, 18%, 29%);

  --fps-color-dark-grey-text: hsl(0, 0%, 100%);
  --fps-color-dark-grey: hsl(200, 18%, 26%);
  --fps-color-dark-grey-h: 200;
  --fps-color-dark-grey-s: 18%;
  --fps-color-dark-grey-l: 26%;
  --fps-color-dark-grey-hover-text: hsl(0, 0%, 100%);
  --fps-color-dark-grey-hover: hsl(200, 18%, 20%);
  --fps-color-dark-grey-disabled-text: hsl(0, 0%, 100%);
  --fps-color-dark-grey-disabled: hsl(200, 18%, 16%);

  --fps-color-light-grey-text: hsl(0, 0%, 100%);
  --fps-color-light-grey: hsl(220, 2%, 75%);
  --fps-color-light-grey-h: 220;
  --fps-color-light-grey-s: 2%;
  --fps-color-light-grey-l: 75%;
  --fps-color-light-grey-hover-text: hsl(0, 0%, 100%);
  --fps-color-light-grey-hover: hsl(220, 2%, 65%);
  --fps-color-light-grey-disabled-text: hsl(0, 0%, 100%);
  --fps-color-light-grey-disabled: hsl(220, 2%, 50%);

  --fps-color-pink-text: hsl(0, 0%, 100%);
  --fps-color-pink: hsl(340, 82%, 52%);
  --fps-color-pink-h: 340;
  --fps-color-pink-s: 82%;
  --fps-color-pink-l: 52%;
  --fps-color-pink-hover-text: hsl(0, 0%, 100%);
  --fps-color-pink-hover: hsl(340, 82%, 45%);
  --fps-color-pink-disabled-text: hsl(0, 0%, 100%);
  --fps-color-pink-disabled: hsl(340, 82%, 41%);
}
