Media queries for different types of devices

media_query_interactions.css

@media (hover: none) and (pointer: coarse) {
  /* you're on a touch-only device */
}

@media (hover: none) and (pointer: fine) {
  /* you're on a device without hover but with a stylus
     or other fine pointing device */
}

@media (hover: hover) and (pointer: coarse) {
  /* you're on a device with hover but a coarse pointer, 
     like a gamepad or wii remote*/
}

@media (hover: hover) and (pointer: fine) {
  /* you're on a device with a mouse or trackpad */
}