body {
  background: #1d1645;
}

svg {
  background: #1d1645;
  display: block;
  margin: 50px auto;
}

path {
  fill: none;
  stroke-width: 3;
  opacity: 0.15;
  -webkit-transition: all 300ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition: all 300ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
}

g.grid > path {
  stroke: #6655ae;
  opacity: 1;
}

.green {
  stroke: #67f9bb;
  fill: #67f9bb;
  fill-opacity: 0.25;
}

.red {
  stroke: #fb4455;
  fill: #fb4455;
  fill-opacity: 0.25;
}

.yellow {
  stroke: #ffee66;
  fill: #ffee66;
  fill-opacity: 0.25;
}

.active {
  opacity: 1;
}

.circle {
  fill-opacity: 1;
}