JSFiddle - React, Tailwind, and code Playground

HTML

<html>
  <body class="mobile">
    <h1>TITLE</h1>
    <div class="btn_noborder">button</div>
  </body>
</html>

CSS

.btn, .btn_noborder {
	background: blue;
	color: white;
	border-color: white;
}
:not(.mobile) .btn:hover, :not(.mobile) .btn_noborder:hover {
	background: red;
	color: blue;
	border-color: black;
}
.mobile .btn_noborder:active, .mobile .btn:active {
	background: red;
	color: blue;
	border-color: black;
}