.spectrum-Rating:hover .spectrum-Rating-icon .spectrum-Rating-starActive,
.spectrum-Rating-icon.is-selected .spectrum-Rating-starActive {
    display: block;
  }
.spectrum-Rating:hover .spectrum-Rating-icon .spectrum-Rating-starInactive,
.spectrum-Rating-icon.is-selected .spectrum-Rating-starInactive {
    display: none;
  }
.spectrum-Rating-icon .spectrum-Rating-starActive,
.spectrum-Rating-icon:hover ~ .spectrum-Rating-icon .spectrum-Rating-starActive {
    display: none;
  }
.spectrum-Rating-icon .spectrum-Rating-starInactive,
.spectrum-Rating-icon:hover ~ .spectrum-Rating-icon .spectrum-Rating-starInactive {
    display: block;
  }
.spectrum-Rating {
  position: relative;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex: 0 0 auto;
      flex: 0 0 auto;

  width: 120px;

  border-radius: 4px;

  cursor: pointer;
}
.spectrum-Rating.is-disabled,
  .spectrum-Rating.is-readOnly {
    cursor: default;
    pointer-events: none;
  }
.spectrum-Rating-input {
  position: absolute;
  z-index: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0.0001;
  pointer-events: none;
}
.spectrum-Rating-icon {
  position: relative;
  background-size: contain;
  background-repeat: no-repeat;
  width: 24px;
  height: 18px;
  padding: 7px 0;
}
.spectrum-Rating-icon.is-currentValue:after {
      border-radius: 2px;
      content: '';
      height: 2px;
      position: absolute;
      bottom: 2px;
      left: 4px;
      right: 4px;
    }
.spectrum-Rating-starActive,
.spectrum-Rating-starInactive {
  width: 18px;
  height: 18px;
  margin: 0 auto;
}