#yes-no {
  width: 800px;
  height: 400px; }

.yes-no__value,
.yes-no__label {
  opacity: 0;
  transition: opacity 0.5s;
  text-anchor: middle; }

.yes-no__group:hover .yes-no__value,
.yes-no__group:hover .yes-no__label,
.yes-no__group--biggest .yes-no__value,
.yes-no__group--biggest .yes-no__label {
  opacity: 1; }

.yes-no__group[data-sentiment="very-positive"] .yes-no__bar {
  fill: #2f5587; }

.yes-no__group[data-sentiment="quite-positive"] .yes-no__bar {
  fill: #8597b1; }

.yes-no__group[data-sentiment="quite-negative"] .yes-no__bar {
  fill: #dc7b77; }

.yes-no__group[data-sentiment="very-negative"] .yes-no__bar {
  fill: #dc1d13; }

.yes-no__divider {
  stroke: #dbd9db;
  stroke-width: 8px; }