/*!
 * d3.compose - Compose complex, data-driven visualizations from reusable charts and components with d3
 * v0.15.13 - https://github.com/CSNW/d3.compose - license: MIT
 */
.chart-compose {
  font-size: 14px;
  background-color: #fff;
  border: solid 1px #ddd;
}

.chart-index-0 {stroke: #1f77b4; fill: #1f77b4;}
.chart-index-1 {stroke: #ff7f0e; fill: #ff7f0e;}
.chart-index-2 {stroke: #2ca02c; fill: #2ca02c;}
.chart-index-3 {stroke: #d62728; fill: #d62728;}
.chart-index-4 {stroke: #9467bd; fill: #9467bd;}
.chart-index-5 {stroke: #8c564b; fill: #8c564b;}
.chart-index-6 {stroke: #e377c2; fill: #e377c2;}
.chart-index-7 {stroke: #7f7f7f; fill: #7f7f7f;}

.chart-line {
  stroke-width: 1.5px;
  fill: none;
}

.chart-bar {
  stroke: none;
  shape-rendering: crispEdges;
}

.chart-label-text {
  font-size: 0.85em;
  stroke: none;
  fill: black;
}
.chart-label-bg {
  opacity: 0.2;
  fill: white;
  stroke: none;
}

.chart-title {
  font-size: 1.2em;
  font-weight: bold;
}
.chart-axis-title {
  font-size: 1.1em;
  font-weight: bold;
}

.chart-axis path {
  fill: none;
  stroke-width: 2px;
  stroke: black;
}
.chart-axis .tick {
  font-size: 0.9em;
}
.chart-axis .tick line, .chart-axis line.tick {
  stroke: black;
}

.chart-legend-label {
  font-size: 0.9em;
}

.chart-gridline {
  stroke-width: 0.5px;
  stroke: #c9c9c9;
  fill: none;
}