html,
body {
  font-family: "Droid sans", sans-serif;
  font-size: 12px;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
#vis {
  background-color: #222;
}
#vis text {
  fill: #eee;
}
#vis .axis line {
  stroke: #111;
}
#vis .axis text {
  font-size: 10px;
  fill: #eee;
}
#vis .axis .tickLabel line {
  stroke: #ccc;
  stroke-width: 2px;
}
#vis .connections path {
  fill: none;
  stroke: #eee;
  opacity: .3;
  transition: 1s fill linear;
  -webkit-transition: 1s fill linear;
  -moz-transition: 1s fill linear;
  -o-transition: 1s fill linear;
}
#vis .connections path.selected {
  stroke-width: 2;
  opacity: .7;
}
#vis .connections path.unselected {
  opacity: .1;
}
#vis .label line {
  stroke: #eee;
}
#vis .poet circle,
#vis .cycle circle {
  fill: white;
  transition: 1s fill linear;
  -webkit-transition: 1s fill linear;
  -moz-transition: 1s fill linear;
  -o-transition: 1s fill linear;
}
#vis .poet.selected circle,
#vis .cycle.selected circle {
  fill: white !important;
  stroke: yellow;
  stroke-width: 3px;
}
#vis .poet.unselected circle,
#vis .cycle.unselected circle {
  fill: #444;
}
#vis .poet .selections circle,
#vis .cycle .selections circle {
  fill: none;
  stroke-width: 2px;
}
