body {
  font-family: sans-serif;
  font-size: 200%;
  background: #cccccc;
}

.clickable {
  border: 1px solid white;
}
.clickable:hover {
  cursor: pointer;
  border: 1px solid #bbbbbb;
}

.outercontainer {
  padding: 0 9% 1px 9%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.container {
  width: 100%;
  text-align: center;
  background: white;
  margin: 1em 0;
  clear: both;
}

.toprow {
  background: white;
  padding: .3em 1em;
  margin: 1em 0;
  text-align: center;
}

.timer {
  float: left;
  width: 3em;
}

.bank {
  float: right;
  width: 6em;
}

.round {
  font-size: 50%;
  float: right;
}

.row {
  padding: .5em 0;
}

.col {
  position: absolute;
  width: 26%;
}

.col1 {
  left: 10%;
}

.col2 {
  left: 37%;
}

.col3 {
  left: 64%;
}

.hidden {
  display: none;
}

.struck {
  text-decoration: line-through;
  color: #777777;
}

.grey {
  background: #dddddd;
}

.blue {
  background: #00ffcc;
}

.red {
  background: #ccff00;
}

.none {
}

.bottom {
  padding: 1em;
  background: white;
  font-size: 40%;
  line-height: 2em;
}

.keybox { 
  padding: 0px .2em;
  border: 1px solid #666666;
  background-color: #dddddd;
}