@charset "utf-8";
	
/*NewsBoxes with sliding captions used for Index.html ----------------------------------------------------------------*/
/*The script used to create the NewsBoxes was taken from code created by Sam Dunn. You can find the his code here: http://buildinternet.com/2009/03/sliding-boxes-and-captions-with-jquery */
/* Thanks Sam! */


/*NEWS ITEMS ON OPENING PAGE ----------------------------------------------------------------------------------------------------*/

/*Title that says "News" ----------------*/
.NewsTitle {
	font-family: Arial, Helvetica, sans-serif;
	color: #171F69;
	font-size: 14px;
	font-weight: bold;
}
/*Headline Style ----------------*/
.NewsHeadline {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 10pt;
	color: #171F69;
	/*color: #AFB2CB; */
	margin: 4px 10px 0px 10px;
	letter-spacing:1px;
	line-height: 16px;
	font-weight: normal;
}

/*News body Style ----------------*/
.NewsBody {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9pt;
	color: #999;

}


/*The Image Box ----------------*/
.boxgrid {
	width: 192px;
	height: 143px;
	margin:0px;
	float:left;
	background:#FFF;
	/*border: solid 2px #8399AF; */
	overflow: hidden;
	position: relative;
}
.boxgrid img {
	position: absolute;
	top: 0px;
	left: 0px;
	border: 0;
}
.boxgrid p {
	padding: 0 10px;
	color:#afafaf;
	font-weight:bold;
	font:10pt "Lucida Grande", Arial, sans-serif;
}
/*The Caption Box ----------------*/	
		
.boxcaption {
float: left;
position: absolute;
background: #FFF;
width: 192px;
height: 144px;
/* width: 100%; */

/*	
opacity: .8; 

/* For IE 5-7 */
/* filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
/* For IE 8 */
/* -MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
/* left: 1px; */


	
}
.captionfull .boxcaption {
	top: 0;
	left: 0;
}
.caption .boxcaption {
	top: -1px;
	left: 0;
}

/*SECTOR SPLASH PAGE ----------------------------------------------------------------------------------------------------*/

/*Sector Splash page: Caption of Sceme Name ----------------*/
.SchemeName {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 11pt;
	text-wrap: normal;
	color: #171f69;
	/*color: #AFB2CB; */
	margin: 4px 10px 0px 10px;
	/*letter-spacing:1px;*/
	line-height: 16px;
	font-weight: normal;
	display:block; 
   	width:90%;  
	height:100%; 
	
}
.SchemeName a:link{
	text-decoration: none;
	text-wrap: normal;
	color: #171f69;
	display:block;  
   	width:90%;  
	height:100%;  

	
}
.SchemeName a:visited{
	text-decoration: none;
	text-wrap: normal;
	color: #171f69;
	display:block;  
   	width:90%;  
	height:100%;  

}
.SchemeName a:active{
	text-decoration: none;
	text-wrap: normal;
	color: #171f69;
	display:block;  
   	width:90%;  
	height:100%;  

}
.SchemeName a:hover{
	text-decoration: none;
	text-wrap: normal;
	color: #FFF;
	display:block;  
   	width:90%;  
	height:100%;  

}


/*Sector Splash page: Caption of Sceme Name WHERE BACKGROUND IS BLUE ----------------*/
.SchemeNameBlue {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 11pt;
	color: #FFF;
	/*color: #AFB2CB; */
	margin: 4px 10px 0px 10px;
	/*letter-spacing:1px;*/
	line-height: 16px;
	font-weight: normal;
		display:block;  
   	width:90%;  
	height:100%; 
	
}
.SchemeNameBlue a:link{
	text-decoration: none;
	color: #FFF;
	display:block;  
   	width:90%;  
	height:100%;  
}
.SchemeNameBlue a:visited{
	text-decoration: none;
	color: #FFF;
	display:block;  
   	width:90%;  
	height:100%;  
}
.SchemeNameBlue a:active{
	text-decoration: none;
	color: #FFF;
	display:block;  
   	width:90%;  
	height:100%;  
}
.SchemeNameBlue a:hover{
	text-decoration: none;
	color: #00adef;
	display:block;  
   	width:90%;  
	height:100%;  
}

/*The Image Box ----------------*/
.boxgridSector {
	width: 98px;
	height: 98px;
	margin:0px;
	float:left;
	border: solid #FFF; 
	/*The following attribute is placed directly in the HTML. This means I don't have to make a new CSS style for each variation: */
	/*border-width: 3px 20px 3px 0px;*/
	position: relative;
	overflow: hidden;
}

.boxgridSector img {
	position: absolute;
	/*These attributes are placed directly in the HTML. This means I don't have to make a new CSS style for each variation: */
	/*background-image:url(../images/projects/learn/markerTEst.jpg);*/
	/*background-position: 3px 50px;*/
	/*top: 3px;*/
	/*left: -3px;*/
	border: 0;
}
.boxgridSector p {.
	padding: 0 10px;
	color:#afafaf;
	font-weight:bold;
	font:10pt "Lucida Grande", Arial, sans-serif;
}




/*The Caption Box ----------------*/	
		
.boxcaptionSector {
	float: left;
	position: absolute;
	/*The Following 3 get over-ridden in the HTML where the boxes have differnt dimentions*/	
top: 98px;
	left: 0px;
	width: 98px;
	height: 98px;
	background: #8cc63f;
	/* width: 100%; */
opacity: .8;


/* For IE 5-7 */
 filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
	/* For IE 8 */
 -MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";

}