/*
    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{
  display:block;
  max-width:none;
  float:left;
  margin:auto;
  border:0;
  -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:#5d5d5d;
  opacity: 0.6;
  filter: alpha(opacity = 60);
}

#colorbox{
  overflow: visible!important;
  outline:0;
}

#cboxContent{
  overflow:visible;
}

.cboxIframe{
  background:#fff;
}

#cboxError{
  padding:50px;
  border:1px solid #ccc;
}

#cboxLoadedContent{
  padding:0;
  border-radius: 4px;
  background:#fff;
}

#cboxLoadingGraphic{
  background:url(/ips_static/common/images/bx_loader.gif) no-repeat center center;
}

#cboxLoadingOverlay{
  background:#fff;
}

#cboxTitle{
  position:absolute;
  top:-22px;
  left:0;
  color:#000;
}

#cboxCurrent{
  position:absolute;
  top:-22px;
  right:205px;
  text-indent:-9999px;
}

/* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {}

/* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
#cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {
  outline:0;
}

#cboxPrevious{
  right:44px;
  background-position:0px 0px;
}

#cboxPrevious:hover{
  background-position:0px -25px;
}

#cboxNext{
  right:22px;
  background-position:-25px 0px;
}

#cboxNext:hover{
  background-position:-25px -25px;
}

#cboxClose{
  overflow:visible;
  width:33px;
  height:33px;
  position:absolute;
  top:-40px;
  right:-38px;
  border:0;
  padding:0;
  margin:0;
  background:url(/ips_static/common/images/btn_modal_close.png) no-repeat 0 0;
  text-indent:-9999px;
}

#cboxClose:hover{
  background-position:0 0;
}

.cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{
  right:66px;
}

.cboxSlideshow_on #cboxSlideshow{
  right:44px;
  background-position:-75px -25px;
}

.cboxSlideshow_on #cboxSlideshow:hover{
  background-position:-100px -25px;
}

.cboxSlideshow_off #cboxSlideshow{
  right:44px;
  background-position:-100px 0px;
}

.cboxSlideshow_off #cboxSlideshow:hover{
  background-position:-75px -25px;
}