<header>
      <h1>Second Cube</h1>
      <p>An experiment on infinite sequences and CSS animations.</p>
      <p>Based on <a href="http://ffffound.com/image/15cca3c0766a634da538fb4bc8b23e2f5a4fe8a7">this image</a> from ffffound.</p>
    </header>
    <div id="viewport">
      <div id="tower">
        <div id="cubes"></div>
      </div>
    </div>
<script type="text/template" id="face">
<svg
  x="0px" y="0px"
  width="<%= size %>px"
  height="<%= size %>px"
  viewBox="0 0 <%= size %> <%= size %>"
  class="face <%= position %>"
  style="bottom: <%= bottom %>px;"
  id="<%= id %>"
  >
<g class="background">
  <rect width="<%= size %>" height="<%= size %>"/>
</g>
<g class="corners">
  <g>
    <polygon points="<%= points.tr %>"/>
    <polygon class="tl" points="<%= points.tl %>"/>
    <polygon points="<%= points.bl %>"/>
    <polygon points="<%= points.br %>"/>
  </g>
</g>
<g class="cross">
  <polygon points="<%= points.cross %>"/>
</g>
</svg>
</script>