/* zoom.css: MuseumZoom's own (zoom.js), for any page that loads the module. Only the module's own
   classes are styled here, so it changes nothing else on a page: the print (.mz-print) and the area
   (.mz-area) it marks when a page attaches it to one picture, and the root it marks while zoomed
   (.mz-zoomed) and while a mouse drags (.mz-dragging). The museum's viewer, which attaches it to the
   slide in front, styles its own (museum.css, "the zoom, in the viewer"). */

/* the picture is never dragged out of the page as an image, nor selected, nor held for its menu */
.mz-print{-webkit-user-drag:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
/* a pinch on the area is the picture's, never the page's */
.mz-area{touch-action:none;user-select:none;-webkit-user-select:none}
/* the cursor: zoom-in over the picture at fit, a hand while zoomed, a closed hand while dragging */
@media (hover:hover) and (pointer:fine){.mz-print{cursor:zoom-in}}
.mz-zoomed .mz-area,.mz-zoomed.mz-area,.mz-zoomed .mz-print{cursor:grab}
.mz-dragging .mz-area,.mz-dragging.mz-area,.mz-dragging .mz-print{cursor:grabbing}