/*
Higher specificity to override other styles. 
Absolutely don't use !important
*/
body .mobile-hidden {
  visibility: hidden;
  display: none;
}

/*
Min-width instead of project default's max-width.
It's a better approach, more maintainable, and far more predicatable
*/
@media (min-width: 767.98px) {
  body .mobile-hidden {
    visibility: visible;
    display: block;
  }
}