I am currently running my magento site with the responsive Ultimo Theme, which has been great so far. However, i am wanting to make some custom css changes to hide some elements on my site which are not compatible with my mobile view. How do i go about implementing a custom css file which is only active when my site is being read on a mobile device?
Per the documentation of the Ultimo theme, you can add css classes to your elements like
hidden-sm hidden-xs This will hide the element on smaller screens. You have the choice of xs (xtra small - phone), sm, md, lg you can also use
visible-xs visible-sm to allow certain elements to be shown at various viewport dimensions