div.rateit
{
    display: -moz-inline-box;
    display: inline-block;
    position: relative;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
}

div.rateit div.rateit-range
{
    position: relative;
    display: -moz-inline-box;
    display: inline-block;
    background: url(/cms/images/layout/star.gif);
    height: 16px;
}

/* for IE 6 */
* html div.rateit, * html div.rateit div.rateit-range
{
    display: inline;
}

/* for IE 7 */
* + html div.rateit, * + html div.rateit div.rateit-range
{
    display: inline;
}

div.rateit div.rateit-hover, div.rateit div.rateit-selected
{
    position: absolute;
    left: 0px;
}

div.rateit div.rateit-hover-rtl, div.rateit div.rateit-selected-rtl
{
    left: auto;
    right: 0px;
}

div.rateit div.rateit-hover
{
    background: url(/cms/images/layout/star.gif) left -32px;
}

div.rateit div.rateit-hover-rtl
{
    background-position: right -32px;
}

div.rateit div.rateit-selected
{
    /* background: url(/cms/images/layout/star.gif) left -16px; */
	background: url(/cms/images/layout/star.gif) left -48px;
}

div.rateit div.rateit-selected-rtl
{
    background-position: right -16px;
}

div.rateit div.rateit-preset
{
    background: url(/cms/images/layout/star.gif) left -48px;
}

div.rateit div.rateit-preset-rtl
{
    background: url(/cms/images/layout/star.gif) left -48px;
}

div.rateit div.rateit-reset
{
    background: url(/cms/images/layout/delete.gif) 0 0;
    width: 16px;
    height: 16px;
    display: -moz-inline-box;
    display: inline-block;
    /*float: left;*/
}

div.rateit div.rateit-reset:hover
{
    background-position: 0 -16px;
}


/*
    WRITE REVIEW: Larger Stars
*/

.reviewCompose div.rateit {vertical-align:middle;}
.reviewCompose .reviewItem div.rateit div.rateit-range {vertical-align:middle; margin-right:10px;}
.reviewCompose div.rateit div.rateit-hover {background-image:none;}
.reviewCompose div.rateit div.rateit-hover-rtl {background-position: right -32px;}
.reviewCompose div.rateit div.rateit-selected {background-image:none;}
.reviewCompose div.rateit div.rateit-selected-rtl {background-position: right -16px;}
.reviewCompose div.rateit div.rateit-preset {background: url(/cms/images/layout/star.gif) left -48px;}
.reviewCompose div.rateit div.rateit-preset-rtl {background: url(/cms/images/layout/star.gif) left -48px;}
.reviewCompose div.rateit div.rateit-reset {
    background-image:none;
/**************************************************************************************************************
    SVG TEMPLATE (NOT URL ENCODED) / URL ENCODE FOR IE COMPATIBILITY:
    <svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='22px' height='22px'><text x='0' y='18' font-size='22' fill='#ed2024'>&#8854;</text></svg>
****************************************************************************************************************/
    background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20version%3D%271.1%27%20width%3D%2722px%27%20height%3D%2722px%27%3E%3Ctext%20x%3D%270%27%20y%3D%2718%27%20font-size%3D%2722%27%20fill%3D%27%23ed2024%27%3E%26%238854%3B%3C%2Ftext%3E%3C%2Fsvg%3E");
    background-position:left center;
    background-size:22px 22px;
    background-repeat:no-repeat;
    width: 22px;
    height: 22px;
    display: inline-block;
    vertical-align:middle;
    margin-right: 10px;
    cursor: pointer;
    float: none;
}

.reviewCompose div.svg div.rateit-range {
    position:relative;
    vertical-align:middle;
/*
    SVG TEMPLATE (NOT URL ENCODED) / URL ENCODE FOR IE COMPATIBILITY:
    <svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='28' height='28'><text x='0' y='24' font-size='33' fill='#ffffff' stroke='#ed2024'>&#9733;</text></svg>
    <svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='28' height='28'><text x='0' y='24' font-size='33' fill='#ed2024' stroke='#ed2024'>&#9733;</text></svg>
*/
    background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20version%3D%271.1%27%20width%3D%2728%27%20height%3D%2728%27%3E%3Ctext%20x%3D%270%27%20y%3D%2724%27%20font-size%3D%2733%27%20fill%3D%27%23ffffff%27%20stroke%3D%27%23ed2024%27%3E%26%239733%3B%3C%2Ftext%3E%3C%2Fsvg%3E");
    background-size:28px 28px;
    filter:drop-shadow( 3px 3px 0px rgba(0,0,0,0.05) );
    cursor:pointer;
}

.reviewCompose div.svg div.rateit-selected,
.reviewCompose div.svg div.rateit-hover,
.reviewCompose div.svg div.rateit-preset {
    background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20version%3D%271.1%27%20width%3D%2728%27%20height%3D%2728%27%3E%3Ctext%20x%3D%270%27%20y%3D%2724%27%20font-size%3D%2733%27%20fill%3D%27%23ed2024%27%20stroke%3D%27%23ed2024%27%3E%26%239733%3B%3C%2Ftext%3E%3C%2Fsvg%3E");
    background-size:28px 28px;
	background-position:0 0;
} 