canvas {
	margin: auto;
	display: block;
	border: white 3px solid;
}

@font-face {
	font-family: "Friz Quadrata";
	src: url('assets/font/Friz Quadrata.otf') format('opentype');
}

h1, h2 {
	font-family: Friz Quadrata;
	font-size: 48px;
	text-align: center;
	font-weight: 700;
	color: #fff;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	text-shadow: 0 0 0.15em #1da9cc;
	user-select: none;
	white-space: nowrap;
	filter: blur(0.007em);
	animation: shake 2.5s linear forwards;
}

h2 {
	font-size: 36px;
	margin-top: -20px;

}

body {
	display: block;
	justify-content: center;
	align-items: center;
	height: 100vh;
	background-color: #000;
}

@keyframes shake {
	5%, 15%, 25%, 35%, 55%, 65%, 75%, 95% {
		filter: blur(0.018em);
		transform: translateY(0.018em) rotate(0deg);
	}

	10%, 30%, 40%, 50%, 70%, 80%, 90% {
		filter: blur(0.01em);
		transform: translateY(-0.018em) rotate(0deg);
	}

	20%, 60% {
		filter: blur(0.03em);
		transform: translate(-0.018em, 0.018em) rotate(0deg);
	}

	45%, 85% {
		filter: blur(0.03em);
		transform: translate(0.018em, -0.018em) rotate(0deg);
	}

	100% {
		filter: blur(0.007em);
		transform: translate(0) rotate(-0.5deg);
	}
}