.vk-image-viewer-popup{
	position:fixed;
	inset:0;
	z-index:1002;
	display:none;
	align-items:center;
	justify-content:center;
	box-sizing:border-box;
	padding:28px;
	background:rgba(255,255,255,.2);
	backdrop-filter:blur(7px);
}

.vk-image-viewer-popup.is-open{
	display:flex;
}

.vk-image-viewer-popup__dialog{
	position:relative;
	width:100%;
	height:100%;
	max-width:1040px;
	max-height:88vh;
	display:flex;
	align-items:center;
	justify-content:center;
}

.vk-image-viewer-popup__stage{
	position:relative;
	width:100%;
	height:100%;
	display:flex;
	align-items:center;
	justify-content:center;
	touch-action:pan-y;
}

.vk-image-viewer-popup__stage:before{
	content:"";
	position:absolute;
	left:50%;
	top:50%;
	z-index:1;
	width:44px;
	height:44px;
	margin:-22px 0 0 -22px;
	border:4px solid rgba(255,255,255,.72);
	border-top-color:#37c8bf;
	border-radius:50%;
	opacity:0;
	visibility:hidden;
	transition:opacity .16s ease, visibility .16s ease;
	animation:vkImageViewerSpin .72s linear infinite;
	will-change:transform;
	pointer-events:none;
}

.vk-image-viewer-popup.is-loading .vk-image-viewer-popup__stage:before{
	opacity:1;
	visibility:visible;
}

.vk-image-viewer-popup__image{
	display:block;
	max-width:100%;
	max-height:100%;
	width:auto;
	height:auto;
	border-radius:8px;
	background:#fff;
	box-shadow:0 24px 70px rgba(23,53,83,.26);
	object-fit:contain;
	opacity:1;
	transition:opacity .16s ease;
	user-select:none;
	-webkit-user-drag:none;
}

.vk-image-viewer-popup.is-loading .vk-image-viewer-popup__image{
	opacity:.32;
}

.vk-image-viewer-popup.is-moving-next .vk-image-viewer-popup__image.is-loaded{
	animation:vkImageViewerNextIn .2s cubic-bezier(.22,.8,.28,1);
}

.vk-image-viewer-popup.is-moving-prev .vk-image-viewer-popup__image.is-loaded{
	animation:vkImageViewerPrevIn .2s cubic-bezier(.22,.8,.28,1);
}

.vk-image-viewer-popup__close,
.vk-image-viewer-popup__nav{
	position:absolute;
	z-index:2;
	display:flex;
	align-items:center;
	justify-content:center;
	border:0;
	border-radius:50%;
	background:rgba(255,255,255,.92);
	color:#20364c;
	font-family:FontAwesome;
	font-size:18px;
	line-height:1;
	box-shadow:0 12px 28px rgba(32,54,76,.18);
	cursor:pointer;
	transition:.18s;
}

.vk-image-viewer-popup__close:hover,
.vk-image-viewer-popup__close:focus,
.vk-image-viewer-popup__nav:hover,
.vk-image-viewer-popup__nav:focus{
	background:#37c8bf;
	color:#fff;
	outline:none;
	box-shadow:0 15px 32px rgba(55,200,191,.28);
}

.vk-image-viewer-popup__close{
	top:0;
	right:0;
	width:42px;
	height:42px;
}

.vk-image-viewer-popup__nav{
	top:50%;
	width:48px;
	height:48px;
	transform:translateY(-50%);
}

.vk-image-viewer-popup__prev{
	left:0;
}

.vk-image-viewer-popup__next{
	right:0;
}

.vk-image-viewer-popup__counter{
	position:absolute;
	left:50%;
	bottom:0;
	z-index:2;
	min-width:54px;
	height:30px;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:0 12px;
	border-radius:999px;
	background:rgba(255,255,255,.92);
	color:#20364c;
	font-size:13px;
	font-weight:bold;
	box-shadow:0 10px 24px rgba(32,54,76,.14);
	transform:translateX(-50%);
}

body.vk-image-viewer-open{
	overflow:hidden;
}

@keyframes vkImageViewerSpin{
	from{
		transform:rotate(0deg);
	}
	to{
		transform:rotate(1turn);
	}
}

@keyframes vkImageViewerNextIn{
	from{
		opacity:.2;
		transform:translateX(28px) scale(.985);
	}
	to{
		opacity:1;
		transform:translateX(0) scale(1);
	}
}

@keyframes vkImageViewerPrevIn{
	from{
		opacity:.2;
		transform:translateX(-28px) scale(.985);
	}
	to{
		opacity:1;
		transform:translateX(0) scale(1);
	}
}

@media (max-width:760px){
	.vk-image-viewer-popup{
		padding:14px 10px 22px;
	}

	.vk-image-viewer-popup__dialog{
		max-height:calc(100vh - 36px);
	}

	.vk-image-viewer-popup__close{
		top:0;
		right:0;
		width:40px;
		height:40px;
	}

	.vk-image-viewer-popup__nav{
		top:auto;
		bottom:2px;
		width:42px;
		height:42px;
		transform:none;
	}

	.vk-image-viewer-popup__prev{
		left:6px;
	}

	.vk-image-viewer-popup__next{
		right:6px;
	}

	.vk-image-viewer-popup__counter{
		bottom:8px;
	}
}
