/*
    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:10px; left:0; z-index:9999;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto !important; overflow: hidden;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#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{background:#000000;}
#colorbox{}
#cboxContent{background:#000; margin-top:20px;}
#cboxLoadedContent{background:transparent; padding:1px;}
#cboxTitle{position:absolute; top:-20px; left:0; color:#ccc;}
#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.gif) top left no-repeat; 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.gif) top right no-repeat; width:28px; height:65px; text-indent:-9999px;}
#cboxNext.hover{background-position:bottom right;}
#cboxLoadingOverlay{background:#000;}
#cboxLoadingGraphic{background:url(/images/loading.gif) center center no-repeat;}
#cboxClose{position:absolute; top:10px; right:5px; display:block; background:url(/images/controls-close.gif) top left no-repeat; width:98px; height:19px; text-indent:-9999px;}
#cboxClose.hover{background-position:bottom left;}

#video	{
	padding: 30px 50px 50px 50px;
	height: 380px;
	width: 480px;
	border: 1px solid #333333;
	}

/*LIFE CYCLE DIAGRAM*/
#life-cycle-light-box-container	{
	background: url(/images/life-cycle-spider.png) no-repeat top center;
	float: left;
	border: 1px solid #333333;
	width: 699px;
	height: 470px;
	}

.lightbox-preview h3	{
	font-size: 1.0em;
	font-weight: bold;
	border-bottom: 1px dotted #333333;
	width: auto;
	margin: 0px 0px 3px 0px;
	padding: 0px 0px 3px 0px;
	}

.lightbox-preview p	{
	font-size: 0.688em;
	color: #585858;
	width: auto;
	margin: 0;
	padding: 0;
	}	

.top-left, 
.top-center, 
.top-right, 
.center-left, 
.center-right, 
.bottom-left, 
.bottom-center, 
.bottom-right	{
	background-color: #242323;
	float: left;
	font-size: 0.75em;
	width: 187px;	
	height:  61px;
	overflow: hidden;
	color: #999999;
	}
	
.top-left a, 
.top-center a, 
.top-right a, 
.center-left a, 
.center-right a, 
.bottom-left a, 
.bottom-center a, 
.bottom-right a		{
	border: 1px solid #333333;
	font-size: 1.125em;
	text-align: center;
	display:block;
	padding: 15px 5px 5px 5px;
	width: 175px;	
	height: 39px;
	color: #999999;	
	}

.top-left a:hover, 
.top-center a:hover, 
.top-right a:hover, 
.center-left a:hover, 
.center-right a:hover, 
.bottom-left a:hover, 
.bottom-center a:hover, 
.bottom-right a:hover{
	border: 1px solid #dd266d;
	color: #ffffff;
	}

.hidden	{
	display:none;
	}

.inline-all	{
	display: inline;
	}		

.top-left-hidden, 
.top-center-hidden, 
.top-right-hidden, 
.center-left-hidden, 
.center-right-hidden, 
.bottom-left-hidden, 
.bottom-center-hidden, 
.bottom-right-hidden	{
	background-color: #ffffff;
	border: 1px solid #dd266d;
	display: none;
	width: 577px;
	height: 80px !important;
	height: 90px;
	padding: 10px;
	margin: 0;
	}

.top-left-hidden 		{top: 166px;left: 42px;}
.top-center-hidden 		{top: 166px;left: 258px;}
.top-right-hidden 		{top: 166px;left: 474px;}
.center-left-hidden 	{top: 279px;left: 27px !important; left: 28px;}
.center-right-hidden 	{top: 279px;left: 490px;}
.bottom-left-hidden 	{top: 393px;left: 41px !important; left: 42px;} 
.bottom-center-hidden	{top: 393px;left: 258px !important; left: 257px;} 
.bottom-right-hidden	{top: 393px;left: 474px !important; left: 473px;}

.top-left				{margin: 40px 0px 0px 40px !important;margin: 30px 0px 0px 20px;}
.top-center				{margin: 40px 0px 0px 29px !important;margin: 30px 0px 0px 29px;}	
.top-right				{margin: 40px 0px 0px 29px !important;margin: 30px 0px 0px 29px;}	
.center-left			{clear: left; margin: 52px 0px 0px 25px !important;margin: 53px 0px 0px 13px;}	
.center-right			{margin: 52px 0px 0px 276px !important;margin: 53px 0px 0px 244px;}	
.bottom-left			{clear: left;margin: 53px 0px 0px 39px !important;margin: 54px 0px 0px 20px;}	
.bottom-center			{margin: 53px 0px 0px 30px !important;margin: 54px 0px 0px 28px;}
.bottom-right			{margin: 53px 0px 0px 29px !important;margin: 54px 0px 0px 29px;}	

.lightbox-preview	{
	float: left;
	background-color: #242323;
	border: 1px solid #333333;
	width: 597px;
	height: 100px !important;
	height: 110px;
	clear: left;
	margin: 20px 0px 0px 50px !important;
	margin: 20px 0px 0px 25px;	
	}	