:root{
	scrollbar-color: #333747 #1d1f21;
}
::selection{
	background-color: #333747;
	color:#c397d8;
}
html{
	color: #eaeaea;
	background-color: #1d1f21;
}
body{ padding: 0; margin: 0; }
a{ color: #f0c674; }
a:hover{ color: #1d1f21; background-color: #f0c674; }
a:hover::selection{  color: #f0c674; }
audio{ width: 100%; display: block; margin-top: 1em; }
main{  margin-left: 12em; margin-right: 1em; padding: 1em; border:1pt solid; margin-bottom: 1em;}
main h1{border-bottom: 1pt solid;}
/*
article{
	padding:1em; 
	background: linear-gradient(to right,#1d1f21,#282a2e);
}
*/
nav{height: 100%;padding: 0.5em; float:left; background: #282a2e; border-right:solid 1pt; border-bottom: solid 1pt; width: 10em;}
nav li{list-style: none; list-style-position:outside;}
nav a{ display: block;}
summary{cursor:pointer;}
summary:hover{ color: #1d1f21; background-color: #f0c674; }
footer{text-align:center; border-top:1pt solid; margin-top: 1em;}
footer a{text-decoration:none;}
footer .mirror{text-align:center; color: #f0c674;}
code{ background: #282a2e; border-radius: 1em; padding: 2pt;}
pre{ background: #282a2e; padding: 1em;  border-radius: 1em;}
.logo{
	padding: 5pt 0;
	margin:0;
	width:100%;
	border-bottom: 2pt solid;
	background-color: #282a2e; 
	background: linear-gradient(to right,#b294bb,#282a2e);
}
.logo a{
	color: #eaeaea;
	text-decoration: inherit;
}
.about ul{list-style:none;}
.about img{height:10em; float:left;}
header{text-transform: capitalize; text-align:center;border-bottom:2pt solid; font-weight:bold;}
.page-head{text-transform: capitalize; text-align:center;border-bottom:2pt solid; font-weight:bold;}
@media (max-width: 800px){
	main{max-width:100%; margin: 1em;}
	nav{padding:0; width: 100%; border-right:solid 0pt;}
	nav a{ padding-left: 1em;}
}
.stickers{ text-align:center; }
.gay{
	background:linear-gradient(-45deg, #cc6666, #f0c674, #b5bd68, #8abeb7, #81a2b3, #b294bb);
	background-clip: text;
	background-size:300%;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	animation:gay 8s ease-in-out infinite;
	-moz-animation: gay 8s ease-in-out infinite;
	-webkit-animation: gay 8s ease-in-out infinite;
}
@keyframes gay {
	0%{background-position: 0px 50%;}
	50%{background-position: 100% 50%;}
	10%{background-position: 0px 50%;}
}