You seem to use Bootstrap.
If you include Bootstrap after your own styles your .big-font style will be overriden by Bootstrap e.g.
<style>
.big-font {
font-size: xx-large;
}
</style>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<a class="btn btn-secondary flex-fill big-font">@item</a>
You should then change the order e.g.
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<style>
.big-font {
font-size: xx-large;
}
</style>
<a class="btn btn-secondary flex-fill big-font">@item</a>