Styling the k-grid-header (MVC)

[Ian]

I am trying to replace the header gradient on a grid on just one page, but my changes have had no effect. 

Using FireFox's Firebug I can see that the CSS rule has been overridden, but there is no visible change. 

<style type="text/css">
    .k-grid-header {
        background-image: url("@Url.Content("~/Images/gridheader.png")");
        background-repeat: repeat-x;
    }
</style>


@(Html.Kendo().Grid<Product>().Name("ProductsGrid").Columns(c =>
      {
          c.Bound(p => p.Name);
          c.Bound(p => p.Id);
      })
      .DataSource(d => d
                           .Ajax()
                           .Read(r => r.Action("GetProducts", "Data"))
      )
      )

[Ian]

Here's what I found to solve it:

<style type="text/css">

    #ProductsGrid {
        font-family: verdana, sans-serif;
        font-size: 10px;
    }

    .k-header {
        background-image: url("@Url.Content("~/Images/gridheader.png")");
        background-repeat: repeat-x;
        color: white;
        font-weight: 700 !important;
    }

    .k-grid, .k-grid * { border: 0 !important; }

</style>