/* IMAGE LIGHTBOX SELECTOR */

#imagelightbox {
cursor:pointer;
position:fixed;
z-index:10000;
-ms-touch-action:none;
touch-action:none;
-webkit-box-shadow:0 0 1em rgba(0,0,0,0.2);
box-shadow:0 0 1em rgba(0,0,0,0.2);
}


/* OVERLAY */

#imagelightbox-overlay {
background-color:#fafafa;
background-color:rgba(0,0,0,0.9);
position:fixed;
z-index:9998;
top:0;
right:0;
bottom:0;
left:0;
}


/* "CLOSE" BUTTON */

#imagelightbox-close{
width:2.5em;
height:2.5em;
text-align:left;
background:none;
border:none;
position:fixed;
z-index:10002;
top:2.5em;
right:2.5em;
color:#fff;
}

#imagelightbox-close:before, #imagelightbox-close:after{
width:2px;
background-color:rgb(30,30,30);
content: '';
position:absolute;
top:20%;
bottom:20%;
left:50%;
margin-left:-1px;
}

#imagelightbox-close:before {
-webkit-transform: rotate( 45deg );
-ms-transform: rotate( 45deg );
transform: rotate( 45deg );
}

#imagelightbox-close:after{
-webkit-transform: rotate( -45deg );
-ms-transform: rotate( -45deg );
transform: rotate( -45deg );
}


/* ARROWS */

.imagelightbox-arrow{
width:3em;
height:3em;
vertical-align:middle;
background:none;
display:none;
position:fixed;
z-index:10001;
top:50%;
margin-top:-1.5em;
border:none;
}

.imagelightbox-arrow-left {
left: 2.5em;
background:url(../images/cursor-prev.png);
}

.imagelightbox-arrow-right {
right: 2.5em;
background:url(../images/cursor-next.png);
}

#imagelightbox-overlay, #imagelightbox-close, #imagelightbox-caption, #imagelightbox-nav, .imagelightbox-arrow {
-webkit-animation: fade-in .25s linear;
animation: fade-in .25s linear;
}

@-webkit-keyframes fade-in {
from	{ opacity: 0; }
to		{ opacity: 1; }
}

@keyframes fade-in {
from	{ opacity: 0; }
to		{ opacity: 1; }
}

@media only screen and (max-width: 40em) {
#container {
width: 100%;
}

#imagelightbox-close {
top: 1.25em;
right: 1.25em;
}

.imagelightbox-arrow {
width: 2.5em;
height: 2.5em;
margin-top: -1.25em;
}

.imagelightbox-arrow-left {
left: 1.25em;
}

.imagelightbox-arrow-right {
right: 1.25em;
}
}

@media only screen and (max-width: 20em) {
.imagelightbox-arrow-left {
left: 0;
}
.imagelightbox-arrow-right {
right: 0;
}
}