Open CSS file in your favorite editor. Feel free to edit.

CSS file style.css is located according to the FolderStyle property
Example: grid1.FolderStyle = "grid/styles/black_glass";

You can edit the existing styles or create new ones.

Body cells font	Header cells font	Cells padding	Body action links
Footer action links	Cells separators	Hide grouping area	Sorting arrows position
Remove sorting arrows	Hide cells separators	Page size selector width	Hide "Records:...-...of..." text
Resize bar width	Background for wrapped headers	Align grouping buttons	Body cells vertical alignment
Selected record	Footer font	Manual paging box width	Row height

CSS:

.ob_gBody .ob_gC, .ob_gBody .ob_gCW 
{
     color: #000000;
     font-family: Tahoma;
     font-size: 12px;
}

CSS:

.ob_gH .ob_gC, .ob_gHContWG .ob_gH .ob_gCW,
.ob_gHCont .ob_gH .ob_gC, .ob_gHCont .ob_gH .ob_gCW 
{
     color: #000000;
     font-family: Tahoma;
     font-size: 14px;
}

CSS:

div.ob_gCc2, div.ob_gCc2C, div.ob_gCc2R 
{
     padding-left: 3px !important;
}

CSS:

a.ob_gAL
{
     font-family: Tahoma;
     font-size: 14px;
     color: #000000;
     text-decoration: none;
}

a.ob_gAL:hover
{
     font-family: Tahoma;
     font-size: 14px;
     color: #000000;
     text-decoration: underline;
}

CSS:

a.ob_gALF
{
     font-family: Tahoma;
     font-size: 14px;
     color: #000000;
     text-decoration: none;
}

a.ob_gALF:hover
{
     font-family: Tahoma;
     font-size: 14px;
     color: #000000;
     text-decoration: underline;
}

CSS:

.ob_gCS, .ob_gCS div, .ob_gCS_F, .ob_gCS_F div
{
      background-color: #000000 !important;
}

CSS:

.ob_gCS, .ob_gCS div, .ob_gCS_F, .ob_gCS_F div 
{
      display: none;
}

CSS:

.ob_gGA
{
      display: none;
}
.ob_gBLSWG, .ob_gBRSWG
{
      top: 17px !important;
}
.ob_gGACont
{
      height: 17px !important;
      position: relative !important;
      background-image: url(styles/black_glass/header_corner_middle.png) !important;
      background-repeat: repeat-x !important;
      font-size: 1px !important;
      margin-left: 20px !important;
      margin-right: 20px !important;
}
.ob_gGACnL
{
      background-image: url(styles/black_glass/header_corner_left.png) !important;
      height: 17px !important;
      width: 25px !important;
      background-repeat: no-repeat !important;
      position: absolute !important;
      left: -25px !important;
}
.ob_gGACnR
{
      background-image: url(styles/black_glass/header_corner_right.png) !important;
      height: 17px !important;
      width: 25px !important;
      background-repeat: no-repeat !important;
      position: absolute !important;
      right: -25px !important;
}

CSS:

div.ob_gHSI
{
       right: 15px !important;
}

To remove the default sorting placeholders (the double arrow image) from the headers, go to the style folder that you are using (e.g. Grid/styles/black_glass) and perform these two operations:
- delete (or rename) the "placeholder.gif" image;
- rename "placeholder_empty.gif" to "placeholder.gif".

"placeholder_empty.gif" is a transparent image having the same size as the default "placeholder.gif".
By renaming it to "placeholder.gif" it will be used by the grid instead of the double arrow image.

CSS:

.ob_gPSTD
{
       width: 100px !important;
       right: -105px !important;
}
.ob_gPSTDIC
{
       width: 100px !important;
}

This code will make the page size selector have a width of 100px instead of the default width of 60px.

CSS:

.ob_gFPT
{
        text-align: right;
        text-indent: -130px;
        overflow:  hidden;
}

CSS:

.ob_gHCont .ob_gCS, .ob_gHContWG .ob_gCS, .ob_gHCont .ob_gCS_F, .ob_gHContWG .ob_gCS_F
{
         margin-left: -2px !important;
}
.ob_gHCont .ob_gCS div, .ob_gHContWG .ob_gCS div, .ob_gHCont .ob_gCS_F div, .ob_gHContWG .ob_gCS_F div
{
         width: 3px !important;
}

CSS:

.ob_gHContWG .ob_gH .ob_gC, .ob_gHContWG .ob_gH .ob_gCW,
.ob_gHCont .ob_gH .ob_gC, .ob_gHCont .ob_gH .ob_gCW
{
         background-image: none !important;
         background-color: #DCE3E8 !important;
         border-bottom: 1px #A8AEBD solid !important;
}

CSS:

.ob_gRGHB
{
         float: right !important;
         margin-right: 470px !important;
}

CSS:

.ob_gBody .ob_gC, .ob_gBody .ob_gCW
{
     vertical-align: top !important;
}
.ob_gBody .ob_gC div.ob_gCc1, .ob_gBody .ob_gCW div.ob_gCc1 
{
     padding-top: 0px !important;
}

CSS:

.ob_gRS
{
     color: #FF0000 !important;
     background-image: url(row_selected.png) !important;
     background-color: #E7F9FE !important;
}

CSS:

.ob_gFCont
{
     font-size: 11px !important;
     color: #FF0000 !important;
}

CSS:

.ob_gMPST .ob_iTCN, .ob_gMPST .ob_iTCO, .ob_gMPST .ob_iTCA
{
     width: 75px !important;
}

CSS:

/* Body rows */
.ob_gBody tbody .ob_gC, .ob_gBody tbody .ob_gCW 
{
     height: 50px !important;
}

/* Header rows */
.ob_gHContWG .ob_gH .ob_gC, .ob_gHContWG .ob_gH .ob_gCW,
.ob_gHCont .ob_gH .ob_gC, .ob_gHCont .ob_gH .ob_gCW
{
     background-image: none !important;
     background-color: #DCE3E8 !important;
     border-bottom: 1px #A8AEBD solid !important;
     height: 50px !important;
}