body {
  color: white;
	background-color: black;
	background-image: linear-gradient(black, #222222 1%, black 4%, #222222 6%, black 10%, #222222 12%, black 13%, #222222 16%, black 20%, #222222 23%, black 24%, #222222 28%, black 30%, #222222 34%, black 36%, #222222 39%, black 40%, #222222 43%, black 47%, #222222 48%, black 50%, #222222 52%, black 56%, #222222 59%, black 60%, #222222 64%, black 67%, #222222 69%, black 70%, #222222 71%, black 73%, #222222 76%, black 80%, #222222 83%, black 85%, #222222 86%, black 90%, #222222 94%, black 97%, #222222 99%, black);
  font-size: 1.05em;
  font-family: "Wittgenstein", serif;
  text-align: center;
}
.section {
	background-color: #111111;
  border: .1em solid white;
  padding: 3%;
  margin: 3% 2.9em;
  transition: box-shadow 0.2s;
}
.section:hover {
  box-shadow: -.05em -.05em .3em .05em red, .05em .05em .3em .05em cyan;
}
.sub-section {
	border: .1em solid white;
  padding: 3%;
  margin: 3%;
  transition: box-shadow 0.2s;
}
.sub-section:hover {
  box-shadow: -.05em -.05em .3em .05em red, .05em .05em .3em .05em cyan;
}
.first-box:before {
	content: "䷶䷾䷒䷿䷿䷔䷪䷫䷅䷓䷣䷨䷧䷴䷂䷺䷟䷏䷌䷐䷬䷕䷍䷡䷛䷙䷇䷩䷞䷼䷘䷻䷎䷚䷦䷥䷮䷊䷢䷭䷠䷗䷰䷽䷈䷖䷋䷜䷆䷲䷱䷝䷀䷤䷸䷹䷳䷵䷁䷷䷯䷉䷄䷑䷃";
  color: #111111;
  writing-mode: vertical-rl;
  text-orientation: upright;
  display: block;
  position: fixed;
  top: 1%;
  left: .6em;
  transform: scale(4);
  z-index: -1;
}
.first-box:after {
	content: "䷶䷾䷒䷿䷿䷔䷪䷫䷅䷓䷣䷨䷧䷴䷂䷺䷟䷏䷌䷐䷬䷕䷍䷡䷛䷙䷇䷩䷞䷼䷘䷻䷎䷚䷦䷥䷮䷊䷢䷭䷠䷗䷰䷽䷈䷖䷋䷜䷆䷲䷱䷝䷀䷤䷸䷹䷳䷵䷁䷷䷯䷉䷄䷑䷃";
  color: #111111;
  writing-mode: vertical-rl;
  text-orientation: upright;
  display: block;
  position: fixed;
  top: 0%;
  right: 1.4em;
  transform: scale(4);
  z-index: -1;
}
.header {
	font-family: "Bona Nova SC", serif;
  text-shadow: -.035em 0em .03em red, .035em 0em .03em cyan;
}
.header:before {
	content: "⚝";
  opacity: 0%;
  transition: opacity 0.2s;
  position: absolute;
  transform: translate(-120%, -10%);
}
.header:hover:before {
  opacity: 100%
}
.header:after {
  content: "⚝";
  opacity: 0%;
  transition: opacity 0.2s;
  position: absolute;
  transform: translate(20%, -9%);
}
.header:hover:after {
  opacity: 100%
}
.list {
  text-align: start;
  width: fit-content;
	margin: auto;
}
h1 {
	font-size: 4em;
}
h2 {
	font-size: 3em;
}
h3 {
	font-size: 2.2em;
}
hr {
  transition: box-shadow 0.2s;
}
hr:hover {
  box-shadow: -.05em -.05em .3em .05em red, .05em .05em .3em .05em cyan;
}
img {
	border: .1em solid white;
  border-radius: .5em;
  transition: box-shadow 0.2s, filter .3s ease-in-out;
}
img:hover {
  box-shadow: -.05em -.05em .3em .05em red, .05em .05em .3em .05em cyan;
}
img:active {
	filter: contrast(130%);
}
ul {
	column-count: 2;
  gap: 4em;
}
ol li {
	padding: 0% .3em;
}
a:link {
	color: cyan;
}
a:visited {
	color: pink;
}
a:hover {
	font-style: italic;
}
a:active {
  color:red;
}
#sticky {
  background-color: #111111;
  border: .03em solid white;
  position: sticky;
  top: 0%;
  width: fit-content;
	max-width: 80%;
  padding: 0 10%;
  margin: 6% auto;
  transition: box-shadow 0.2s;
}
#sticky:hover {
  box-shadow: -.05rem -.05rem .3rem .05rem red, .05rem .05rem .3rem .05rem cyan;
}