
/******************************************************
Teleologic Ltd.

SHORT CUTS
For navigating style sheet use search '=(letter)'

=c : main Content styles section
=h : Header styles
=m : Menu (horizontal links)
=d : menu Drop-down (appear under Menu)
=x : conteXt menu (appears below nav)
=n : Navigation (vertical links bar)
=l : Links (right-hand column)
=f : Footer section

=p : Print media

******************************************************/



body.Home
/* All body tags have the class Home. Stops formatting problems when within Container */
{
	margin: 0;
	FONT-FAMILY: Verdana, Arial, Helvetica, Geneva, sans-serif;
	background-color: #FFFFFF;
	color: #28386C;
	font-size: 1em;

}

table.Home
/* Top level table containing all content*/
{
	background-color: #FFF;
	width: 730px;
	padding: 0;
	margin: 0 auto;
}

td
{
	font-size: 1em;
	padding: 0; margin: 0;
	vertical-align: top;
}

H1
{
	color: #26376F;
    font-weight: normal;
    LETTER-SPACING: 1px;
    font-size: 1.5em;
    line-height: 95%;
    margin: 0.5em 0 2em 0;  /* em values used as they increase with font-size if changed %*/
}

H2
{	font-size: 110%; 
	COLOR: #26376F; 
	FONT-WEIGHT: bold;
	margin: 0 0 1.5em 0;
}
H3
{	FONT-SIZE: 100%; 
	COLOR: #26376F; 
	FONT-WEIGHT: bold;
	margin: 0 0 1.5em 0;
}

a
{	
	color: #26376F;
	text-decoration: none;
	font-weight: bold;
}
a:hover, a:active
{
	color: #993300;
	text-decoration: underline;
	font-weight: bold;
}

form
{	margin: 0em; padding: 0em;	}

UL
{    margin: 0.5em 0 2em 0;	}

img
{	padding: 0px; border: 0px;	}

tbody, thead
{
margin: 0;
}

td.main 
{
	background-color: #FFF;
	margin: 0; padding: 0;
}

td.navigation-top
{
	background-color: #D7E0EF;
	background-image:url("../images/page/navigation-top_bground.gif");
	background-repeat:repeat-x;
}

td.context-top
{
	background-color: #FFF;
	background-image:url("../images/page/context-top_bground.gif");
	background-repeat:repeat-x;
	height: 30px;
}


textarea
{
	FONT-FAMILY: Verdana, Arial, Helvetica, Geneva, sans-serif;

}

/*********** =Content **********/



td.content 
{
	font-size: 0.7em;
	margin: 0;
	line-height: 1.25em;
	
	
	border-left: 15px solid #FFF;

	border-right: 10px solid #FFF;
					/* borders set the spacing between content and navigation - margin & 
					   padding values don't work*/
}
td.content-home
{

	font-size: 0.7em;
	margin: 0;
	line-height: 1.25em;
	border: 0;
	background-color: #D7E0EF;
	background-image:url("../images/page/home-content-bground.jpg");
	background-repeat:repeat-x;
}
td.content-home .content-home-text
{
	/*padding: 70px 360px 0 15px;*/
	padding: 70px 0 0 15px;
}

td.content p
{	margin-top: 0px; margin-bottom: 0px; 
	padding-bottom: 1.5em;
	
}

td.content td
{
	vertical-align: top;
	padding: 0 0 0 0.5em;
	margin: 0px;
}

td.content hr
{
	height: 1px;
	color: #DADADA;
}
	/* HRs are used between topics in the TopicList proforma */


table.topic-list
{	margin: 0.5em 0;	}
table.topic-list td
{	padding: 0 0 0.25em 0.25em; margin: 0;	}

table.topic-list td.topic-list-title
{	font-size: 1.3em; color: #26376F; font-weight: bold;
	margin: 0; padding: 0.4em 0 0 0.25em; 
}
td.topic-list-title a
{	color: #26376F; font-weight: bold;	}
td.topic-list-title a:hover, td.topic-list-title a:active
{	color: #26376F; font-weight: bold; text-decoration: underline;	}

#map
{
background-color: #D7E0EF;
margin: 0 0 10px 0;
}

/*********** =Links (right-hand column) **********/
/* Note: this column appears only if content included.
   The ID of this column 'content' means that styles applied to
   main section can also be used */
   


td.links, td.links-home
{
	font-size: 0.7em;
	background-color: #FFF;
	margin: 0;
	line-height: 1.25em;
}
td.links 
{
	width: 200px;
	border-left: 10px solid #FFF;
}
td.links-home 
{
	width: 100%;
}

table.links
{	width: 200px; empty-cells: show;	}
table.links-home
{	width: 100%; empty-cells: show;	margin: 0 0 10px 0;}



td.link-section_header
{
	BACKGROUND-COLOR: #6D6D6D;
	border-top: 1px solid #FFF;
	border-bottom: 2px solid #447CED;
	background-image:url("../images/page/link-section_header_bground.gif");
	background-repeat:repeat-x;
	padding: 0.5em;
}
td.link-section_spacer
{
	white-space: display;
	width: 1px;
	background-color: #FFF;
	border-right: 1px solid #fff;
}

td.link-section_header a
{
	font-weight: normal;
	color: #fff;
}
td.link-section_header a:hover, td.link-section_header a:active
{
	font-weight: normal;
	color: #D7E0EF;
}




td.link-section_content
{
	background-color: #D7E0EF;
	border-top: 1px solid #2340E6;
}
td.link-section_content ul
{
	padding: 0.5em 0 0.5em 0;
	margin: 0 0 0 0.5em;
	list-style: none;
}
td.link-section_content li
{
	padding: 0 0.5em 0.25em 1em;
	background-image:url("../images/page/link-bullet.gif");
	background-repeat:no-repeat;
	background-position: 0% 5px;	
}
td.link-section_content a
{
	text-decoration: none;
	color: #28376E;
	font-weight: normal;
}
td.link-section_content a:hover, td.link-section_content a:active
{
	text-decoration: underline;
	color: #666666;
	font-weight: normal;
}





















/*********** =Header **********/

table.header
{
margin: 0; padding: 0; border: 0;
	background-color: #212E5B;
	background-image:url("../images/page/header-bground.jpg");
	background-repeat:no-repeat;
	background-position: 0% 0%;
}
td.header
{
}
td.header_logo
{

}

td.header_banner
{
text-align: right;
vertical-align: middle;
font-size: 0.7em;
COLOR: #384E99;
}
td.header_banner span.header_banner-item
{
padding: 0 1em 0 1em;
COLOR: #FFF;
}
td.header_banner span.header_banner-item a
{
COLOR: #FFF; font-weight: normal;
}
td.header_banner span.header_banner-item a: hover
{
COLOR: #FFF; text-decoration: underline; font-weight: normal;
}

div.header_banner_contact
{
    FONT-SIZE: 70%;
    COLOR: #FFFFFF;
	FONT-FAMILY: Verdana, Arial, Helvetica, Geneva, sans-serif;
    padding: 0.5em 0.5em 0 0;
}
div.header_banner_contact A:link, 
div.header_banner_contact A:visited
{    COLOR: #FFFFFF; text-decoration: none	}
div.header_banner_contact A:hover, 
div.header_banner_contact A:active
{    COLOR: #DADADA; text-decoration: underline	}


/*********** =Menu (horizontal menu) **********/

table.menu
{
	BACKGROUND-COLOR: #6D6D6D;
	border-top: 1px solid #000087;
	border-bottom: 1px solid #0000DC;
}



/*td.menuItem, td.menuItemSel*/

td.menu_link, td.menu_link_sel, td.menu_link-support
{
	FONT-FAMILY: Verdana, Arial, Helvetica, Geneva, sans-serif;
	font-size: 85%;
	padding: 5px 3px 7px 3px;
	text-align: center;
}
td.menu_link, td.menu_link_sel, td.menu_sep, td.menu_space, td.menu_link-support
{
	white-space: nowrap;
	background-repeat:repeat-x;
	border-bottom: 2px solid #447CED;
}
td.menu_link, td.menu_sep, td.menu_space
{
	background-image:url("../images/page/menu_link_bground.gif");
}

td.menu_link_sel
{
	background-color: #709EF3;
	background-image:url("../images/page/menu_link_sel_bground.gif");
}
td.menu_link-support
{
	background-color: #B3D0D4;
	background-image:url("../images/page/menu_link_support_bground.gif");
}

td.menu_sep, td.menu_space
{
	font-size: 0.1em;
	color: #CACCCB;
}
td.menu_sep
{
	width: 0.5em;
}


td.menu_link a, 
td.menu_link_sel a,
td.menu_link-support a
{
	text-decoration: none;
	font-size: 0.8em;
	font-weight: normal;
	COLOR: #FFFFFF;
}
td.menu_link-support a
{
	COLOR: #000;
}
td.menu_link a:hover, td.menu_link a:active
{
	COLOR: #E4E9FF;
	font-weight: normal;
}
td.menu_link_sel a:hover, td.menu_link_sel a:active
{
	COLOR: #E4E9FF;
	font-weight: normal;
}
td.menu_link-support a:hover, td.menu_link-support a:active
{
	COLOR: #000;
	font-weight: normal;
}



/*********** =Navigation (vertical menu) **********/



td.navigation 
{
	vertical-align: top;
	padding: 0; 
	width: 150px;
	height: 400px;
	
				/* Background styles below set an image to appear in the Nav section in the 
				   same position on all pages and not dependent on the height of the list of 
				   links. 
				   Note: default.htm has an inline style for background-position to make the 
				   image appear lower on the page */
	
	background-color: #D7E0EF;
	background-image:url("../images/page/navigation_bground.gif");

	background-position: 0% 100%;
	background-repeat: no-repeat;	
	
	
}


table.navigation_links
{
width: 100%;
border-top: 1pt solid #BACFEC;
}


				/* Navigation table cells set the background colour and borders for the links */

table.navigation_links td.nav_link_unsel	/* Unselected link cell - link is not relevant to page displayed */
{
	background-color: ##D7E0EF;
	border-bottom: 1pt solid #BACFEC;
	padding: 0; margin: 0;
}
table.navigation_links td.nav_link_sel		/* Selected link cell - link is to page displayed */
{
	background-color: #447CED;
	border-bottom: 1pt solid #BACFEC;
	padding: 0; margin: 0;
}
table.navigation_links td.nav_link_selarea		/* Selected Area link cell - page linked to is relevant to page displayed */
{
	background-color: #BACFEC;
	border-bottom: 1pt solid #BACFEC;
	padding: 0; margin: 0;

}

				/* Link styles relevant to all types: Unselected, Selected or Selected Area */

table.navigation_links td.nav_link_unsel a, 
table.navigation_links td.nav_link_sel a, 
table.navigation_links td.nav_link_selarea a
{
	display: block;
	text-decoration: none;
	font-size: 70%;
	font-weight: normal;
	padding: 1px 0px 1px 0px;
	margin: 0px;
	width: 100%;
}

				/* HREF colour changes are dependent on navigation TD style */ 

table.navigation_links td.nav_link_unsel a 
{	color: #28386C;	}
table.navigation_links td.nav_link_unsel a:hover, 
table.navigation_links td.nav_link_unsel a:active
{	color: #28386C;	text-decoration: underline;	}

table.navigation_links td.nav_link_sel a
{	color: #FFFFFF;	}
table.navigation_links td.nav_link_sel a:hover,
table.navigation_links td.nav_link_sel a:active
{	color: #FFFFFF;	text-decoration: underline; }

table.navigation_links td.nav_link_selarea a
{	color: #28386C;	}
table.navigation_links td.nav_link_selarea a:hover, 
table.navigation_links td.nav_link_selarea a:active
{	color: #28386C;	text-decoration: underline;	}




				/* Level 1 Nav menu item positioning */

table.navigation_links td.nav_link_unsel a.nav_link_level1, 
table.navigation_links td.nav_link_selarea a.nav_link_level1, 
table.navigation_links td.nav_link_sel a.nav_link_level1
{
	padding: 4px 3px 4px 3px;
	width: 144px;
}


				/* Level 2 Nav menu item positioning */

table.navigation_links td.nav_link_unsel a.nav_link_level2, 
table.navigation_links td.nav_link_selarea a.nav_link_level2, 
table.navigation_links td.nav_link_sel a.nav_link_level2
{
	padding: 4px 3px 4px 10px;
	width: 135px;
}


				/* Level 3 Nav menu item positioning */

table.navigation_links td.nav_link_unsel a.nav_link_level3, 
table.navigation_links td.nav_link_selarea a.nav_link_level3, 
table.navigation_links td.nav_link_sel a.nav_link_level3
{
	padding: 4px 3px 4px 17px;
	width: 129px;
}



/*********** =D =Menu - drop-down menu items **********/

table.drop-down
{
	font-size: 0.7em;
	border-top: 0;
	border-left: 1px solid #0000DC;
	border-right: 1px solid #0000DC;	
	
				/* The TD is used to set the bottom border. This allows all borders to have same thickness
				   All Table borders set would mean bottom cell would have a thicker border 
				*/

}
table.drop-down td.drop-down_link
{
	padding: 0;
	border-bottom: 1px solid #0000DC;
	background-color: #447CED;
	margin: 0;	
} 

table.drop-down td.drop-down_link a

{
	padding: 0.15em 1em 0.15em 0.25em;
	text-decoration: none;
	display: block;
	width: 150px;
	color: #FFFFFF;
	font-weight: normal;
}
table.drop-down td.drop-down_link a:hover, 
table.drop-down td.drop-down_link a:active
{
	color: #FFFFFF;
	font-weight: normal;
	background-color: #6D6D6D;	
}

				/* Sets the basic formatting of the drop-down menu. 
				   Positioning set by javascript function in proforma */

div.drop-down_area
  {
    background-color:white;
    position: absolute;
    width:150px;
    visibility: hidden;
  }

/*********** =x =ContextNav **********/
/* ContextNav = breadcrumb links that appear under the (horizontal) menu */

#contextnav 
{
	padding: 5px 0 0 0;
	margin: 0;
}
.contextnav ul			/* Although a bulleted list context nav items displayed horizontally */
{
	font-size: 60%;
	line-height: 200%;
	padding: 0.5em 0 0 0;
	margin: 0 0 0 0.5em;
	
}
.contextnav li
{
	display: inline;			/* Sets context nav items to be displayed horizontally*/
	padding: 0 5px 0 10px;		/* right-hand padding larger to make space for bullet image */
	background-image:url("../images/page/li-contextnav.gif");
								/* Bullet used is non-repeating background image. Padding 
								   (see above) makes sure text does not appear over the image */
	background-repeat:no-repeat;
	background-position: 0% 50%;	
								/* background image displayed to far-left of item (0%) 
								   and vertically half-way up (50%) */
}

.contextnav a
{
text-decoration: none;
color: #000000;
}
.contextnav a:hover, .contextnav a:active
{
text-decoration: underline;
color: #666666;
}

/*********** =Footer **********/


table.footer 
{
	margin: 0;
	font-size: 0.6em;
	width: 100%;
	border-top: 1px solid #BFBFBF;
}
table.footer td
{
	padding: 0.5em 0 0.5em 0.5em;
}
table.footer td a
{
	color: #7F7F7F;
	font-weight: normal;
	text-decoration: none;
}
table.footer td a:hover, table.footer td a:active
{
	color: #7F7F7F;
	font-weight: normal;
	text-decoration: underline;
}


/*********** =404 **********/

div.pnf-section_content ul
{
	padding: 0.5em 0 0.5em 0;
	margin: 0 0 0 0.5em;
	list-style: none;
}
div.pnf-section_content li
{
	padding: 0 0.5em 0.25em 1em;
	background-image:url("../images/page/link-bullet.gif");
	background-repeat:no-repeat;
	background-position: 0% 5px;	
}
div.pnf-section_content a
{
	text-decoration: underline;
	color: #26376F;
	font-weight: bold;
}
div.pnf-section_content a:hover, td.pnf-section_content a:active
{
	text-decoration: underline;
	color: #666666;
	font-weight: bold;
}


/*********** =Form **********/


	#form {padding: 0; margin: 20px 0 0 0; width: 100%; }
	#form div {vertical-align: top; padding: 2px 0px; }
	#formArea { border: 5px solid #D7E0EF; background-color: #D7E0EF; position:relative; float:right; width: auto;}
	#formHeading { position:relative; color:#662D91; margin: 0; font-weight: bold; }
	#formCol1	{ position:relative; float:left; margin: 0 0 0 5px; padding: 0; }
	#formCol2	{ position:relative; float:right; margin: 0 5px; padding: 0; }	
	#formArea label {display: block; padding: 2px 0 2px 0; }
	#formArea div  { padding: 0 0 10px 0; margin: 0;}
	#formArea div div { padding: 0; margin: 0;}
	#formArea .button  { background-color: #D7E0EF; border-width: 1px; border-style: solid; border-color: #28386C; color:#28386C; font-size: 90%; padding: 3px 0; font-weight: bold; margin:0; }
	#formButtons	{ text-align: right; display:block;}

	#formAreaLogin { border: 5px solid #D7E0EF; background-color: #D7E0EF; width: 45%; margin: 0 auto;}
	#formAreaLogin label {display: block; padding: 2px 0 2px 0; }
	#formAreaLogin div  { padding: 0 0 10px 0; margin: 0;}
	#formAreaLogin div div { padding: 0; margin: 0;}
	#formAreaLogin .button  { background-color: #D7E0EF; border-width: 1px; border-style: solid; border-color: #28386C; color:#28386C; font-size: 90%; padding: 3px 0; font-weight: bold; margin:0; }




/*********** =Print **********/


@media print {


	table.Home
	{width: 100%}

	td.main
	{
		border-top: 1px solid #DADADA;
	}

	td.navigation, table.menu, td.links, td.navigation-top, td.context-top
	{
		display: none; visibility: collapse;
	}

	h1
	{
	    margin: 1em 0 1em 0;  
	}


}





