/*
    ColorBox Core Style
    The following rules are the styles that are consistant between themes.
    Avoid changing this area to maintain compatability with future versions of ColorBox.
*/
#colorbox, #cboxOverlay, #cboxWrapper {position: absolute;top: 0;left: 0;z-index: 999999;overflow: hidden;}
#cboxOverlay { position: fixed; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); }
#cboxMiddleLeft, #cboxBottomLeft { clear: left; }
#cboxContent { position: relative; }
#cboxLoadedContent { overflow: scroll; -webkit-overflow-scrolling: touch; }
#cboxLoadedContent iframe { display: block; width: 100%; height: 100%; border: 0; -webkit-overflow-scrolling: touch; }
#cboxTitle { margin: 0; background: #249d6a !important; padding: 8px 20px; font-weight: 400 !important; color: #FFF; }
#cboxLoadingOverlay, #cboxLoadingGraphic { position: absolute; top: 0; left: 0; width: 100%; }
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow { cursor: pointer; }
/* 
    ColorBox example user style
    The following rules are ordered and tabbed in a way that represents the
    order/nesting of the generated HTML, so that the structure easier to understand.
*/
#cboxOverlay { }

#colorbox { box-shadow: 0 0 10px #000; }

#cboxContent { margin: 0; padding: 0 !important; }

#cboxLoadedContent { background: #FFF; top: 32px; position: relative; padding-bottom: 32px; width: 100% !important; }
.pop-hdng { background: #249d6a; color: #FFF; position: absolute; left: 0; top: 0; right: 0; }

#cboxTitle { position: absolute; top: 0; width: 100%; height: 32px; left: 0; }

#cboxCurrent { position: absolute; top: -20px; right: 0px; color: #ccc; }

#cboxSlideshow { position: absolute; top: -20px; right: 90px; color: #fff; }

#cboxPrevious { position: absolute; top: 50%; left: 5px; margin-top: -32px; background: url('images/controls.png') no-repeat top left; width: 28px; height: 65px; text-indent: -9999px; }

	#cboxPrevious.hover { background-position: bottom left; }

#cboxNext { position: absolute; top: 50%; right: 5px; margin-top: -32px; background: url('images/controls.png') no-repeat top right; width: 28px; height: 65px; text-indent: -9999px; }

	#cboxNext.hover { background-position: bottom right; }

#cboxLoadingOverlay { background: #000; }

#cboxLoadingGraphic { background: url('images/loading.gif') no-repeat center center; }

#cboxClose, #EditClose, .custom-cboxClose { position: absolute; content: 'X'; top: 6px; right: 6px; color: #FFF; width: 22px; height: 22px; min-width: 22px !important; padding: 0 !important; display: block; z-index: 10000000000000001; line-height: 22px; font-family: "Arial Unicode MS"; text-align: center; font-size: 14px; border: 1px solid #FFF; background: #249d6a; font-family: Arial, sans-serif; transition: all .4s ease-in-out; }
	#cboxClose:hover, #EditClose:hover, .custom-cboxClose:hover { border-radius: 100%; -webkit-transform: rotate(360deg) translate3d( 0, 0, 0) !important; transform: rotate(360deg) translate3d( 0, 0, 0) !important; color: #FFF; text-decoration: none; }
/*#cboxClose:before{content:'X';}*/
@media screen and (max-width:900px) {
	#colorbox { width: 90% !important; left: 5% !important; }
	#cboxOverlay, #cboxWrapper, #cboxContent, #cboxLoadedContent { width: 100% !important; }
}
