@charset "utf-8";

/*--------------------------------------------------------------
# Lightbox
# Mobile Styles
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Lightbox
--------------------------------------------------------------*/
.lightbox-overlay {
	position:                                                  fixed;
	display:                                                   flex;
	visibility:                                                hidden;
  	z-index:                                                 9999999995 !important;
	align-items:                                               center;
	justify-content:                                           center;
  	width:                                                   100%;
	height:                                                    100%;
  	top:                                                     0;
  	left:                                                    0;
  	overflow:                                                hidden;
	background:                                                rgba(0, 0, 0, 0.92);
	opacity:                                                   0;
	transition:                                                all 0.3s var(--main-trans-easing);
}

.lightbox-overlay .lightbox-image {
	max-width:                                                 90%;
	max-height:                                                80%;
	transition:                                                all 0.3s var(--main-trans-easing);
}

.lightbox-overlay .block-button.button-prev {
	position:                                                  fixed;
	left:                                                      15px;
}

.lightbox-overlay .block-button.button-next {
	position:                                                  fixed;
	right:                                                     15px;
}

/* 2: Phones (landscape) + Tablets (portrait) */
@media (max-width: 860px) {
	.lightbox-overlay .block-button.button-prev,
	.lightbox-overlay .block-button.button-next {
		bottom:                                                   15px;
	}
}

.lightbox-overlay .block-button.button-prev button,
.lightbox-overlay .block-button.button-next button {
	display:                                                   block;
}

.lightbox-overlay .lightbox-counter {
	position:                                                  absolute;
  	top:                                                     15px;
  	left:                                                    15px;
  	background:                                              var(--close-btn-background);
  	color:                                                   var(--close-btn-color);
  	border:                                                  var(--close-btn-border);
  	padding:                                                 2px 10px;
  	font-size:                                               16px;
  	z-index:                                                 1000;
	font-weight:                                               bold;
}

.transition-in {
	opacity:                                                   1;
	transform:                                                 translate(0, 0) perspective(500px) translate3d(0,0,0);
}

.transition-out {
	opacity:                                                   0;
}

.lightbox-slide .direction-next {
	transform:                                                 translate(85vw, 0);
}

.lightbox-slide .direction-prev {
	transform:                                                 translate(-85vw, 0);
}

.lightbox-zoom .transition-out.direction-next {
	transform:                                                 translate(85vw, 0) perspective(500px) translate3d(0,0,-2000px);
}

.lightbox-zoom .transition-out.direction-prev {
	transform:                                                 translate(-85vw, 0) perspective(500px) translate3d(0,0,-2000px);
}