:root {
	color-scheme: only dark;
}
body {
	/*background: #000000;*/
	background-image: url("data/bg.gif");
	background-repeat: repeat;
	background-size: auto;
	color: #ffffff;
	font-family: Iosevka Web, monospace;
}
img {
  max-width: 100%;
  height: auto;
}

a img {border: none;}
a:link {color: #8888ff; text-decoration: none;}
a:visited {color: #b35fff; text-decoration: none;}
a:hover {text-decoration: underline;}
a:active {text-decoration: underline;}

#ul-nav {
	/*backdrop-filter: blur(10px);*/
	background: #000000;
	position: fixed;
	font-size: 18px;
	top: 0;
	list-style-type: none;
	margin: 0 -8px;
	padding: 10px 20px;
	width: 100%;
	border-bottom: 5px solid white;
} /* this is upsetting */
#ul-nav a {color: white; padding: 0 5px; text-decoration: none;}
#ul-nav a:hover:not(.active) {color: #6495ed;}

#main {
	padding: 40px 20px 1px 20px;
}
#xero {
  position: fixed;
  left: 0;
  width: 100em;
  min-height: 100%;
  opacity: 0;
  transition: 0.1s;
}
.outline {
	text-shadow:
	-1px -1px 0 #000000,
	1px -1px 0 #000000,
	-1px 1px 0 #000000,
	1px 1px 0 #000000,  
	-1px 0 0 #000000,
	1px 0 0 #000000,
	0 1px 0 #000000,
	0 -1px 0 #000000; /* Terminate with a semi-colon */
}
.active {background-color: #ffffff;}
.mario {
	opacity: 0;
	transition: 20s;
}
.mario:hover {opacity: 1}
.content {
  width: 100%;
}