.spectrum--large .spectrum-Rating {

  width: 150px;

  border-radius: 5px;
}
.spectrum--large .spectrum-Rating-icon {
  width: 30px;
  height: 22px;
  padding: 9px 0;
}
.spectrum--large [dir="ltr"] .spectrum-Rating-icon.is-currentValue:after {
      left: 5px;
}
.spectrum--large [dir="rtl"] .spectrum-Rating-icon.is-currentValue:after {
      right: 5px;
}
.spectrum--large [dir="ltr"] .spectrum-Rating-icon.is-currentValue:after {
      right: 5px;
}
.spectrum--large [dir="rtl"] .spectrum-Rating-icon.is-currentValue:after {
      left: 5px;
}
.spectrum--large .spectrum-Rating-icon.is-currentValue:after {
      border-radius: 2px;
      height: 2px;
      bottom: 2px;
    }
.spectrum--large .spectrum-Rating-starActive,
.spectrum--large .spectrum-Rating-starInactive {
  width: 22px;
  height: 22px;
}
.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;
}
[dir="ltr"] .spectrum-Rating-icon.is-currentValue:after {
      left: 4px;
}
[dir="rtl"] .spectrum-Rating-icon.is-currentValue:after {
      right: 4px;
}
[dir="ltr"] .spectrum-Rating-icon.is-currentValue:after {
      right: 4px;
}
[dir="rtl"] .spectrum-Rating-icon.is-currentValue:after {
      left: 4px;
}
.spectrum-Rating-icon.is-currentValue:after {
      border-radius: 2px;
      content: '';
      height: 2px;
      position: absolute;
      bottom: 2px;
    }
.spectrum-Rating-starActive,
.spectrum-Rating-starInactive {
  width: 18px;
  height: 18px;
  margin: 0 auto;
}
.spectrum--dark .spectrum-Rating.is-focused {
    box-shadow: 0 0 0 2px rgb(38, 128, 235);
  }
.spectrum--dark .spectrum-Rating:hover .spectrum-Rating-icon {
      color: rgb(185, 185, 185);
    }
.spectrum--dark .spectrum-Rating:hover .spectrum-Rating-icon:hover {
        color: rgb(227, 227, 227);
      }
.spectrum--dark .spectrum-Rating:hover .spectrum-Rating-icon:active {
        color: rgb(255, 255, 255);
      }
.spectrum--dark .spectrum-Rating:hover .spectrum-Rating-icon.is-currentValue:after {
          background: currentColor;
        }
.spectrum--dark .spectrum-Rating-icon {
  color: rgb(185, 185, 185);
}
.spectrum--dark .spectrum-Rating-icon.is-selected {
    color: rgb(55, 142, 240);
  }
.spectrum--dark .spectrum-Rating-icon:hover ~ .spectrum-Rating-icon {
      color: rgb(185, 185, 185);
    }
.spectrum--dark .spectrum-Rating--quiet .spectrum-Rating-icon {
    color: rgb(185, 185, 185);
  }
.spectrum--dark .spectrum-Rating--quiet .spectrum-Rating-icon.is-selected {
      color: rgb(185, 185, 185);
    }
.spectrum--dark .spectrum-Rating--quiet:hover .spectrum-Rating-icon {
      color: rgb(185, 185, 185);
    }
.spectrum--dark .spectrum-Rating--quiet:hover .spectrum-Rating-icon:hover {
        color: rgb(227, 227, 227);
      }
.spectrum--dark .spectrum-Rating--quiet:hover .spectrum-Rating-icon:active {
        color: rgb(255, 255, 255);
      }
.spectrum--dark .spectrum-Rating.is-disabled .spectrum-Rating-icon {
      color: rgb(90, 90, 90);
    }
.spectrum--dark .spectrum-Rating.is-disabled .spectrum-Rating-icon.is-selected {
        color: rgb(90, 90, 90);
      }
.spectrum--darkest .spectrum-Rating.is-focused {
    box-shadow: 0 0 0 2px rgb(20, 115, 230);
  }
.spectrum--darkest .spectrum-Rating:hover .spectrum-Rating-icon {
      color: rgb(162, 162, 162);
    }
.spectrum--darkest .spectrum-Rating:hover .spectrum-Rating-icon:hover {
        color: rgb(200, 200, 200);
      }
.spectrum--darkest .spectrum-Rating:hover .spectrum-Rating-icon:active {
        color: rgb(239, 239, 239);
      }
.spectrum--darkest .spectrum-Rating:hover .spectrum-Rating-icon.is-currentValue:after {
          background: currentColor;
        }
.spectrum--darkest .spectrum-Rating-icon {
  color: rgb(162, 162, 162);
}
.spectrum--darkest .spectrum-Rating-icon.is-selected {
    color: rgb(38, 128, 235);
  }
.spectrum--darkest .spectrum-Rating-icon:hover ~ .spectrum-Rating-icon {
      color: rgb(162, 162, 162);
    }
.spectrum--darkest .spectrum-Rating--quiet .spectrum-Rating-icon {
    color: rgb(162, 162, 162);
  }
.spectrum--darkest .spectrum-Rating--quiet .spectrum-Rating-icon.is-selected {
      color: rgb(162, 162, 162);
    }
.spectrum--darkest .spectrum-Rating--quiet:hover .spectrum-Rating-icon {
      color: rgb(162, 162, 162);
    }
.spectrum--darkest .spectrum-Rating--quiet:hover .spectrum-Rating-icon:hover {
        color: rgb(200, 200, 200);
      }
.spectrum--darkest .spectrum-Rating--quiet:hover .spectrum-Rating-icon:active {
        color: rgb(239, 239, 239);
      }
.spectrum--darkest .spectrum-Rating.is-disabled .spectrum-Rating-icon {
      color: rgb(73, 73, 73);
    }
.spectrum--darkest .spectrum-Rating.is-disabled .spectrum-Rating-icon.is-selected {
        color: rgb(73, 73, 73);
      }
.spectrum--light .spectrum-Rating.is-focused {
    box-shadow: 0 0 0 2px rgb(38, 128, 235);
  }
.spectrum--light .spectrum-Rating:hover .spectrum-Rating-icon {
      color: rgb(110, 110, 110);
    }
.spectrum--light .spectrum-Rating:hover .spectrum-Rating-icon:hover {
        color: rgb(75, 75, 75);
      }
.spectrum--light .spectrum-Rating:hover .spectrum-Rating-icon:active {
        color: rgb(44, 44, 44);
      }
.spectrum--light .spectrum-Rating:hover .spectrum-Rating-icon.is-currentValue:after {
          background: currentColor;
        }
.spectrum--light .spectrum-Rating-icon {
  color: rgb(110, 110, 110);
}
.spectrum--light .spectrum-Rating-icon.is-selected {
    color: rgb(20, 115, 230);
  }
.spectrum--light .spectrum-Rating-icon:hover ~ .spectrum-Rating-icon {
      color: rgb(110, 110, 110);
    }
.spectrum--light .spectrum-Rating--quiet .spectrum-Rating-icon {
    color: rgb(110, 110, 110);
  }
.spectrum--light .spectrum-Rating--quiet .spectrum-Rating-icon.is-selected {
      color: rgb(110, 110, 110);
    }
.spectrum--light .spectrum-Rating--quiet:hover .spectrum-Rating-icon {
      color: rgb(110, 110, 110);
    }
.spectrum--light .spectrum-Rating--quiet:hover .spectrum-Rating-icon:hover {
        color: rgb(75, 75, 75);
      }
.spectrum--light .spectrum-Rating--quiet:hover .spectrum-Rating-icon:active {
        color: rgb(44, 44, 44);
      }
.spectrum--light .spectrum-Rating.is-disabled .spectrum-Rating-icon {
      color: rgb(202, 202, 202);
    }
.spectrum--light .spectrum-Rating.is-disabled .spectrum-Rating-icon.is-selected {
        color: rgb(202, 202, 202);
      }
.spectrum--lightest .spectrum-Rating.is-focused {
    box-shadow: 0 0 0 2px rgb(55, 142, 240);
  }
.spectrum--lightest .spectrum-Rating:hover .spectrum-Rating-icon {
      color: rgb(116, 116, 116);
    }
.spectrum--lightest .spectrum-Rating:hover .spectrum-Rating-icon:hover {
        color: rgb(80, 80, 80);
      }
.spectrum--lightest .spectrum-Rating:hover .spectrum-Rating-icon:active {
        color: rgb(50, 50, 50);
      }
.spectrum--lightest .spectrum-Rating:hover .spectrum-Rating-icon.is-currentValue:after {
          background: currentColor;
        }
.spectrum--lightest .spectrum-Rating-icon {
  color: rgb(116, 116, 116);
}
.spectrum--lightest .spectrum-Rating-icon.is-selected {
    color: rgb(38, 128, 235);
  }
.spectrum--lightest .spectrum-Rating-icon:hover ~ .spectrum-Rating-icon {
      color: rgb(116, 116, 116);
    }
.spectrum--lightest .spectrum-Rating--quiet .spectrum-Rating-icon {
    color: rgb(116, 116, 116);
  }
.spectrum--lightest .spectrum-Rating--quiet .spectrum-Rating-icon.is-selected {
      color: rgb(116, 116, 116);
    }
.spectrum--lightest .spectrum-Rating--quiet:hover .spectrum-Rating-icon {
      color: rgb(116, 116, 116);
    }
.spectrum--lightest .spectrum-Rating--quiet:hover .spectrum-Rating-icon:hover {
        color: rgb(80, 80, 80);
      }
.spectrum--lightest .spectrum-Rating--quiet:hover .spectrum-Rating-icon:active {
        color: rgb(50, 50, 50);
      }
.spectrum--lightest .spectrum-Rating.is-disabled .spectrum-Rating-icon {
      color: rgb(211, 211, 211);
    }
.spectrum--lightest .spectrum-Rating.is-disabled .spectrum-Rating-icon.is-selected {
        color: rgb(211, 211, 211);
      }