div.stars {
    float: left;
    display: inline-block;
}

input.star { display: none; }

label.star {
    float: right;
    padding-left: 10px;
    font-size:1.5em;
}

input.star:checked ~ label.star:before {
    content: '\f005';
    transition: all .25s;
}

input.star-1:checked ~ label.star:before { color: #F62; }
input.star-2:checked ~ label.star:before { color: #ff8616; }
input.star-3:checked ~ label.star:before { color: #ffc438; }
input.star-4:checked ~ label.star:before { color: #ffdf35; }
input.star-5:checked ~ label.star:before { color: #fff13d; }

label.star:hover { transform: rotate(-15deg) scale(1.3); }

label.star:before {
    content: '\f006';
    font-family: FontAwesome;
}