.obiwe-media {
	max-width: 100%;
}

.obiwe-image-wrap {
	position: relative;
	width: 100%;
	line-height: 0;
}

.obiwe-image-wrap img {
	display: block;
	width: 100%;
	max-width: 100%;
}

.obiwe-button-positioner {
	position: absolute;
	z-index: 2;
	line-height: normal;
	--obiwe-h-offset: 20px;
	--obiwe-v-offset: 20px;
	--obiwe-translate-x: 0px;
	--obiwe-translate-y: 0px;
}

.obiwe-overlay-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--obiwe-icon-gap, 8px);
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	transition-property: color, background-color, border-color, box-shadow, opacity;
	transition-timing-function: ease;
}

.obiwe-overlay-button:hover,
.obiwe-overlay-button:focus {
	text-decoration: none;
}

.obiwe-button-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

.obiwe-button-icon i,
.obiwe-button-icon svg {
	width: 1em;
	height: 1em;
	font-size: 1em;
}

.obiwe-position-top-left {
	top: var(--obiwe-v-offset);
	left: var(--obiwe-h-offset);
}

.obiwe-position-top-center {
	top: var(--obiwe-v-offset);
	left: 50%;
	transform: translateX(-50%);
}

.obiwe-position-top-right {
	top: var(--obiwe-v-offset);
	right: var(--obiwe-h-offset);
}

.obiwe-position-middle-left {
	top: 50%;
	left: var(--obiwe-h-offset);
	transform: translateY(-50%);
}

.obiwe-position-center {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.obiwe-position-middle-right {
	top: 50%;
	right: var(--obiwe-h-offset);
	transform: translateY(-50%);
}

.obiwe-position-bottom-left {
	bottom: var(--obiwe-v-offset);
	left: var(--obiwe-h-offset);
}

.obiwe-position-bottom-center {
	bottom: var(--obiwe-v-offset);
	left: 50%;
	transform: translateX(-50%);
}

.obiwe-position-bottom-right {
	bottom: var(--obiwe-v-offset);
	right: var(--obiwe-h-offset);
}

.obiwe-position-custom {
	transform: translate(var(--obiwe-translate-x), var(--obiwe-translate-y));
}
