rect {
  stroke: #CACACA;
}
#loading {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(100, 100, 100, 0.6);
  text-align: center;
  padding-top: 200px;
}
#loading.little {
  right: inherit;
  left: inherit;
  bottom: inherit;
  background-color: inherit;
  padding: 0;
  margin-left: 400px;
}
.modal-dialog {
  width: 80%;
}
.modal-content .row {
  margin: 0;
}
text {
  font-size: 6pt;
}

body {
  margin: 0;
}
#selected-column-rect {
  width: 50px;
  height: 50px;
  border: solid black 2px;
  background-color: white;
}
#selected-column-rect.on {
  background-color: orange;
}

code {
  font-size: 24pt;
}

#ac-context {
  width: 600px;
  height: 600px;
}

#input-encoding rect {
  fill: white;
}
#input-encoding rect:hover {
  stroke: black;
  stroke-width: 5px;
}
#input-encoding rect.pool {
  fill: #ffcc6e !important;
}

#active-columns rect:hover, #active-columns rect.clicked {
  stroke: #1f04ff;
  stroke-width: 3px;
  fill: #1f04ff;
}

#connections line {
  stroke-width: 1px;
}

#connections circle {
  fill: #1f04ff;
  stroke: #6762ff;
}

#permanence-threshold {
  border: solid black 1px;
  background-color: white;
}

code.dim {
  margin-left: 10px;
  font-size: 12pt;
}

ul li {
  list-style: none;
}
li .btn {
  font-size: 16pt;
  margin: 6px 0;
  padding: 2px 8px;
}

#cell-legend td {
  margin: 30px;
}

#cell-legend .key {
  border: solid black 2px;
  width: 50px;
  height: 50px;
  padding: 2px;
}

#cell-legend .min {
  background-color: #00ff00;
}

#cell-legend .max {
  background-color: #ff0000;
  color: white;
}