/* aster plot */

.axis path,
.axis line {
  fill: none;
  stroke: #000;
  shape-rendering: crispEdges;
}

.bar {
  fill: orange;
}

.solidArc:hover {
  fill: orangered ;
}

.solidArc {
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.x.axis path {
/*  display: none;*/
}

.aster-score { 
  line-height: 1;
  font-weight: 300;
  font-size: 400%;
}

.aster-label {
    text-transform: uppercase;
    align: center;
    font-family: "Open Sans";
    font-weight: 300;
    font-size: 80%;
}

.bullet .marker { stroke: #000; stroke-width: 2px; }
.bullet .tick line { stroke: #666; stroke-width: .5px; }
.bullet .range.s0 { fill: #eee; }
.bullet .range.s1 { fill: #ddd; }
.bullet .range.s2 { fill: #ccc; }
.bullet .title { font-size: 14px; font-weight: 600; }
.bullet .subtitle { fill: #999; }

/* chart */

#xAxis path, #yAxis path, #xAxis line, #yAxis line {
	stroke: #ccc;
	fill: none;
	shape-rendering: crispEdges;
}

#xAxis text, #yAxis text {
	font-family: "Open Sans";
    font-weight: 300;
    font-size: 80%;
}

#xLabel, #yLabel { font-weight: 600; font-size: 14px; }

.refline { stroke: #ccc; }
.refrect { fill: #ccc; }

#perfimpact, .bullet, .aster { margin: 0 auto; text-align:center; }
.aster {width: 600px;}
.bullet, #perimpact {width: 700px;}