img {
	transition-duration: var(--transition-longer);
	transition-property: transform, box-shadow, border-radius;

	&:not(.no-hover) {
		cursor: zoom-in;
	}

	&:not(.no-hover):hover {
		transform: scale(1.1);
		box-shadow: var(--shadow-raised);
		border-radius: 0;
	}
}

img,
video {
	display: block;
	margin: 1rem auto;
	box-shadow: var(--shadow);
	border-radius: var(--rounded-corner);
	max-width: 100%;

	&.full {
		width: 100%;
	}

	&.pixels {
		image-rendering: pixelated;
	}

	&.transparent {
		box-shadow: none;
		border-radius: 0;

		&:hover {
			box-shadow: none;
		}
	}
}