/* 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;} #cboxWrapper {max-width:none;} #cboxOverlay{position:fixed; width:100%; height:100%;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative;} #cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;} #cboxTitle{margin:0;} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} .cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;} .cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;} #colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;} /* 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; opacity: 0.8 !important; filter: alpha(opacity = 90);} #colorbox{outline:0;} #cboxContent{margin-top:20px;background:#000;} .cboxIframe{background:#fff;} #cboxError{padding:50px; border:1px solid #ccc;} #cboxLoadedContent{background:#fff;} #cboxTitle{position:absolute; top:-20px; left:0; color:#ccc;} #cboxCurrent{position:absolute; top:-20px; right:0px; color:#ccc;} #cboxLoadingGraphic{background:url(../i/loading.gif) no-repeat center center;} /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */ #cboxPrevious, #cboxNext {display: none !important; border:0; padding:0; margin:0; overflow:visible; left: 10px; top: 50%; margin-top: -29px; width: 57px; height: 57px; background-color: rgba(150, 0, 79, 0.8); background-repeat: no-repeat; background-position: 20px 14px; } #cboxContent:hover #cboxPrevious, #cboxContent:hover #cboxNext {display: inline-block !important;} #cboxPrevious:hover, #cboxNext:hover {background-color: rgba(255, 255, 255, 0.8);} /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */ #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;} #cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;} #cboxPrevious{position:absolute; background-image: url("../i/slider-controls-left.png"); text-indent:-9999px;} #cboxPrevious:hover{background-image: url("../i/slider-controls-left-hover.png");} #cboxNext{position:absolute; background-image: url("../i/slider-controls-right.png"); background-position: 23px 14px; left: auto; right: 10px; text-indent:-9999px;} #cboxNext:hover{background-image: url("../i/slider-controls-right-hover.png");} #cboxClose{position:absolute; top:-25px; right:-28px; display:block; background: url("../i/close.png") no-repeat 0 0; width:17px; height:17px; text-indent:-9999px;} #cboxClose:hover{background-position:0 bottom;}