/*CSS Document*/

/*****************************************************************************

T E S T   S I T E

File :css/default.css	

*****************************************************************************/



/****************************************************************************

* DEFAULT CSS

****************************************************************************/

BODY {
font-family : Verdana, Arial, Helvetica, sans-serif;
color : #333333;
font-size: 11px;
font-weight : normal;
background-image:url(../images/main_bg.jpg);

/* page margins */
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
} 
	
/******************************************************************************
 
  T A B L E S  &  C E L L S
  
******************************************************************************/	

/*Cell border to the right*/
.tdborder {  
border-right:2px solid #fff; 
} 

/*Cell border to the left and right*/
.tdborder2 {  
border-right:2px solid #fff;
border-left:2px solid #fff;
} 


/*tables white backgrounds*/
.whitebg {
background-color: #FFFFFF;
}
	
/*Cell backgrounds*/
.cellbg {
background-color: #F4FBEE;	
}

/*Dotted line around table for projects*/
.table {
border-style: dotted;
border-width: 1px;
border-color: #CACACA;
}

/*Dotted line around table for projects*/
.table2 {
border-style: dotted;
border-width: 1px;
border-color: #CACACA;
}

/*project tables LEFT and RIGHT grey bg with white lines*/
.tablesolid1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color:#1F5592;
font-weight: bold;
text-align: left;
vertical-align: middle;
padding-left: 3px;
padding-top: 2px;
padding-bottom: 2px;
background-color: #F3F3F3;
border-style: solid;
border-width: 1px;
border-color: #FFFFFF;
}

.tablesolid2 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color:#666666;
font-weight: normal;
text-align: left;
vertical-align: middle;
padding-left: 2px;
padding-top: 2px;
padding-bottom: 2px;
background-color: #F3F3F3;
border-style: solid;
border-width: 1px;
border-color: #FFFFFF;
}



/*******************************

* M A R G I N S

********************************/


/*Margin for center body cells*/
p.leftmargin
{
margin-left: 20px
}


p.margin {margin: 10px 5px 5px 5px}

/*******************************

* H E A D I N G S

********************************/

/*bold text headings*/
.boldheading  {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 13px;
color:#333333;
font-weight: bold;		
}
	


		
/*******************************

* T E X T

********************************/



/*BLUE large text*/
.bluetext  {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
color:#005094;
font-weight: bold;		
}

.blueheading  {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color:#005094;
font-weight: bold;		
}

.blueheadline  {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color:#005094;
font-weight: bold;
text-decoration: none;	
border-bottom: dashed 1px #005094	
}

.greyheading  {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
color:#999999;
font-weight: bold;		
}


/******************************************************************************
 
  I M A G E  wrapping 
  
******************************************************************************/	


img.floatLeft { 
    float: left; 
    margin: 4px; 
}
img.floatRight { 
    float: right; 
    margin: 8px; 
}


/******************************************************************************
 
  L I N K S 
  
******************************************************************************/	


/*******************************
* Border REMOVAL for linked images
Remove all borders around any linked images without
touching the HTML code. 

This one lightweight rule will command all linked images to shrug
off any borders a browser tries to surround them with.

********************************/
a img {
border: none; 
}




/*******************************
* TOP NAVIGATION LINKS
********************************/


/*test 2 - for top navigation - this is the best so far and the most simple*/
.navlinks { 
border-top:none; 
border-right:none; 
} 

.navlinks td { 
border-bottom:none; 
border-right:none; 
} 

* html .links td a {
width:100%;
height: 100%;
} 

.navlinks td a { 
text-decoration:none; 
color:#005094; 
text-align: center;
background-color:#FFFFFF; 
display:block; 
padding:3px 10px; 
} 

.navlinks td a:hover {  
background-color:#C8D6DF; 
color:#005094; 
} 



/*test 2a - for LEFT navigation - white background with dotted grey line*/


.navleft td { 
border-bottom:1px dotted #C0C0C0; 
border-right:none; 
} 

* html .links td a {
width:160px;
height: 21px;
} 

.navleft td a { 
text-decoration: none; 
color: #333333; 
text-align: left;
background-color:#FFFFFF; 
display:block; 
padding:0px 0px; 
} 

.navleft td a:hover { 
background-color:#EEEEEE; 
color:#333333; 
} 





/*test 3 - for top navigation - this one uses images for the rollover
the html code for the page is as follows :

<div id="Menu"> 
<ul> 
<li><a href="#"><span>Link 1</span></a></li> 
<li><a href="#"><span>Longer link text</span></a></li> 
<li><a href="#"><span>Link 2</span></a></li> 
</ul> 
</div> 

(also there is a fix for IE 6 and 7 as follows :

*/

 
.Menu { 
font-family: Arial, sans-serif; 
border-bottom: 10px solid #A0CEF8; 
} 
.Menu ul { 
text-align: center; /* We are using text-align: center on ul to horizontally align our menu to the page. If you want the menu aligned left or right just change text-align to either left or right */ 
margin: 0 0 5px 0; /* Just some margin to align the blue border below the menu */ 
} 
#Menu li { 
display: inline; /* Menu links are horizontally aligned using display: inline */ 
} 
#Menu li a { 
padding: 7px 0 6px 10px; /* Display: block won't work in this example, instead we are using padding to make the hole tab a clickable link */ 
color: #5d5350; 
text-decoration: none; 
font-weight: bold; 
background: url(../images/tabbed-menu-left.gif) no-repeat left top; /* Rollover effect using "Fast rollovers without preload" concept for the left part of the tab */ 
} 
#Menu li a:hover { 
background: url(../images/tabbed-menu-left.gif) no-repeat left bottom; 
} 
#Menu li a span { 
padding: 7px 10px 6px 0; 
background: url(../images/tabbed-menu-right.gif) no-repeat right top; /* Rollover effect using "Fast rollovers without preload" concept for the right part of the tab */ 
} 
#Menu li a:hover span { 
background: url(../images/tabbed-menu-right.gif) no-repeat right bottom; 
} 





/*test 1 - menu nav - a little problematic*/


.navlist{
padding-left: 0;
margin-left: 0;
background-color: #036;
color: White;
float: center;
width: 100%;
font-family: Verdana, Arial, Helvetica, sans-serif;
}



.navcontainer ul{
padding-left: 0;
margin-left: 0;
background-color: #036;
color: White;
float: center;
width: 100%;
font-family: Verdana, Arial, Helvetica, sans-serif;
}

#navcontainer ul li { display: inline; }

#navcontainer ul li a{
padding: 0.2em 1em;
background-color: #036;
color: White;
text-decoration: none;
float: left;
border-right: 1px solid #fff;
}

#navcontainer ul li a:hover{
background-color: #369;
color: #fff;
}







/*test - menu nav*/
ul#menu
{
	margin:0;
	padding:0;
	list-style-type:none;
	width:434;
	position:relative;
	display:block;
	height:22px;
	font-size:12px;
	font-weight:bold;
	background:#666666;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	border-bottom:1px solid #FFFFFF;
	border-top:1px solid #000000;
}

ul#menu li
{
	display:block;
	float:left;
	margin:0;
	padding:0;
}
	
ul#menu li a
{
	display:block;
	float:left;
	color:#999999;
	text-decoration:none;
	font-weight:bold;
	padding:8px 30px 0 20px;
	border-right:1px solid #FFFFFF;
	border-left:1px solid #FFFFFF;
}
	
ul#menu li a:hover
{	
	color:#FFFFFF;
	height:22px;
	background:#CCCCCC;		
}
	

ul#menu li a.current
{
	display:inline;
	height:22px;
	background:#EEEEEE;	
	float:left;
	margin:0
}



/*test - 3*/

a.topnavlink  {
font-family : Verdana, Arial, Helvetica, sans-serif;
color : #1F5592;
font-size: 11px;
font-weight : normal;
text-decoration : none;
border-style: solid;
border-width: 1px;
border-color: #FFFFFF;
background-color:#FF0000;
}

a:visited.topnavlink {
font-family : Verdana, Arial, Helvetica, sans-serif;
color : #1F5592;
font-size: 11px;
font-weight : normal;
text-decoration : none;
border-style: solid;
border-width: 1px;
border-color: #FFFFFF;
background-color:#FF0000; 
}

a:hover.topnavlink  {
font-family : Verdana, Arial, Helvetica, sans-serif;
color : #5A98DC;
font-size: 11px;
font-weight : normal; 
text-decoration : none;
border-style: solid;
border-width: 1px;
border-color: #FFFFFF;
background-color:#b2ab9b;
border-bottom: 1px dotted #5A98DC 
}

a:active.topnavlink  {
font-family : Verdana, Arial, Helvetica, sans-serif;
color : #1F5592;
font-size: 11px;
font-weight : normal; 
text-decoration : none;
border-style: solid;
border-width: 1px;
border-color: #FFFFFF;
background-color:#FF0000;
}	

/*******************************
* BODY LINKS
********************************/

a.bodylink  {
font-family : Verdana, Arial, Helvetica, sans-serif;
color : #005094;
font-size: 11px;
font-weight : normal;
text-decoration : none; 
}

a:visited.bodylink  {
font-family : Verdana, Arial, Helvetica, sans-serif;
color : #005094;
font-size: 11px;
font-weight : normal;
text-decoration : none; 
}

a:hover.bodylink  {
font-family : Verdana, Arial, Helvetica, sans-serif;
color : #5A98DC;
font-size: 11px;
font-weight : normal; 
text-decoration : none;
border-bottom: 1px dotted #5A98DC 
}

a:active.bodylink  {
font-family : Verdana, Arial, Helvetica, sans-serif;
color : #005094;
font-size: 11px;
font-weight : normal; 
text-decoration : none; 
}	






	
/*Link for FOOTER text*/

a.footerlink  {
font-family : Verdana, Arial, Helvetica, sans-serif;
color : #FFFFFF;
font-size: 11px;
font-weight : normal;
text-decoration : none; 
}

a:visited.footerlink  {
font-family : Verdana, Arial, Helvetica, sans-serif;
color : #FFFFFF;
font-size: 11px;
font-weight : normal;
text-decoration : none; 
}

a:hover.footerlink  {
font-family : Verdana, Arial, Helvetica, sans-serif;
color : #FFFFFF;
font-size: 11px;
font-weight : normal; 
text-decoration : none;
border-bottom: 1px dotted #FFFFFF 
}

a:active.footerlink  {
font-family : Verdana, Arial, Helvetica, sans-serif;
color : #FFFFFF;
font-size: 11px;
font-weight : normal; 
text-decoration : none; 
}	
	
	
/******************************************************************************

  BEST LINK test for left nav (using small arrow gif)

******************************************************************************/	

.wireframemenu{
border: 1px dotted #FFFFFF;
background-color: white;
border-bottom-width: 0;
width: 150px;
}

* html .wireframemenu{ /*IE only rule. Original menu width minus all left/right paddings */
width: 145px;
}

.wireframemenu ul{
padding: 0px;
margin: 0px;
list-style-type: none;
}

.wireframemenu a{
font: normal 11px Verdana;
padding: 4px 20px;
margin: 2px;
display: block;
width: 145px; /*Define width for IE6's sake*/
color: #595959;
text-decoration: none;
border-bottom: 1px dotted #C0C0C0;
background-image:url(../images/arrow_bullet.gif);
background-position:left;
background-repeat:no-repeat;	
}

.wireframemenu a:visited{
color: #595959;
}

html>body .wireframemenu a{ /*Non IE rule*/
width: auto;
}

.wireframemenu a:hover{
background-color: #EEEEEE;
color: black;
}


/******************************************************************************

 S C R O L L B A R 

******************************************************************************/	



html {
scrollbar-base-color: #1F5592;
scrollbar-arrow-color: white;
scrollbar-track-color: #D7E6F7;

scrollbar-shadow-color: black;
scrollbar-lightshadow-color: black; 
scrollbar-darkshadow-color: gray;

scrollbar-highlight-color: white;
scrollbar-3dlight-color: black;
}

/******************************************************************************

  L I S T S

******************************************************************************/

/*For lists with gif images*/


/*Drk blue square list*/
.list1 ul
{
list-style-type: none;
padding: 0;
margin-left: 20px;
}

.list1 li
{
background-image: url(../images/icon_square2.gif);
background-repeat: no-repeat;
background-position: 0 .3em;
padding-left: 12px;
}



/*Arrow list*/

.list2 ul
{
list-style-type: none;
padding: 0;
margin-left: 110px;
}

.list2 li
{
background-image: url(../images/arrow_plain.gif);
background-repeat: no-repeat;
background-position: 0 .3em;
padding-left: 12px;
}

/******************************************************************************

  F O O T E R 

******************************************************************************/			
			
/*footer text */
.footerText  {
background-color: #005094;
font-size: 11px;
color:#FFFFFF;
font-weight: normal;		
}


/******************************************************************************

  M I S C E L L A N E O U S    

******************************************************************************/	

/*Justified text for a paragraph */
p.justify {
margin-left: 20px;
margin-right: 5px;
text-align: justify}


/*Justified text for a cell */
td.justify {
text-align: justify}


/*Shadow for text  - VERY SILLY -  porperties : glow, shadow or dropshadow*/
.shadow { 
filter:glow(color=#cccccc);
}

/*Horizontal Rule - modify size and colour as needed*/
rule2 hr{ 
height: 1px; 
width: 150px; background: #0000cc; 
}

hr {
color: #fff; 
background-color: #fff; 
border: 1px dotted #005094; 
border-style: none none dotted; 
}


/*Single line indent for the beginning of a paragraph*/
.single { 
text-indent: 25px;
margin-bottom: 0;
margin-top: 0;
text-align: justify;
}




.navlist ul{
padding-left: 0;
margin-left: 0;
background-color: #036;
color: White;
float: center;
width: 100%;
font-family: Verdana, Arial, Helvetica, sans-serif;
}


/*To add a dotted underline under text*/
border-bottom: dotted 1px #005094

/******************************************************************************

  T E S T I N G    

******************************************************************************/	

/*Single line indent for the beginning of a paragraph*/
a.link
a.visited
a.focus
a.hover
a.active

#1F5592