html, body {
  width: 100%;
  height: 100%;
  background-color: black;
  padding: 0;
  margin: 0;
}

canvas {
  -webkit-transform: translatez(360deg);
     -moz-transform: translatez(0);
      -ms-transform: translatez(0);
       -o-transform: translatez(0);
          transform: translatez(0);
}

#zoomContainer {
  width: 100%;
  height: 100%;

  position: relative;

  border: 0;
  margin: 0;
  padding: 0;

  background-color: black;
  background-image: url("../images/spinner.gif");
  background-repeat: no-repeat;
  background-position: 50% 50%;
}

#browserWarning {
  display: none;
  height: 100px;

  position: absolute;
  top: 45%;

  margin: 0 50px;

  background-color: black;
  color: white;
  text-align: center;
  font-size: 18px;
  line-height: 22px;
  font-family: "arial", sans;
}

canvas#main {
  display: block;
  width: 640px;
  height: 360px;

  position: relative;

  margin: 0 auto;
  cursor: none;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  /*
  image-rendering: optimizeSpeed;
  image-rendering: -moz-crisp-edges;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: -o-crisp-edges;
  image-rendering: optimize-contrast;
  -ms-interpolation-mode: nearest-neighbor;
  */
}








/* ABC header and footer stuff */

#abcHeader .sites .controller {
  border: 0;
}

.splash {
  width: 215px;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  margin-left: auto;
  font-family: Arial, Helvetica;
  font-size: 14px;
}

.splash .logo {
  display: block;
  width: auto;
  height: 100%;
  float: left;
  border: 0 !important;
  color: white;
  font-style: normal;
  text-decoration: none;
}

.splash .logo.full {
  display: block !important;
}

.splash .logo.half {
  display: none !important;
}

.splash .logo .image {
  display: block;
  float: left;
  border: 0;
  margin-top: 5px;
}

.splash .seperator {
  display: block;
  float: left;
  margin: 9px 15px;
  color: #4f7f8c;
}

.splash .more {
  display: block;
  width: auto;
  height: 100%;
  float: left;
  border: 0 !important;
  color: white;
  font-style: normal;
  text-decoration: none;
}

.splash .more .games {
  display: block;
  float: left;
}

@media (max-width: 549px) {
  .splash {
    width: 75px;
  }

  .splash .logo.full {
    display: none !important;
  }

  .splash .logo.half {
    display: block !important;
  }

  .splash .logo .image.logoAbc {
    display: none !important;
  }

  .splash .seperator {
    display: none !important;
  }

  .splash .more {
    display: none !important;
  }
}