#theme-selector .color-span span:nth-child(1){background:var(--fg-default);}
#theme-selector .color-span span:nth-child(2){background:var(--bg-default);}
#theme-selector .color-span span:nth-child(3){background:var(--fg-dark-title);}
#theme-selector .color-span span:nth-child(4){background:var(--bg-dark-title);}
#theme-selector .color-span span:nth-child(5){background:var(--fg-light-title);}
#theme-selector .color-span span:nth-child(6){background:var(--bg-light-title);}

#theme-selector .color-span span{border:2px solid white;}

.theme-default {
  --fg-default:#C5C6C7;
  --bg-default:#0B0C10;

  --fg-dark-title:#C5C6C7;
  --bg-dark-title:#1F2833;

  --fg-light-title:#1F2833;
  --bg-light-title:#C5C6C7;
}

.theme-blackboard {
  --fg-default:#D8FA3C;
  --bg-default:#14192A;

  --fg-dark-title:#FFFFFF;
  --bg-dark-title:#AB2A1D;

  --fg-light-title:#AEAEAE;
  --bg-light-title:#14192A;
}

.theme-dracula {
  --fg-default:#d9d0c6;
  --bg-default:#282a36;

  --fg-dark-title:#000000;
  --bg-dark-title:#fd5554;

  --fg-light-title:#000000;
  --bg-light-title:#ebb96e;
}

.theme-solarized {
  --fg-default:#eee8d5;
  --bg-default:#002b36;

  --fg-dark-title:#000000;
  --bg-dark-title:#2aa198;

  --fg-light-title:#000000;
  --bg-light-title:#b58900;
}

.theme-thyme {
  --fg-default:#898b8c;
  --bg-default:#ECEEF0;

  --fg-dark-title:#CCE5E5;
  --bg-dark-title:#007C7F;

  --fg-light-title:#6B7A27;
  --bg-light-title:#BBD445;
}

.theme-hornet {
  --fg-default:#d1d0d0;
  --bg-default:#3A3839;

  --fg-dark-title:#816c28;
  --bg-dark-title:#FED650;

  --fg-light-title:#848484;
  --bg-light-title:#FFFFFF;
}