#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; border-radius:8px; }
#imageContainer{ padding: 10px; }
#lightboxImage{border-radius:4px}

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{position:absolute;top:10px;left:10px;height:calc(100% - 20px);width:calc(100% - 20px);z-index:10;pointer-events:none}
#imageContainer>#hoverNav{left:10px}

/* Hovering each half of the image reveals its navigation square. */
#prevLink,#nextLink{position:absolute;top:0;display:block;width:49%;height:100%;color:#d1000d;text-decoration:none;pointer-events:auto}
#hoverNav a i{position:absolute;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:#fff;font-size:27px;line-height:1;opacity:0}
#prevLink{left:-5px}
#nextLink{right:-5px}
#prevLink i{left:0}
#nextLink i{right:0}
#hoverNav a:hover i,#hoverNav a:focus-visible i{opacity:1}
#hoverNav a:focus-visible,#imageData #bottomNavClose:focus-visible{outline:2px solid #d1000d;outline-offset:3px}

/* Caption and close control match the product cards. */
#imageDataContainer{font:inherit;line-height:1.45;background-color:#fff;color:#111;margin:0 auto;overflow:auto;width:100%;border-radius:0 0 8px 8px}

#imageData{display:flex;align-items:center;gap:10px;padding:3px 10px 10px}
#imageData #imageDetails{flex:1;min-width:0;text-align:left;overflow-wrap:anywhere}
#imageData #caption{display:block;font-family:'Museo','Raleway',Verdana,Arial,sans-serif;font-size:1em;font-weight:900;text-transform:uppercase}
#imageData #numberDisplay{display:block;font-size:12px;opacity:.5}
#imageData #bottomNav{flex:0 0 30px}
#imageData #bottomNavClose{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:30px;height:30px;border:2px solid #d1000d;border-radius:50%;background:none;color:#d1000d;font-size:16px;line-height:1;text-decoration:none;transition:.25s}
#imageData #bottomNavClose:hover{border-color:rgb(168,173,173);color:rgb(168,173,173)}

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }