Моя таблица DataTable отображается не так, как должна

https://datatables.net/ Я взял datatable с этого сайта. Я пишу через свой код, но предыдущая и следующая кнопки не стилизуются. Я использую фреймворк Django. Как я могу это исправить?

Вот моя html-таблица:

<div class="table-keep">
  <div class="container">



    <h1>Olv Go Registrations</h1>



      <table class="table" border=1 id="mydatatablem">


        <thead>
          <tr>

            <th>Full Name</th>
            <th>Company</th>
            <th>Email</th>
            <th>Phone Number</th>
            <th>Note</th>

          </tr>

        </thead>
        <tbody>
          {% for x in x_list %}

              <tr>
                  <td>{{x.full_name}}</td>
                  <td>{{x.company}}</td>
                  <td>{{x.email}}</td>
                  <td>{{x.phone_number}}</td>
                  <td>{{x.note}}</td>

              </tr>


          {% endfor %}




        </tbody>
      </table>


    </div>
  </div>

 <!-- Latest compiled and minified JavaScript -->
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
      <script src='https://cdn.datatables.net/1.12.1/js/jquery.dataTables.min.js'></script>
      <script>
      $(document).ready(function () {
          $('#mydatatablem').DataTable();
      });
    
      </script>

Когда я использую эту таблицу данных на своем сайте, кнопки выглядят следующим образом:

https://i.stack.imgur.com/6MQDg.png

Вернуться на верх