.starrating > input {
  display: none; }

.starrating > label:before {
  content: "\F005";
  margin: 2px;
  font-family: FontAwesome;
  display: inline-block; }

.starrating.thankyou > label:before {
  margin-left: 4px;
  margin-right: 4px;
  margin-top: 0;
  margin-bottom: 0;
  display: block;
  font-size: 16px; }

.starrating > label {
  color: #222222; }

.starrating > input:checked ~ label {
  color: #ffca08; }

.starrating > input:hover ~ label {
  color: #ffca08; }

@media (min-width: 769px) {
  .starrating.thankyou > label:before {
    font-size: 32px; } }

@media (min-width: 992px) {
  .starrating.thankyou > label:before {
    font-size: 48px; } }