<label><input type="checkbox" id="col_1">Hide Column 1</input></label>
<label><input type="checkbox" id="col_2">Hide Column 2</input></label>
<label><input type="checkbox" id="col_3">Hide Column 3</input></label>

<div class="selected-counter">Selected: <span>0</span></div>
<div class="highlighted-counter">Highlighted: <span>0</span></div>

<table width="100%" cellpadding="0" cellspacing="0" class="reddyTable">
    <thead>
        <tr>
            <th><input type="checkbox" name="cbAll" id="cbAll" /></th>
            <th>Column 1</th>
            <th>Column 2</th>
            <th>Column 3</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td><input type="checkbox" id="cb1" name="cb1" /></td>
            <td>Lorem Ipsum</td>
            <td>Dolar sit</td>
            <td>Amet</td>
        </tr>
        <tr>
            <td><input type="checkbox" id="cb2" name="cb2" /></td>
            <td>Pellentesque</td>
            <td>semper arcu</td>
            <td>eget molestie</td>
        </tr>
        <tr>
            <td><input type="checkbox" id="cb3" name="cb3" /></td>
            <td>ex rutrum et</td>
            <td>Vivamus</td>
            <td>efficitur</td>
        </tr>
    </tbody>

</table>

body{font-family:Arial;}

label{margin-right:15px;}
table.reddyTable{border:1px solid #ccc;margin-top:20px;border-collapse:collapse;}
table.reddyTable th{text-align:left;border:1px solid #aaa;padding:5px;background:#ddd;}
table.reddyTable td{border:1px solid #ccc;padding:5px;}
table.reddyTable tr.highlightTr td{background:#ffe599;}
table.reddyTable tr.selectTr td{background:#6aa84f;}


.selected-counter,.highlighted-counter{margin-top:20px;font-weight:normal;font-size:12px;}
.selected-counter span,.highlighted-counter span{font-weight:bold;font-size:16px;position:relative;bottom:-2px;}
.selected-counter{color:#555;}
.highlighted-counter{color:#2e4267;}