/* =============================================================================
Image Zoom JS v0.0.1 | MIT License | https://github.com/alecrios/image-zoom-js
Modified: the zoom animates a separate overlay image ([data-zoom-overlay]);
the thumbnail itself no longer transforms. Backdrop is slightly translucent
so the reader keeps their place in the page.
============================================================================= */

[data-zoom-backdrop] {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	z-index: 900;
	background-color: rgba(255, 255, 255, 0.8);
	opacity: 0;
	transition: opacity 400ms ease;
	pointer-events: none;
}

[data-zoom-backdrop='active'] {
	opacity: 1;
	pointer-events: auto;
}

[data-zoom-image] {
	position: relative;
	z-index: 800;
	cursor: zoom-in;
}

[data-zoom-image='active'] {
	cursor: default;
}

[data-zoom-overlay] {
	position: fixed;
	z-index: 1000;
	margin: 0;
	padding: 0;
	border: 0;
	box-shadow: none;
	max-width: none;
	max-height: none;
	cursor: zoom-out;
	transition: transform 400ms ease;
	will-change: transform;
}