Bootstrap 4 "hidden" class doesn't work

I'm using Bootstrap v4 with it's default CSS and JS. I'm trying to apply the classes hidden, hidden-XX-down and hidden-XX-up to various divs, buttons, etc. But it doesn't seem to affect anything. All other classes work, except this one.

Here's an example:

<div class="row"><div class="col col-10 offset-1 hidden-sm-down"><p class="text-primary text-center">Lorem ipsum dolor sit amet.</p></div></div>

I want the paragraph to be invisible when I resize the window to a smaller width (sm-down), yet it remains visible and nothing happens.