html {
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #26282a;
	font: 18px monospace;
	height: 100%;
}

*, *:before, *:after {
	box-sizing: border-box;
}

body {
	background-color: #323334 ;
	border-radius: 14px;
	box-shadow: 0px 0px 5px 3px #16182077;
	color: #ebdbb2;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 30ch;
	min-width: 20ww;
	padding: 2em;
}
p {
	margin: 0;
}
p span {
	color: #8ec07c;
	font-weight: bold;
}

p #logo {
	color: #60c0d0;
	font-size: 28px;
	vertical-align:-3px;
}

p #cursor {
	background-color: #add8e6;
	animation: blink 2s infinite;
}
@keyframes blink {
	0% { opacity: 0; }
	49% { opacity: 0; }
	50% { opacity: 1; }
}

a {
	color: inherit;
	text-decoration: none;
}

a:focus,
a:hover {
	font-weight: bold;
}

ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

nav {
	display: grid;
	grid-template-columns: auto auto auto auto;
	padding: 1.5em 0;
}

.tree > .all {
	margin: 0;
	padding-left: 1rem;
}

.all {
	display: inline-block;
	vertical-align: top;
	margin-left: 1em;
	padding-left: 0.5em;
}

.all:nth-child(1) {
	margin-left: 0;
}

li {
	position: relative;
}
li::before, li::after {
	content: "";
	position: absolute;
	left: -0.75rem;
}
li::before {
	border-top: 2px solid #83a598;
	top: 0.45em;
	width: 0.8rem;
}
li::after {
	border-left: 2px solid #83a598;
	height: 100%;
	top: 0.2rem;
}
li:last-child::after {
	height: 0.3rem;
}

h3 {
	position: relative;
}
h3::before, h3::after {
position: absolute;
	left: -0.75rem;
	content: "";
}
h3::before {
	border-top: 2px solid #83a598;
	top: 0.5rem;
	width: 0.6em;
}
h3::after {
	border-left: 2px solid #83a598;
	height: 200%;
	top: 0.5rem;
}

.linksbox {
	text-align: center;
	color: #ebdbb2;
	text-decoration: none;
	width: 8em;
	box-shadow: 5px 5px 3px rgba(27, 34, 38, 0.55);
	padding: 0.2em;
}

.title {
	text-align: center;
	width: 8em;
	margin-left: 0.2em;
}

.math {
	background-color: #689d6a;
}

.\.\. {
	background-color: #928374;
}

.linux {
	background-color: #458588;
}

.social {
	background-color: #b16286;
}

.feed {
	background-color: #cc241d;
}

.reddit {
	background-color: #d65d0e;
}

input {
	background: none;
	color: #323334;
	width: 15px;
	font: inherit;
	text-align: center;
	outline: none;
	border: none;
	border-radius: 0;
	transition: .1s; /* uwu */
}
textarea:focus,
input:focus {
	color: #ebdbb2;
	outline: none;
	width: 30%;
}