html,
body {
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  font-family:Verdana, Arial, sans-serif;
  background:#fff;
  cursor:default;
}
canvas {
  display:block;
  margin:0 auto;
  image-rendering:-moz-crisp-edges;
  image-rendering:-webkit-optimize-contrast;
  image-rendering:pixelated;
}
canvas.margin {
  position:absolute;
  outline:1px solid #ddd;
}
#img,
#form {
  position:absolute;
  left:-99999px;
  top:0;
}
button::-moz-focus-inner {
  padding:0;
  border:0;
}
button {
  position:relative;
  overflow:visible;
  clear:both;
  display:block;
  width:90px;
  height:46px; /* (= height (33px) + padding + border) */
  margin:0;
  padding:6px 8px;
  font:28px Arial, Helvetica, sans-serif;
  letter-spacing:1px;
  color:#333;
  background:#ebebeb;
  border:1px solid #cbcbcb;
  border-width:0 1px 1px 0;
  cursor:pointer;
}
button:first-child {
  margin-bottom: 15px;
}
button:hover,
button:focus {
  color:#002dff;
  background-color:#d7d7ff;
  border-color:#90b0e7;
}
button:active {
  color:#576e97;
  background-color:#b7c5eb;
  border-color:#7d7ce3;
  border-width:1px 0 0 1px;
}
#buttons {
  position:fixed;
  top:30px;
  right:30px;
  height:0;
}
#about {
  position:fixed;
  top:0;
  right:0;
  display:block;
  width:6px;
  padding:8px 12px;
  font-size:10px;
  line-height:14px;
  text-decoration:none;
  color:gray;
}
#about:hover,
#about:focus {
  color:#000;
}
* {
  -moz-user-select:none;
  -khtml-user-select:none;
  -webkit-user-select:none;
  -ms-user-select:none;
  user-select:none;
}
#error {
  position: absolute;
  width: 400px;
  margin: 200px 0 0 500px;
  font-size: 18px;
  line-height: 36px;
}
/* Mobile browsers (Opera Mobile, Safari iOS, Chrome Android) */
@media only screen and (max-device-width:480px) {
  button {
    width:40px;
    height:23px;
    margin:0 0 15px 0;
    padding:2px 3px 4px 4px;
    font-size:14px;
    letter-spacing:0;
  }
  #about {
    position:fixed;
    top:0;
    right:0;
    padding:2px;
  }
  #buttons {
    position:fixed;
    top:15px;
    right:12px;
  }
}