How to prioritize the order of css with css coming from the node module?

Question

I use primeNg table in my html page and when I am responsive I would like to keep the header of my grid.

however the table "p-datatable-thead" is automatically set to "display-none" with node

 @media screen and (max-width: 40em)
<style>
.p-datatable.p-datatable-responsive .p-datatable-tfoot>tr>td, .p-datatable.p- 
 datatable-responsive .p-datatable-thead>tr>th {
 display: none!important;
}

this css comes directly from the node primeng module:

node_modules > primeng > ressources > components > table > table.css

I tried to cancel this css with my own stylesheet :

 @media screen and (max-width: 40em) {
  .gridAccount.p-datatable.p-datatable-responsive .p-datatable-tfoot>tr>td, .p- 
  datatable.p-datatable-responsive .p-datatable-thead>tr>th {
     display: table-cell !important;
   }
 }

but my css goes after the css of the component from node_modules.

How to make my own css go in front of the node_modules css ?