﻿table.ui-styled-table
{
    border-collapse: collapse;
    -khtml-border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
/* BASIC CSS STYLING TO MAKE IT LOOK PRETTIER */
td
{
    padding: 3px;
}
th
{
    padding: 6px;
}
/* IE7: setting "separate" results in bad visuals; all other browsers work fine with either value */

/* if set to "separate", then this rule is also needed to prevent double vertical borders on hover:
table.ui-styled-table tr * + th, table.ui-styled-table tr * + td  { border-left-width: 0px !important; } */
table.ui-styled-table
{
    border-collapse: collapse;
}
    /* undo the "bolding" that jQuery UI theme may cause on hovered elements
/* IE7: does not support "inherit", so use a MS proprietary expression along with an IE <= 7 targeting hack
        to make the visuals consistent across all supported browsers */
    table.ui-styled-table td.ui-state-hover
    {
        font-weight: inherit;
        *font-weight: expression(this.parentNode.currentStyle['fontWeight']);
    }
    /* initally remove bottom border for all cells */
    table.ui-styled-table th, table.ui-styled-table td
    {
        border-bottom-width: 0px !important;
    }
    /* hovered-row cells should show bottom border (will be highlighted) */
    table.ui-styled-table tbody tr:hover th, table.ui-styled-table tbody tr:hover td
    {
        border-bottom-width: 1px !important;
    }
    /* remove top border if the above row is being hovered to prevent double horizontal borders */
    table.ui-styled-table tbody tr:hover + tr th, table.ui-styled-table tbody tr:hover + tr td
    {
        border-top-width: 0px !important;
    }
    /* last-row cells should always show bottom border (not necessarily highlighted if not hovered) */

    /* IE7, IE8: selector dependent on CSS classes because of no support for :last-child */
    table.ui-styled-table tbody tr.last-child th, table.ui-styled-table tbody tr.last-child td
    {
        border-bottom-width: 1px !important;
    }
    /* last-row cells should always show bottom border (not necessarily highlighted if not hovered) */

    /* IE8 BUG: if these (unsupported) selectors are added to a rule, other selectors for that rule will stop working as well! */

    /* IE9+, FF, Chrome: make sure the visuals are working even without the CSS classes crutch */
    table.ui-styled-table tbody tr:last-child th, table.ui-styled-table tbody tr:last-child td
    {
        border-bottom-width: 1px !important;
    }
