grid css hover border

HTML

<script src="https://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<script src="https://jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/generatedata.js"></script>
<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.energyblue.css">
<div id='jqxWidget'>
    <div id="jqxgrid"></div>
</div>

CSS

.jqx-checkbox-hover-GAINGRID {
    background-color: #fff;
}
.jqx-radiobutton-hover-GAINGRID {
    background-color: #fff;
}
.jqx-scrollbar-thumb-state-hover-horizontal-GAINGRID, .jqx-scrollbar-thumb-state-hover-GAINGRID {
    background: #fff;
}
.jqx-scrollbar-thumb-state-pressed-horizontal-GAINGRID, .jqx-scrollbar-thumb-state-pressed-GAINGRID {
    background: #fff;
}
.jqx-icon-arrow-up-hover-GAINGRID, .jqx-icon-arrow-up-selected-GAINGRID
{
    background-image: url('images/icon-up-white.png');
    background-repeat: no-repeat;
    background-position: center;
}
.jqx-icon-arrow-down-hover-GAINGRID, .jqx-icon-arrow-down-selected-GAINGRID

{
    background-image: url('images/icon-down-white.png');
    background-repeat: no-repeat;
    background-position: center;
}
.jqx-icon-arrow-left-hover-GAINGRID, .jqx-icon-arrow-left-selected-GAINGRID
{
    background-image: url('images/icon-left-white.png');
    background-repeat: no-repeat;
    background-position: center;
}
.jqx-icon-arrow-right-hover-GAINGRID, .jqx-icon-arrow-right-selected-GAINGRID
{
    background-image: url('images/icon-right-white.png');
    background-repeat: no-repeat;
    background-position: center;
}
.jqx-icon-arrow-first-hover-GAINGRID, .jqx-icon-arrow-last-selected-GAINGRID
{
    background-image: url('images/icon-first-white.png');
    background-repeat: no-repeat;
    background-position: center;
}
.jqx-icon-arrow-last-hover-GAINGRID, .jqx-icon-arrow-last-selected-GAINGRID
{
    background-image: url('images/icon-last-white.png');
    background-repeat: no-repeat;
    background-position: center;
}
.jqx-icon-calendar-hover-GAINGRID, .jqx-icon-calendar-pressed-GAINGRID {
    background-image: url('images/icon-calendar-white.png');
}
.jqx-icon-time-GAINGRID, .jqx-icon-time-hover-GAINGRID, .jqx-icon-time-pressed-GAINGRID {
    background-image:...

JavaScript

var data = generatedata(500);
var source = {
    localdata: data,
    datafields: [{
        name: 'firstname',
        type: 'string'
    }, {
        name: 'lastname',
        type: 'string'
    }, {
        name: 'productname',
        type: 'string'
    }, {
        name: 'date',
        type: 'date'
    }, {
        name: 'quantity',
        type: 'number'
    }, {
        name: 'price',
        type: 'number'
    }],
    datatype: "array"
};

var adapter = new $.jqx.dataAdapter(source);
$("#jqxgrid").jqxGrid({
    width: 500,
    theme: 'GAINGRID',
    source: adapter,
    sortable: true,
    ready: function () {
        $("#jqxgrid").jqxGrid('selectrow', 0);
        $('#jqxgrid').jqxGrid('focus');
    },
    columns: [{
        text: 'First Name',
        datafield: 'firstname',
        columngroup: 'Name',
        width: 90
    }, {
        text: 'Last Name',
        columngroup: 'Name',
        datafield: 'lastname',
        width: 90
    }, {
        text: 'Product',
        datafield: 'productname',
        width: 170
    }, {
        text: 'Order Date',
        datafield: 'date',
        width: 160,
        cellsformat: 'dd-MMMM-yyyy'
    }, {
        text: 'Quantity',
        datafield: 'quantity',
        width: 80,
        cellsalign: 'right'
    }, {
        text: 'Unit Price',
        datafield: 'price',
        cellsalign: 'right',
        cellsformat: 'c2'
    }]
});