Any Hover

If you switch to a mobile device in your developer tools, you'll see that clicking on the button does fire another hover effect than for the desktop devices

HTML

							
							
<button class="myButton">X</button>

CSS

							
							
.myButton:hover {
	background-color: #c53532;
}
/* in this example we reset the hover effect for touch devices! */
/* please see resources for more informations */
@media (hover:on-demand) {
	.myButton:hover {
		background-color: transparent; /* #color-when-NOT-touch-device; */
	}
}

Resources: ➤ https://developer.mozilla.org/en-US/docs/Web/CSS/@media/any-hover