.cursor {
  height: 25px;
  width: 25px;
  position: fixed; /* Sticks to the viewport */
  top: 0;
  left: 0;
  pointer-events: none; /* Prevents interfering with clicks */
  z-index: 99999999; /* Keeps it on top of everything */
  background-image: url('../img/cursor.webp');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-size: cover;
}

@media (max-width: 500px) {
  * {
      cursor: auto !important; /* Default cursor for small screens */
  }
  .cursor {
      display: none !important; /* Hide the custom cursor */
  } 
}