img {
cursor: pointer;
}
body.darkbox-opened {
overflow: hidden;
}
.darkbox-container {
transition: 0.3s;
opacity: 0;
position: fixed;
top: 0;
left: 0;
height: 100vh;
width: 100vw;
z-index: 9999999999999;
background-color: rgba(0, 0, 0, 0.8); 
overflow: auto;
}
.darkbox-container .darkbox-navigate {
color: white;
font-size: 30px; 
}
.darkbox-container .darkbox-navigate .darkbox-navigate-arrow, .darkbox-container .darkbox-navigate .darkbox-close {
position: fixed;
background-color: rgba(0,0,0,0.1);
width: 50px;
height: 50px;
cursor: pointer;
transition: 0.3s;
background-size: 65%;
background-position: center;
background-repeat: no-repeat;
font-size: 0;
border-radius: 50px;
}
.darkbox-container .darkbox-navigate .darkbox-navigate-arrow {
top: calc(50% - 35px);
display: flex;
align-items: center;
}
.darkbox-container .darkbox-navigate .darkbox-close:hover, .darkbox-container .darkbox-navigate .darkbox-navigate-arrow:hover  {
background-color:  #000;
}
.darkbox-container .darkbox-navigate .darkbox-close {
background-image: url(/wp-content/themes/basetheme/assets/darkbox/close.svg);
top: 15px;
right: 15px;
}
.darkbox-container .darkbox-navigate .darkbox-navigate-left {
background-image: url(/wp-content/themes/basetheme/assets/darkbox/prev.svg);
left: 15px; 
}
.darkbox-container .darkbox-navigate .darkbox-navigate-right {
background-image: url(/wp-content/themes/basetheme/assets/darkbox/next.svg);
right: 15px; 
}
.darkbox-container .darkbox-content {
transition: 0.2s;
position: relative;
height: 100%;
width: 100%;
padding: 25px;
box-sizing: border-box; 
display: flex;
align-items: center;
justify-content: center;
transform: scale(0.8);
}
.darkbox-container .darkbox-content img {
opacity: 1;
cursor: default; 
border-radius: 5px;
max-height: 90%;
max-width: min( 90%, 700px );
}
.darkbox-container .darkbox-img-filename {
color: white;
padding: 10px;
position: fixed;
left: 0;
right: 0;
bottom: 0;
text-align: center;
}
.darkbox-container-open {
opacity: 1; 
}
.darkbox-container-open .darkbox-content {
transform: scale(1); 
}
.darkbox-container .darkbox-content  .darkbox-iframe {
border: 0px;
width: 100%!important;
height: 100%!important;
}
@media screen and (max-width: 1023px) {
.darkbox-container .darkbox-content {
padding: 0;
}
}