@font-face {
    font-family: "Fira Code";
    src: url('../fonts/FiraCode-VariableFont_wght.woff2') format('woff2-variations'),
     	 url('../fonts/FiraCode-VariableFont_wght.ttf') format('truetype-variations');
	font-weight: 100 200 300 400 500 600 700 800 900;
    font-style: normal;
    font-display: swap;
}

body { 
	overflow-x: hidden;
	overflow-y: auto;
}

body, #background {
	background-color: white;
	width: 100vw;
	height: 100vh;
	margin: 0; 
	padding: 0; 
}

#body,
.font {
	font-family: "Fira Code", monospace; 
	color: white !important;
	font-size: 0.8rem; 
	font-style: normal;
	font-weight: 100;
	line-height: 1.8rem;
	text-rendering: geometricPrecision;
	text-align: center;
}

#background {
	display: block;
	position: fixed;
	top: 0; left: 0;
	z-index: -1;
	box-shadow: 0px 0px 200px rgba(0,0,8,0.9) inset;
	background: url(
		"data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22200%22%20height%3D%22200%22%3E%3Cfilter%20id%3D%22n%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%220.47%22%20numOctaves%3D%223%22%20stitchTiles%3D%22stitch%22%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20filter%3D%22url(%23n)%22%20opacity%3D%220.45%22%2F%3E%3C%2Fsvg%3E"), #000000;
}

#centralize, 
#logo  {
	padding: 0;
	margin: 0;
	text-align: center;
}

#centralize {
	display: block; 
	position: absolute; 
	top: 50%; left: 50%;
	transform: translate(-50%,-50%);
}

#logo {
	--y: 200px;
  	width: var(--y);
  	height: calc(var(--y) * 0.65);
	margin: auto;
	background-image: url('../img/yumla-w.png');
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}

/* ----- END OF FILE ----- */