:root {
  --black: #000000;
  --black-trans: #00000080;
  --dark: #404040;
  --dark-trans: #40404080;
  --gray: #808080;
  --gray-trans: #80808080;
  --lightgray: #c0c0c0;
  --lightgray-trans: #c0c0c080;
  --white: #ffffff;
  --white-trans: #ffffff80;
  --red: #c02020;
  --red-trans: #c0202080;
  --green: #20c020;
  --green-trans: #20c02080;
  --blue: #2020c0;
  --blue-trans: #2020c080;
  --slateblue: #4040c0;
  --slateblue-trans: #4040c080;
  --aqua: #40c0ff;
  --aqua-trans: #40c0ff80;
  --emerald: #40c040;
  --emerald-trans: #40c04080;
  --turquoise: #40ffc0;
  --turquoise-trans: #40ffc080;
  --seagreen: #20c0c0;
  --seagreen-trans: #20c0c080;
  --violet: #c040ff;
  --violet-trans: #c040ff80;
  --pink: #ff40c0;
  --pink-trans: #ff40c080;
  --grassgreen: #c0ff40;
  --grassgreen-trans: #c0ff4080;
  --gold: #ffc040;
  --gold-trans: #ffc04080;
  --brown: #c08020;
  --brown-trans: #c0802080;
  --black-compl: #ffffff;
  --black-compl-trans: #ffffff80;
  --dark-compl: #bfbfbf;
  --dark-compl-trans: #bfbfbf80;
  --gray-compl: #7f7f7f;
  --gray-compl-trans: #7f7f7f80;
  --lightgray-compl: #3f3f3f;
  --lightgray-compl-trans: #3f3f3f80;
  --white-compl: #000000;
  --white-compl-trans: #00000080;
  --red-compl: #3fdfdf;
  --red-compl-trans: #3fdfdf80;
  --green-compl: #df3fdf;
  --green-compl-trans: #df3fdf80;
  --blue-compl: #dfdf3f;
  --blue-compl-trans: #dfdf3f80;
  --slateblue-compl: #bfbf3f;
  --slateblue-compl-trans: #bfbf3f80;
  --aqua-compl: #bf3f00;
  --aqua-compl-trans: #bf3f0080;
  --emerald-compl: #bf3fbf;
  --emerald-compl-trans: #bf3fbf80;
  --turquoise-compl: #bf003f;
  --turquoise-compl-trans: #bf003f80;
  --seagreen-compl: #df3f3f;
  --seagreen-compl-trans: #df3f3f80;
  --violet-compl: #3fbf00;
  --violet-compl-trans: #3fbf0080;
  --pink-compl: #00bf3f;
  --pink-compl-trans: #00bf3f80;
  --grassgreen-compl: #3f00bf;
  --grassgreen-compl-trans: #3f00bf80;
  --gold-compl: #003fbf;
  --gold-compl-trans: #003fbf80;
  --brown-compl: #3f7fdf;
  --brown-compl-trans: #3f7fdf80;
}

/* Colors */
.color-black {
  color: var(--black);
}

.color-black::selection, .color-black ::selection {
  color: var(--black-compl);
}

.highlight-black {
  background-color: var(--black);
}

.highlight-black::selection {
  background-color: var(--black-compl);
}

.color-black svg path, .color-black svg rect, .color-black svg circle {
  fill: var(--black);
}

.color-black-trans {
  color: var(--black-trans);
}

.color-black-trans::selection, .color-black-trans ::selection {
  color: var(--black-trans-compl);
}

.highlight-black-trans {
  background-color: var(--black-trans);
}

.highlight-black-trans::selection {
  background-color: var(--black-trans-compl);
}

.color-black-trans svg path, .color-black-trans svg rect, .color-black-trans svg circle {
  fill: var(--black-trans);
}

.color-dark {
  color: var(--dark);
}

.color-dark::selection, .color-dark ::selection {
  color: var(--dark-compl);
}

.highlight-dark {
  background-color: var(--dark);
}

.highlight-dark::selection {
  background-color: var(--dark-compl);
}

.color-dark svg path, .color-dark svg rect, .color-dark svg circle {
  fill: var(--dark);
}

.color-dark-trans {
  color: var(--dark-trans);
}

.color-dark-trans::selection, .color-dark-trans ::selection {
  color: var(--dark-trans-compl);
}

.highlight-dark-trans {
  background-color: var(--dark-trans);
}

.highlight-dark-trans::selection {
  background-color: var(--dark-trans-compl);
}

.color-dark-trans svg path, .color-dark-trans svg rect, .color-dark-trans svg circle {
  fill: var(--dark-trans);
}

.color-gray {
  color: var(--gray);
}

.color-gray::selection, .color-gray ::selection {
  color: var(--gray-compl);
}

.highlight-gray {
  background-color: var(--gray);
}

.highlight-gray::selection {
  background-color: var(--gray-compl);
}

.color-gray svg path, .color-gray svg rect, .color-gray svg circle {
  fill: var(--gray);
}

.color-gray-trans {
  color: var(--gray-trans);
}

.color-gray-trans::selection, .color-gray-trans ::selection {
  color: var(--gray-trans-compl);
}

.highlight-gray-trans {
  background-color: var(--gray-trans);
}

.highlight-gray-trans::selection {
  background-color: var(--gray-trans-compl);
}

.color-gray-trans svg path, .color-gray-trans svg rect, .color-gray-trans svg circle {
  fill: var(--gray-trans);
}

.color-lightgray {
  color: var(--lightgray);
}

.color-lightgray::selection, .color-lightgray ::selection {
  color: var(--lightgray-compl);
}

.highlight-lightgray {
  background-color: var(--lightgray);
}

.highlight-lightgray::selection {
  background-color: var(--lightgray-compl);
}

.color-lightgray svg path, .color-lightgray svg rect, .color-lightgray svg circle {
  fill: var(--lightgray);
}

.color-lightgray-trans {
  color: var(--lightgray-trans);
}

.color-lightgray-trans::selection, .color-lightgray-trans ::selection {
  color: var(--lightgray-trans-compl);
}

.highlight-lightgray-trans {
  background-color: var(--lightgray-trans);
}

.highlight-lightgray-trans::selection {
  background-color: var(--lightgray-trans-compl);
}

.color-lightgray-trans svg path, .color-lightgray-trans svg rect, .color-lightgray-trans svg circle {
  fill: var(--lightgray-trans);
}

.color-white {
  color: var(--white);
}

.color-white::selection, .color-white ::selection {
  color: var(--white-compl);
}

.highlight-white {
  background-color: var(--white);
}

.highlight-white::selection {
  background-color: var(--white-compl);
}

.color-white svg path, .color-white svg rect, .color-white svg circle {
  fill: var(--white);
}

.color-white-trans {
  color: var(--white-trans);
}

.color-white-trans::selection, .color-white-trans ::selection {
  color: var(--white-trans-compl);
}

.highlight-white-trans {
  background-color: var(--white-trans);
}

.highlight-white-trans::selection {
  background-color: var(--white-trans-compl);
}

.color-white-trans svg path, .color-white-trans svg rect, .color-white-trans svg circle {
  fill: var(--white-trans);
}

.color-red {
  color: var(--red);
}

.color-red::selection, .color-red ::selection {
  color: var(--red-compl);
}

.highlight-red {
  background-color: var(--red);
}

.highlight-red::selection {
  background-color: var(--red-compl);
}

.color-red svg path, .color-red svg rect, .color-red svg circle {
  fill: var(--red);
}

.color-red-trans {
  color: var(--red-trans);
}

.color-red-trans::selection, .color-red-trans ::selection {
  color: var(--red-trans-compl);
}

.highlight-red-trans {
  background-color: var(--red-trans);
}

.highlight-red-trans::selection {
  background-color: var(--red-trans-compl);
}

.color-red-trans svg path, .color-red-trans svg rect, .color-red-trans svg circle {
  fill: var(--red-trans);
}

.color-green {
  color: var(--green);
}

.color-green::selection, .color-green ::selection {
  color: var(--green-compl);
}

.highlight-green {
  background-color: var(--green);
}

.highlight-green::selection {
  background-color: var(--green-compl);
}

.color-green svg path, .color-green svg rect, .color-green svg circle {
  fill: var(--green);
}

.color-green-trans {
  color: var(--green-trans);
}

.color-green-trans::selection, .color-green-trans ::selection {
  color: var(--green-trans-compl);
}

.highlight-green-trans {
  background-color: var(--green-trans);
}

.highlight-green-trans::selection {
  background-color: var(--green-trans-compl);
}

.color-green-trans svg path, .color-green-trans svg rect, .color-green-trans svg circle {
  fill: var(--green-trans);
}

.color-blue {
  color: var(--blue);
}

.color-blue::selection, .color-blue ::selection {
  color: var(--blue-compl);
}

.highlight-blue {
  background-color: var(--blue);
}

.highlight-blue::selection {
  background-color: var(--blue-compl);
}

.color-blue svg path, .color-blue svg rect, .color-blue svg circle {
  fill: var(--blue);
}

.color-blue-trans {
  color: var(--blue-trans);
}

.color-blue-trans::selection, .color-blue-trans ::selection {
  color: var(--blue-trans-compl);
}

.highlight-blue-trans {
  background-color: var(--blue-trans);
}

.highlight-blue-trans::selection {
  background-color: var(--blue-trans-compl);
}

.color-blue-trans svg path, .color-blue-trans svg rect, .color-blue-trans svg circle {
  fill: var(--blue-trans);
}

.color-slateblue {
  color: var(--slateblue);
}

.color-slateblue::selection, .color-slateblue ::selection {
  color: var(--slateblue-compl);
}

.highlight-slateblue {
  background-color: var(--slateblue);
}

.highlight-slateblue::selection {
  background-color: var(--slateblue-compl);
}

.color-slateblue svg path, .color-slateblue svg rect, .color-slateblue svg circle {
  fill: var(--slateblue);
}

.color-slateblue-trans {
  color: var(--slateblue-trans);
}

.color-slateblue-trans::selection, .color-slateblue-trans ::selection {
  color: var(--slateblue-trans-compl);
}

.highlight-slateblue-trans {
  background-color: var(--slateblue-trans);
}

.highlight-slateblue-trans::selection {
  background-color: var(--slateblue-trans-compl);
}

.color-slateblue-trans svg path, .color-slateblue-trans svg rect, .color-slateblue-trans svg circle {
  fill: var(--slateblue-trans);
}

.color-aqua {
  color: var(--aqua);
}

.color-aqua::selection, .color-aqua ::selection {
  color: var(--aqua-compl);
}

.highlight-aqua {
  background-color: var(--aqua);
}

.highlight-aqua::selection {
  background-color: var(--aqua-compl);
}

.color-aqua svg path, .color-aqua svg rect, .color-aqua svg circle {
  fill: var(--aqua);
}

.color-aqua-trans {
  color: var(--aqua-trans);
}

.color-aqua-trans::selection, .color-aqua-trans ::selection {
  color: var(--aqua-trans-compl);
}

.highlight-aqua-trans {
  background-color: var(--aqua-trans);
}

.highlight-aqua-trans::selection {
  background-color: var(--aqua-trans-compl);
}

.color-aqua-trans svg path, .color-aqua-trans svg rect, .color-aqua-trans svg circle {
  fill: var(--aqua-trans);
}

.color-emerald {
  color: var(--emerald);
}

.color-emerald::selection, .color-emerald ::selection {
  color: var(--emerald-compl);
}

.highlight-emerald {
  background-color: var(--emerald);
}

.highlight-emerald::selection {
  background-color: var(--emerald-compl);
}

.color-emerald svg path, .color-emerald svg rect, .color-emerald svg circle {
  fill: var(--emerald);
}

.color-emerald-trans {
  color: var(--emerald-trans);
}

.color-emerald-trans::selection, .color-emerald-trans ::selection {
  color: var(--emerald-trans-compl);
}

.highlight-emerald-trans {
  background-color: var(--emerald-trans);
}

.highlight-emerald-trans::selection {
  background-color: var(--emerald-trans-compl);
}

.color-emerald-trans svg path, .color-emerald-trans svg rect, .color-emerald-trans svg circle {
  fill: var(--emerald-trans);
}

.color-turquoise {
  color: var(--turquoise);
}

.color-turquoise::selection, .color-turquoise ::selection {
  color: var(--turquoise-compl);
}

.highlight-turquoise {
  background-color: var(--turquoise);
}

.highlight-turquoise::selection {
  background-color: var(--turquoise-compl);
}

.color-turquoise svg path, .color-turquoise svg rect, .color-turquoise svg circle {
  fill: var(--turquoise);
}

.color-turquoise-trans {
  color: var(--turquoise-trans);
}

.color-turquoise-trans::selection, .color-turquoise-trans ::selection {
  color: var(--turquoise-trans-compl);
}

.highlight-turquoise-trans {
  background-color: var(--turquoise-trans);
}

.highlight-turquoise-trans::selection {
  background-color: var(--turquoise-trans-compl);
}

.color-turquoise-trans svg path, .color-turquoise-trans svg rect, .color-turquoise-trans svg circle {
  fill: var(--turquoise-trans);
}

.color-seagreen {
  color: var(--seagreen);
}

.color-seagreen::selection, .color-seagreen ::selection {
  color: var(--seagreen-compl);
}

.highlight-seagreen {
  background-color: var(--seagreen);
}

.highlight-seagreen::selection {
  background-color: var(--seagreen-compl);
}

.color-seagreen svg path, .color-seagreen svg rect, .color-seagreen svg circle {
  fill: var(--seagreen);
}

.color-seagreen-trans {
  color: var(--seagreen-trans);
}

.color-seagreen-trans::selection, .color-seagreen-trans ::selection {
  color: var(--seagreen-trans-compl);
}

.highlight-seagreen-trans {
  background-color: var(--seagreen-trans);
}

.highlight-seagreen-trans::selection {
  background-color: var(--seagreen-trans-compl);
}

.color-seagreen-trans svg path, .color-seagreen-trans svg rect, .color-seagreen-trans svg circle {
  fill: var(--seagreen-trans);
}

.color-violet {
  color: var(--violet);
}

.color-violet::selection, .color-violet ::selection {
  color: var(--violet-compl);
}

.highlight-violet {
  background-color: var(--violet);
}

.highlight-violet::selection {
  background-color: var(--violet-compl);
}

.color-violet svg path, .color-violet svg rect, .color-violet svg circle {
  fill: var(--violet);
}

.color-violet-trans {
  color: var(--violet-trans);
}

.color-violet-trans::selection, .color-violet-trans ::selection {
  color: var(--violet-trans-compl);
}

.highlight-violet-trans {
  background-color: var(--violet-trans);
}

.highlight-violet-trans::selection {
  background-color: var(--violet-trans-compl);
}

.color-violet-trans svg path, .color-violet-trans svg rect, .color-violet-trans svg circle {
  fill: var(--violet-trans);
}

.color-pink {
  color: var(--pink);
}

.color-pink::selection, .color-pink ::selection {
  color: var(--pink-compl);
}

.highlight-pink {
  background-color: var(--pink);
}

.highlight-pink::selection {
  background-color: var(--pink-compl);
}

.color-pink svg path, .color-pink svg rect, .color-pink svg circle {
  fill: var(--pink);
}

.color-pink-trans {
  color: var(--pink-trans);
}

.color-pink-trans::selection, .color-pink-trans ::selection {
  color: var(--pink-trans-compl);
}

.highlight-pink-trans {
  background-color: var(--pink-trans);
}

.highlight-pink-trans::selection {
  background-color: var(--pink-trans-compl);
}

.color-pink-trans svg path, .color-pink-trans svg rect, .color-pink-trans svg circle {
  fill: var(--pink-trans);
}

.color-grassgreen {
  color: var(--grassgreen);
}

.color-grassgreen::selection, .color-grassgreen ::selection {
  color: var(--grassgreen-compl);
}

.highlight-grassgreen {
  background-color: var(--grassgreen);
}

.highlight-grassgreen::selection {
  background-color: var(--grassgreen-compl);
}

.color-grassgreen svg path, .color-grassgreen svg rect, .color-grassgreen svg circle {
  fill: var(--grassgreen);
}

.color-grassgreen-trans {
  color: var(--grassgreen-trans);
}

.color-grassgreen-trans::selection, .color-grassgreen-trans ::selection {
  color: var(--grassgreen-trans-compl);
}

.highlight-grassgreen-trans {
  background-color: var(--grassgreen-trans);
}

.highlight-grassgreen-trans::selection {
  background-color: var(--grassgreen-trans-compl);
}

.color-grassgreen-trans svg path, .color-grassgreen-trans svg rect, .color-grassgreen-trans svg circle {
  fill: var(--grassgreen-trans);
}

.color-gold {
  color: var(--gold);
}

.color-gold::selection, .color-gold ::selection {
  color: var(--gold-compl);
}

.highlight-gold {
  background-color: var(--gold);
}

.highlight-gold::selection {
  background-color: var(--gold-compl);
}

.color-gold svg path, .color-gold svg rect, .color-gold svg circle {
  fill: var(--gold);
}

.color-gold-trans {
  color: var(--gold-trans);
}

.color-gold-trans::selection, .color-gold-trans ::selection {
  color: var(--gold-trans-compl);
}

.highlight-gold-trans {
  background-color: var(--gold-trans);
}

.highlight-gold-trans::selection {
  background-color: var(--gold-trans-compl);
}

.color-gold-trans svg path, .color-gold-trans svg rect, .color-gold-trans svg circle {
  fill: var(--gold-trans);
}

.color-brown {
  color: var(--brown);
}

.color-brown::selection, .color-brown ::selection {
  color: var(--brown-compl);
}

.highlight-brown {
  background-color: var(--brown);
}

.highlight-brown::selection {
  background-color: var(--brown-compl);
}

.color-brown svg path, .color-brown svg rect, .color-brown svg circle {
  fill: var(--brown);
}

.color-brown-trans {
  color: var(--brown-trans);
}

.color-brown-trans::selection, .color-brown-trans ::selection {
  color: var(--brown-trans-compl);
}

.highlight-brown-trans {
  background-color: var(--brown-trans);
}

.highlight-brown-trans::selection {
  background-color: var(--brown-trans-compl);
}

.color-brown-trans svg path, .color-brown-trans svg rect, .color-brown-trans svg circle {
  fill: var(--brown-trans);
}

.color-black-compl {
  color: var(--black-compl);
}

.color-black-compl::selection, .color-black-compl ::selection {
  color: var(--black-compl-compl);
}

.highlight-black-compl {
  background-color: var(--black-compl);
}

.highlight-black-compl::selection {
  background-color: var(--black-compl-compl);
}

.color-black-compl svg path, .color-black-compl svg rect, .color-black-compl svg circle {
  fill: var(--black-compl);
}

.color-black-compl-trans {
  color: var(--black-compl-trans);
}

.color-black-compl-trans::selection, .color-black-compl-trans ::selection {
  color: var(--black-compl-trans-compl);
}

.highlight-black-compl-trans {
  background-color: var(--black-compl-trans);
}

.highlight-black-compl-trans::selection {
  background-color: var(--black-compl-trans-compl);
}

.color-black-compl-trans svg path, .color-black-compl-trans svg rect, .color-black-compl-trans svg circle {
  fill: var(--black-compl-trans);
}

.color-dark-compl {
  color: var(--dark-compl);
}

.color-dark-compl::selection, .color-dark-compl ::selection {
  color: var(--dark-compl-compl);
}

.highlight-dark-compl {
  background-color: var(--dark-compl);
}

.highlight-dark-compl::selection {
  background-color: var(--dark-compl-compl);
}

.color-dark-compl svg path, .color-dark-compl svg rect, .color-dark-compl svg circle {
  fill: var(--dark-compl);
}

.color-dark-compl-trans {
  color: var(--dark-compl-trans);
}

.color-dark-compl-trans::selection, .color-dark-compl-trans ::selection {
  color: var(--dark-compl-trans-compl);
}

.highlight-dark-compl-trans {
  background-color: var(--dark-compl-trans);
}

.highlight-dark-compl-trans::selection {
  background-color: var(--dark-compl-trans-compl);
}

.color-dark-compl-trans svg path, .color-dark-compl-trans svg rect, .color-dark-compl-trans svg circle {
  fill: var(--dark-compl-trans);
}

.color-gray-compl {
  color: var(--gray-compl);
}

.color-gray-compl::selection, .color-gray-compl ::selection {
  color: var(--gray-compl-compl);
}

.highlight-gray-compl {
  background-color: var(--gray-compl);
}

.highlight-gray-compl::selection {
  background-color: var(--gray-compl-compl);
}

.color-gray-compl svg path, .color-gray-compl svg rect, .color-gray-compl svg circle {
  fill: var(--gray-compl);
}

.color-gray-compl-trans {
  color: var(--gray-compl-trans);
}

.color-gray-compl-trans::selection, .color-gray-compl-trans ::selection {
  color: var(--gray-compl-trans-compl);
}

.highlight-gray-compl-trans {
  background-color: var(--gray-compl-trans);
}

.highlight-gray-compl-trans::selection {
  background-color: var(--gray-compl-trans-compl);
}

.color-gray-compl-trans svg path, .color-gray-compl-trans svg rect, .color-gray-compl-trans svg circle {
  fill: var(--gray-compl-trans);
}

.color-lightgray-compl {
  color: var(--lightgray-compl);
}

.color-lightgray-compl::selection, .color-lightgray-compl ::selection {
  color: var(--lightgray-compl-compl);
}

.highlight-lightgray-compl {
  background-color: var(--lightgray-compl);
}

.highlight-lightgray-compl::selection {
  background-color: var(--lightgray-compl-compl);
}

.color-lightgray-compl svg path, .color-lightgray-compl svg rect, .color-lightgray-compl svg circle {
  fill: var(--lightgray-compl);
}

.color-lightgray-compl-trans {
  color: var(--lightgray-compl-trans);
}

.color-lightgray-compl-trans::selection, .color-lightgray-compl-trans ::selection {
  color: var(--lightgray-compl-trans-compl);
}

.highlight-lightgray-compl-trans {
  background-color: var(--lightgray-compl-trans);
}

.highlight-lightgray-compl-trans::selection {
  background-color: var(--lightgray-compl-trans-compl);
}

.color-lightgray-compl-trans svg path, .color-lightgray-compl-trans svg rect, .color-lightgray-compl-trans svg circle {
  fill: var(--lightgray-compl-trans);
}

.color-white-compl {
  color: var(--white-compl);
}

.color-white-compl::selection, .color-white-compl ::selection {
  color: var(--white-compl-compl);
}

.highlight-white-compl {
  background-color: var(--white-compl);
}

.highlight-white-compl::selection {
  background-color: var(--white-compl-compl);
}

.color-white-compl svg path, .color-white-compl svg rect, .color-white-compl svg circle {
  fill: var(--white-compl);
}

.color-white-compl-trans {
  color: var(--white-compl-trans);
}

.color-white-compl-trans::selection, .color-white-compl-trans ::selection {
  color: var(--white-compl-trans-compl);
}

.highlight-white-compl-trans {
  background-color: var(--white-compl-trans);
}

.highlight-white-compl-trans::selection {
  background-color: var(--white-compl-trans-compl);
}

.color-white-compl-trans svg path, .color-white-compl-trans svg rect, .color-white-compl-trans svg circle {
  fill: var(--white-compl-trans);
}

.color-red-compl {
  color: var(--red-compl);
}

.color-red-compl::selection, .color-red-compl ::selection {
  color: var(--red-compl-compl);
}

.highlight-red-compl {
  background-color: var(--red-compl);
}

.highlight-red-compl::selection {
  background-color: var(--red-compl-compl);
}

.color-red-compl svg path, .color-red-compl svg rect, .color-red-compl svg circle {
  fill: var(--red-compl);
}

.color-red-compl-trans {
  color: var(--red-compl-trans);
}

.color-red-compl-trans::selection, .color-red-compl-trans ::selection {
  color: var(--red-compl-trans-compl);
}

.highlight-red-compl-trans {
  background-color: var(--red-compl-trans);
}

.highlight-red-compl-trans::selection {
  background-color: var(--red-compl-trans-compl);
}

.color-red-compl-trans svg path, .color-red-compl-trans svg rect, .color-red-compl-trans svg circle {
  fill: var(--red-compl-trans);
}

.color-green-compl {
  color: var(--green-compl);
}

.color-green-compl::selection, .color-green-compl ::selection {
  color: var(--green-compl-compl);
}

.highlight-green-compl {
  background-color: var(--green-compl);
}

.highlight-green-compl::selection {
  background-color: var(--green-compl-compl);
}

.color-green-compl svg path, .color-green-compl svg rect, .color-green-compl svg circle {
  fill: var(--green-compl);
}

.color-green-compl-trans {
  color: var(--green-compl-trans);
}

.color-green-compl-trans::selection, .color-green-compl-trans ::selection {
  color: var(--green-compl-trans-compl);
}

.highlight-green-compl-trans {
  background-color: var(--green-compl-trans);
}

.highlight-green-compl-trans::selection {
  background-color: var(--green-compl-trans-compl);
}

.color-green-compl-trans svg path, .color-green-compl-trans svg rect, .color-green-compl-trans svg circle {
  fill: var(--green-compl-trans);
}

.color-blue-compl {
  color: var(--blue-compl);
}

.color-blue-compl::selection, .color-blue-compl ::selection {
  color: var(--blue-compl-compl);
}

.highlight-blue-compl {
  background-color: var(--blue-compl);
}

.highlight-blue-compl::selection {
  background-color: var(--blue-compl-compl);
}

.color-blue-compl svg path, .color-blue-compl svg rect, .color-blue-compl svg circle {
  fill: var(--blue-compl);
}

.color-blue-compl-trans {
  color: var(--blue-compl-trans);
}

.color-blue-compl-trans::selection, .color-blue-compl-trans ::selection {
  color: var(--blue-compl-trans-compl);
}

.highlight-blue-compl-trans {
  background-color: var(--blue-compl-trans);
}

.highlight-blue-compl-trans::selection {
  background-color: var(--blue-compl-trans-compl);
}

.color-blue-compl-trans svg path, .color-blue-compl-trans svg rect, .color-blue-compl-trans svg circle {
  fill: var(--blue-compl-trans);
}

.color-slateblue-compl {
  color: var(--slateblue-compl);
}

.color-slateblue-compl::selection, .color-slateblue-compl ::selection {
  color: var(--slateblue-compl-compl);
}

.highlight-slateblue-compl {
  background-color: var(--slateblue-compl);
}

.highlight-slateblue-compl::selection {
  background-color: var(--slateblue-compl-compl);
}

.color-slateblue-compl svg path, .color-slateblue-compl svg rect, .color-slateblue-compl svg circle {
  fill: var(--slateblue-compl);
}

.color-slateblue-compl-trans {
  color: var(--slateblue-compl-trans);
}

.color-slateblue-compl-trans::selection, .color-slateblue-compl-trans ::selection {
  color: var(--slateblue-compl-trans-compl);
}

.highlight-slateblue-compl-trans {
  background-color: var(--slateblue-compl-trans);
}

.highlight-slateblue-compl-trans::selection {
  background-color: var(--slateblue-compl-trans-compl);
}

.color-slateblue-compl-trans svg path, .color-slateblue-compl-trans svg rect, .color-slateblue-compl-trans svg circle {
  fill: var(--slateblue-compl-trans);
}

.color-aqua-compl {
  color: var(--aqua-compl);
}

.color-aqua-compl::selection, .color-aqua-compl ::selection {
  color: var(--aqua-compl-compl);
}

.highlight-aqua-compl {
  background-color: var(--aqua-compl);
}

.highlight-aqua-compl::selection {
  background-color: var(--aqua-compl-compl);
}

.color-aqua-compl svg path, .color-aqua-compl svg rect, .color-aqua-compl svg circle {
  fill: var(--aqua-compl);
}

.color-aqua-compl-trans {
  color: var(--aqua-compl-trans);
}

.color-aqua-compl-trans::selection, .color-aqua-compl-trans ::selection {
  color: var(--aqua-compl-trans-compl);
}

.highlight-aqua-compl-trans {
  background-color: var(--aqua-compl-trans);
}

.highlight-aqua-compl-trans::selection {
  background-color: var(--aqua-compl-trans-compl);
}

.color-aqua-compl-trans svg path, .color-aqua-compl-trans svg rect, .color-aqua-compl-trans svg circle {
  fill: var(--aqua-compl-trans);
}

.color-emerald-compl {
  color: var(--emerald-compl);
}

.color-emerald-compl::selection, .color-emerald-compl ::selection {
  color: var(--emerald-compl-compl);
}

.highlight-emerald-compl {
  background-color: var(--emerald-compl);
}

.highlight-emerald-compl::selection {
  background-color: var(--emerald-compl-compl);
}

.color-emerald-compl svg path, .color-emerald-compl svg rect, .color-emerald-compl svg circle {
  fill: var(--emerald-compl);
}

.color-emerald-compl-trans {
  color: var(--emerald-compl-trans);
}

.color-emerald-compl-trans::selection, .color-emerald-compl-trans ::selection {
  color: var(--emerald-compl-trans-compl);
}

.highlight-emerald-compl-trans {
  background-color: var(--emerald-compl-trans);
}

.highlight-emerald-compl-trans::selection {
  background-color: var(--emerald-compl-trans-compl);
}

.color-emerald-compl-trans svg path, .color-emerald-compl-trans svg rect, .color-emerald-compl-trans svg circle {
  fill: var(--emerald-compl-trans);
}

.color-turquoise-compl {
  color: var(--turquoise-compl);
}

.color-turquoise-compl::selection, .color-turquoise-compl ::selection {
  color: var(--turquoise-compl-compl);
}

.highlight-turquoise-compl {
  background-color: var(--turquoise-compl);
}

.highlight-turquoise-compl::selection {
  background-color: var(--turquoise-compl-compl);
}

.color-turquoise-compl svg path, .color-turquoise-compl svg rect, .color-turquoise-compl svg circle {
  fill: var(--turquoise-compl);
}

.color-turquoise-compl-trans {
  color: var(--turquoise-compl-trans);
}

.color-turquoise-compl-trans::selection, .color-turquoise-compl-trans ::selection {
  color: var(--turquoise-compl-trans-compl);
}

.highlight-turquoise-compl-trans {
  background-color: var(--turquoise-compl-trans);
}

.highlight-turquoise-compl-trans::selection {
  background-color: var(--turquoise-compl-trans-compl);
}

.color-turquoise-compl-trans svg path, .color-turquoise-compl-trans svg rect, .color-turquoise-compl-trans svg circle {
  fill: var(--turquoise-compl-trans);
}

.color-seagreen-compl {
  color: var(--seagreen-compl);
}

.color-seagreen-compl::selection, .color-seagreen-compl ::selection {
  color: var(--seagreen-compl-compl);
}

.highlight-seagreen-compl {
  background-color: var(--seagreen-compl);
}

.highlight-seagreen-compl::selection {
  background-color: var(--seagreen-compl-compl);
}

.color-seagreen-compl svg path, .color-seagreen-compl svg rect, .color-seagreen-compl svg circle {
  fill: var(--seagreen-compl);
}

.color-seagreen-compl-trans {
  color: var(--seagreen-compl-trans);
}

.color-seagreen-compl-trans::selection, .color-seagreen-compl-trans ::selection {
  color: var(--seagreen-compl-trans-compl);
}

.highlight-seagreen-compl-trans {
  background-color: var(--seagreen-compl-trans);
}

.highlight-seagreen-compl-trans::selection {
  background-color: var(--seagreen-compl-trans-compl);
}

.color-seagreen-compl-trans svg path, .color-seagreen-compl-trans svg rect, .color-seagreen-compl-trans svg circle {
  fill: var(--seagreen-compl-trans);
}

.color-violet-compl {
  color: var(--violet-compl);
}

.color-violet-compl::selection, .color-violet-compl ::selection {
  color: var(--violet-compl-compl);
}

.highlight-violet-compl {
  background-color: var(--violet-compl);
}

.highlight-violet-compl::selection {
  background-color: var(--violet-compl-compl);
}

.color-violet-compl svg path, .color-violet-compl svg rect, .color-violet-compl svg circle {
  fill: var(--violet-compl);
}

.color-violet-compl-trans {
  color: var(--violet-compl-trans);
}

.color-violet-compl-trans::selection, .color-violet-compl-trans ::selection {
  color: var(--violet-compl-trans-compl);
}

.highlight-violet-compl-trans {
  background-color: var(--violet-compl-trans);
}

.highlight-violet-compl-trans::selection {
  background-color: var(--violet-compl-trans-compl);
}

.color-violet-compl-trans svg path, .color-violet-compl-trans svg rect, .color-violet-compl-trans svg circle {
  fill: var(--violet-compl-trans);
}

.color-pink-compl {
  color: var(--pink-compl);
}

.color-pink-compl::selection, .color-pink-compl ::selection {
  color: var(--pink-compl-compl);
}

.highlight-pink-compl {
  background-color: var(--pink-compl);
}

.highlight-pink-compl::selection {
  background-color: var(--pink-compl-compl);
}

.color-pink-compl svg path, .color-pink-compl svg rect, .color-pink-compl svg circle {
  fill: var(--pink-compl);
}

.color-pink-compl-trans {
  color: var(--pink-compl-trans);
}

.color-pink-compl-trans::selection, .color-pink-compl-trans ::selection {
  color: var(--pink-compl-trans-compl);
}

.highlight-pink-compl-trans {
  background-color: var(--pink-compl-trans);
}

.highlight-pink-compl-trans::selection {
  background-color: var(--pink-compl-trans-compl);
}

.color-pink-compl-trans svg path, .color-pink-compl-trans svg rect, .color-pink-compl-trans svg circle {
  fill: var(--pink-compl-trans);
}

.color-grassgreen-compl {
  color: var(--grassgreen-compl);
}

.color-grassgreen-compl::selection, .color-grassgreen-compl ::selection {
  color: var(--grassgreen-compl-compl);
}

.highlight-grassgreen-compl {
  background-color: var(--grassgreen-compl);
}

.highlight-grassgreen-compl::selection {
  background-color: var(--grassgreen-compl-compl);
}

.color-grassgreen-compl svg path, .color-grassgreen-compl svg rect, .color-grassgreen-compl svg circle {
  fill: var(--grassgreen-compl);
}

.color-grassgreen-compl-trans {
  color: var(--grassgreen-compl-trans);
}

.color-grassgreen-compl-trans::selection, .color-grassgreen-compl-trans ::selection {
  color: var(--grassgreen-compl-trans-compl);
}

.highlight-grassgreen-compl-trans {
  background-color: var(--grassgreen-compl-trans);
}

.highlight-grassgreen-compl-trans::selection {
  background-color: var(--grassgreen-compl-trans-compl);
}

.color-grassgreen-compl-trans svg path, .color-grassgreen-compl-trans svg rect, .color-grassgreen-compl-trans svg circle {
  fill: var(--grassgreen-compl-trans);
}

.color-gold-compl {
  color: var(--gold-compl);
}

.color-gold-compl::selection, .color-gold-compl ::selection {
  color: var(--gold-compl-compl);
}

.highlight-gold-compl {
  background-color: var(--gold-compl);
}

.highlight-gold-compl::selection {
  background-color: var(--gold-compl-compl);
}

.color-gold-compl svg path, .color-gold-compl svg rect, .color-gold-compl svg circle {
  fill: var(--gold-compl);
}

.color-gold-compl-trans {
  color: var(--gold-compl-trans);
}

.color-gold-compl-trans::selection, .color-gold-compl-trans ::selection {
  color: var(--gold-compl-trans-compl);
}

.highlight-gold-compl-trans {
  background-color: var(--gold-compl-trans);
}

.highlight-gold-compl-trans::selection {
  background-color: var(--gold-compl-trans-compl);
}

.color-gold-compl-trans svg path, .color-gold-compl-trans svg rect, .color-gold-compl-trans svg circle {
  fill: var(--gold-compl-trans);
}

.color-brown-compl {
  color: var(--brown-compl);
}

.color-brown-compl::selection, .color-brown-compl ::selection {
  color: var(--brown-compl-compl);
}

.highlight-brown-compl {
  background-color: var(--brown-compl);
}

.highlight-brown-compl::selection {
  background-color: var(--brown-compl-compl);
}

.color-brown-compl svg path, .color-brown-compl svg rect, .color-brown-compl svg circle {
  fill: var(--brown-compl);
}

.color-brown-compl-trans {
  color: var(--brown-compl-trans);
}

.color-brown-compl-trans::selection, .color-brown-compl-trans ::selection {
  color: var(--brown-compl-trans-compl);
}

.highlight-brown-compl-trans {
  background-color: var(--brown-compl-trans);
}

.highlight-brown-compl-trans::selection {
  background-color: var(--brown-compl-trans-compl);
}

.color-brown-compl-trans svg path, .color-brown-compl-trans svg rect, .color-brown-compl-trans svg circle {
  fill: var(--brown-compl-trans);
}

.repo-list {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.repo-card {
  border-radius: 0.286rem;
  background: var(--black);
  padding: 0.571rem;
  margin: 0.571rem;
  max-width: 600px;
  width: 80%;
}
.repo-card a {
  color: var(--white);
}
.repo-card a:hover {
  border-bottom: 0.143rem solid var(--white);
}
.repo-card a:link {
  text-decoration: none;
}
.repo-card a:visited {
  text-decoration: none;
}

.repo-clone-count {
  display: flex;
  flex-direction: row;
  align-items: end;
}

.repo-created-at {
  margin-top: 0.857rem;
}

.sort-by {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 0.571rem;
  margin: 0.571rem;
}
.sort-by a {
  margin: 0.286rem;
  padding: 0.571rem;
  border-radius: 500px;
}
.sort-by a.unselected-category {
  background-color: var(--black);
  color: var(--white);
}
.sort-by a.selected-category {
  background-color: var(--white);
  color: var(--black);
}
.sort-by a:link {
  text-decoration: none;
}
.sort-by a:visited {
  text-decoration: none;
}

div.search-bar-long {
  display: flex;
  flex-direction: row;
  justify-content: center;
}
div.search-bar-long input.submit-button {
  margin-left: 0.286rem;
}

form.search-bar-long {
  width: 80%;
}