@import url("https://fonts.googleapis.com/css?family=Press+Start+2P");
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html,
body {
	line-height: 40px;
}
body {
	position: absolute;
	background: #000000;
	background-size: cover;
}
a {
	color: #ffffff;
}
.activebody{
	margin-left: 4px;
}
.lur {
	font-size: 80%;
}
.start {
	margin-left: 10%;
	margin-right: 40%;
	position: relative;
	color: #ffffff;
	font-size: 35px;
	line-height: 60px;
}
@media screen and (max-width: 480px) {
	#burk {
		margin-left: 16px;
		color: red;
	}
	#lur {
		margin-left: 16px;
		color: red;
	}
}
.scanlines {
	position: fixed;
	width: 130vw;
	height: 140vh;
	pointer-events: none;
	opacity: 5;
	-webkit-animation: opacity 9s linear infinite;
	animation: opacity 9s linear infinite;
	background: linear-gradient(to bottom, transparent 50%, rgba(0, 0, 0, 0.5) 51%);
	background-size: 110% 6px;
	-webkit-animation: scanlines 9s linear infinite;
	animation: scanlines 140s linear infinite;
}
@media screen and (max-width: 480px) {
	.h3{
		font-size: 72px;
	}
}
@-webkit-keyframes scanlines {
  from {
    background: linear-gradient(to bottom, transparent 50%, rgba(106, 101, 109, 0.4) 51%);
    background-size: 100% 12px;
  }
  to {
    background: linear-gradient(to bottom, rgba(106, 101, 109, 0.4) 50%, transparent 51%);
    background-size: 100% 12px;
  }
}
@keyframes scanlines {
  from {
    background: linear-gradient(to bottom, transparent 50%, rgba(106, 101, 109, 0.4) 51%);
    background-size: 100% 12px;
  }
  to {
    background: linear-gradient(to bottom, rgba(106, 101, 109, 0.4) 50%, transparent 51%);
    background-size: 100% 12px;
  }

}
.intro-wrap {
	position: relative;
	font-family: 'Press Start 2P', cursive;
	color: #ffffff;
	font-size: 2rem;
}
.intro-wrap .fullname {
	color: #ffffff;
	position: relative;
	left: 2vw;
	top: 2vw;
}
.intro-wrap .fullname .char {
	-webkit-animation: type 1.2s infinite alternate;
	animation: type 1.2s infinite alternate;
	-webkit-animation-delay: calc(60ms * var(--char-index));
	animation-delay: calc(60ms * var(--char-index));
}
.intr
o-wrap .console-type {
	padding-left: 2vw;
	padding-top: 15vh;
	font-size: 1rem;
}
@-webkit-keyframes opacity {
	0% {
		opacity: .6;
	}
	20% {
		opacity: .3;
	}
	35% {
		opacity: .5;
	}
	50% {
		opacity: .8;
	}
	60% {
		opacity: .4;
	}
	80% {
		opacity: .7;
	}
	100% {
		opacity: .6;
	}
}
@keyframes opacity {
	0% {
		opacity: .6;
	}
	20% {
		opacity: .3;
	}
	35% {
		opacity: .5;
	}
	50% {
		opacity: .8;
	}
	60% {
		opacity: .4;
	}
	80% {
		opacity: .7;
	}
	100% {
		opacity: .6;
	}
}
@-webkit-keyframes type {
	0%,
	19% {
		opacity: 0;
	}
	20%,
	100% {
		opacity: 1;
	}
}

@keyframes type {
	0%,
	19% {
		opacity: 0;
	}
	20%,
	100% {
		opacity: 1;
	}
}
#console-type h1,
#console-type h2 {
	font-size: 1rem;
	white-space: nowrap;
	overflow-x: hidden;
	width: 100%;
}
#console-type .input0 {
	position: absolute;
	opacity: 0;
}
#console-type .output {
	opacity: 1;
}
#console-type .output4 {
	animation: enter 1000ms;
	-webkit-animation: enter 1000ms;
}
#console-type .output5 {
	animation: enter 2000ms;
	-webkit-animation: enter 2000ms;
}
@keyframes enter {
	0% {
		opacity: 0;
		position: absolute;
	}
	99% {
		opacity: 0;
		position: absolute;
	}
	100% {
		opacity: 1;
		position: absolute;
	}
}
@keyframes blink {
	to {
		opacity: 0;
	}
}
.cursor {
	color: #ffffff;
	animation: blink 1s infinite;
}
.cursor:before {
	content: "|";
	color: #ffffff;
}
.cursor:after {
	color: #ffffff;
	animation: blink 1s infinite;
	content: "";
}
input,
textarea {
	font-family: 'Press Start 2P', cursive;
}
.console {
	font-size: 1rem;
  line-height: 1.4;
  margin-top: .2rem;
	animation: enter 2s;
	-webkit-animation: enter 2s;
  margin-bottom: 2vw;
}
.command {
	background-color: transparent;
	width: 33rem;
	color: #ffffff;
	border: none;
	outline: none;
	box-shadow: none;
	padding: 0;
	font-family: 'Press Start 2P', cursive;
  font-size: 1rem;
}
.hide {
	display: none;
}