:root {
	  --content: #43256e;
	}

	@font-face {
	  font-family: Moms Typewriter;
	  src: url("MomsTypewriter.ttf");
	}

	@font-face {
	  font-family: Brotheric;
	  src: url("BrothericRegular.otf");
	}

	@font-face {
	  font-family: Metal Ultra;
	  src: url("MetalBlockUltra.ttf");
	}

	body {
	  font-family: "Moms Typewriter", sans-serif;
	  margin: 0;
	  background-color: #ffffff;
	  color: #000000;
	  background-image: url("whitebg.jpg");
	  background-size: 700px;
	  background-position: center center;
	  text-shadow: 1px 1px 1px grey;
	  cursor: url("unclicked.png"), auto;
	}

	* {
	  box-sizing: border-box;
	}

	#container {
	  max-width: 900px;
	  margin: 0 auto;
	}

	a {
	  color: #ef0000;
	  text-decoration: none;
	  text-shadow: 0px 0px 3px red;
	  font-weight: bold;
	  transition: color 0.3s ease-in-out, text-shadow 0.3s ease-in-out;
	}

	a:hover {
	  cursor: url("clicked.png"), auto;
	  color: #730006;
	  text-shadow: 0px 0px 3px #730006;
	}

	#header {
	  width: 100%;
	  background-color: #5e4e8c;
	  height: 150px;
	  background-image: url(blackplaid.jpg);
	  background-size: 100%;
	  border: solid 2px gray;
	  border-radius: 4px;
	  box-shadow: 2px 2px 2px #000000;
	}
	
	.button {
	  background: linear-gradient(
		180deg,
		rgba(0, 0, 0, 1) 0%,
		rgba(194, 194, 194, 1) 45%,
		rgba(0, 0, 0, 1) 47%,
		rgba(0, 0, 0, 1) 60%,
		rgba(166, 166, 166, 1) 100%
	  );
	  border: solid 2px gray;
	  border-radius: 4px;
	  box-shadow: 2px 2px 2px #000000;
	  color: #ffffff;
	  font-family: moms typewriter;
	  text-shadow: 0px 0px 3px black;
	  height: 40px;
	  font-size: 17px;
	}
	
	.button:hover {
	  cursor: url("clicked.png"), auto;
	  background: linear-gradient(180deg,rgba(189, 0, 0, 1) 0%, rgba(255, 0, 0, 1) 45%, rgba(117, 0, 0, 1) 47%, rgba(255, 0, 0, 1) 100%);
	  text-shadow: 0px 0px 3px black;
	  border: solid 2px #750000;
	}

	#navbar {
	  height: 40px;
	  background-color: #13092d;
	  width: 100%;
	}

	#navbar ul {
	  display: flex;
	  padding: 0;
	  margin: 0;
	  list-style-type: none;
	  justify-content: space-evenly;
	}

	#navbar li {
	  padding-top: 10px;
	}

	#navbar li a {
	  color: #ed64f5;
	  font-weight: 800;
	  text-decoration: none;
	}

	#navbar li a:hover {
	  color: #a49cba;
	  text-decoration: underline;
	}

	#flex {
	  display: flex;
	}

	/* Width */
	::-webkit-scrollbar {
	  width: 10px;
	}

	/* Track */
	::-webkit-scrollbar-track {
	  background: grey;
	}

	/* Handle */
	::-webkit-scrollbar-thumb {
	  background: black;
	}

	/* Handle on hover */
	::-webkit-scrollbar-thumb:hover {
	  background: #black;
	}

	aside {
	  width: 200px;
	  padding: 20px;
	  font-size: smaller;
	  background-image: url("boxbg.jpg");
	  background-size: 500x;
	  border: solid 2px gray;
	  border-radius: 4px;
	  box-shadow: 2px 2px 2px #000000;
	}

	main {
	  flex: 1;
	  padding: 20px;
	  order: 2;
	  background-image: url("mainbg.jpg");
	  background-size: 500px;
	  border: solid 2px gray;
	  border-radius: 4px;
	  box-shadow: 2px 2px 2px #000000;
	}

	*/ #leftSidebar {
	  order: 1;
	}

	#rightSidebar {
	  order: 3;
	}

	footer {
	  background-color: #000000;
	  background: linear-gradient(
		180deg,
		rgba(0, 0, 0, 1) 0%,
		rgba(194, 194, 194, 1) 45%,
		rgba(0, 0, 0, 1) 47%,
		rgba(0, 0, 0, 1) 60%,
		rgba(166, 166, 166, 1) 100%
	  );
	  border: solid 2px gray;
	  border-radius: 4px;
	  box-shadow: 2px 2px 2px #000000;
	  width: 100%;
	  height: 40px;
	  padding: 10px;
	  text-align: center;
	  color: #ffffff;
	}

	h1,
	h2,
	h3 {
	  color: black;
	  font-weight: lighter;
	  letter-spacing: 3px;
	  font-family: Metal Ultra;
	}

	h1 {
	  font-size: 40px;
	}

	h2 {
	  font-family: moms typewriter;
	}
	

	strong {
	  color: #ef0000;
	  text-decoration: none;
	  text-shadow: 0px 0px 3px red;
	  font-weight: bold;
	}

	.box {
	  background-color: white;
	  border: solid 2px gray;
	  border-radius: 4px;
	  box-shadow: inset 2px 2px 3px grey;
	  padding: 10px;
	}
	
	.shrines {
	  background-color: white;
	  border: solid 2px gray;
	  border-radius: 4px;
	  box-shadow: inset 2px 2px 3px grey;
	  padding: 10px;
	}
	
	.shrines img {
	  filter: grayscale(1)
	}
	
	.shrines img:hover {
	  filter: grayscale(0)
	}
	
	.neighbors {
	  background-color: white;
	  border: solid 2px gray;
	  border-radius: 4px;
	  box-shadow: inset 2px 2px 3px grey;
	  padding: 10px;
	}
	
	.neighbors a {
	  filter: grayscale(1);
	  transition: filter 0.19s ease-in-out;
	}
	
	.neighbors a:hover {
	  filter: grayscale(0);
	}
	
	.featuredpic {
	  background-image: url(pandatony.jpg); 
	  width: 100%; 
	  height: 150px; 
	  background-size: cover;
	  border: solid 2px gray;
	  border-radius: 4px;
	  box-shadow: inset 2px 2px 3px grey;
	  padding: 10px;
	}

	.lyricbox {
	  background: black;
	  color: white;
	  border: solid 2px gray;
	  border-radius: 4px;
	  box-shadow: 2px 2px 2px #000000;
	  padding: 10px;
	}

	#topBar {
	  width: 100%;
	  height: 30px;
	  padding: 10px;
	  font-size: smaller;
	  background-color: #13092d;
	}
	
	ul {
	  list-style-type: disc;
	}


	@media only screen and (max-width: 800px) {
	  #flex {
		flex-wrap: wrap;
	  }

	  aside {
		width: 100%;
	  }

	  main {
		order: 1;
	  }

	  #leftSidebar {
		order: 2;
	  }

	  #rightSidebar {
		order: 3;
	  }

	  #navbar ul {
		flex-wrap: wrap;
	  }
	}

	/*CRT*/
	@keyframes flicker {
	  0% {
		opacity: 0.27861;
	  }
	  5% {
		opacity: 0.34769;
	  }
	  10% {
		opacity: 0.23604;
	  }
	  15% {
		opacity: 0.90626;
	  }
	  20% {
		opacity: 0.18128;
	  }
	  25% {
		opacity: 0.83891;
	  }
	  30% {
		opacity: 0.65583;
	  }
	  35% {
		opacity: 0.67807;
	  }
	  40% {
		opacity: 0.26559;
	  }
	  45% {
		opacity: 0.84693;
	  }
	  50% {
		opacity: 0.96019;
	  }
	  55% {
		opacity: 0.08594;
	  }
	  60% {
		opacity: 0.20313;
	  }
	  65% {
		opacity: 0.71988;
	  }
	  70% {
		opacity: 0.53455;
	  }
	  75% {
		opacity: 0.37288;
	  }
	  80% {
		opacity: 0.71428;
	  }
	  85% {
		opacity: 0.70419;
	  }
	  90% {
		opacity: 0.7003;
	  }
	  95% {
		opacity: 0.36108;
	  }
	  100% {
		opacity: 0.24387;
	  }
	}
	.crt::after {
	  content: " ";
	  display: block;
	  position: fixed;
	  top: 0;
	  left: 0;
	  bottom: 0;
	  right: 0;
	  background: rgba(18, 16, 16, 0.1);
	  opacity: 0;
	  z-index: 2;
	  pointer-events: none;
	  animation: flicker 1s infinite;
	}