/*
    ColorBox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:visible;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}

/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000;}
#colorbox{}
    #cboxContent{margin-top:6px; position:relative;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{background:#000; padding:0; line-height:normal; position:relative; overflow:visible !important; max-height:none !important;
            display:flex; align-items:center; justify-content:center; box-sizing:border-box;}
        #cboxLoadedContent .cboxPhoto{float:none; margin:0; object-fit:contain; flex-shrink:0;}
        /* Inside visible area — negative top was clipped by #colorbox overflow */
        #cboxTitle{position:absolute; top:8px; left:10px; right:50%; color:#eee; z-index:10050; font-size:13px; line-height:1.3; text-shadow:0 1px 3px #000, 0 0 8px #000; pointer-events:none;}
        #cboxCurrent{position:absolute; top:8px; right:48px; left:auto; color:#eee; z-index:10050; font-size:13px; line-height:1.3; text-shadow:0 1px 3px #000, 0 0 8px #000; pointer-events:none;}
        #cboxSlideshow{position:absolute; top:8px; right:120px; color:#fff; z-index:10050;}
        #cboxPrevious,
        #cboxNext{
            position:absolute;
            top:50%;
            width:42px;
            height:42px;
            margin-top:-21px;
            border-radius:21px;
            background:rgba(0, 0, 0, 0.72);
            border:1px solid rgba(255, 255, 255, 0.28);
            box-shadow:0 2px 8px rgba(0, 0, 0, 0.45);
            text-indent:-9999px;
            overflow:hidden;
        }
        #cboxPrevious{left:10px;}
        #cboxNext{right:10px;}
        #cboxPrevious:before,
        #cboxNext:before{
            content:"";
            position:absolute;
            top:50%;
            left:50%;
            width:12px;
            height:12px;
            margin-top:-6px;
            border-top:3px solid #fff;
            border-right:3px solid #fff;
        }
        #cboxPrevious:before{
            margin-left:-3px;
            transform:translate(-50%, 0) rotate(-135deg);
        }
        #cboxNext:before{
            margin-left:-9px;
            transform:translate(-50%, 0) rotate(45deg);
        }
        #cboxPrevious.hover,
        #cboxNext.hover,
        #cboxPrevious:hover,
        #cboxNext:hover{
            background:rgba(255, 255, 255, 0.16);
            border-color:rgba(255, 255, 255, 0.48);
        }
        #cboxLoadingOverlay{background:#000;}
        #cboxLoadingGraphic{background:url(images/gallery/loading.gif) no-repeat center center;}
        #cboxClose{position:absolute; top:4px; right:4px; display:block; width:40px; height:32px; text-indent:-9999px; z-index:10060; cursor:pointer;}