/*-----	Colorbox Core Style - Do Not Change These */
#colorbox,
#cboxOverlay,
#cboxWrapper{
position:absolute;
top:0;
left:0;
z-index:9999;
overflow:hidden;
}
#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;
}
#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;
}
#colorbox, 
#cboxContent, 
#cboxLoadedContent{
box-sizing:content-box; 
-moz-box-sizing:content-box; 
-webkit-box-sizing:content-box;
}

/*----------------------------------------------------------------------------------------------------------*/
/*----- Use to Modify Colorbox Appearance - Nesting Order of HTML */
#cboxOverlay{
background:#FFF;		/* White Background Area */
}
#colorbox{
outline:1px solid #CCC;	/* Grey Hairline Border */
}

/*----	Do Not Change These */
#cboxTopLeft{
width:14px; 
height:14px; 
background:url(../graphics/controls.png) no-repeat 0 0;
}
#cboxTopCenter{
height:14px; 
background:url(../graphics/border.png) repeat-x top left;
}
#cboxTopRight{
width:14px; 
height:14px; 
background:url(../graphics/controls.png) no-repeat -36px 0;
}
#cboxBottomLeft{
width:14px; 
height:43px; 
background:url(../graphics/controls.png) no-repeat 0 -32px;
}
#cboxBottomCenter{
height:43px; 
background:url(../graphics/border.png) repeat-x bottom left;
}
#cboxBottomRight{
width:14px; 
height:43px; 
background:url(../graphics/controls.png) no-repeat -36px -32px;
}
#cboxMiddleLeft{
width:14px; 
background:url(../graphics/controls.png) repeat-y -175px 0;
}
#cboxMiddleRight{
width:14px; 
background:url(../graphics/controls.png) repeat-y -211px 0;
}
.cboxIframe{
background:#F00;
}
#cboxError{
padding:50px; 
border:1px solid #ccc;
}

/*----------------------------------------------------------------------------------------------------------*/	
#cboxLoadedContent{
margin-bottom:25px;		/* Margin Below Content */
}     

/*-----	Slide Titles */      
#cboxTitle{
position:absolute;
bottom:-5px;			/* Titles Position	bottom:-25px; */
left:0;
text-align:center;
width:100%;
font-size:70%;			/* font-weight:bold; */
color:#555; 			/* Mid Grey */
}

/*----- X Image Numbers ie. image 1 of 9 */
#cboxselected{
position:absolute;
bottom:-35px;				/* Numbers Position	bottom:-25px; */
left:58px;
font-size:50%;				/* font-weight:bold; */
color:#555;					/* Mid Grey */
}		

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

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

#cboxNext{
left:27px; 
background-position:-75px -25px;
}
#cboxNext:hover{
background-position:-75px 0px;
}

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

.cboxSlideshow_on #cboxSlideshow{
background-position:-125px 0px; 
right:27px;
}
.cboxSlideshow_on #cboxSlideshow:hover{
background-position:-150px 0px;
}
.cboxSlideshow_off #cboxSlideshow{
background-position:-150px -25px; 
right:27px;
}
.cboxSlideshow_off #cboxSlideshow:hover{
background-position:-125px 0px;
}