Ajax rating toolkit not visible in my contentplaceholder ASP

See more:

C#

ASP.NET

WebForms

Ajax

i am trying to show user rating from sql database using ajax rating toolkit in a datalist under a contentplaceholder of a masterform but the stars are not visible.I tried adding inline css in masterform and child form but it's still the same here is the code of my contentplaceholder and the style i am applying.I also have the correct url of the images.

<asp:Content ID="Content2" ContentPlaceHolderID="cpMainContent" Runat="Server">

    <table>
        <tr
            ><td>
                <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:MOVIERATINGConnectionString1 %>"
                     SelectCommand="SELECT users.name as username,userrating.comment as usercomment,userrating.stars as userstars,moviedata.name as moviename,userrating.ratingID as ratingID FROM userrating userrating  inner join users users  on users.userid=userrating.userid inner join moviedata moviedata  on moviedata.movieid=userrating.movieid"></asp:SqlDataSource>
                <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
                <asp:DataList ID="DataList1" runat="server"  DataKeyField="ratingID" DataSourceID="SqlDataSource1">
                    <ItemTemplate>
                        Username:
                        <asp:Label ID="ratingIDLabel" runat="server" Text='<%# Eval("username") %>' />
                        <br />
                        Movie Name:
                        <asp:Label ID="Label1" runat="server" Text='<%# Eval("moviename") %>' />
                        <br />
                        Comment:
                        <asp:Label ID="userIDLabel" runat="server" Text='<%# Eval("usercomment") %>' />
                        <br />
                        Rating
                        
                        <ajaxToolkit:Rating runat="server" ID="Rating1"
                            MaxRating="10"
                            CurrentRating='<%# !string.IsNullOrEmpty(Eval("userstars").ToString()) ? Convert.ToInt32(Eval("userstars")) : 0 %>'
                           StarCssClass="Star" WaitingStarCssClass="WaitingStar" EmptyStarCssClass="Star"
                            FilledStarCssClass="FilledStar" AutoPostBack="True" 
                            >
                         </ajaxToolkit:Rating>
                       <br />

<br />
                    </ItemTemplate>
                </asp:DataList>
            </td>

        </tr>
        <tr><td>

            <asp:SqlDataSource ID="SqlDataSource2" runat="server"></asp:SqlDataSource>
            <asp:DataList ID="DataList2" runat="server"></asp:DataList>
            </td></tr>
        <tr><td></td></tr>
        
    </table>
</asp:Content>

the style applied in masterpage head

<asp:ContentPlaceHolder ID="head" runat="server">
      <style type="text/css">
        .Star
        {
            background-image: url(images/Star.gif);
            height: 17px;
            width: 17px;
        }
        .WaitingStar
        {
            background-image: url(images/WaitingStar.gif);
            height: 17px;
            width: 17px;
        }
        .FilledStar
        {
            background-image: url(images/FilledStar.gif);
            height: 17px;
            width: 17px;
        }
    </style>
  </asp:ContentPlaceHolder>

What I have tried:

i have tried placing the style tag in masterform in child form i have also tried it in a seperate application