<!DOCTYPE html>
<html lang='en'>
  <head>
    <meta charset='UTF-8'>
    <title>City 3D</title>
    <link href='./stylesheets/city-3d.css' rel='stylesheet'>
  </head>
  <body>
    <div class='container'>
      <button class='rotate rotateX'>Rotate X</button>
      <button class='rotate rotateY'>Rotate Y</button>
      <div class='building-test'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
    </div>
    <div class='scene buildings'>
      <div class='building'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
      <div class='building'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
      <div class='building'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
      <div class='building'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
      <div class='building'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
      <div class='building'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
      <div class='building'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
      <div class='building'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
      <div class='building'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
      <div class='building'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
      <div class='building'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
      <div class='building'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
      <div class='building'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
      <div class='building'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
      <div class='building'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
      <div class='building'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
      <div class='ground'>
        <div class='face top'></div>
        <div class='face bottom'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
    </div>
    <div class='scene building-sans-bottom'>
      <div class='building'>
        <div class='face top'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
      </div>
      <div class='building-edged-roof'>
        <div class='face top'></div>
        <div class='face back'></div>
        <div class='face front'></div>
        <div class='face left'></div>
        <div class='face right'></div>
        <div class='face front-top'></div>
        <div class='face back-top'></div>
        <div class='face left-top'></div>
        <div class='face right-top'></div>
        <div class='face front-interior'></div>
        <div class='face back-interior'></div>
        <div class='face left-interior'></div>
        <div class='face right-interior'></div>
      </div>
    </div>
  </body>
</html>
