body {
	margin: 0;
	height: 100vh;
	width: 100vw;
	font-family: sans-serif;
	color: #ff7474;

	text-align: center;
	background-image: url("/assets/bg-grid-white.png"), linear-gradient(90deg, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 20%, rgba(0,0,0,0) 80%, rgba(0,0,0,0.1) 100%);
	background-color: #421919;
	background-position: 50vw 50vh;
	
	letter-spacing: 1.5px;
	/*filter: grayscale(1);*/
	}

	a { text-decoration: none; color: #339fff; }
	a:hover { text-decoration: underline; color: #83c4ff; }

	#bg {
	width: 100vw;
	height: 100vh;
	}

	#bg-image {
	width: 100vw;
	height: 100vh;
	background-origin: border-box;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url("/assets/index-bg.png");
	filter: hue-rotate(130deg) drop-shadow(0 0 5px #803B3B);
	transform: scale(-1, -1);
	}

	#title {
	position:relative;
	transition: 0.2s ease-out;
	bottom: 0px;
	}

	#title:hover, #title:focus {
	bottom: 4px;
	filter: drop-shadow(0px 0px 5px rgba(255, 190, 35, .5));
	}

	#cover-img {
	margin: 22px 0;
	transition: .2s linear;
	}

	#cover-img:hover, #cover-img:focus {
	filter: drop-shadow(0px 0px 5px rgb(168, 68, 29));
	}

	.hover { transition: .2s linear; }
	.hover:hover { filter: drop-shadow(0px 0px 5px rgba(255, 190, 35, 1)); }

	p {
	margin: 0;
	font-size: 24px;
	}

	main {
	position: absolute;
	height: 496px;
	width: 500px;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	filter: hue-rotate(-130deg);
	}

	#bottom-right {
	position: absolute;
	right: 2px;
	bottom: 2px;
	image-rendering: pixelated;

	transition: .1s ease-in;
	filter: contrast(1) drop-shadow(0 0 1px black) drop-shadow(0 -1px black) drop-shadow(0 -1px black);
	}
	#bottom-right:hover, #bottom-right:focus {
	filter: contrast(2) drop-shadow(0 0 1px black) drop-shadow(0 -1px black) drop-shadow(0 -1px black);
	}
	#bottom-right:active {
	transition: .05s ease-in;
	bottom: 0px;
	filter: contrast(2) drop-shadow(0 0 1px black);
	}