body, html {
  padding: 0;
  margin: 0;
  height: 100%;
  width: 100%;
  color: #45D5AB;
  background: #121212;
  -webkit-text-size-adjust: 100%;
  font-size: 18px;
  font-family: 'Roboto', sans-serif; }

#table_element {
  position: absolute;
  display: table;
  width: 100%;
  height: 100%;
  text-align: center; }

.table_row {
  display: table-row; }

.centered_content {
  display: table-cell;
  vertical-align: middle; }

#main_content {
  width: 808px;
  margin: 0 auto;
  padding: 30px; }
  @media (max-width: 868px) {
    #main_content {
      width: 100%;
      box-sizing: border-box; } }

img {
  width: 100%;
  height: auto; }

#scene {
  width: 400px;
  height: 400px;
  margin: 0 auto; }
  @media (max-width: 460px) {
    #scene {
      width: 250px;
      height: 250px;
      margin-top: 10px; } }

#scene canvas {
  cursor: -webkit-grab;
  cursor: -moz-grab; }

#scene canvas:active {
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing; }

p {
  margin: 5px; }

.hide_at_480 {
  display: none; }
  @media (min-width: 481px) {
    .hide_at_480 {
      display: inline; } }

.show_at_480 {
  display: none; }
  @media (max-width: 480px) {
    .show_at_480 {
      display: inline; } }

a:link, a:visited {
  text-decoration: none; }