body { background-color: black; color: #AAA; font-size: 12pt; padding: 1em; }

#unsupported { border: 1px solid yellow; color: black; background-color: #FFFFAD; padding: 2em; margin: 1em; display: inline-block; }

#sidebar                    { width: 18em; height: 40em; float: left; font-size: 0.825em; background-color: #333; border: 1px solid white; padding: 1em;  }
#sidebar ul                 { padding-left: 1em; list-style-type: none; text-align: right; }
#sidebar ul.back            { margin-bottom: 1em; text-align: left; text-style: italic; }
#sidebar ul.parts           { margin-bottom: 2em; }
#sidebar ul li.back         { margin-bottom: 1em; font-weight: bold; }
#sidebar ul li a            { color: white; text-decoration: none; }
#sidebar ul li a:visited    { color: white; }
#sidebar ul li a:hover      { color: white; text-decoration: underline; }
#sidebar ul li a.selected   { color: #F08010; }
#sidebar ul li a i          { color: #AAA;    }
#sidebar ul li a.selected i { color: #F08010; }
#sidebar .settings          { line-height: 1.2em; height: 1.2em; text-align: right; }
#sidebar .settings.size     { }
#sidebar .settings.speed    { margin-bottom: 1em; }
#sidebar .settings label    { vertical-align: middle; }
#sidebar .settings input    { vertical-align: middle; }
#sidebar .settings select   { vertical-align: middle; }
#sidebar .description       { margin-bottom: 2em; }
#sidebar .description b     { font-weight: normal; color: #FFF; }


@media screen and (min-width: 0px) {
  #sidebar { display: none; }
  #game    { display: block; width: 480px; height: 360px; margin: 0 auto; }
}

@media screen and (min-width: 800px) {
  #game    { width: 640px; height: 480px; }
}

@media screen and (min-width: 1000px) {
  #sidebar { display: block; }
  #game    { margin-left: 18em; }
}

@media screen and (min-width: 1200px) {
  #game    { width: 800px; height: 600px; }
}

@media screen and (min-width: 1600px) {
  #game    { width: 1024px; height: 768px; }
}