body{
  color:#ccc;
  font-family:Helvetica, sans-serif;
  font-size:1em;
  background-color:#111;
}
.txt {
  position:absolute;
  top:10px;
  left:10%;
}
.tilt-refs {
  display:none;
}
.container {
  position:relative;
}
.game-display {
  display: none;
}
.back-btn {
  position: absolute;
  top: 100px;
}
.game-message {
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,2,0.7);
  text-align: center;
  color: red;
  z-index: 100;
  position: absolute;
  display:none;
  top:0;
  left:0;
}
.game-message h2 {
  margin: 20% 0 6%;
  font-size: 270%;
  border-top: 4px solid red;
  border-bottom: 4px solid red;
  padding: 0.5em 0;
}
.game-message a {
  background-color: rgb(239, 255, 8);
  text-decoration: none;
  padding: 1em 2em;
  color: rgb(255, 0, 0);
  margin-top: 42px;
  font-weight: bold;
  border: 5px dashed rgb(255, 136, 0);
  border-radius: 30px;
}
.robot {
  position:absolute;
 /* top:50%;
  left:40%;*/
}
canvas {
  position:absolute;
  top:0px;
  left:0px;
  
}
canvas #gameboard{z-index:10;}
canvas #starfield{z-index:5;}

@media screen and (max-width: 900px) {
  .game-message h2 {
    margin: 45% 0 6%;
  }
}
@media screen and (max-width: 400px) {  
  
  .robot{
    top:30%;
    
  }
  .robot img {
    width:80px;
  }
  .reset h2 {
    margin-bottom:20%;
  }
  .game-message h2 {
    margin: 55% 0 26%;
  }
}