df8bedcafa53dea073ca986d914426c1c4472514
3 The following CSS is consistent between example themes and should not be altered.
5 #colorbox, #cboxOverlay
, #cboxWrapper
{position:absolute
; top:0; left:0; z-index:4999; overflow:hidden
;}
6 #cboxWrapper {max-width:none
;}
7 #cboxOverlay{position:fixed
; width:100%; height:100%;}
8 #cboxMiddleLeft, #cboxBottomLeft
{clear:left
;}
9 #cboxContent{position:relative
;}
10 #cboxLoadedContent{overflow:auto
; -webkit-overflow-scrolling: touch
;}
12 #cboxLoadingOverlay, #cboxLoadingGraphic
{position:absolute
; top:0; left:0; width:100%; height:100%;}
13 #cboxPrevious, #cboxNext
, #cboxClose
, #cboxSlideshow
{cursor:pointer
;}
14 .cboxPhoto{float:right
; margin:auto
; border:0; display:block
; max-width:none
; -ms-interpolation-mode:bicubic
;}
15 .cboxIframe{width:100%; height:100%; display:block
; border:0; padding:0; margin:0;}
16 #colorbox, #cboxContent
, #cboxLoadedContent
{-webkit-box-sizing: content-box
;-moz-box-sizing: content-box
;box-sizing: content-box
;}
20 Change the following styles to modify the appearance of Colorbox. They are
21 ordered & tabbed in a way that represents the nesting of the generated HTML.
23 #cboxOverlay{background:url
(images/overlay.png) repeat
0 0; opacity: 0.9; filter: alpha
(opacity
= 90);}
25 #cboxTopLeft{width:21px; height:21px; background:url
(images/controls.png) no-repeat
-101px 0;}
26 #cboxTopRight{width:21px; height:21px; background:url
(images/controls.png) no-repeat
-130px 0;}
27 #cboxBottomLeft{width:21px; height:21px; background:url
(images/controls.png) no-repeat
-101px -29px;}
28 #cboxBottomRight{width:21px; height:21px; background:url
(images/controls.png) no-repeat
-130px -29px;}
29 #cboxMiddleLeft{width:21px; background:url
(images/controls.png) left top repeat-y
;}
30 #cboxMiddleRight{width:21px; background:url
(images/controls.png) right top repeat-y
;}
31 #cboxTopCenter{height:21px; background:url
(images/border.png) 0 0 repeat-x
;}
32 #cboxBottomCenter{height:21px; background:url
(images/border.png) 0 -29px repeat-x
;}
33 #cboxContent{background:#fff; overflow:hidden
;}
34 .cboxIframe{background:#fff;}
35 #cboxError{padding:50px; border:1px solid
#ccc;}
36 #cboxLoadedContent{margin-bottom:28px;}
37 #cboxTitle{position:absolute
; bottom:0px; right:0; text-align:center
; width:100%; color:#949494;}
38 #cboxCurrent{position:absolute
; bottom:0px; right:58px; color:#949494;}
39 #cboxLoadingOverlay{background:url
(images/loading_background.png) no-repeat center center
;}
40 #cboxLoadingGraphic{background:url
(images/loading.gif) no-repeat center center
;}
42 /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
43 #cboxPrevious, #cboxNext
, #cboxSlideshow
, #cboxClose
{border:0; padding:0; margin:0; overflow:visible
; width:auto
; background:none
; }
45 /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
46 #cboxPrevious:active
, #
cboxNext:active
, #
cboxSlideshow:active
, #
cboxClose:active
{outline:0;}
48 #cboxSlideshow{position:absolute
; bottom:0px; left:30px; color:#0092ef;}
49 #cboxPrevious{position:absolute
; bottom:0; right:0; background:url
(images/controls.png) no-repeat
-50px 0; width:25px; height:25px; text-indent:-9999px;}
50 #cboxPrevious:hover
{background-position:-50px -25px;}
51 #cboxNext{position:absolute
; bottom:0; right:27px; background:url
(images/controls.png) no-repeat
-75px 0; width:25px; height:25px; text-indent:-9999px;}
52 #cboxNext:hover
{background-position:-75px -25px;}
53 #cboxClose{position:absolute
; bottom:0; left:0; background:url
(images/controls.png) no-repeat
-25px 0; width:25px; height:25px; text-indent:-9999px;}
54 #cboxClose:hover
{background-position:-25px -25px;}
57 The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
58 when an alpha filter (opacity change) is set on the element or ancestor element. This style is not applied to or needed in IE9.
59 See: http://jacklmoore.com/notes/ie-transparency-problems/
62 .cboxIE #cboxTopCenter
,
63 .cboxIE #cboxTopRight
,
64 .cboxIE #cboxBottomLeft
,
65 .cboxIE #cboxBottomCenter
,
66 .cboxIE #cboxBottomRight
,
67 .cboxIE #cboxMiddleLeft
,
68 .cboxIE #cboxMiddleRight {
69 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
=#00FFFFFF
,endColorstr
=#00FFFFFF
);