css - telerik asp.net mvc grid - how to style selected row on hover -

i tried lot of question , answers here , on telerik forums none worked reason. have grid want style wish , things managed, failed setting selected row hover background-color.

any idea?

here grid:

@(html.kendo().grid < apdashboard.models.orderviewmodel > ()     .name("grid")     .columns(columns => {         columns.bound(p => p.freight).title("מספר ספינה");         columns.bound(p => p.orderdate).title("תאריך הזמנה").format("{0:mm/dd/yyyy}");         columns.bound(p => p.shipname).title("שם משלוח");         columns.bound(p => p.shipcity).title("עיר משלוח");     })     .pageable()     .sortable()     .scrollable()     .filterable()     .clientdetailtemplateid("template")     .htmlattributes(new {         style = "height:550px;"     })     .datasource(datasource => datasource         .ajax()         .pagesize(20)         .read(read => read.action("orders_read", "grid"))     )     .events(events => events.databound("databound")) ) 

and here stylings:

i marked below tried hover

.k-i-expand:before{     content: "\e007" } .k-i-collapse:before{     content: "\e002" }  .k-grid{     font-family: arial;     font-size: 13px; } .k-grid td{     color: #1e1e1e; } .k-grid tr:hover{     background-color: #e0f3f7; } .k-grid-header .k-header{     background-color: #d8dcdf; } .k-grid-header .k-header .k-link{     color: #1e1e1e; } .k-grid .k-state-selected{     background-color: #bce8f3 !important; }  /* ================================== */ /* here tried hover */ /* ================================== */ .k-grid .k-state-selected:hover {     background-color: #bce8f3 !important; } 

works fine me.

.k-state-selected:hover td { background-color: red !important; }