body,html {
    margin: 0;
    padding: 0;
}
* {
    box-sizing: border-box;
}
body {
	font-family: GraublauWeb, Verdana, arial, helvetica;
	background-image: url("background.png");
	background-repeat: repeat;
	background-size: cover;
	color: #14143d;
}


a {
	color: cornflowerblue;
	text-decoration: none;
}

a:visited {
	color: cornflowerblue;
	text-decoration: none;
}

a:hover {
	color: cornflowerblue;
	text-decoration: underline;
}
.screenClass /* the whole screen */
{
	position: absolute;
    min-width: 320px;
    min-height: 200px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.paperClass { /* the PAPER area */
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	height: 100%;
	background-color: black;
    image-rendering: -moz-crisp-edges;
    image-rendering: -webkit-crisp-edges;
    image-rendering: pixelated; /* Remove the last three lines to let graphics and text blurred / Quita las últimas tres líneas para que texto y gráficos aparezcan difuminados */
}


.goodbye {
	position:absolute;
	left: 0;
	top:0;
	bottom:0;
	right:0;
	background-color: black;
	font-size: medium;
	padding: 20px;
	color: whitesmoke;
	z-index: 4000;
	display: none;
}

#imageBuffer 
{
	position:absolute;
	left: 0;
	top:0;
	bottom:0;
	right:0;
	display:none;
	z-index: -1;
}

.anykey_layer {
	width: 100vw;
	height: 100vh;
	position: absolute;
	left: 0;
	top:0;
	bottom:0;
	right:0;
}

.scanlines {
  position: relative;
  overflow: hidden;
}
.scanlines:before, .scanlines:after {
  display: block;
  pointer-events: none;
  content: "";
  position: absolute;
}
.scanlines:before {
  width: 100%;
  height: 2px;
  z-index: 2147483649;
  background: rgba(0, 0, 0, 0.3);
  opacity: 0.75;
  -webkit-animation: scanline 6s linear infinite;
          animation: scanline 6s linear infinite;
}
.scanlines:after {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2147483648;
  background: linear-gradient(to bottom, transparent 50%, rgba(0, 0, 0, 0.3) 51%);
  background-size: 100% 4px;
  -webkit-animation: scanlines 1s steps(60) infinite;
          animation: scanlines 1s steps(60) infinite;
}

/* ANIMATE UNIQUE SCANLINE */
@-webkit-keyframes scanline {
  0% {
    transform: translate3d(0, 200000%, 0);
  }
}
@keyframes scanline {
  0% {
    transform: translate3d(0, 200000%, 0);
  }
}
@-webkit-keyframes scanlines {
  0% {
    background-position: 0 50%;
  }
}
@keyframes scanlines {
  0% {
    background-position: 0 50%;
  }
}

@media (max-height: 600px) {
	.scanlines:before {
	  -webkit-animation: none;
			  animation: none;
	}
	.scanlines:after {
	  -webkit-animation: none;
			  animation: none;
	}
}