body {
  background:#3a3f3a;
  margin:0; padding:0;
  font:normal 20px/22px Helvetica, Arial, Tahoma, sans-serif;
}
#wrapper {
  margin:4em auto 0 auto;
  width:44em;
}
h1.puzTitle {
  font-size:1em;
  color:#5a5a6a;
  margin-right:1em;
  clear:both;
  text-align:right;
}
h4 {
  margin:0; padding:0;
}
#puzzleBox {
  float:right;
  margin:1em;
  margin-bottom:2em;
  width:22.5em;
  height:22.5em;
  background:#fff;
  border:.1em solid #2a2f2a;
  border-width:0 0 .1em .1em;
}
ul.boxes {
  margin:0; padding:0;
  list-style:none;
}
ul.boxes li {
  display:block; float:left;
  width:.9em; height:.9em;
  border:.1em solid #2a2f2a;
  border-width:.1em .1em 0 0;
  padding:.25em;
  text-align:center;
  text-transform:lowercase;
}
li.null {
  background:#6a6f6a;
}
#clueBox {
  float:left;
  background:#eaefea;
  padding:1em;
  color:#5a5a6a;
}

.clues {
  width:17em;
  list-style:none;
  margin:0; padding:0;
}
.direction {
  font-size:1em;
  font-weight:bold;
  margin-bottom:.5em;
}
.clues ol {
  margin:0; padding:0;
  list-style:none;
}
.clues li ol li {
  font-size:.6em;
  line-height:130%;
  margin:.25em 0;
}
li.num {
  position:relative;
}
.num em {
  font-size:10px;
  position:absolute;
  top:-4px; left:1px;
  font-style:normal;
  font-weight:bold;
}
#showClues {
  float:right;
  padding:.5em 2em;
  margin:0;
  display:block; clear:both;
  border:none;
  color:#eaefea;
  background:#2a2f2a;
  text-align:center;
}
#showClues:hover {
  background:#f27;
}
#letters {
  display:none;
}