canvas {
  float: left;
}

.board{
  height: auto;
}


ul {
  list-style-type:none;
}

li {
  padding-bottom: 15px;
}

.statements {
  vertical-align: top;
}

table {
  border: 1px;
  vertical-align: top;
  border-collapse: separate;
}

td {
  vertical-align: top;
  padding-right: 15px;
  font-family: "Courier New"
}

.question {
  float: left;
}

.buttons {
  margin-left: 28px;
  display: inline;
}

.btn {
  margin-left: 10px;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

#previous-hint-button, #next-hint-button, #apply-hint-button {
  background-color: #ffffff;
  margin-bottom: 8px;
  margin-right: 5px;
}

.result {
  display: inline;
  white-space:nowrap;
  margin-left: 40px;
}

#success {
  color: green;
}

#failure {
  color: black;
}

.player {
  text-align: center;
}


hr {
  display: block;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  margin-left: 5%;
  margin-right: 5%;
  border-style: inset;
  border-width: 1px;
}

.knownKey {
  display: inline;
  float: left;
  margin-left: 1.5em;
}

.mapArrow {
  display: inline;
  float: center;
  margin-left: 1.5em;
  margin-right: 1.5em;
}

.unknownValues {
  display: inline;
  float: right;
  margin-right: 1.5em;
}

.hint {
   background: #eeeeee;
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
   padding: 4px;
   margin-top:8px;
}

#hintText {
  min-height: 3em;
}

.solutionText {
  color: #666666;
}

ul {
  list-style-type: none;
}