/*
  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: #2d5980; opacity: 0.7; filter: alpha(opacity = 70); }
#colorbox { outline: 0; }
#cboxContent { margin-top: 40px; background: #fffde3; /*-moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;*/ -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5); box-shadow: 0 0 8px rgba(0, 0, 0, 0.5); }
.cboxIframe { background: #000; }
#cboxError { padding: 50px; border: 1px solid #ccc; }
/*
#cboxLoadedContent { border: 5px solid #fff; background: #000; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
*/
#cboxLoadedContent{ border: 5px solid #fffde3;background: #fffde3; background: #fffde3; /* -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; */ -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5); box-shadow: 0 0 8px rgba(0, 0, 0, 0.5); }
#cboxTitle { position: absolute; bottom: 100%; left: 0; width: 75%; margin-bottom: 8px; font-weight: bold; font-size: 1.05em; color: #fff; text-shadow: 0 1px 1px rgba(0,0,0,.7); }
#cboxCurrent { display: none !important; position: absolute; top: -20px; right: 0; color: #ccc; }
#cboxLoadingGraphic { background: url(../img/colorbox/loading.gif?v=2) no-repeat center center; }

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

/* 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; top: 50%; left: 10px; margin-top: -18px; width: 36px; height: 36px; background: url(../img/colorbox/sprite.png) 0 -36px no-repeat; text-indent: -9999px; }
#cboxPrevious:hover { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; -khtml-opacity: 0.80; -moz-opacity: 0.80; opacity: 0.80; }

#cboxNext { position: absolute; top: 50%; right: 10px; margin-top: -18px; width: 36px; height: 36px; background: url(../img/colorbox/sprite.png) 0 -72px no-repeat; text-indent: -9999px; }
#cboxNext:hover { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; -khtml-opacity: 0.80; -moz-opacity: 0.80; opacity: 0.80; }

#cboxClose { position: absolute; top: 5px; right: 5px; width: 36px; height: 36px; background: url(../img/colorbox/sprite.png) 0 0 no-repeat; text-indent: -9999px; }
#cboxClose:hover { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; -khtml-opacity: 0.80; -moz-opacity: 0.80; opacity: 0.80; }

@media screen and (min-width: 0) and (max-width: 640px) {
    #cboxClose  { right: 10px; }
    #cboxTitle { padding-left: 10px; padding-right: 10px; }
}