.hide {
    display: none;
}

.clear {
    float: none;
    clear: both;
}

.rating {
    unicode-bidi: bidi-override;
    direction: rtl;
    text-align: left;
    position: relative;
}

    .rating > label {
        float: right;
        display: inline;
        padding: 0;
        margin: 0;
        position: relative;
        width: 0.9em;
        height:1.7em;
        font-size:2.0em;
        cursor: pointer;
        color: #f00;
    }

        .rating > label:hover,
        .rating > label:hover ~ label,
        .rating > input.radio-btn:checked ~ label {
            color: transparent;
        }

            .rating > label:hover:before,
            .rating > label:hover ~ label:before,
            .rating > input.radio-btn:checked ~ label:before,
            .rating > input.radio-btn:checked ~ label:before {
                content: "\2605";
                position: absolute;
                left: 0;
                color: #f00;
            }


.ratingSmallSpan {
    font-size: 1.0em;
    width: 100px;
    vertical-align: middle;
    float: right;
    padding-left: 5px;
    padding-top: 5px;
}

.ratingSmall > label {
    float: right;
    display: inline;
    padding: 0;
    margin: 0;
    position: relative;
    width: 0.9em;
    height: 1.3em;
    font-size: 1.3em;
    cursor: pointer;
    color: #f00;
}

        .ratingSmall > label:hover,
        .ratingSmall > label:hover ~ label,
        .ratingSmall > input.radio-btn:checked ~ label {
            color: transparent;
        }

            .ratingSmall > label:hover:before,
            .ratingSmall > label:hover ~ label:before,
            .ratingSmall > input.radio-btn:checked ~ label:before,
            .ratingSmall > input.radio-btn:checked ~ label:before {
                content: "\2605";
                position: absolute;
                left: 0;
                color: #f00;
            }