html {
  font: 17px/1.5 sans-serif;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  color: #1b1e23;
}

body {
  margin: 0;
  height: 100vh;
  width: 100vw;
  background: black;
  color:  white;
}

input, canvas, button {
  vertical-align: middle;
}

#opts {
  position: absolute;
  display: none;
}

#opts select, #opts input {
  width: 100%;
}

#opts label {
  width: 19.5%;
  display: inline-block;
  box-sizing: border-box;
  padding: 0 8px;

  display: inline-flex;
  align-items: end;
}

#opts label .wrap {
  display: inline-block;
}

#opts label .label {
  font-weight: bold;
  font-family: sans-serif;
  font-size: 13px;
  display: block;
}

#opts fieldset {
  border: 1px solid #aaa;
  margin-bottom: .3em;
}

#opts legend {
  font-family: sans-serif;
  font-size: 12px;
  color: #777;
}

/*.iso-25 { fill: red; }
.iso-20 { fill: #1dcc04; }
.iso-15 { fill: red; }
.iso-10 { fill: red; }
.iso-5  { fill: #1dcc04; }
*/

svg {
  width: 100%;
  height: 100%;
}

.place,
.place-label {
  fill: rgb(218, 213, 213);
}

/* text {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 10px;
  pointer-events: none; */
}