.item {
  min-width: 80px;
  min-height: 80px;
  background: #222;
}
.item.width2 {
  width: 160px;
}
.item.height2 {
  height: 160px;
}
.item.width3 {
  width: 240px;
}
.item.height3 {
  height: 240px;
}
.clear {
  clear: both;
}
h2 {
  margin-top: 40px;
}
/*
 * some base style 
 */
body,
html {
  margin: 0;
  padding: 0;
}
body {
  font-family: 'Helvetica Neue', Helvetica, arial, sans-serif;
  font-size: 118%;
  color: fff;
}
#controls {
  background: rgba(1, 1, 1, 0.3);
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  padding: .4em;
}
#controls p,
#controls label {
  color: #fff;
  text-shadow: 1px 1px rgba(10, 10, 10, 0.2), -1px -1px rgba(10, 10, 10, 0.2);
}
#controls input {
  max-width: 50px;
  padding: 0;
  margin: 0;
}
#controls input,
#controls select,
#controls p {
  font-size: 82%;
}
/*#log {
  background: rgba(1, 1, 1, 0.8);
  font-size: 82%;
  padding: .2em;
  position: absolute;
  left: 0px;
  width: 100%;
}*/
#log {
  float: right;
  color: #fff;
  padding: 0 1em;
}