body { margin: 0px; padding: 0px; font-family: 'Open Sans', sans-serif; font-weight: 300; background-color: #000; }
#glCanvas { width: 100%; height: 100%; position: fixed; left: 0px; right: 0px; }
#main {
  color: #fff;
  width: 100%;
  margin: 1em 0 2em 0;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  z-index: 2;
}

.header { margin: 240px 0px 300px 0px; }
.center { text-align: center; }
.left { text-align: center; }
.section { width: 70%; margin: auto; font-size: 1.8em; }
.section .inner { padding: 14px 20px 20px 20px; }
.section h2 { margin-bottom: 20px; margin-top: 60px; }
.footer { color: #777; }

h1 { letter-spacing: 6px; margin: 0px 0px; padding: 20px 0px; display: block; }
h2 { font-weight: 300; margin: 0px 0px; padding: 20px 0px; display: block; }
p { padding: 10px 0px; margin: 0px; }
a { text-decoration: none; color: #00D6FF; }
a:hover { color: #7BEAFF; }

.intro h1 { padding: 0px 0px; }
.intro h2 { padding: 10px 0px; margin: 0px; }

.bio { line-height: 1.4em; margin-bottom: 180px; }

.gameicon { width: 900px; height: 296px; margin: auto; }
.game .title { text-align: left; padding: 0px 0px 10px 0px; }
.game .icon { width: 100%; }
.game { background-color: #000; margin-bottom: 20px; font-size: 0.8em; }
.game .date { color: #666; }
.game .description { color: #aaa; padding-top: 6px; }
.game { cursor: pointer; }

@media (min-width: 1200px) {
  .section { font-size: 2.25vw; }
}

@media (max-width: 850px) {
  .section { font-size: 1.5em; }
}
@media (max-width: 650px) {
  .section { width: 100%; font-size: 1.2em; }
  .header { margin: 100px 0px 100px 0px; }
  .bio { margin-bottom: 100px; }
  .game .inner { opacity: 1.0 !important; }
}