Cacher is the code snippet organizer for pro developers

.star-rating{
    font-size: 0;
}

.star-rating__wrap{
    display: inline-block;
    font-size: 14px;
    padding: 0 13px;
}
.star-rating__wrap:after{
    content: "";
    display: table;
    clear: both;
}
.star-rating__ico{
    float: right;
    padding-left: 2px;
    cursor: pointer;
    color: #774343;
    margin-bottom: 0;
}
.star-rating__ico:last-child{
    padding-left: 0;
}
.star-rating__input{
    display: none;
}
.star-rating__ico:hover:before,
.star-rating__ico:hover ~ .star-rating__ico:before,
.star-rating__input:checked ~ .star-rating__ico:before
{
    content: "\f005";
}

<div class="star-rating">
		<div class="star-rating__wrap">
		  <input class="star-rating__input" id="star-rating-5" type="radio" name="rating" value="5">
		  <label class="star-rating__ico fa fa-star-o fa-lg" for="star-rating-5" title="5 out of 5 stars"></label>
		  <input class="star-rating__input" id="star-rating-4" type="radio" name="rating" value="4">
		  <label class="star-rating__ico fa fa-star-o fa-lg" for="star-rating-4" title="4 out of 5 stars"></label>
		  <input class="star-rating__input" id="star-rating-3" type="radio" name="rating" value="3">
		  <label class="star-rating__ico fa fa-star-o fa-lg" for="star-rating-3" title="3 out of 5 stars"></label>
		  <input class="star-rating__input" id="star-rating-2" type="radio" name="rating" value="2">
		  <label class="star-rating__ico fa fa-star-o fa-lg" for="star-rating-2" title="2 out of 5 stars"></label>
		  <input class="star-rating__input" id="star-rating-1" type="radio" name="rating" value="1">
		  <label class="star-rating__ico fa fa-star-o fa-lg" for="star-rating-1" title="1 out of 5 stars"></label>
		  </div>
</div>