.nextgen_pro_lightbox_open {
	overflow: hidden !important;
	-webkit-text-size-adjust: none;
	padding: 0 !important;
	margin: 0 !important;
}

#npl_overlay {
	display: none;
	position: fixed;
	top: -100px;
	left: -100px;
	right: -100px;
	bottom: -100px;
	z-index: 1000000;
	background: #000000;
	opacity: 0;
}

#npl_overlay.npl_ios_no_opacity {
	opacity: 1;
}

#npl_wrapper {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 1000001;
	border: 0 none transparent;
	padding: 0;
	margin: 0;
	overflow: hidden;
}

/* Prevent iOS from highlighting everything touched */
body.nextgen_pro_lightbox_open {
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	-webkit-touch-callout: none;
}

body.nextgen_pro_lightbox_open #npl_wrapper {
	display: flex;
}

body.nextgen_pro_lightbox_open #npl_wrapper.npl_ie9_flex_hack {
	display: block;
}

/* Without this the main image will disappear when dismissing the iOS keyboard  */
/* because galleria.js will read the entire <body> height for some weird reason */
#npl_wrapper.npl_ios_hack {
	max-height: 100vh !important;
	max-width: 100vw !important;
	width: 100%;
	height: 100%;
}

#npl_wrapper.npl_open_with_padding {
	-webkit-box-shadow: 0 0 20px 1px rgba(0, 0, 0, 0.6);
	-moz-box-shadow: 0 0 20px 1px rgba(0, 0, 0, 0.6);
	box-shadow: 0 0 20px 1px rgba(0, 0, 0, 0.6);
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

#npl_button_close {
	background: #fff;
	border-radius: 50%;
	color: #555;
	font-size: 22px;
	line-height: 1;
	opacity: 0.5;
	padding: 4px 6px 4px 7px !important;
	position: absolute;
	right: 8px;
	top: 11px;
	z-index: 1000100;
}

#npl_wrapper.npl-sidebar-open #npl_button_close {
	right: 514px;
}

#npl_button_close.hidden {
	display: none;
}

#npl_button_close:hover {
	cursor: pointer;
}

#npl_wrapper.npl_mobile #npl_button_close {
	font-size: 28px;
	top: 15px;
	right: 25px;
}

#npl_wrapper #npl_button_close.npl-sidebar-open {
	right: 500px;
	margin-right: 15px;
}

#npl_spinner_container {
	color: white;
	font-size: 86px;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	align-items: center;
	z-index: 1000003;
}

#npl_wrapper.npl-variant-white #npl_spinner_container {
	color: #444444;
}

#npl_wrapper.npl-sidebar-open #npl_spinner_container {
	right: 500px;
}

#npl_wrapper.npl_ie9_flex_hack #npl_spinner_container {
	display: block !important;
}

#npl_wrapper.npl_ie9_flex_hack #npl_spinner_container svg,
#npl_wrapper.npl_ie9_flex_hack #npl_spinner_container i {
	position: relative;
	top: calc(50% - 43px);
	left: calc(50% - 43px);
}

#npl_spinner {
	margin: 0 auto;
}

#npl_wrapper.npl_ie9_flex_hack #npl_spinner_container.hidden {
	display: none !important;
}

#npl_spinner_container.hidden {
	display: none !important;
}

#npl_content {
	z-index: 1000002;
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	transform: translate3d(0, 0, 0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	box-sizing: content-box;
}

body.nextgen_pro_lightbox_open #npl_wrapper.npl_ie9_flex_hack.npl-sidebar-open #npl_content {
	position: absolute;
	top: 0;
	right: 500px;
	left: 0;
	bottom: 0;
}

#npl_sidebar {
	z-index: 1000002;
	width: 0;
	height: 100%;
	min-height: 100%;
	max-height: 100%;
	color: white;
	overflow-y: auto;
	overflow-x: hidden;
	background: #252728 url("theme/container_bg.png");
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	font-family: "Lato", sans-serif;
}

#npl_sidebar_overlay {
	width: 500px;
	height: 100%;
	min-height: 100%;
	max-height: 100%;
	overflow: hidden;
	background: black;
	position: absolute;
	right: 0;
	top: 0;
	align-items: center;
	opacity: 0;
	transition: opacity 0.75s;
	display: none;
	color: white;
}

body.nextgen_pro_lightbox_open #npl_wrapper.npl_ie9_flex_hack {
	display: block;
}

#npl_sidebar_overlay svg,
#npl_sidebar_overlay i {
	margin: 0 auto;
	font-size: 86px;
}

#npl_wrapper.npl_ie9_flex_hack #npl_sidebar_overlay svg,
#npl_wrapper.npl_ie9_flex_hack #npl_sidebar_overlay i {
	position: absolute;
	top: calc(50% - 43px);
	left: calc(50% - 43px);
}

#npl_wrapper.npl-sidebar-overlay-open #npl_sidebar_overlay {
	display: flex;
	z-index: 1000002;
	opacity: 1;
}

#npl_wrapper.npl-sidebar-open #npl_sidebar {
	width: 500px;
	min-width: 350px;
	border-left: 1px solid rgba(255, 255, 255, 0.2);
}

body.nextgen_pro_lightbox_open #npl_wrapper.npl_ie9_flex_hack.npl-sidebar-open #npl_sidebar {
	position: absolute;
	top: 0;
	right: 0;
}

#npl_wrapper.npl-sidebar-open #npl_content {
	width: calc(100% - 500px);
	/*border-right: 20px solid #fff;
    border-left: 20px solid #fff;*/
	box-sizing: border-box;
}

#npl_content * {
	box-sizing: content-box;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
}

body.nextgen_pro_lightbox_open #npl_overlay {
	display: block;
	opacity: 0.8;
}

body.nextgen_pro_lightbox_open #npl_overlay.npl_ios_no_opacity {
	opacity: 1;
}

#npl_sidebar_toggle {
	position: absolute;
	top: 11px;
	right: 10px;
	font-size: 17px;
	text-decoration: none;
	display: none;
	opacity: 0.5;
	cursor: pointer;
	z-index: 1000100;
	line-height: 1;
	background: #fff;
	color: #555;
	border-radius: 50%;
	padding: 6px 6px 6px 7px;
}

#npl_wrapper.npl-sidebar-open #npl_sidebar_toggle {
	display: block;
}

@media only screen and (max-width: 760px) {
	/* Hide the close-modal button when only the sidebar is displayed */
	#npl_wrapper.npl-sidebar-open #npl_button_close {
		display: none;
	}
	#npl_wrapper.npl-sidebar-open #npl_sidebar_toggle {
		right: 25px;
	}

	/* Remove padding at low resolutions */
	body #npl_wrapper.npl_open_with_padding {
		border-radius: 0;
		box-shadow: none;
		top: 0;
		bottom: 0;
		right: 0;
		left: 0;
	}

	/* Hide the content area entirely and display only the sidebar */
	#npl_wrapper.npl-sidebar-open #npl_content {
		width: 50vw;
		position: absolute;
		left: -100vw;
	}
	#npl_wrapper.npl-sidebar-open #npl_sidebar,
	#npl_wrapper.npl-sidebar-open #npl_sidebar_overlay {
		width: 100%;
		border-left: none;
	}
	#npl_wrapper.npl-sidebar-open #npl_spinner_container {
		display: none;
	}

	/* Display the sidebar thumbnail now that the main content is hidden */
	#npl_sidebar .nggpl-sidebar-thumbnail {
		display: block !important;
	}
}

/* TikTok video styles for Pro Lightbox */
#npl_wrapper .ngg-tiktok-container {
	background: transparent !important;
	z-index: 2 !important;
	pointer-events: none;
}

#npl_wrapper .ngg-tiktok-video {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	pointer-events: auto;
}
/* Video Styles for Pro Lightbox */
#npl_wrapper .ngg-video-container {
	background: transparent !important;
	z-index: 2 !important;
	pointer-events: none;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

#npl_wrapper .ngg-video-container video,
#npl_wrapper .ngg-video-container iframe {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	pointer-events: auto;
}

/* Dismissible notice shown when one or more image batches fail to load. */
#npl_wrapper .npl-load-error {
	position: absolute;
	top: 20px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 1000002;
	max-width: 90%;
	padding: 12px 44px 12px 16px;
	border-radius: 4px;
	background: rgba(0, 0, 0, 0.85);
	color: #ffffff;
	font-size: 14px;
	line-height: 1.4;
	text-align: center;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
	pointer-events: auto;
}

#npl_wrapper .npl-load-error .npl-load-error-dismiss {
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	margin: 0;
	padding: 0 4px;
	border: 0;
	background: transparent;
	color: #ffffff;
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
}
