/* Resets */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
img,svg{display:block;max-width:100%;border:none; outline:none;}
@font-face {
	font-family: 'GlassTTY';
	src: url('/fonts/Glass_TTY_VT220.woff2') format('woff2');
}
html {min-height:100%}
body {
	background-color: #696b6e;
	background:
		url("/images/OldPlastic_002.jpg") center / cover no-repeat;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	color: #1d2021;
	font-family: Helvetica, sans-serif;
	font-size: 16px;
	text-align: center;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	min-height:100vh;
}
.container {
	display:flex;
	flex-direction: column;
	width:98%;
	min-width: 320px;
	max-width: 760px;
	padding:2em 1.2em 3em;
}
pre {
	background: #0f0f0f;

	border-radius: .7em;
	padding: 1.5em 2em 38px;
	margin: 1.5rem auto 0;
  width:100%;
	box-shadow: 0 0 20px rgba(51,152,255,.25), inset 0 0 12px rgba(51,152,255,.17), inset 0 -4px 42px rgba(0, 0, 0, 0.9);
	white-space: pre;
}
code {
	font-family: 'GlassTTY', monospace;
	font-size: .95em;
	line-height: 1.4;
	color: #3398ff;
	text-shadow: 0 0 10px rgba(51,152,255,.57);
	white-space: pre-line;
}
/* Typography */
h1 {
	margin: 0;
}
p {
	margin: 0 0 3em;
}
.logo {
	width:256px;
	margin-bottom:.5em;
	transition: all 1s ease-in-out;
	height: auto;
	margin:0 auto;
	mix-blend-mode: multiply;
}
/* Responsive Design */
@media (min-width: 400px) {
	.container {min-width: 396px}
}
@media (min-width: 760px) {
	p {
		font-size: 1.2em;
	}
	.logo {
		width: 320px;
		margin-bottom: .25em
	}
	code {font-size:1em}
}
@media (min-width: 1024px) {
	.logo {width: 512px;}
	.container {max-width: 920px}
	code {font-size:1.2em}
}
@media (min-width: 1399px) {
	.container {max-width: 1100px}
}
@media (min-width: 1599px) {
	.container {max-width: 1400px}
}