﻿.rating{
	width: 80px;
	height: 16px;
	margin: 5px 0px;
	padding: 0;
	list-style: none;
	clear: both;
	position: relative;
	background: url(../images/rating/star-matrix-2.gif) no-repeat 0 0;
}
/* add these classes to the ul to effect the change to the correct number of stars */
.star0 { background-position: 0 0; }
.star05 { background-position: 0 -16px; }
.star1 { background-position: 0 -32px; }
.star15 { background-position: 0 -48px; }
.star2 { background-position: 0 -64px; }
.star25 { background-position: 0 -80px; }
.star3 { background-position: 0 -96px; }
.star35 { background-position: 0 -112px; }
.star4 { background-position: 0 -128px; }
.star45 { background-position: 0 -144px; }
.star5 { background-position: 0 -160px; }

ul.rating li {
	cursor: pointer;
	/*ie5 mac \*/
	float: left;
	/* end hide*/
	text-indent: -999em;
}
ul.rating li a {
	position: absolute;
	left: 0;
	top: 0;
	width: 8px;
	height: 16px;
	text-decoration: none;
	z-index: 200;
}
ul.rating li.i1 a { left: 0; }
ul.rating li.i2 a { left: 8px; }
ul.rating li.i3 a { left: 16px; }
ul.rating li.i4 a { left: 24px; }
ul.rating li.i5 a { left: 32px; }
ul.rating li.i6 a { left: 40px; }
ul.rating li.i7 a { left: 48px; }
ul.rating li.i8 a { left: 56px; }
ul.rating li.i9 a { left: 64px; }
ul.rating li.i10 a { left: 72px; }

ul.rating li a:hover {
	z-index: 2;
	width: 80px;
	height: 16px;
	overflow: hidden;
	left: 0;	
	background: url(../images/rating/star-matrix-2.gif) no-repeat 0 0;
}
ul.rating li.i1 a:hover { background-position: 0 -176px; }
ul.rating li.i2 a:hover { background-position: 0 -192px; }
ul.rating li.i3 a:hover { background-position: 0 -208px; }
ul.rating li.i4 a:hover { background-position: 0 -224px; }
ul.rating li.i5 a:hover { background-position: 0 -240px; }
ul.rating li.i6 a:hover { background-position: 0 -256px; }
ul.rating li.i7 a:hover { background-position: 0 -272px; }
ul.rating li.i8 a:hover { background-position: 0 -288px; }
ul.rating li.i9 a:hover { background-position: 0 -304px; }
ul.rating li.i10 a:hover { background-position: 0 -320px; }

ul.rating.readonly li a{cursor:auto}
ul.rating.readonly li a:hover{cursor:auto;background:none}
ul.rating.readonly li {cursor:auto}
