/*
    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:auto; 
    -webkit-overflow-scrolling: touch;
}
#cboxTitle {
    margin:0;
}
#cboxLoadingOverlay, 
#cboxLoadingGraphic {
    position:absolute; 
    top:0; 
    left:0; 
    width:100%; 
    height:100%;
}
#cboxClose {
    cursor:pointer;
}
.cboxIframe {
    width:100%; 
    height:100%; 
    display:block; 
    border: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; }
#colorbox { outline:0; }
#cboxTopLeft {
    width:14px; 
    height:14px; 
    background:url(/publisher/img/controls.png) no-repeat 0 0;
}
#cboxTopCenter {
    height:14px; 
    background:url(/publisher/img/border.png) repeat-x top left;
}
#cboxTopRight {
    width:14px; 
    height:14px; 
    background:url(/publisher/img/controls.png) no-repeat -36px 0;
}
#cboxBottomLeft {
    width:14px; 
    height:43px; 
    background:url(/publisher/img/controls.png) no-repeat 0 -32px;
}
#cboxBottomCenter {
    height:43px; 
    background:url(/publisher/img/border.png) repeat-x bottom left;
}
#cboxBottomRight {
    width:14px; 
    height:43px; 
    background:url(/publisher/img/controls.png) no-repeat -36px -32px;
}
#cboxMiddleLeft {
    width:14px; 
    background:url(/publisher/img/controls.png) repeat-y -175px 0;
}
#cboxMiddleRight {
    width:14px; 
    background:url(/publisher/img/controls.png) repeat-y -211px 0;
}
#cboxContent {
    background:#fff; 
    overflow:visible;
}
.cboxIframe { background:#fff; }
#cboxError {
    padding:50px; 
    border:1px solid #ccc;
}
#cboxLoadedContent { margin-bottom:5px; }
#cboxLoadingOverlay { 
    background:url(/publisher/img/loading_background.png) no-repeat center center;
}
#cboxLoadingGraphic { 
    background:url(/publisher/img/loading.gif) no-repeat center center;
}
#cboxTitle { 
    position:absolute; 
    bottom:-25px; 
    left:0; 
    text-align:center; 
    width:100%; 
    font-weight:bold; 
    color:#7C7C7C;
}
#cboxCurrent{
    position:absolute; 
    bottom:-25px; 
    left:58px; 
    font-weight:bold; 
    color:#7C7C7C;
}

/* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
#cboxClose { 
    padding:0; 
    margin:0; 
    overflow:visible;  
    position:absolute; 
    bottom:-29px; 
    background:url(/publisher/img/controls.png) no-repeat 0px 0px; 
    width:23px; 
    height:23px; 
    text-indent:-9999px;
    border: 0;
}
/* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
#cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active { outline:0; }


#cboxClose { right:0; background-position:-100px -25px;}
#cboxClose:hover { background-position:-100px 0px;}