@media (max-width:767px) {

	:root {
		--zoomist-wrapper-bg-color: #efefef;
		--zoomist-slider-bg-color: rgba(255, 255, 255, .8);
		--zoomist-slider-border-radius: 0 0 4px 0;
		--zoomist-slider-padding-x: 20px;
		--zoomist-slider-padding-y: 20px;
		--zoomist-slider-track-color: #ddd;
		--zoomist-slider-track-color-hover: #ccc;
		--zoomist-slider-bar-size: 120px;
		--zoomist-slider-bar-side: 2px;
		--zoomist-slider-bar-border-radius: 2px;
		--zoomist-slider-bar-color: #666;
		--zoomist-slider-bar-color-hover: #444;
		--zoomist-slider-button-size: 12px;
		--zoomist-slider-button-color: #fff;
		--zoomist-zoomer-button-size: 32px;
		--zoomist-zoomer-button-color: rgba(255, 255, 255, .9);
		--zoomist-zoomer-button-color-hover: rgba(255, 255, 255, .95);
		--zoomist-zoomer-button-color-disabled: rgba(255, 255, 255, .9);
		--zoomist-zoomer-button-opacity-disabled: .7;
		--zoomist-zoomer-icon-size: 14px;
		--zoomist-zoomer-icon-color: #333;
		--zoomist-zoomer-icon-color-hover: #111;
		--zoomist-zoomer-icon-color-disabled: #999;
		--zoomist-modules-tranistion-duration: .3s
	}

	.zoomist-container {
		position: relative;
		padding: 0 !important;
		touch-action: none;
		user-select: none
	}

	.zoomist-wrapper {
		position: relative;
		z-index: 1;
		width: 100%;
		height: 100%;
		padding: 0 !important;
		overflow: hidden;
		background-color: var(--zoomist-wrapper-bg-color)
	}

	.zoomist-image {
		position: relative;
		max-width: none !important;
		max-height: none !important;
		pointer-events: none
	}

	.zoomist-slider {
		position: absolute;
		z-index: 2;
		top: 0;
		left: 0;
		padding: var(--zoomist-slider-padding-y) var(--zoomist-slider-padding-x);
		background-color: var(--zoomist-slider-bg-color);
		border-radius: var(--zoomist-slider-border-radius)
	}

	.zoomist-slider:hover .zoomist-slider-wrapper {
		background-color: var(--zoomist-slider-track-color-hover)
	}

	.zoomist-slider:hover .zoomist-slider-bar {
		background-color: var(--zoomist-slider-bar-color-hover)
	}

	.zoomist-slider:hover .zoomist-slider-button:before {
		box-shadow: 0 0 8px #0009
	}

	.zoomist-slider-horizontal .zoomist-slider-wrapper {
		align-items: center;
		justify-content: flex-start;
		width: var(--zoomist-slider-bar-size);
		height: var(--zoomist-slider-bar-side)
	}

	.zoomist-slider-horizontal .zoomist-slider-bar {
		top: 0;
		width: calc(var(--value) * 1%);
		height: 100%
	}

	.zoomist-slider-horizontal .zoomist-slider-button {
		left: calc(var(--value) * 1%)
	}

	.zoomist-slider-vertical .zoomist-slider-wrapper {
		align-items: flex-end;
		justify-content: center;
		width: var(--zoomist-slider-bar-side);
		height: var(--zoomist-slider-bar-size)
	}

	.zoomist-slider-vertical .zoomist-slider-bar {
		bottom: 0;
		width: 100%;
		height: calc(var(--value) * 1%)
	}

	.zoomist-slider-vertical .zoomist-slider-button {
		bottom: calc(var(--value) * 1%)
	}

	.zoomist-slider-wrapper {
		position: relative;
		display: flex;
		background-color: var(--zoomist-slider-track-color);
		transition: background-color var(--zoomist-modules-tranistion-duration)
	}

	.zoomist-slider-bar {
		position: absolute;
		z-index: 0;
		left: 0;
		display: block;
		border-radius: var(--zoomist-slider-bar-border-radius);
		background-color: var(--zoomist-slider-bar-color);
		transition: background-color var(--zoomist-modules-tranistion-duration)
	}

	.zoomist-slider-button {
		position: relative;
		z-index: 1;
		display: block;
		width: 0 !important;
		height: 0 !important
	}

	.zoomist-slider-button:before {
		content: "";
		position: absolute;
		left: calc(var(--zoomist-slider-button-size) * -.5);
		top: calc(var(--zoomist-slider-button-size) * -.5);
		width: var(--zoomist-slider-button-size);
		height: var(--zoomist-slider-button-size);
		display: block;
		background-color: var(--zoomist-slider-button-color, #fff);
		border-radius: 50%;
		box-shadow: 0 0 4px #0006;
		transition: box-shadow var(--zoomist-modules-tranistion-duration)
	}

	.zoomist-zoomer {
		position: absolute;
		z-index: 2;
		bottom: 0;
		right: 0;
		border-radius: 0 0 0 4px;
		overflow: hidden
	}

	.zoomist-zoomer-button {
		position: relative;
		display: flex;
		justify-content: center;
		align-items: center;
		width: var(--zoomist-zoomer-button-size);
		height: var(--zoomist-zoomer-button-size);
		background: none;
		background-color: var(--zoomist-zoomer-button-color);
		border: 0;
		transition: background-color var(--zoomist-modules-tranistion-duration);
		cursor: pointer
	}

	.zoomist-zoomer-button:hover {
		background-color: var(--zoomist-zoomer-button-color-hover)
	}

	.zoomist-zoomer-button:hover .zoomist-zoomer-icon {
		fill: var(--zoomist-zoomer-icon-color-hover)
	}

	.zoomist-zoomer-button.zoomist-zoomer-disabled {
		pointer-events: none;
		background-color: var(--zoomist-zoomer-button-color-disabled);
		opacity: var(--zoomist-zoomer-button-opacity-disabled)
	}

	.zoomist-zoomer-button.zoomist-zoomer-disabled .zoomist-zoomer-icon {
		fill: var(--zoomist-zoomer-icon-color-disabled)
	}

	.zoomist-zoomer-icon {
		width: var(--zoomist-zoomer-icon-size);
		height: var(--zoomist-zoomer-icon-size);
		fill: var(--zoomist-zoomer-icon-color);
		transition: fill var(--zoomist-modules-tranistion-duration)
	}

	/* CUSTOM */

	.zoomist-slider, .zoomist-zoomer-reset {
		display: none;
	}	
}