body {
  /** Variables principales (By Guillaume) --------------------------------------- */

  --skin-background-header: hsl(200, 3%, 18%);
  --skin-background-primary: #EEEEEE;
  --skin-background-secondary: var(--skin-background-header);
  --skin-background-tertiary: #FFFFFF;
  --skin-background-quaternary: #1c213d;
  --skin-color-primary: #2c2e2f;
  --skin-color-primary-2: #F5F5F5;
  --skin-color-primary-3: #555;
  --skin-color-secondary: #979898;
  /*#737373*/
  --skin-color-tertiary: var(--skin-color-primary);
  --skin-color-quaternary: #373e4a;
  --skin-color-important-primary: #0088cc;
  --skin-color-important-primary-dark: #016597;
  --skin-color-important-secondary: #6c0;
  --skin-border-primary: var(--panel-background);
  --skin-border-secondary: #eee;
  --skin-border-tertiary: #1c213d;
  --skin-border-transparent: transparent;
  --skin-form-gradient-border: #1d2127;
  --skin-form-background: #050819;
  --skin-disabled: #26223a;
  --primary-color: #000;
  --border-compte: #e4e4e4;

  --skin-solar-color: #FDE70C;
  --skin-battery-color: #68b828;
  --skin-battery-charge-color: #95C969;
  --skin-grid-color: #598DFF;
  --skin-grid-color-chart: #0051FF; /* dxChart transforms in #598DFF */
  --skin-feedin-color: #40bbea;

  /** Header ------------------------------------------------------------- */

  --navbar-horizontal-menu-bg: var(--skin-background-header);
  --navbar-horizontal-menu-bg-hover: hsl(0, 0%, 93%);
  --nav-menu-top-a-bg: var(--skin-background-tertiary);
  --nav-menu-top-a-bg-focus: hsl(0, 0%, 93%);
  --nav-menu-top-col-bg: var(--skin-background-tertiary);
  --nav-menu-top-col: var(--skin-background-tertiary);
  --nav-menu-top-col-hover: #666;
  --nav-menu-top-col-open: #333;
  --nav-menu-top-col-active: #000;
  --nav-menu-inner-border-color: #f0f0f0;
  --nav-menu-border-color: #f3f3f3;

  /** Body ------------------------------------------------------------- */

  --primary-background: var(--skin-background-primary);
  --primary-color: #2c2e2f;
  --p-color: var(--skin-color-secondary);
  --p-color-input: inherit;
  --page-title-background: #f8f8f8;
  --panel-default-heading-color: #333;

  /** Panel ------------------------------------------------------------- */

  --panel-background: #FFFFFF;
  --link-inverter-parallel: #979898;
  --panel-heading-border-color: #f5f5f5;
  --page-container-main-content-row-bg: var(--skin-background-primary);
  --user-name-a-color: #373e4a;
  --user-name-span-color: #9d9d9d;
  --panel-body-color: #979898;
  --panel-body-a-color: #373e4a;
  --panel-body-a-hover-color: #16191e;
  --form-group-btn-hover: #333;

  /** Timeline */

  --timeline-first-child-color: #717272;
  --timeline-span-color: #979898;
  --timeline-label-p-color: #737881;
  --timeline-label-bg-color: var(--skin-background-tertiary);
  --timeline-centered-bg: var(--skin-background-tertiary);
  --timeline-icon-boxshadow-bg: var(--skin-background-tertiary);

  /** Tuile */

  --tuile-xe-bg: var(--skin-background-tertiary);
  --tuile-xe-span-color: #979898;
  --tuile-xe-span-color-contraste: #202121;
  --tuile-xe-num-color: #3e3f3f;
  --tuile-xe-arrow-color: #979898;

  /** Imeon state bar */

  --imeon-state-bar-bg: #000;
  --imeon-state-bar-bg-hover: #333;
  --imeon-state-bar-li-color: #fff;
  --imeon-state-bar-li-color-inactive: #777777;
  --imeon-state-bar-dropdown-header-bg: var(--skin-background-header);
  --imeon-state-bar-dropdown-header-bg-hover: #f5f5f5;
  --imeon-state-bar-dropdown-bg: var(--skin-background-tertiary);
  /*--imeon-state-bar-dropdown-header-bg: #000;
  --imeon-state-bar-dropdown-header-bg-hover: #838181;
  --imeon-state-bar-dropdown-bg: #fff;*/
  --imeon-state-bar-dropdown-color: #000;
  --imeon-state-bar-dropdown-border: #ddd;
  --imeon-state-bar-dropdown-border-left: var(--skin-background-tertiary);
  --imeon-state-bar-badge-default-bg: var(--skin-background-button-mallow1);
  --imeon-state-bar-badge-default-color: black;
  --imeon-state-bar-badge-error-bg: var(--skin-background-error);
  --imeon-state-bar-badge-error-color: var(--skin-color-important-primary);
  --imeon-state-bar-badge-warning-bg: var(--skin-background-warning);
  --imeon-state-bar-badge-warning-color: var(--skin-color-important-primary-dark);

  /** Footer */

  --footer-bg: var(--skin-background-primary);
  --footer-a-color: #373e4a;
  --footer-group-bg: rgba(44, 46, 47, 0.05);
  --footer-border-color: #ddd;

  /** Onglet */

  --onglet-color: #555;
  --onglet-bg: #f4f4f4;
  --onglet-bg-hover: var(--skin-background-tertiary);
  --onglet-bg-active: var(--skin-background-tertiary);

  /** Tableau */

  --tableau-bg: var(--skin-background-tertiary);
  --tableau-border-color: var(--skin-color-primary-2);
  --tableau-th-color: #2c2e2f;
  --tableau-row-odd-bg: #f9f9f9;
  --tableau-row-even-bg: var(--skin-background-tertiary);
  --tableau-footer-border-top: #111;
  --tableau-footer-color: #2c2e2f;
  --tableau-wrapper-color: #333;
  --tableau-wrapper-paginate-color: #333;
  --tableau-wrapper-paginate-border: #333;
  --tableau-wrapper-paginate-disable-color: #666;
  --tableau-wrapper-paginate-disable-bg: transparent;
  --tableau-wrapper-paginate-current-color: #333;
  --tableau-wrapper-paginate-current-border-color: #979797;
  --tableau-wrapper-paginate-current-bg: var(--skin-background-tertiary);
  --tableau-wrapper-paginate-hover-color: #fff;
  --tableau-wrapper-paginate-hover-border-color: #111;
  --tableau-wrapper-paginate-hover-bg: #585858;
  --tableau-body-a-color: #6c0;
  --tableau-body-a-border-color: var(--tableau-body-a-color, #6c0);
  --timeline-list-style-li-color: #2c2e2f; /** Colonne 'Detail' dans le tableau des Imeons */
  --timeline-list-style-li-border: var(--skin-background-primary); /** Colonne 'Detail' dans le tableau des Imeons */

  /** Plus link */

  --plus-link-color: #9cb7e0;
  --plus-link-hover-color: #7a87b1;

  /** Calendar */

  --calendar-btn-bg: var(--skin-background-tertiary);
  --calendar-btn-color: #333;
  --calendar-btn-border-color: #000;
  --calendar-btn-secondary-bg: #68b828;
  --calendar-btn-secondary-bg-hover: #5ca323;
  --calendar-btn-secondary-color: var(--skin-color-primary);
  --calendar-datepicker-switch-color: #2c2e2f;
  --calendar-datepicker-span-disabled-color: #777;
  --calendar-datepicker-disabled-color: #979898;
  --calendar-datepicker-span-old-new-color: #b1b1b1;
  --calendar-datepicker-span-hover-color: #f5f5f5;
  --calendar-datepicker-day-color: #646565;
  --calendar-datepicker-day-oldnew-color: #b1b1b1;
  --calendar-datepicker-day-hover-color: #2c2e2f;
  --calendar-datepicker-day-hover-bg: #f5f5f5;
  --calendar-datepicker-day-active-bg: #68b828;
  --calendar-datepicker-day-active-color: #fff;
  --calendar-dropdown-menu-bg: var(--skin-background-tertiary);
  --calendar-dropdown-menu-border-color: #ddd;
  --calendar-datepicker-button-bg: #f5f5f5;

  /** Forms -------------------------------------------------------------------*/

  --form-placeholder: var(--skin-color-tertiary);
  --form-disabled: var(--skin-disabled);

  /** Button (By Guillaume) ------------------------------------------------------------- */

  --skin-background-btn-btn-blue: #0e62c7;
  --skin-color-button-general: white;
  --skin-background-button-white: white;
  --skin-background-button-black: #424547;
  --skin-background-button-grey: #AAA;
  --skin-background-button-light-grey: #EEEEEE;
  --skin-background-button-green: var(--skin-battery-color);
  --skin-background-button-darkgreen: #008C8C;
  --skin-background-button-yellow1: #ffc90e;
  --skin-background-button-yellow2: #fff200;
  --skin-background-button-blue: #40bbea;
  --skin-background-button-darkblue: var(--skin-grid-color);
  --skin-background-button-darkblue1: #507FE5;
  --skin-background-button-darkblue2: #4771CC;
  --skin-background-button-darkblue3: #3E63B2;
  --skin-background-button-darkviolet: #778E99;
  --skin-background-button-darkviolet1: #6F32A9;
  --skin-background-button-darkviolet2: #632C96;
  --skin-background-button-darkviolet3: #562783;
  --skin-background-button-mallow1: #7c38bc;
  --skin-background-button-mallow2: #c19de1;
  --skin-background-button-orange: var(--skin-solar-color);
  --skin-background-button-orange1: #FCC404;
  --skin-background-button-orange2: #FCB004;
  --skin-background-button-orange3: #FC9B04;
  --skin-background-button-darkorange: #FFA500;
  --skin-background-button-clearorange: #F1CD42;
  --skin-background-button-red: #ff6264;
  --skin-background-button-off-secondary: #59a21e;
  --skin-background-button-off-secondary-hover: #6cbf2a;
  --skin-background-button-enable: #e6b62c;
  --skin-background-button-enable-hover: #5ca323;
  --skin-background-button-disable: #5ca323;
  --skin-background-button-disable-hover: #e6b62c;
  --skin-raj: var(--skin-background-button-green); /* test (By Guillaume) */
  /**
  primary: #0f83c9;
  success: #1bbf89; / rgba(27, 191, 137, 0.1)
  info: #56c0e0; /rgba(86, 192, 224, 0.1)
  warning: #f7af3e; / rgba(247, 175, 62, 0.1)
  error: #db524b; / rgba(219, 82, 75, 0.1)

  */
  --skin-background-warning: #FCD904;
  --skin-background-error: #ff6264;
  --skin-background-comm-lost: var(--skin-background-button-white);
  --skin-background-success: #68b828;
  --skin-background-info: #56c0e0;

  /** Badges (By Guillaume) ------------------------------------------------------------- */

  --skin-background-badge-default: #777777;
  --skin-background-badge-primary: #2c2e2f;
  --skin-background-badge-secondary: var(--skin-battery-color);
  --skin-background-badge-red-danger: #cc3f44;
  --skin-background-badge-blue-info: var(--skin-background-button-blue);
  --skin-background-badge-yellow-warning: #ffba00;
  --skin-background-badge-green-success: #8dc63f;
  --skin-background-badge-purple: var(--skin-background-button-mallow1);
  --skin-background-badge-pink: var(--skin-background-button-red);
  --skin-background-badge-yellow: #fcd036;
  --skin-background-badge-orange: #f7aa47;
  --skin-background-badge-turquoise: #00b19d;
  --skin-background-badge-red: #d5080f;
  --skin-background-badge-blue: #0e62c7;
  --skin-background-badge-black: #222222;
  --skin-background-badge-white: #fff;

  /** Labels (By Guillaume) ---------------------------------------------------------- */

  --skin-background-label-primary: #2c2e2f;
  --skin-background-label-secondary: var(--skin-battery-color);
  --skin-background-label-success: #8dc63f;
  --skin-background-label-danger: #cc3f44;
  --skin-background-label-info: var(--skin-background-button-blue);
  --skin-background-label-warning: #ffba00;
  --skin-background-label-red: #d5080f;
  --skin-background-label-purple: var(--skin-background-button-mallow1);
  --skin-background-label-pink: var(--skin-background-button-red);
  --skin-background-label-yellow: #fcd036;
  --skin-background-label-orange: #f7aa47;
  --skin-background-label-turquoise: #00b19d;
  --skin-background-label-blue: #0e62c7;
  --skin-background-label-black: #222222;

  /** Couleur de la jauge de la batterie JS (By Guillaume) --------------------------- */

  --skin-background-battery-jauge-pallier1: #ff0000;
  --skin-background-battery-jauge-pallier2: #FFA500;
  --skin-background-battery-jauge-pallier3: #ffc90e;
  --skin-background-battery-jauge-pallier4: #68b828;
  --skin-battery-background-bg: #dcdcdc;
  --skin-stroke-color-stateofcharge-JS: #888888;
  --skin-text-color-stateofcharge-JS: #333;

  /* Series JS (By Guillaume) -------------------------------------------------------- */

  --skin-background-battery-stored-pv: var(--skin-col-Stored-production);
  --skin-background-grid-inj-pv: var(--skin-background-button-blue);
  --skin-background-consumed-grid: var(--skin-grid-color-chart);

  /* autonomy chart JS (By Guillaume) ------------------------------------------------ */

  --skin-background-autonomy-chart-JS-solar: var(--skin-solar-color);
  --skin-background-autonomy-chart-JS-battery: var(--skin-battery-color);

  /* aautonomy chart JS (By Guillaume) ----------------------------------------------- */

  --skin-border-color-aautonomy-chart-JS: #7941ae;

  /* Les Opacities JS (les nombres comme 080 c'est en fait 0.8) (By Guillaume) ------- */

  --skin-opacity-050-JS: 0.5;
  --skin-opacity-055-JS: 0.55;
  --skin-opacity-065-JS: 0.65;
  --skin-opacity-080-JS: 0.8;
  --skin-opacity-090-JS: 0.9;
  --skin-opacity-100-JS: 1;

  /* Trackcolors JS (By Guillaume) --------------------------------------------------- */

  --skin-track-color-autonomy-gauge: #f2f2f2;

  /* All charts JS (By Guillaume) ---------------------------------------------------- */

  --skin-background-all-chart-JS: #ffffff;

  /* form wizard (By Guillaume) ------------------------------------------------------ */

  --skin-background-form-wizard: var(--skin-background-tertiary);

  /* palette-repartition-doughut-3-JS (By Guillaume) --------------------------------- */

  --skin-palette-repartition-doughut-3-JS: var(--skin-grid-color);

  /* Couleurs pour les graphs (By Guillaume) ----------------------------------------- */

  --skin-col-Consumed-from-grid: var(--skin-grid-color-chart);
  --skin-col-Consumed-from-battery: var(--skin-battery-color);
  --skin-col-Consumed-from-pv: var(--skin-solar-color);
  --skin-col-Directly-consumed-production: var(--skin-solar-color);
  --skin-col-Stored-production: var(--skin-battery-charge-color);
  --skin-col-Fed-to-grid-production: var(--skin-feedin-color);
  --skin-col-Fed-to-grid: var(--skin-feedin-color);
  --skin-col-grid-injection: var(--skin-background-button-blue);
  --skin-col-Battery-Charge-current: var(--skin-background-button-mallow1);
  --skin-col-Battery-Discharge-current: var(--skin-background-button-mallow2);
  --skin-col-Battery-SOC: var(--skin-battery-color);
  --tooltip-bg: #ffffff;
  --tooltip-col: var(--skin-color-primary);
  --legend-bg: #EEEEEE50;

  /* Couleurs pour le doughnut (By Guillaume) --------------------------------------- */

  --col-Nodata-pal-1: #d9d9d9;
  --col-Consumed-pal-2: var(--skin-palette-orange);
  --col-Stored-pal-3: var(--skin-palette-green1);
  --col-Fed-pal-4: var(--skin-palette-blue1);
  --col-large-orange: var(--skin-col-Consumed-from-pv);
  --col-large-green1: var(--skin-col-Stored-production);
  --col-large-blue1: var(--skin-col-Fed-to-grid);

  /** Palette de couleurs pour les textes **/

  --skin-palette-green: var(--skin-battery-color);
  --skin-palette-green1: var(--skin-col-Stored-production);
  --skin-palette-blue: var(--skin-background-button-blue);
  --skin-palette-blue1: #0051FF;
  --skin-palette-orange: var(--skin-solar-color);
  --skin-palette-red: var(--skin-background-button-red);
  --skin-palette-mallow1: var(--skin-background-button-mallow1);
  --skin-palette-mallow2: var(--skin-background-button-mallow2);
  --skin-palette-yellow1: var(--skin-background-button-yellow1);
  --skin-palette-yellow2: var(--skin-background-button-yellow2);

  /** Other (By Guillaume) ----------------------------------------------------------- */

  --skin-background-form-wizard-inscription: #142261;
  /*--skin-background-loadingmessage: #101631;*/
  --skin-background-loadingmessage: #4b4d4e;
  --skin-background-homecontainer: #a3b5d7;
  --skin-background-slidermarker-JS: #9B9B9B;

}
