/**
 * Custom overrides for colorbox style.
 */
/* Spiderweb background */
#cboxOverlay {
  background: #000;
  background-image: url("images/bg.jpg");
}

#colorbox {
  overflow: visible !important; /* Required by the close button, title etc. */
  background: #000;
}
#cboxLoadingOverlay {
/*  background: #000;*/
}

#colorbox div {
  overflow: visible !important; /* Required by the close button, title etc. */
/*  background: #000; */
}

#cboxContent {
  margin-bottom: 28px;
  position: relative;
  left: -16px;
}

#cboxLoadedContent {
  background: transparent;
  border: none;
}

/**
 * These elements are buttons, and may need to have additional
 * styles reset to avoid unwanted base styles.
 */
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow {
  border: 0;
  padding: 0;
  margin: 0;
  overflow: visible;
  width: auto;
  background: none;
  cursor: pointer;
  outline: none;

  position: absolute;
  top: 0;
  width: 50%;
  text-indent: -9999px;
  background-repeat: no-repeat;
  height: 100%;
}

.cboxPhoto {
  border: #fff4db 9px solid;
  margin: auto;
  display: block;
  width: auto !important;
  height: auto !important;
  max-width:100% !important;
  max-height: 100% !important;
}

#cboxTitle {
  left: 0;
  top: 0;
/*  height: 68px; */
  padding: 0.5em 140px 0.5em 20px;
  vertical-align: middle;
  float: none !important;
  position: relative;
  bottom: 0;
  color: white;
  font-style: italic;
  background: #000;
}
#cboxCurrent {
  position: absolute;
  bottom: -26px;
  right: 80px;
  color: #313131;
  border-left: 1px solid #313131;
  padding: 0 0 0 15px;
  display: none !important;
}

#cboxPrevious {
  position: absolute;
  left: -56px;
  background: none;
  text-indent: -9999px;
  background-position: 0 10% !important;
}
/* media gallery items are different */
.tval-colorbox #cboxPrevious {
  left: -72px;
}
#cboxPrevious:hover {
  background-position: 0 0;
  background: url(images/prev.gif) no-repeat;
}
#cboxNext {
  position: absolute;
  right: -51px;
  background: none;
  text-indent: -9999px;
  background-position: 100% 10% !important;
}
/* media gallery items are different */
.tval-colorbox #cboxNext {
  right: -67px;
}
#cboxNext:hover {
    background: url(images/next.gif) no-repeat 0 ;
}

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

#cboxClose {
  background: transparent url("images/close.gif") no-repeat scroll right center;
  display: block;
  height: 23px;
  width: 84px;
  padding: 0px;
  position: absolute;
  top: -19px;
  right: 18px;
  z-index: 10700;
}
#cboxClose:hover {
   background: transparent url("images/close-hover.gif");
}

#cboxWrapper {
  width: 100% !important;
  padding: 0 16px;
}

.cbox-corner {
  position: absolute;
  z-index: 10600;
}
#cbox-top-left {
  top: 0;
  left: 0;
  background: transparent url("images/close-hover.gif");
}
#cbox-top-right {
  top: 0;
  right: 0;
}

#cboxContent .corner {
  height: 80px;
  width: 80px;
  position: absolute;
}

#cboxContent .corner-top-left {
  top: -35px;
  left: -13px;
  background: url(images/corner-tl.gif) top left no-repeat;
}
/* media gallery items are different */
.tval-colorbox #cboxContent .corner-top-left {
  left: -29px;
}

#cboxContent .corner-top-right {
  top: -35px;
  right: -17px;
  background: url(images/corner-tr.gif) top left no-repeat;
}
.tval-colorbox #cboxContent .corner-top-right {
  right: -32px;
}

#cboxContent .corner-bottom-left {
  bottom: -28px;
  left: -13px;
  background: url(images/corner-bl.gif) top left no-repeat;
}
.tval-colorbox #cboxContent .corner-bottom-left {
  left: -29px;
}

#cboxContent .corner-bottom-right {
  bottom: -28px;
  right: -17px;
  background: url(images/corner-br.gif) top left no-repeat;
}
.tval-colorbox #cboxContent .corner-bottom-right {
  right: -32px;
}

.node-type-media-gallery #colorbox {
  padding: 0 16px 32px 16px;
}
.node-type-media-gallery #cboxWrapper {
  padding-left: 32px;
}