/*!
* Luminous v2.3.5
* Copyright 2015-2021, Zebrafish Labs
* Licensed under BSD-2 (https://github.com/imgix/luminous/blob/main/LICENSE.md)
*/ @keyframes a {
0% {
opacity: 0
}
to {
opacity: 1
}
}
@keyframes b {
0% {
opacity: 0;
transform: scale(.5)
}
to {
opacity: 1;
transform: scale(1)
}
}
@keyframes c {
0% {
transform: translate(-50%, -50%) rotate(0)
}
50% {
transform: translate(-50%, -50%) rotate(-180deg)
}
to {
transform: translate(-50%, -50%) rotate(-1turn)
}
}
@keyframes d {
0% {
transform: scale(1)
}
10% {
transform: scale(1.2) translateX(6px)
}
25% {
transform: scale(1.3) translateX(8px)
}
40% {
transform: scale(1.2) translateX(6px)
}
50% {
transform: scale(1)
}
60% {
transform: scale(.8) translateX(6px)
}
75% {
transform: scale(.7) translateX(8px)
}
90% {
transform: scale(.8) translateX(6px)
}
to {
transform: scale(1)
}
}
@keyframes e {
0% {
transform: scale(1)
}
10% {
transform: scale(1.2) translateX(-6px)
}
25% {
transform: scale(1.3) translateX(-8px)
}
40% {
transform: scale(1.2) translateX(-6px)
}
50% {
transform: scale(1)
}
60% {
transform: scale(.8) translateX(-6px)
}
75% {
transform: scale(.7) translateX(-8px)
}
90% {
transform: scale(.8) translateX(-6px)
}
to {
transform: scale(1)
}
}
.lum-lightbox {
background: rgba(0, 0, 0, .6);
}
.lum-lightbox-inner {
bottom: 2.5%;
left: 2.5%;
right: 2.5%;
top: 2.5%
}
.lum-lightbox-inner img {
position: relative
}
.lum-lightbox-inner .lum-lightbox-caption {
color: #fff;
margin: 0 auto;
max-width: 700px;
text-align: center
}
.lum-loading .lum-lightbox-loader {
animation: c 1.8s linear infinite;
display: block;
height: 20px;
left: 50%;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
width: 66px
}
.lum-lightbox-loader:after, .lum-lightbox-loader:before {
background: hsla(0, 0%, 100%, .9);
border-radius: 20px;
content: "";
display: block;
height: 20px;
margin-top: -10px;
position: absolute;
top: 50%;
width: 20px
}
.lum-lightbox-loader:before {
animation: d 1.8s linear infinite;
left: 0
}
.lum-lightbox-loader:after {
animation: e 1.8s linear infinite;
animation-delay: -.9s;
right: 0
}
.lum-lightbox.lum-opening {
animation: a .18s ease-out
}
.lum-lightbox.lum-opening .lum-lightbox-inner {
animation: b .18s ease-out
}
.lum-lightbox.lum-closing {
animation: a .3s ease-in;
animation-direction: reverse
}
.lum-lightbox.lum-closing .lum-lightbox-inner {
animation: b .3s ease-in;
animation-direction: reverse
}
.lum-img {
transition: opacity .12s ease-out
}
.lum-loading .lum-img {
opacity: 0
}
.lum-gallery-button {
background: transparent;
border: 0;
cursor: pointer;
height: 100px;
margin: 0;
max-height: 100%;
outline: 0;
overflow: hidden;
padding: 0;
position: absolute;
text-indent: 150%;
top: 50%;
transform: translateY(-50%);
white-space: nowrap;
width: 60px
}
.lum-close-button {
height: 32px;
opacity: .3;
position: absolute;
right: 5px;
top: 5px;
width: 32px
}
.lum-close-button:hover {
opacity: 1
}
.lum-close-button:after, .lum-close-button:before {
background-color: #fff;
content: " ";
height: 33px;
left: 15px;
position: absolute;
width: 2px
}
.lum-close-button:before {
transform: rotate(45deg)
}
.lum-close-button:after {
transform: rotate(-45deg)
}
.lum-previous-button {
left: 12px
}
.lum-next-button {
right: 12px
}
.lum-gallery-button:after {
border-top: 4px solid hsla(0, 0%, 100%, .8);
content: "";
display: block;
height: 36px;
position: absolute;
top: 50%;
width: 36px
}
.lum-previous-button:after {
border-left: 4px solid hsla(0, 0%, 100%, .8);
border-radius: 3px 0 0 0;
box-shadow: -2px 0 rgba(0, 0, 0, .2);
left: 12%;
transform: translateY(-50%) rotate(-45deg)
}
.lum-next-button:after {
border-radius: 0 3px 0 0;
border-right: 4px solid hsla(0, 0%, 100%, .8);
box-shadow: 2px 0 rgba(0, 0, 0, .2);
right: 12%;
transform: translateY(-50%) rotate(45deg)
}
@media (max-width:460px) {
.lum-lightbox-image-wrapper {
-webkit-overflow-scrolling: touch;
display: flex;
overflow: auto
}
.lum-lightbox-caption {
bottom: 0;
position: absolute;
width: 100%
}
.lum-lightbox-position-helper {
margin: auto
}
.lum-lightbox-inner img {
max-height: none;
max-width: none
}
}


.lum-lightbox-inner img {
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
object-fit: contain;
}

@media (max-width: 460px) {
.lum-lightbox-inner img {
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
}
}