/* gotta make the page look purty */
/* sidenote, this is hacky as all hell, enjoy... :P */

body {
  background: black;
  color: white;
	animation: fade-me-in 1.5s;
}

@keyframes fade-me-in {
  0% {opacity:0;}
  80% {opacity:0;}
  100% {opacity:1;}
}

pre {
  text-align: center; 
  vertical-align: middle;
  font-size: 25px;
}

/* a lot of this is to center this element on the page, */
/* vertically and horizontally */
#right {
  vertical-align: middle;
  top: 55%; 
  transform: translateY(-50%); 
  position: absolute; 
  z-index: 200;
}

#left {
  vertical-align: middle; 
  top: 50%; 
  transform: translateY(-40%); 
  position: absolute; 
  z-index: 500;
}

#right0 {
  vertical-align: middle;
  top: 35%; 
  transform: translateY(-50%); 
  position: absolute; 
  z-index: 200;
}

#left0 {
  vertical-align: middle; 
  top: 60%; 
  transform: translateY(-55%); 
  position: absolute; 
  z-index: 500;
}

/* a lot of this is to center this element on the page, */
/* vertically and horizontally */
div {
  position: absolute; 
  left: 50%; 
  top: 50%; 
  transform: translateX(-50%, -50%);
}

#instruct {
  color: white;
}

#magic {
  color: blue;
}

/* a lot of this is to center this element on the page, */
/* vertically and horizontally */
#open {
  color: blue; 
  text-align: center; 
  margin: 0;
}

/* a lot of this is to center this element on the page, */
/* vertically and horizontally */
#close {
  color: blue; 
  text-align: center; 
  margin:0;
}