I have a problem with duplicated pagination & search bar on jquery datatables, can someone help me out?

$(document).ready(function() {
   $('#acc').DataTable( {
      "lengthMenu": [ [5, 10, 25, 50, 100, -1], [5, 10, 25, 50, 100, "All"] ],
      responsive: {
         details: {
            display: $.fn.dataTable.Responsive.display.modal( {
               header: function ( row ) {
                  var data = row.data();
                  return 'Details for '+data[0];
               }
            } ),
            renderer: $.fn.dataTable.Responsive.renderer.tableAll( {
               tableClass: 'table'
            } )
         }
      }
   } );
} );

<div class="container">
   <table id="acc" class="table table-striped responsive nowrap table-hover" style="width:100%">
      <thead>
         <tr>
            <th>ID</th>
            <th>Name</th>
            <th>Email</th>
            <th>Password</th>
            <th>Role</th>
         </tr>
      </thead>
      <tbody>
         <tr>
            <td>1</td>
            <td>Josh</td>
            <td>josh@test.com</td>
            <td>josh123</td>
            <td>Leader</td>
         </tr>
      </tbody>
   </table>
</div>