Align GridView Header Text Center using CSS

Hiii,

I have used bootstrap cssclass table,table-hover,table-condensed ,table-bordered for gridview styling.

But after using this classes grid headers are not aligned center or right it always aligned left side. 

<asp:TemplateField HeaderText="Sr.No" ItemStyle-HorizontalAlign="Center" ControlStyle-Width="5%" HeaderStyle-HorizontalAlign="Center">
<ItemTemplate>
  <asp:Label ID="lblRowNum" runat="server" Text='<%#Container.DataItemIndex+1 %>'></asp:Label>
</ItemTemplate>
<ItemStyle Width="5%" />
</asp:TemplateField>
<asp:BoundField DataField="ID" HeaderText="ID" ReadOnly="true" ItemStyle-Width="10%" HeaderStyle-HorizontalAlign="Center" Visible="false" />