﻿.rating-css {

    font-size: 28px !important;
    height: 40px;
    text-shadow: 0 1px 0 #a2a2a2;
    margin-right: 2px;
}
.rating-container {
float:left;
clear:both;
}

    .rating-css.camera-active {
        color: #0000FF;
    }
    .rating-css.camera-disactive {
        color: #e7e7e7;
    }

    .rating-css.heart-active {
        color: #FF0000;
        margin-right:4.5px !important;
    }

.rating-css.heart-disactive {
    color: #e7e7e7;
    margin-right: 4.5px !important;
}

.rating-css.people-active {
    color: #000000;
    margin-right: 5px !important;
}

.rating-css.people-disactive {
    color: #e7e7e7;
    margin-right: 5px !important;
}

.rating-css.star-active {
    color: #ffd700;
    margin-right: 8px !important;
}

.rating-css.star-disactive {
    color: #e7e7e7;
    margin-right: 8px !important;
}

    .star-ratings-css {
        unicode-bidi: bidi-override;
        color: #c5c5c5;
        font-size: 40px;
        height: 40px;
        width: 166px;
        /*margin: 0 auto;*/
        position: relative;
        text-shadow: 0 1px 0 #a2a2a2;
        margin-bottom: 10px;
    }

    .star-ratings-css::before {
        content: '★★★★★';
        opacity: .3;
    }

    .star-ratings-css::after {
        color: gold;
        content: '★★★★★';
        text-shadow: 0 1px 0 #ab5414;
        position: absolute;
        z-index: 1;
        display: block;
        left: 0;
        top: 0;
        width: attr(rating);
        overflow: hidden;
    }

.camera-ratings-css {
    unicode-bidi: bidi-override;
    color: #c5c5c5;
    font-size: 24px;
    height: 40px;
    /*margin: 0 auto;*/
    position: relative;
    text-shadow: 0 1px 0 #a2a2a2;
    margin-bottom: 0px;
    overflow: hidden;
    width: 166px;
}

    .camera-ratings-css::before {
        content: '📷📷📷📷📷';
        opacity: .3;
    }

    .camera-ratings-css::after {
        color: aqua;
        content: '📷📷📷📷📷';
        text-shadow: 0 1px 0 #ab5414;
        position: absolute;
        z-index: 1;
        display: block;
        left: 0;
        top: 0;
        width: attr(rating);
        overflow: hidden;
    }

.people-ratings-css {
    unicode-bidi: bidi-override;
    color: #c5c5c5;
    font-size: 33px;
    height: 40px;
    /*margin: 0 auto;*/
    position: relative;
    text-shadow: 0 1px 0 #a2a2a2;
    margin-bottom: 10px;
    overflow: hidden;
    width: 166px;
}

    .people-ratings-css::before {
        content: '🗣🗣🗣🗣🗣';
        opacity: .3;
    }

    .people-ratings-css::after {
        color: black;
        content: '🗣🗣🗣🗣🗣';
        text-shadow: 0 1px 0 #ab5414;
        position: absolute;
        z-index: 1;
        display: block;
        left: 0;
        top: 0;
        width: attr(rating);
        overflow: hidden;
    }

.heart-ratings-css {
    unicode-bidi: bidi-override;
    color: #c5c5c5;
    font-size: 34px;
    height: 40px;
    /*margin: 0 auto;*/
    position: relative;
    text-shadow: 0 1px 0 #a2a2a2;
    margin-bottom: 10px;
    overflow: hidden;
    width: 166px;
}

    .heart-ratings-css::before {
        content: '❤❤❤❤❤';
        opacity: .3;
    }

    .heart-ratings-css::after {
        color: red;
        content: '❤❤❤❤❤';
        text-shadow: 0 1px 0 #ab5414;
        position: absolute;
        z-index: 1;
        display: block;
        left: 0;
        top: 0;
        width: attr(rating);
        overflow: hidden;
    }

[title="0"]::after {
    width: 0%;
}

[title="1"]::after {
    width: 20%;
}

[title="2"]::after {
    width: 40%;
}

[title="3"]::after {
    width: 60%;
}

[title="4"]::after {
    width: 80%;
}

.rating-label {
    font-weight: bold;
   margin-left: 170px;
   margin-top:19px;
}
.rating-valori {
    clear: both;
    float:left;
}
