/*** XEN/ECH CUSTOMIZATIONS */
.lightboxOverlay {z-index:99}
.lb-dataContainer {background-color:white}
.lb-outerContainer {min-height: 180px}
@media (max-width:350px) {
.lb-container, .lb-dataContainer, .lb-outerContainer, #lightbox {min-width: 300px; }
}
@media (max-width:400px) {
.lb-container, .lb-dataContainer, .lb-outerContainer, #lightbox {min-width: 400px; }
}
@media (min-width:420px) {
.lb-container, .lb-dataContainer, .lb-outerContainer, #lightbox {min-width: 420px; }
}
@media (min-width:500px) {
.lb-container, .lb-dataContainer, .lb-outerContainer, #lightbox {min-width: 500px; }
}
@media (min-width:550px) {
.lb-container, .lb-dataContainer, .lb-outerContainer, #lightbox {min-width: 550px; }
}

#lightbox {
	position: fixed;
    overflow-y: auto;
    height: auto;
    max-height: 93vh;
    width: auto;
    left: 50% !important;
    margin: 0 auto;
    text-align: center;
    transform: translateX(-50%);
    border: solid 5px #798a77;
    top: 20px !important;
}

.lb-data .lb-details {
    padding: 0 4px;
    color: #0e0e0e;
    margin:0 auto;  position:relative; /*float:none;*/
}
.lb-close {
	/*margin-right: 20px;
	position: absolute;
	top:0px; 
	left:0px;*/
}


/*
#lightbox {top: 50% !important;transform: translateY(-50%);}*/ /** center it. library uses it's own parm to set height but center is usually what we want not a set px value  **/
.lb-image {margin: 0 auto;}
#lightboxOverlay {opacity: 0.5}

/** BELOW: customization per malcolm, nov 19 2019 **/

 @media (min-width: 750px) {
.lb-container, .lb-dataContainer, .lb-outerContainer, #lightbox {min-width: 750px !important;}
}
.lb-close {
    display: block;
    float: right;
    width: 30px;
    height: 30px;
    background: url(../img/close.png) top right no-repeat;
    text-align: right;
    outline: none;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
    opacity: 0.7;
    -webkit-transition: opacity 0.2s;
    -moz-transition: opacity 0.2s;
    -o-transition: opacity 0.2s;
    transition: opacity 0.2s;
    z-index: 100;

}

.lb-data .lb-caption {font: 10px Verdana,Helvetica,sans-serif !important; }
.lb-data .lb-caption #caption a {    text-decoration: underline !important;}
.lb-data .lb-caption a:link {   color: #647562 !important; text-decoration:underline !important } /*text-decoration: none !important;}*/
.lb-caption {font-weight: bold}
.lb-dataContainer {
font: 10px Verdana,Helvetica,sans-serif;
    background-color: #fff;
    margin: 0 auto;
    margin-top: 30px;
    line-height: 1.4em;
    overflow: auto;
    width: 100%;
}
.lb-data .lb-caption a {
    color: #333 !important;
    text-decoration: underline !important;
    outline: 0;
}
.lb-closeContainer {
position: sticky;
    right: 0px;
    top: 0px;
    height: 0px;
    width: 100%;
    z-index: 100;
    background: white;
}

.lb-data .lb-details {
    width: 85%;
    float: none;
    text-align: left;
    line-height: 1.1em;
     margin: 0 auto !important; 
}
.lightbox {background: white}

@media (max-width: 500px ) {
	.lb-data .lb-details { width: 95%}
}