/*! PhotoSwipe main CSS by Dmitry Semenov | photoswipe.com | MIT license */
/*
	Styles for basic PhotoSwipe functionality (sliding area, open/close transitions)
*/
/* pswp = photoswipe */
.pswp {
		display: none;
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		overflow: hidden;
		-ms-touch-action: none;
		touch-action: none;
		z-index: 9999;
		-webkit-text-size-adjust: 100%;
		/* create separate layer, to avoid paint on window.onscroll in webkit/blink */
		-webkit-backface-visibility: hidden;
		outline: none;
}
.pswp * {
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
}
.pswp img {
		max-width: none;
		border-radius: 40px;
}
@media(max-width: 767px) {
		.pswp img {
				border-radius: 20px;
		}
}
/* style is added when JS option showHideOpacity is set to true */
.pswp--animate_opacity {
		/* 0.001, because opacity:0 doesn't trigger Paint action, which causes lag at start of transition */
		opacity: 0.001;
		will-change: opacity;
		/* for open/close transition */
		-webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
		transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
}
.pswp--open {
		display: block;
}
.pswp--zoom-allowed .pswp__img {
		/* autoprefixer: off */
		cursor: -webkit-zoom-in;
		cursor: -moz-zoom-in;
		cursor: zoom-in;
}
.pswp--zoomed-in .pswp__img {
		/* autoprefixer: off */
		cursor: -webkit-grab;
		cursor: -moz-grab;
		cursor: grab;
}
.pswp--dragging .pswp__img {
		/* autoprefixer: off */
		cursor: -webkit-grabbing;
		cursor: -moz-grabbing;
		cursor: grabbing;
}
/*
	Background is added as a separate element.
	As animating opacity is much faster than animating rgba() background-color.
*/
.pswp__bg {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background: #000;
		opacity: 0;
		transform: translateZ(0);
		-webkit-backface-visibility: hidden;
		will-change: opacity;
}
.pswp__scroll-wrap {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		overflow: hidden;
}
.pswp__container, .pswp__zoom-wrap {
		-ms-touch-action: none;
		touch-action: none;
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
}
/* Prevent selection and tap highlights */
.pswp__container, .pswp__img {
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		-webkit-tap-highlight-color: transparent;
		-webkit-touch-callout: none;
}
.pswp__zoom-wrap {
		position: absolute;
		width: 100%;
		-webkit-transform-origin: left top;
		-ms-transform-origin: left top;
		transform-origin: left top;
		/* for open/close transition */
		-webkit-transition: -webkit-transform 333ms cubic-bezier(0.4, 0, 0.22, 1);
		transition: transform 333ms cubic-bezier(0.4, 0, 0.22, 1);
}
.pswp__bg {
		will-change: opacity;
		/* for open/close transition */
		-webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
		transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
}
.pswp--animated-in .pswp__bg, .pswp--animated-in .pswp__zoom-wrap {
		-webkit-transition: none;
		transition: none;
}
.pswp__container, .pswp__zoom-wrap {
		-webkit-backface-visibility: hidden;
}
.pswp__item {
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		overflow: hidden;
}
.pswp__img {
		position: absolute;
		width: auto;
		height: auto;
		top: 0;
		left: 0;
		display: inline-block;
}
@media(max-width: 767px) {
		.pswp__img {
				top: 10px;
		}
}
.pswp__img::before, .pswp__img::after {
		content: '';
		display: block;
		position: absolute;
		top: -100px;
		right: 0;
		width: 100px;
		height: 2px;
		background: #1c1c1c;
}
/*
	stretched thumbnail or div placeholder element (see below)
	style is added to avoid flickering in webkit/blink when layers overlap
*/
.pswp__img--placeholder {
		-webkit-backface-visibility: hidden;
}
/*
	div element that matches size of large image
	large image loads on top of it
*/
.pswp__img--placeholder--blank {
		background: #222;
}
.pswp--ie .pswp__img {
		width: 100% !important;
		height: auto !important;
		left: 0;
		top: 0;
}
/*
	Error message appears when image is not loaded
	(JS option errorMsg controls markup)
*/
.pswp__error-msg {
		position: absolute;
		left: 0;
		top: 50%;
		width: 100%;
		text-align: center;
		font-size: 14px;
		line-height: 16px;
		margin-top: -8px;
		color: #CCC;
}
.pswp__error-msg a {
		color: #CCC;
		text-decoration: underline;
}
.pswp__top-bar {
		z-index: 9999;
		display: block;
}