.counts-wrapper {
  display: flex;
}
.counts-label {
  float: left;
  width: 6em;
}

.counts-bar-wrapper {
  border: 1px solid black;
  height: 10px;
  margin-top: 5px;
  width: 175px;
}
.counts-bar {
    height: 100%;
}

.excellent-bar.counts-bar {
    background-color: green;
}

.vgood-bar.counts-bar {
    background-color: greenyellow;
}

.average-bar.counts-bar {
    background-color: #d8e63e;
}


.bad-bar.counts-bar {
    background-color: #d68418;
}

.terrible-bar.counts-bar {
    background-color: #b02004;
}


.counts-value:before {
	content:"\00a0";
    
}

.excellent-bar.counts-label:before {
    content: "Excellent:";
}

.vgood-bar.counts-label:before {
    content: "Very Good:";
}

.average-bar.counts-label:before {
    content: "Average:";
}


.bad-bar.counts-label:before {
    content: "Bad:";
}

.terrible-bar.counts-label:before {
    content: "Terrible:";
}