/*
  @project: monepi/administrateur
  @create: 8 Oct 2020
  @update: 8 Oct 2020
  @description: CSS Variables
*/

/* ----------------------------------------------------------------------------- == SUMMARY */
/*
  1. :root
*/

/* ----------------------------------------------------------------------------- == Root */
:root {
  /* Color palette */
  --blue-700: #6c7ab1;
  --blue-500: #7287df;
  --blue-400: #95a6e3;
  --blue-300: #b8c3ef;
  --blue-200: #c7cff3;
  --blue-100: #e3e7fa;
  --orange-700: #b27c27;
  --orange-500: #e18a04;
  --orange-400: #f3b148;
  --orange-300: #f0c481;
  --orange-100: #f3d19b;
  --green-900: #7D8C11;
  --green-700: #8d983b;
  --green-500: #a5b823;
  --green-400: #bbc85e;
  --green-300: #d2db91;
  --green-100: #dbe3a7;
  --pink-700: #ba786b;
  --pink-500: #ee8470;
  --pink-400: #eea393;
  --pink-300: #f6c1b7;
  --pink-100: #f9cec6;
  --yellow-700: #b09126;
  --yellow-500: #deac02;
  --yellow-400: #e2c046;
  --yellow-300: #eed580;
  --yellow-100: #f2de9a;
  --purple-700: #6c2d5f;
  --purple-500: #720d5d;
  --purple-300: #b886ae;
  --purple-200: #c79fbf;
  --purple-100: #D4B9CB;
  --red-700: #b22525;
  --red-500: #e10000;
  --red-300: #ef7f7f;
  --red-100: #f39999;
  --grey-100: #f5f4f4;
  --grey-101: #e8f1f1;
  --grey-300: #f1efe8;
  --grey-301: #f1e8e8;
  --grey-400: #d9d3d3;
  --grey-500: #bcbcbc;
  --grey-600: #797373;
  --grey-700: #686660;
  --grey-800: #3E3F41;
  --grey-900: #2F2F2F;
  --white: #ffffff;
  --breakpoint-xl: 1600px

  /* Timing Functions */;
  --ease-in: cubic-bezier(0.33, 1, 0.68, 1); /* easeOutCubic */
  --ease-out: cubic-bezier(0.11, 0, 0.5, 0); /*  easeInQuad   */

  /* Font families */
  --font-base: "Open Sans";
  --font-emphase: "Montserrat";
  --font-breadcrumb: "Roboto";
}