/* Vars */
:root {
	--main-color: #3135FC;
	--main-color-dark: hsl(from var(--main-color) h s calc(l - 35));

	--title-shadow-distance: 5px;
	--title-shadow-color: #0A0A2F8A;
	--title-shadow-blur: 3px;
}

/* General layout */
body {
	font-family: 'Inter',
	Arial, sans-serif;
	margin: 0;
	background: radial-gradient(circle,var(--main-color) 0%, var(--main-color-dark) 100%);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	background-attachment: fixed;
	color: #e6f4ea;
	min-height: 100vh;
	overflow: clip;
}

h1 {
	font-family: 'Freckle Face', cursive;
	text-align: center;
	font-size: 10vw;
	color: #ffffff;
	text-shadow:
		0 var(--title-shadow-distance) var(--title-shadow-blur) var(--title-shadow-color),
		var(--title-shadow-distance) 0 var(--title-shadow-blur) var(--title-shadow-color),
		var(--title-shadow-distance) var(--title-shadow-distance) var(--title-shadow-color);

	font-weight: 100;
	margin: 0;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

/* BG Stuff */

.background-pattern {
	mask-repeat: repeat;
	opacity: .15;
	height: 200%;
	width: 200%;
	background-color: black;
	mask-position: 0 0;
	z-index: -1;
}

#scanlines {
	-webkit-mask-image: url(/assets/Images/Lines.png);
	mask-image: url(/assets/Images/Lines.png);
	/*animation: scanlines 0.1s infinite linear;*/
	position: fixed;
	top: -200px;
	left: -200px;
	image-rendering: pixelated;
}

.silhouette {
	-webkit-mask-image: url(/assets/Images/Meat.png);
	mask-image: url(/assets/Images/Meat.png);
	mask-repeat: no-repeat;
	mask-size: auto 100%;
	mask-position: center;
	opacity: .05;
	height: 100%;
	width: 100%;
	background-color: black;
	position: fixed;
	/*animation: scrolling-anim 6s infinite linear;*/
	z-index: -2;
}

.silhouette-img {
	opacity: .08;
	height: 100%;
	position: fixed;
	transform: translate(-50%, -50%);
	top: 50%;
	left: 50%;
	/*animation: scrolling-anim 6s infinite linear;*/
	z-index: -2;
}

/* Animations */

@keyframes scanlines {
	100% {
		mask-position: 0px -3px;
	}
}
