
body {
  font-size: 16px;
  font-family: 'Old Standard TT', serif;
  background: #ede0ce;

  /* Don't highlight stuff on double clicks */
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.structure {
  width: 640px;
  margin-left: auto;
  margin-right: auto;
  background: #ede0ce;
}

.structure .header {
  margin-top: 1em;
}

#world {
  float: left;
  width: 400px;
}

#world canvas {
  cursor: pointer;
}

#toolbar {
  float: left;
  width: 200px;
  height: 100px;
  background: #ede0ce;
  padding: 0 1em;
  text-transform: uppercase;
}

#toolbar .section-title {
  font-weight: bold;
}

#toolbar .section-wrapper {
  margin-top: 10px;
  margin-bottom: 20px;
}

#toolbar .button-row {
  margin-bottom: 10px
}

#toolbar .checkbox-row {
  margin-top: 6px;
}

#status h2 {
  font-size: 20px;
}

#status {
  font-size: 12px;
  background: purple;
}

.clearfix {
  clear: both;
}

.item-selector {
  background: #78A890;
  border: 3px solid #78A890;
  padding: 2px;
  margin-right: 6px;
  cursor: pointer;
  border-radius: 4px;

  /* Don't highlight buttons on clicks */
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.item-selector:hover, .item-selector.selected {
  border: 3px solid #09738A;
}

.item-selector.disabled {
  background: #aaa;
  color: #666;
  border: 3px solid #aaa;
  cursor: not-allowed;
}

.item-selector.disabled:hover {
  border: 3px solid #999;
}
