Datatable header not aligned when horizontal scroll in Safari

MKPI

I create and load my datatable this way:

Table = $("#customerTable").DataTable({
data:[],
columns: [
{ "data": "CompanyId" },
{ "data": "CompanyName" },
{ "data": "City" },
{ "data": "Country" }
],
rowCallback: function (row, data) {},
bFilter: false,
paging: false,
bInfo: false,
procesing: true,
scrollY: "50vh",
scrollX: true
});
CSS:

div.datatables_wrapper {
width: 1082px;
margin: 0 auto;
}
Button Click handler:

$("#customerSearchButton").on("click", function (event) {
$.ajax({
url: "",
type: "post",
data: { searchText: searchText }
}).done(function (result) {
Table.clear().draw();
Table.rows.add(result).draw();
}).fail(function (jqXHR, textStatus, errorThrown) {
// needs to implement if it fails
});
}
The behaviour is correct in Chrome/FF/IE but in safari in IOS/OSX when the horizontal scroll happens the headers are not aligned with the content columns. In this case the horizontal scroll only moves the content rows but not the header row.

¿What is the error in the datatable creation?

Big thanks in advance.

MKPI

This is the datatable debug record:
https://debug.datatables.net/eqenic