/* the default rating is placed as a background image in the ul */
/* use the background position according to the table above to display the required images*/
.ratinggroup strong, .ratinggroup span {display:block; float:left;  height:16px;}
.ratingaverage,.ratinguser{}
.ratingaverage strong, .ratingaverage span, .ratinguser strong, .ratinguser span{ dispaly:block; float:left;  height:16px;}
.rating{
    width:45px;
    height:16px;
    padding:0;
    margin:0;
    list-style:none;
    position:relative;
    background: url(http://images.meredith.com/recipe/images/temps/shell/forks.gif) no-repeat 0 0;
    float:left;
}
/* add these classes to the ul to effect the change to the correct number of stars */
.zero {background-position:0 0}
.half{background-position:0 -16px}
.one {background-position:0 -32px}
.onehalf{background-position:0 -48px}
.two {background-position:0 -64px}
.twohalf{background-position:0 -80px}
.three {background-position:0 -96px}
.threehalf {background-position:0 -112px}
.four {background-position:0 -128px}
.fourhalf{background-position:0 -144px}
.five {background-position:0 -160px}

ul.rating li {
    /*ie5 mac doesn't like it if the list is floated\*/
    float:left;
    /* end hide*/
    text-indent:-999em;
}
ul.rating li a {
    cursor:default;
    position:absolute;
    left:0;
    top:0;
    width:9px;
    height:16px;
    text-decoration:none;
    z-index: 200;
    border:none;
}
ul.rating.capture li a{
    cursor: pointer;
}
ul.rating li.s1 a {left:0}
ul.rating li.s2 a {left:9px;}
ul.rating li.s3 a {left:18px;}
ul.rating li.s4 a {left:27px;}
ul.rating li.s5 a {left:36px;}
ul.rating.capture li a:hover {
    z-index:2;
    width:45px;
    height:16px;
    overflow:hidden;
    left:0;
    background: url(http://images.meredith.com/recipe/images/temps/shell/forks.gif) no-repeat 0 0
}
ul.rating.capture li.s1 a:hover {background-position:0 -176px;}
ul.rating.capture li.s2 a:hover {background-position:0 -192px;}
ul.rating.capture li.s3 a:hover {background-position:0 -208px}
ul.rating.capture li.s4 a:hover {background-position:0 -224px}
ul.rating.capture li.s5 a:hover {background-position:0 -240px}