body.dark{
  --border: #555555;
  --primary-color: #3cabff;
  --primary-border: var(--border);
  --nav-active-color: var(--primary-color);
  --bar-bg: #1B1B1B;
  
  /* MAIN COLORS */
  --site-bg: #333333;
  --page-content-bg: var(--site-bg);
  --site-second-bg: #eef5fa;
  --main-color: #d0d0d0;

  /* NAVBAR */;
  --navbar-bg: var(--bar-bg);
  --navbar-active-bg: var(--bar-bg);

  /* SIDEBAR */
  --sidebar-bg: #242424;
  --sidebar-color: var(--table-color);
  --rgba: rgba(0, 0, 0, 0.5);

  /* WIDGET */
  --widget-headline-bg: var(--bar-bg);
  --widget-headline-border: var(--bar-bg);
  --widget-border-color: var(--bar-bg);
  --widget-toolbox-bg: var(--border);
  --widget-border: var(--border);

  /* TABLE */
  --table-odd-bg: #212020;
  --table-even-bg: #292929;
  --table-color: var(--main-color);
  --table-border: var(--border);
  --table-headline: var(--bar-bg);

  /* BUTTON */
  --button-bg: var(--sidebar-bg);
  --button-border: var(--border);

  /* INPUT */
  --input-bg:var(--table-even-bg);
  --input-color:var(--main-color);
  --input-border: #cccccc;
}