Boostrap table footer not displaying at the bottom

I have a Bootstrap responsive table in my AspNet Web API project which not showing me foot text within the table. My foot text shows on the top of the page outside table. I mean I'm trying to keep the footer of bootstrap modal to bottom but I can't, this is my html structure:

<div class="container">

<div class="table-responsive">
         <table class="table table-bordered table-hover" id="Countries">
             <thead>
                 <tr>
                     <th>
                         CountryId
                     </th>
                     <th>
                         CountryName
                     </th>


                     <th class="col-md-2">
                        Action
                     </th>
                 </tr>
             </thead>
             <tbody class="tbody"></tbody>
             <tfoot> All text I put here shows at the top of the page outside of the table</tfoot>

         </table>
     </div>
</div>