StackOverflow - Removal of padding of nested table

http://stackoverflow.com/questions/37146199/datatables-nested-table-with-collapse-how-remove-padding/37171459#37171459

HTML

<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="//cdn.datatables.net/1.10.2/js/jquery.dataTables.min.js"></script>
<script src="//cdn.datatables.net/responsive/1.0.1/js/dataTables.responsive.min.js"></script>
<table id="example" class="display nowrap" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th></th>
            <th>Item 1</th>
            <th>Item 2</th>
            <th>Item 3</th>
            <th>Item 4</th>
        </tr>
    </thead>
    <tbody>
        <tr data-child-value="hidden 1">
            <td class="details-control">_</td>
            <td>data 1a</td>
            <td>data 1b</td>
            <td>data 1c</td>
            <td>data 1d</td>
        </tr>
        <tr data-child-value="hidden 2">
            <td class="details-control">_</td>
            <td>data 2a</td>
            <td>data 2b</td>
            <td>data 2c</td>
            <td>data 2d</td>
        </tr>
    </tbody>
</table>

<table id="example2" class="display nowrap childtable" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th></th>
            <th>Col 1</th>
            <th>Col 2</th>
            <th>Col 3</th>
            <th>Col 4</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Jen</td>
            <td>100</td>
            <td>Left</td>
            <td>Left</td>
        </tr>
        <tr>
            <td>Sal</td>
            <td>88</td>
            <td>Right</td>
            <td>Right</td>
        </tr>
    </tbody>
</table>

CSS

@import url('//cdn.datatables.net/1.10.2/css/jquery.dataTables.css');
.childtable thead {
    display: none;
    border-collapse: collapse;
}

table.dataTable tbody tr.shown + tr > td {
    padding: 0;
}

table.dataTable tbody tr.shown + tr table.dataTable tbody td.sorting_1,
td.details-control {
    width: 40px;
}

td.details-control {
    background: url('http://www.datatables.net/examples/resources/details_open.png') no-repeat center center;
    cursor: pointer;
}

tr.shown td.details-control {
    background: url('http://www.datatables.net/examples/resources/details_close.png') no-repeat center center;
}

JavaScript

$(document).ready(function() {
    var table = $('#example').DataTable({});

    // Add event listener for opening and closing details
    $('#example').on('click', 'td.details-control', function() {
        var tr = $(this).closest('tr');
        var row = table.row(tr);

        if (row.child.isShown()) {
            // This row is already open - close it
            row.child.hide();
            tr.removeClass('shown');
        } else {
            // Open this row
            //format(row);
            /*
            row.child( 
            [
              'First child row',
              'Second child row',
              'Third child row'
            ] ).show();
            */
            //row.child(callAjax()).show();
            //callAjax(row);
            callAjax2(row);
            tr.addClass('shown');
        }
    });

    function callAjax2(row) {

        var table = $('#example2').clone().dataTable({
            "sDom": 'ti',
            "deferRender": true,
            "processing": true,
        
                /* ,
                            columnDefs: [
                            {
                              targets: 0,
                              className: 'details-control'
                            }
                  					]*/
        });

        row.child(table).show();
    }

    function callAjax(row) {
        $.ajax({
         ,
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function(response) {
                //alert(response.data );
                //row.child( response.data ).show();
                //var table = $('#example2').DataTable({});
                var table = $('#example2').clone().DataTable({});
                table.rows.add(response.data);
                row.child(table).show();
            },
            error: function() {
                $('#output').html('Bummer: there was an error!');
            }
        });
    }

    function...