html,
	body {
		margin: 0;
		padding: 0;
	}

	#image-zoom-wrapper {
		position: relative;
		text-align: left;
		width: 800px;
		height: 400px;
		overflow: auto;
		margin: 10px auto;
		border: 1px solid #000;
		background: #AAA url("./loader.gif") no-repeat 50% 50%;
		-moz-user-select: none;
		-khtml-user-select: none;
		-webkit-user-select: none;
		user-select: none;
	}

	#image-zoom-wrapper.js-active {
		cursor: move;
		background-image: none;
	}

	.js-enabled #image-zoom-wrapper {
		overflow: hidden;
		position: relative;
	}

	.js-enabled #image-zoom-wrapper #image-zoom {
		visibility: hidden;
		position: relative;
	}

	#image-zoom-wrapper div {
		padding: 0;
	}

	#image-zoom-wrapper div.zoom-control {
		width: 26px;
		height: 26px;
	}

	#image-zoom-wrapper div.zoom-in,
	#image-zoom-wrapper div.zoom-out {
		background: url("./zoom-in.png") no-repeat 0 0;
		position: absolute;
		left: 10px;
		top: 10px;
	}

	#image-zoom-wrapper div.zoom-out {
		background-image: url("./zoom-out.png");
		top: 46px;
	}

	#image-zoom-wrapper div.zoom-off {
		background-position: 0 100%;
	}

	@media only screen and (max-width: 820px) {

		#image-zoom-wrapper {
			width: auto;
			margin-left: 10px;
			margin-right: 10px;
			border-width: 5px;
		}

		#image-zoom-wrapper div.zoom-in,
		#image-zoom-wrapper div.zoom-out {
			background-image: url("./zoom-in-104.png");
			background-size: 52px;
			width: 52px;
			height: 52px;
		}

		#image-zoom-wrapper div.zoom-out {
			background-image: url("./zoom-out-104.png");
			left: auto;
			right: 10px;
			top: 10px;
		}

	}

	@media only screen and (max-width: 820px) {
		#image-zoom-wrapper {
			height: 75vh;
		}
	}

	@media only screen and (max-height: 420px) {
		#image-zoom-wrapper {
			height: 55vh;
		}
	}