/* http://meyerweb.com/eric/tools/css/reset/
----------------------------------------------------------------------------------------- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin : 0; padding : 0; border : 0; outline : 0; font-size : 100%; vertical-align : baseline; background : transparent; }
body { line-height : 1; }
ol, ul { list-style-type : none; }
:focus { outline : 0 }
ins { text-decoration : none; }
del { text-decoration : line-through }

body    { font: 12px/1.5 "Lucida Grande", Tahoma, serif; overflow: hidden; text-align: center }
#stage  { position: relative; display: inline-block; padding: 40px 20px; max-width: 90%; text-align: left; margin: 0 auto }

.no-text-shadow { text-shadow: none }
.no-drop-shadow {}
.hidden         { display: none }
.visible        { opacity: 1; display: static }
.centered       { text-align: center; margin: 0 auto }

h1    { font-size: 3.6em }
h2    { font-size: 3.2em }
h3    { font-size: 3em }
p, li { font-size: 1.4em }
p     { margin: 0.5em 0 }

ul    { display: inline-block; margin-left: 2em }

#stage > * { text-rendering: optimizeLegibility }
a          { cursor: pointer }

div.slice { position: absolute; display: block; width: 0; top: -10px; bottom: -10px }

#help {
  display: inline-block;
  font-size: 200%;
  opacity: 0;
  position: fixed;
  right: 10px;
  top: 10px;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.6);
  color: #fff;
  padding: 10px;
}