DataTables Responsive footer detail

HTML

<script src="//cdn.datatables.net/1.10.5/js/jquery.dataTables.min.js"></script>
<script src="//cdn.datatables.net/responsive/1.0.4/js/dataTables.responsive.js"></script>
<script src="//cdn.datatables.net/fixedheader/2.1.2/js/dataTables.fixedHeader.min.js"></script>
<link rel="stylesheet" href="//cdn.datatables.net/1.10.5/css/jquery.dataTables.css">
<link rel="stylesheet" href="//cdn.datatables.net/responsive/1.0.4/css/dataTables.responsive.css">
<link rel="stylesheet" href="//cdn.datatables.net/fixedheader/2.1.2/css/dataTables.fixedHeader.css">
<div id="container">
    <table id="table" class="display">
        <thead>
            <tr>
                <th>Color</th>
                <th>Column&nbsp;2</th>
                <th>Column&nbsp;3</th>
                <th>Count</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>White</td>
                <td></td>
                <td></td>
                <td>1</td>
            </tr>
            <tr>
                <td>Silver</td>
                <td></td>
                <td></td>
                <td>2</td>
            </tr>
            <tr>
                <td>Gray</td>
                <td></td>
                <td></td>
                <td>3</td>
            </tr>
            <tr>
                <td>Black</td>
                <td></td>
                <td></td>
                <td>4</td>
            </tr>
            <tr>
                <td>Red</td>
                <td></td>
                <td></td>
                <td>5</td>
            </tr>
            <tr>
                <td>Maroon</td>
                <td></td>
                <td></td>
                <td>6</td>
            </tr>
            <tr>
                <td>Yellow</td>
                <td></td>
                <td></td>
                <td>7</td>
            </tr>
            <tr>
                <td>Olive</td>
                <td></td>
                <td></td>
                <td>8</td>
            </tr>
  ...

CSS

#container {
    width:320px;
}
#table .total td {
    border-top: 1px solid #111;
    font-weight:bold;
}

JavaScript

$(function () {
    var table = $('#table').DataTable({
        "paging": false,
        "searching": false,
        "responsive": true,
        "info": false,
        "drawCallback": function() {
            $('tbody').append($('tr.total'));
        },
        scrollX: "200px",
        scrollY: "200px",
        fixedColumns: true,
    });

    new $.fn.dataTable.FixedHeader(table, {
        "alwaysCloneTop": true
    });
});