/*
===============================================================
Site Stylesheet
===============================================================
AUTHOR			: Christian Wach <needle@haystack.co.uk>
LAST MODIFIED	: 09/08/2006
---------------------------------------------------------------
NOTES

This is a general stylesheet applied throughout the site

---------------------------------------------------------------
*/ 



/*
===============================================================
Master Styles
===============================================================
*/ 

* 
{
	margin: 0;
	padding: 0;
}



body
{
	font-family: Arial, Helvetica, sans-serif;
	background-color: #fff;
	text-align: center;
	font-size: 76%;
	line-height: 76%;
}



acronym
{
	text-decoration: none;
	border: 0;
}



a, a:visited
{
	color: #3e6af0;
	text-decoration: underline;
	border: 0px;
}

a:hover, a:active
{
	color: #1d316e;
	text-decoration: underline;
	border: 0px;
}

a img
{
	border: 0px;
}

/* ensure h2, h3, h4 links don't underline */
h2 a, h3 a, h4 a,
h2 a:visited, h3 a:visited, h4 a:visited
{
	text-decoration: none;
}

h2 a:hover, h3 a:hover, h4 a:hover,
h2 a:active, h3 a:active, h4 a:active
{
	text-decoration: underline;
}




/* 
------------------------------------------------------
#footer encloses all footer elements
------------------------------------------------------
*/

#footer
{
	clear: both;
	margin: 0 0 0 0;
	padding: 0 12px 0 12px;
	border: 0px solid red;
	border-top: 1px solid #ddd;
	background-color: #fff;
}

#footer:after {
    content: "."; 
    display: block; 
    position:relative; /*works better in IE5.5 or float in float situations*/
    height: 0; 
    clear: both; 
    visibility: hidden;
}

	#footer ul
	{
		margin: 0;
		list-style: none;	
	}
	
	#footer li 
	{
		margin: 0;
		padding: 4px 0 4px 12px;
		float: left;
		list-style: none;	
		color: #3e6af0;
		font-weight: bold;
		font-size: 1em;
		line-height: 1.33em;
	}

	#footer ul.supportedby
	{
		float: right;
	}

	#footer a:hover, #footer a:active
	{
		color: #1d316e;
		text-decoration: underline;
		border: 0px;
	}
	

	
/* 
------------------------------------------------------
.clearer is used wherever IE screws up floated elements
------------------------------------------------------
*/

.clearer {
	clear: both; 
	margin: 0px;
	padding: 0px;
	line-height: 0px;
	font-size: 1px;
	height: 1px;
	border: 0px solid blue;
	background: transparent;
}




/*
===============================================================
Page Styles
===============================================================
*/ 



/* 
------------------------------------------------------
#container encloses all body content
------------------------------------------------------
*/

#container
{
	margin: 0px auto;
	padding: 0;
	border: 0px solid orange;
	background: transparent;
	width: 920px;
	text-align: left;
}



/* 
------------------------------------------------------
#header encloses all header elements
------------------------------------------------------
*/

#header
{
	background: #fff;
	border: 0px solid red;
}

#header:after {
    content: "."; 
    display: block; 
    position:relative; /*works better in IE5.5 or float in float situations*/
    height: 0; 
    clear: both; 
    visibility: hidden;
}

	#title_space
	{
		padding: 0;
	}
	
		#logo_cas
		{
			margin: 0 0 12px 0;
			padding: 0 0 0 0;
			float: left;
			width: 208px;
			background: transparent;
			border: 0px solid blue;
		}
		
		#title
		{
			padding: 24px 0 0 220px;
		}
		
		/* These are the Page Title attributes */
		#title h1
		{
			padding: 0 0 12px 0;
			margin: 0;
			width: 500px;
			font-size: 3em;
			line-height: 100%;
			font-weight: bold;
			color: #1d316e;
		}
		
		/* These are the Page Subtitle attributes */
		#title p
		{
			font-size: 1.5em;
			line-height: 100%;
			font-weight: bold;
			color: #3e6af0; 
			width: 500px;
		}
		
	#logo_space
	{
		float: right;
		width: 172px;
		background: transparent;
	}
	
		#logo
		{
			margin: 22px 0 0 0;
			width: 172px;
			height: 43px;
			background: transparent;
		}
		


/* 
------------------------------------------------------
#pagebody encloses all menu and content elements
------------------------------------------------------
*/

#pagebody 
{
	margin: 0;	
	padding: 0;	
	border: 0px solid blue;
	background: transparent url(/images/interface/page_background_repeat.gif) repeat-y 208px 0px;
}




/*
===============================================================
Menu Styles
===============================================================
*/



/* 
------------------------------------------------------
#menu encloses all menu items
------------------------------------------------------
*/

#menu 
{
	clear: both;
	margin: 12px 0 0 0;
	width: 196px;
	float: left;
	border: 0px solid red;
	background-color: transparent;
}



	/* Top Level */
	#menu ul
	{
		margin: 0;
		padding: 0;
		list-style: none;	
	}
	
	#menu ul li 
	{
		margin: 0;
		padding: 0 0 0 12px;
		list-style: none;	
		color: #3e6af0;
		font-weight: bold;
		border: 0px solid red;
	}
	
		#menu ul li a
		{
			display: block;
			padding: 4px 12px 4px 24px;
			width: 148px;
			color: #3e6af0;
			text-decoration: none;
			border: 0px solid green;
			font-size: 1.16em;
			line-height: 1.25em;
		}
		
		#menu ul li a:hover
		{
			display: block;
			padding: 4px 12px 4px 24px;
			width: 148px;
			color: #1d316e;
			text-decoration: underline;
			border: 0px solid green;
		}
		
		#menu ul li#active_item div#menu_top
		{
			height: 7px;
			background: transparent url(/images/interface/menu_184_top.gif) no-repeat top left;
		}
	
		#menu ul li a.active_link
		{
			padding: 4px 12px 4px 0px;
			width: 172px;
			background: transparent url(/images/interface/menu_184_repeat.gif) repeat-y top left;
		}
	
		#menu ul li#active_item span#menu_arrow
		{
			width: 14px;
			height: 12px;
			margin: 2px 3px 6px 7px;
			float: left;
			background: red;
			background: transparent url(/images/interface/blue_arrow.gif) no-repeat top left;
		}
	
		#menu ul li#active_item div#menu_bottom
		{
			height: 7px;
			background: transparent url(/images/interface/menu_184_bottom.gif) no-repeat top left;
		}
	



			/* Second Level */
			#menu ul li ul
			{
				margin: 0;
				padding: 0;
				list-style: none;	
			}
			
			#menu ul li ul li 
			{
				margin: 0;
				padding: 0 0 0 12px;
				list-style: none;	
				color: #3e6af0;
				font-weight: bold;
				border: 0px solid red;
			}
			
				#menu ul li ul li a
				{
					display: block;
					padding: 4px 12px 4px 24px;
					width: 136px;
					color: #3e6af0;
					text-decoration: none;
					border: 0px solid green;
					font-size: 1.16em;
					line-height: 1.25em;
				}
				
				#menu ul li ul li a:hover
				{
					display: block;
					padding: 4px 12px 4px 24px;
					width: 136px;
					color: #1d316e;
					text-decoration: underline;
					border: 0px solid green;
				}
				
				#menu ul li ul li#active_item div#menu_top
				{
					height: 7px;
					background: transparent url(/images/interface/menu_172_top.gif) no-repeat top left;
				}
			
				#menu ul li ul li a.active_link
				{
					padding: 4px 12px 4px 0px;
					width: 160px;
					background: transparent url(/images/interface/menu_172_repeat.gif) repeat-y top left;
				}
			
				#menu ul li ul li#active_item span#menu_arrow
				{
					width: 14px;
					height: 12px;
					margin: 2px 3px 6px 7px;
					float: left;
					background: red;
					background: transparent url(/images/interface/blue_arrow.gif) no-repeat top left;
				}
			
				#menu ul li ul li#active_item div#menu_bottom
				{
					height: 7px;
					background: transparent url(/images/interface/menu_172_bottom.gif) no-repeat top left;
				}
			
		
		
		
					/* Third Level */
					#menu ul li ul li ul
					{
						margin: 0;
						padding: 0;
						list-style: none;	
					}
					
					#menu ul li ul li ul li 
					{
						margin: 0;
						padding: 0 0 0 12px;
						list-style: none;	
						color: #3e6af0;
						font-weight: bold;
						border: 0px solid red;
					}
					
						#menu ul li ul li ul li a
						{
							display: block;
							padding: 4px 12px 4px 24px;
							width: 124px;
							color: #3e6af0;
							text-decoration: none;
							border: 0px solid green;
							font-size: 1.16em;
							line-height: 1.25em;
						}
						
						#menu ul li ul li ul li a:hover
						{
							display: block;
							padding: 4px 12px 4px 24px;
							width: 124px;
							color: #1d316e;
							text-decoration: underline;
							border: 0px solid green;
						}
						
						#menu ul li ul li ul li#active_item div#menu_top
						{
							height: 7px;
							background: transparent url(/images/interface/menu_160_top.gif) no-repeat top left;
						}
					
						#menu ul li ul li ul li a.active_link
						{
							padding: 4px 12px 4px 0px;
							width: 148px;
							background: transparent url(/images/interface/menu_160_repeat.gif) repeat-y top left;
						}
					
						#menu ul li ul li ul li#active_item span#menu_arrow
						{
							width: 14px;
							height: 12px;
							margin: 2px 3px 6px 7px;
							float: left;
							background: red;
							background: transparent url(/images/interface/blue_arrow.gif) no-repeat top left;
						}
					
						#menu ul li ul li ul li#active_item div#menu_bottom
						{
							height: 7px;
							background: transparent url(/images/interface/menu_160_bottom.gif) no-repeat top left;
						}
					
				
				
				
							/* Fourth Level */
							#menu ul li ul li ul li ul
							{
								margin: 0;
								padding: 0;
								list-style: none;	
							}
							
							#menu ul li ul li ul li ul li 
							{
								margin: 0;
								padding: 0 0 0 12px;
								list-style: none;	
								color: #3e6af0;
								font-weight: bold;
								border: 0px solid red;
							}
							
								#menu ul li ul li ul li ul li a
								{
									display: block;
									padding: 4px 12px 4px 24px;
									width: 112px;
									color: #3e6af0;
									text-decoration: none;
									border: 0px solid green;
									font-size: 1.16em;
									line-height: 1.25em;
								}
								
								#menu ul li ul li ul li ul li a:hover
								{
									display: block;
									padding: 4px 12px 4px 24px;
									width: 112px;
									color: #1d316e;
									text-decoration: underline;
									border: 0px solid green;
								}
								
								#menu ul li ul li ul li ul li#active_item div#menu_top
								{
									height: 7px;
									background: transparent url(/images/interface/menu_148_top.gif) no-repeat top left;
								}
							
								#menu ul li ul li ul li ul li a.active_link
								{
									padding: 4px 12px 4px 0px;
									width: 136px;
									background: transparent url(/images/interface/menu_148_repeat.gif) repeat-y top left;
								}
							
								#menu ul li ul li ul li ul li#active_item span#menu_arrow
								{
									width: 14px;
									height: 12px;
									margin: 2px 3px 6px 7px;
									float: left;
									background: red;
									background: transparent url(/images/interface/blue_arrow.gif) no-repeat top left;
								}
							
								#menu ul li ul li ul li ul li#active_item div#menu_bottom
								{
									height: 7px;
									background: transparent url(/images/interface/menu_148_bottom.gif) no-repeat top left;
								}
							
						
						
						
	/* The selected menu item */
	#menu a.active_link
	{
		color: #1d316e;
	}



						
/* 
------------------------------------------------------
.skip uses the off-left technique as described here:
http://css-discuss.incutio.com/?page=ScreenreaderVisibility
and here:
http://www.defacto-cms.com/what-are-skip-links.html

http://geek.focalcurve.com/archive/2005/03/accessibly-hiding-skiplinks/
has a different approach again...
.skip { visibility: hidden; position: absolute; left: -9999px; }
------------------------------------------------------
*/

#menu p a.skip 
{
	/* visibility: hidden; add this if tab-order is to be skipped */
	position: absolute;
	left: -9999px;
}

#menu p a.skip:active,
#menu p a.skip:focus
{
	top: 0em;
	left: 10em;
	border: 3px #3399cc solid;
	background-color: transparent;
}





/* 
------------------------------------------------------
#content encloses all content elements
------------------------------------------------------
*/

#content 
{
	margin: 12px 0 0 208px;	
	padding: 0 0 12px 0;	
	width: 700px;
	border: 0px solid blue;
	background: transparent;
}

#content:after {
    content: "."; 
    display: block; 
    position: relative; /*works better in IE5.5 or float in float situations*/
    height: 0;
    clear: both; 
    visibility: hidden;
}

	#centre_col 
	{
		margin: 0;	
		float: left;
		padding: 0 0 0 0;	
		width: 528px;
		border: 0px solid blue;
		background: red;
		background: transparent url(/images/interface/page_background_top.gif) no-repeat top left;
	}
	
	#right_col 
	{
		margin: 0 0 0 540px;	
		padding: 0 0 0 0;	
		width: 172px;
		border: 0px solid blue;
		background-color: transparent;
	}
	





/* 
------------------------------------------------------
.simple_row encloses any row of boxes
------------------------------------------------------
*/

.simple_row 
{
	margin: 0;	
	padding: 12px 0 0 0;	
	border: 0px solid blue;
	background: transparent;
}



	
/* 
------------------------------------------------------
#top_row encloses top row boxes
------------------------------------------------------
*/

#top_row 
{
	margin: 0;	
	padding: 0;	
	border: 0px solid blue;
	background: transparent;
}



	
/* 
------------------------------------------------------
#bottom_row encloses the other boxes
------------------------------------------------------
*/

#bottom_row 
{
	margin: 0;
	padding: 4px 0 0 0;
	clear: both;
	height: 12px;
	border: 0px solid blue;
}



	
/* 
------------------------------------------------------
#bottom_row (mediascape page)
------------------------------------------------------
*/

#bottom_row 
{
	width: 522px;
	margin: 0 0 0 2px;
	padding: 4px 0 0 0;
	clear: both;
	height: 12px;
	border: 0px solid blue;
	background: transparent url(/images/interface/large_rule.gif) repeat-x top left;
}



	
/* 
------------------------------------------------------
.item_nav encloses all item navigation elements
------------------------------------------------------
*/

.item_nav 
{
	clear: both;
	padding: 12px 12px 0 12px;
	border: 0px solid red;
	background-color: transparent;
}

/*
Clearing Space Issue Fix
http://css-discuss.incutio.com/?page=ClearingSpace
*/

.item_nav:after {
    content: "."; 
    display: block; 
    position:relative; /*works better in IE5.5 or float in float situations*/
    height: 0; 
    clear: both; 
    visibility: hidden;
}

	.item_nav ul
	{
		margin: 0;
		list-style: none;	
	}
	
		.item_nav li 
		{
			margin: 0;
			padding: 0;
			list-style: none;	
			color: #3e6af0;
			font-weight: bold;
			font-size: 1.16em;
			line-height: 1.33em;
		}
	
		.item_nav li a
		{
			display: block;
			padding: 4px 0 4px 28px;
			color: #3e6af0;
			text-decoration: none;
			width: 136px;
			border: 0px solid green;
			background: transparent url(/images/interface/previous.gif) no-repeat top left;
		}
		
		.item_nav li a:hover
		{
			display: block;
			padding: 4px 0 4px 28px;
			color: #1d316e;
			text-decoration: underline;
			width: 136px;
			border: 0px solid green;
			background: transparent url(/images/interface/previous_over.gif) no-repeat top left;
		}
	
		.item_nav li.next_item
		{
			float: right;
			text-align: right;
			padding: 0;
			font-size: 1.16em;
			line-height: 1.33em;
		}

		.item_nav span.next_text_link /* kludge - a bit inelegant */
	    {
		   text-align: right;
		   padding: 0;
		   font-size: 1.16em;
		   line-height: 1.33em;
		   display:block;
	    }
		
		.item_nav li.next_item a
		{
			display: block;
			padding: 4px 28px 4px 4px;
			color: #3e6af0;
			text-decoration: none;
			width: 128px;
			border: 0px solid green;
			background: transparent url(/images/interface/next.gif) no-repeat top right;
		}
		
		.item_nav li.next_item a:hover
		{
			display: block;
			padding: 4px 28px 4px 4px;
			color: #1d316e;
			text-decoration: underline;
			width: 128px;
			border: 0px solid green;
			background: transparent url(/images/interface/next_over.gif) no-repeat top right;
		}
	



/* 
------------------------------------------------------
.subsection encloses floating subsection boxes
------------------------------------------------------
*/

.subsection_bordered 
{
	margin: 12px 0 0 12px;
	width: 196px;
	height: 196px;
	padding: 0;
	float: left;
	background: transparent url(/images/interface/boundary.gif) no-repeat top left;
}

	.subsection_bordered_text
	{
		padding: 12px;
	}
	
	.subsection_bordered_text h2
	{
		padding: 0 0 12px 0;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 1.5em;
	}
	
	.subsection_bordered_text p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 12px 0 0 0;
	}	



.subsection
{
	margin: 0;
	width: 160px;
	padding: 0 0 12px 12px;
	float: left;
	background: transparent;
}

	.subsection_text
	{
	}
	
	.subsection_text h2
	{
		padding: 0 0 12px 0;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 1.5em;
	}
	
	.subsection_text h2.equalheight
	{
		height: 2.5em;
	}
	
	.subsection_text p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 12px 0 0 0;
	}	





/* 
------------------------------------------------------
#scrapbook_header encloses scrapbook_header box
------------------------------------------------------
*/

#scrapbook_header 
{
	margin: 0;
	padding: 12px 0 12px 12px;
	background: transparent;
}

#scrapbook_header:after {
    content: "."; 
    display: block; 
    position:relative; /*works better in IE5.5 or float in float situations*/
    height: 0; 
    clear: both; 
    visibility: hidden;
}

	#scrapbook_header_text
	{
	}
	
	#scrapbook_header_text h2
	{
		padding: 0 0 0 0;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 2em;
	}
	
	#scrapbook_header_text img
	{
		float: left;
		padding: 0 12px 12px 0;
	}	

	#scrapbook_header_text p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 0 12px 12px 0;
	}	





/* 
------------------------------------------------------
#ideas encloses ideas box
------------------------------------------------------
*/

#ideas 
{
	margin: 0;
	width: 240px;
	padding: 12px 0 12px 12px;
	float: left;
	clear: both;
	background: transparent;
}

	#ideas_text
	{
	}
	
	#ideas_text h2
	{
		padding: 0 0 0 0;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 2em;
	}
	
	#ideas_text p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 12px 0 0 0;
	}	

	#ideas_text ul
	{
		color: #3e6af0;
		padding: 12px 0 0 0;
		list-style: none;
	}
	
		#ideas_text ul li
		{
			color: #3e6af0;
			font-size: 1.33em;
			font-weight: bold;
			line-height: 1.5em;
			padding: 0 0 0 0;
			list-style: none;
		}
		
		#ideas_text ul li a,
		#ideas_text ul li a:active,
		#ideas_text ul li a:visited
		{
			text-decoration: none;
		}
		
		#ideas_text ul li a:hover
		{
			text-decoration: underline;
		}
		



/* 
------------------------------------------------------
#stories encloses stories box
------------------------------------------------------
*/

#stories 
{
	margin: 0;
	width: 240px;
	padding: 12px 0 12px 12px;
	float: left;
	background: transparent;
}

	#stories_text
	{
	}
	
	#stories_text h2
	{
		padding: 0 0 0 0;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 2em;
	}
	
	#stories_text p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 12px 0 0 0;
	}	

	#stories_text ul
	{
		color: #3e6af0;
		padding: 12px 0 0 0;
		list-style: none;
	}
	
		#stories_text ul li
		{
			color: #3e6af0;
			font-size: 1.33em;
			font-weight: bold;
			line-height: 1.5em;
			padding: 0 0 12px 0;
			list-style: none;
		}
		
		#stories_text ul li a,
		#stories_text ul li a:active,
		#stories_text ul li a:visited
		{
			text-decoration: none;
		}
		
		#stories_text ul li a:hover
		{
			text-decoration: underline;
		}
		



/* 
------------------------------------------------------
#story encloses centre column content on story pages
------------------------------------------------------
*/

#story 
{
	margin: 0;
	padding: 12px;
	background: transparent;
}

	#story h3
	{
		color: #1d316e;
	}
	
	#story h4
	{
		margin: 12px 0;
		font-weight: normal;
		font-size: 1.16em;
		color: #1d316e;
		line-height: 1.5em;
		border: 0px solid yellow;
	}
	
	#story p
	{
		margin: 0;
		padding: 0 0 12px 0;
		font-weight: normal;
		font-size: 1.16em;
		color: #1d316e;
		line-height: 1.5em;
		border: 0px solid yellow;
	}
	
	#story ol
	{
		color: #3e6af0;
		font-size: 1.5em;
		font-weight: bold;
		line-height: 2.33em;
		padding: 0 0 0 36px;
	}
	
		#story ol li
		{
			padding: 0 0 12px 0;
		}

	#story ul
	{
		font-weight: normal;
		font-size: 1.16em;
		color: #1d316e;
		line-height: 1.5em;
		padding: 0 0 24px 24px;
	}
	
		#story ul li
		{
			padding: 0 0 12px 0;
		}





/* 
------------------------------------------------------
#faq_content_list is a ul at the top of pages that
require links to internal sections of the page
------------------------------------------------------
*/

#story ul.faq_content_list
{
	color: #3e6af0;
	font-size: 1.5em;
	font-weight: bold;
	line-height: 2.33em;
	padding: 0 0 24px 36px;
}







/* 
------------------------------------------------------
.item encloses each sequence item
------------------------------------------------------
*/

.item 
{
	margin: 0;
	padding: 12px 12px 0 12px;
	clear: both;
	background-color: transparent;
}

div.help_copy .item 
{
	padding: 12px 0 0 0;
	border: 0px solid red;
}

.item:after {
    content: "."; 
    display: block; 
    position: relative; /*works better in IE5.5 or float in float situations*/
    height: 0;
    clear: both; 
    visibility: hidden;
}

	div.item h2
	{
		color: #1d316e;
		font-size: 1.5em;
		line-height: 2em;
		padding: 0 0 0 0;
	}
	
	.item_text
	{
		border: 0px solid red;
	}
	
	div.help_copy div.item_text
	{
	}
	
	div.help_copy noscript,
	div.help_copy noscript p,
	{
		display: none;		
	}
	
	.item_text h3
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 0 0 0 0;
	}
	
	.item_text ul
	{
		color: #1d316e;
		font-size: 1.16em;
		font-weight: normal;
		line-height: 150%;
		padding: 0 12px 0 18px;
	}
	
		.item_text ul li
		{
			padding: 0 0 12px 0;
		}
		
	.item_text ol
	{
		color: #3e6af0;
		font-size: 1.5em;
		font-weight: bold;
		line-height: 150%;
		list-style: disc;
		padding: 0 0 0 24px;
	}
	
	.item_text ol.help_sequence_list
	{
		color: #3e6af0;
		font-size: 1.5em;
		font-weight: bold;
		line-height: 1.0em;
		list-style: disc;
		padding: 0 0 0 24px;
	}
	
	.item_text ol.help_sequence_list li
	{
		padding: 0 0 12px 0;
	}
	
	.item_text ol.help_sequence_list li a,
	.item_text ol li a
	{
		text-decoration: none;
	}
	
	.item_text ol.help_sequence_list li a:hover,
	.item_text ol li a:hover
	{
		text-decoration: underline;
	}
	
	.item_text p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 0 0 12px 0;
	}
	
	.item_text img
	{
		float: right;
		padding: 0 0 12px 12px;
	}
	
	div.help_copy div.item_text
	{
	}
	
	img.leftalign
	{
		float: left;
		padding: 0;
		margin: 0;
	}
	
	.item hr
	{
		clear: both;
		margin: 6px 0 18px 0;
	}
	
/* 
------------------------------------------------------
.item_copy encloses each instructions copy area
------------------------------------------------------
*/

.item_copy
{
	width: 210px;
	border: 0px solid blue;
	float: left;
	padding: 0 0 12px 0;
	background: transparent;
}

	.item_copy h3
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 0 0 0 0;
	}
	
	.item_copy p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 0 0 12px 0;
	}
	
/* 
------------------------------------------------------
.item_desc encloses each instructions description
------------------------------------------------------
*/

.item_desc
{
	width: 280px;
	border: 0px solid red;
	float: right;
	padding: 0 0 12px 0;
	background: transparent;
}

	.item_desc ul
	{
		color: #3e6af0;
		font-size: 1.5em;
		font-weight: bold;
		line-height: 2.33em;
		padding: 0 0 0 0;
		margin: 0 0 0 0;
		text-align: right;
		list-style: none;
	}
	
	.item_desc img
	{
		vertical-align: middle;
		border: 0px solid blue;
	}
	
	.item_desc .print_link
	{
		float: left;
		font-size: 1.5em;
		font-weight: bold;
		line-height: 2em;
		padding: 0;
		width: 48px;
	}
	
	.item_desc img.img_dl
	{
		float: left;
	}
	




/*
===============================================================
Sidebar Widget Styles
===============================================================
These are styles for the items that appear in the Right Column
===============================================================
*/ 



/* 
------------------------------------------------------
#search encloses the search form
------------------------------------------------------
*/

#search
{
	padding: 12px 0 24px 0;
	background: transparent;
	border: 0px solid blue;
}

	#search input#search_field
	{
		margin: 2px 0 0 2px;
	}
	
	#search input#search_button
	{
		margin: 0 0 0 2px;
		vertical-align: top;
	}




/* 
------------------------------------------------------
#tip encloses RHS tips
------------------------------------------------------
*/

#tip 
{
	margin: 0;
	padding: 0 0 0 0;
	width: 160px;
	border: 0px solid green;
	background: transparent;
}

	#tip h2
	{
		padding: 0 0 12px 0;
		margin: 0;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 1.5em;
		border: 0px solid red;
	}
	
	#tip p
	{
		padding: 0 0 12px 0;
		margin: 0;
		font-weight: normal;
		font-size: 1.16em;
		color: #1d316e;
		line-height: 1.5em;
		border: 0px solid yellow;
	}
	
	#tip ul
	{
		margin: 0;
		padding: 0 0 0 18px;
		list-style: disc;
	}
	
		#tip ul li
		{
			font-size: 1.16em;
			line-height: 1.5em;
			color: #1d316e;
			border: 0px solid yellow;
			list-style: disc;
		}
		



/* 
------------------------------------------------------
#try_this encloses RHS try_this area
------------------------------------------------------
*/

#try_this 
{
	margin: 0;
	padding: 0 0 24px 0;
	width: 160px;
	border: 0px solid yellow;
	background: transparent;
}

	#try_this a
	{
		text-decoration: none;
	}
	
	#try_this a:hover
	{
		text-decoration: underline;
	}
	
	#try_this h2
	{
		margin: 0 0 12px 0;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 1.5em;
		border: 0px solid red;
	}
	
	#try_this h3
	{
		margin: 0 0 12px 0;
		font-weight: bold;
		font-size: 1.16em;
		color: #3e6af0;
		line-height: 1.5em;
		border: 0px solid red;
	}
	
	#try_this p
	{
		margin: 12px 0;
		font-weight: normal;
		font-size: 1.16em;
		color: #1d316e;
		line-height: 1.5em;
		border: 0px solid yellow;
	}
	
	#try_this ul
	{
		margin: 12px 0 0 0;
		list-style: none;
		font-weight: bold;
		font-size: 1.16em;
		color: #3e6af0;
		line-height: 1.5em;
		border: 0px solid yellow;
	}
	



/* 
------------------------------------------------------
.learn encloses all RHS help items
------------------------------------------------------
*/

.learn 
{
	margin: 0 0 24px 0;
	padding: 0 0 0 0;
	width: 160px;
	border: 0px solid red;
	clear: right;
	background: transparent;
}


	.learn_top
	{
		height: 12px;
		background: transparent url(/images/interface/learnmore_box_top.gif) no-repeat top left;
	}
	
	.learn_content
	{
		margin: 0;
		padding: 0 12px 0 12px;
		border: 0px solid red;
		background: transparent url(/images/interface/learnmore_box_middle.gif) repeat-y top left;
	}
	
		.learn_content h2
		{
			font-weight: bold;
			font-size: 1.5em;
			color: #1d316e;
			line-height: 1.5em;
		}
	
		.learn_content ul
		{
			margin: 0;
			padding: 12px 0 0 0;
			list-style: none;	
		}
		
		.learn_content li 
		{
			margin: 0;
			padding: 4px 0 4px 0;
			list-style: none;	
			color: #3e6af0;
			font-weight: bold;
			font-size: 1.16em;
			line-height: 1.33em;
		}
		
			.learn_content li a
			{
				padding: 0;
				color: #3e6af0;
				text-decoration: none;
				border: 0px solid green;
			}
			
			.learn_content li a:hover
			{
				padding: 0;
				color: #1d316e;
				text-decoration: underline;
				border: 0px solid green;
			}
			
	.learn_bottom
	{
		height: 12px;
		background: transparent url(/images/interface/learnmore_box_bottom.gif) no-repeat top left;
	}
	
	
	
/* 
------------------------------------------------------
#newsletter encloses RHS subscription area
------------------------------------------------------
*/

#newsletter 
{
	margin: 0;
	padding: 0 0 24px 0;
	width: 160px;
	border: 0px solid green;
	background: transparent;
}

	#newsletter h2
	{
		padding: 0;
		margin: 0 0 12px 0;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 1.5em;
		border: 0px solid red;
	}
	
	#newsletter h3
	{
		padding: 0;
		margin: 0 0 12px 0;
		font-weight: bold;
		font-size: 1.16em;
		color: #3e6af0;
		line-height: 1.5em;
		border: 0px solid red;
	}
	
	#newsletter p
	{
		margin: 0 0 12px 0;
		font-weight: normal;
		font-size: 1em;
		text-align: left;
		color: #1d316e;
		line-height: 1.16em;
		border: 0px solid yellow;
	}
	
	#newsletter #newsletter_form p
	{
		margin: 12px 0 0 0;
		font-weight: normal;
		font-size: 1.16em;
		text-align: left;
		color: #1d316e;
		line-height: 1.16em;
		border: 0px solid yellow;
	}
	
	#newsletter input
	{
		margin: 4px 0 12px 0;
	}
	
	#newsletter input#email_button
	{
		margin: 12px 0 12px 0;
	}
	



/*
===============================================================
Styles for Specific Pages
===============================================================
*/ 



/* 
------------------------------------------------------
#participate encloses RHS participate widget
------------------------------------------------------
*/

#participate 
{
	margin: 0;
	padding: 0 0 12px 0;
	width: 160px;
	border: 0px solid green;
	background: transparent;
}

	#participate h2
	{
		padding: 0 0 12px 0;
		margin: 0;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 1.5em;
		border: 0px solid red;
	}
	
	#participate img
	{
		padding: 0 0 12px 0;
	}
	
	#participate p
	{
		padding: 0 0 12px 0;
		margin: 0;
		font-weight: normal;
		font-size: 1.16em;
		color: #1d316e;
		line-height: 1.5em;
		border: 0px solid yellow;
	}
	



/* 
------------------------------------------------------
#participate_form lives on its own page
------------------------------------------------------
*/

#participate_form p
{
	clear: both;
	margin: 12px 0;
}

	#participate_form label
	{
		float: left;
		clear: right;
		width: 120px;
		font-weight: normal;
		font-size: 1.16em;
		color: #1d316e;
		line-height: 1.5em;
		border: 0px solid yellow;
	}
	





/* 
------------------------------------------------------
#disclaimer encloses centre column disclaimer page
------------------------------------------------------
*/

#disclaimer 
{
	margin: 0;
	padding: 12px 12px 0 12px;
	clear: left;
	background: transparent;
}

	#disclaimer h4
	{
		margin: 0;
		font-weight: bold;
		font-size: 1em;
		color: #1d316e;
		line-height: 1.33em;
		border: 0px solid yellow;
	}
	
	#disclaimer p
	{
		margin: 0;
		font-weight: normal;
		font-size: 1em;
		color: #1d316e;
		line-height: 1.33em;
		border: 0px solid yellow;
	}
	





/* 
------------------------------------------------------
.mediascape encloses each sequence mediascape
------------------------------------------------------
*/

.mediascape 
{
	margin: 0;
	padding: 12px 12px 0 12px;
	clear: left;
	background-color: transparent;
}

	.mediascape_text
	{
		float: right;
		width: 332px;
		background-color: transparent;
	}
	
	.mediascape_text h3
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 0 0 0 0;
	}
	
	.mediascape_text ul
	{
		color: #3e6af0;
		font-size: 1.5em;
		font-weight: bold;
		line-height: 2.33em;
		padding: 0 0 0 36px;
	}
	
	.mediascape_text ol
	{
		color: #3e6af0;
		font-size: 1.5em;
		font-weight: bold;
		line-height: 2.33em;
		padding: 0 0 0 36px;
	}
	
	.mediascape_text p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 0 0 0 0;
	}
	
	.mediascape img
	{
		float: left;
		padding: 0 12px 0 0;
	}
	



/* 
------------------------------------------------------
#pupils encloses pupils box
------------------------------------------------------
*/

#pupils 
{
	margin: 0;
	width: 160px;
	padding: 12px 0 12px 12px;
	float: left;
	background: transparent;
}

	#pupils_text
	{
	}
	
	#pupils_text h2
	{
		padding: 0 0 12px 0;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 1.5em;
	}
	
	#pupils_text p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 12px 0 0 0;
	}	




/* 
------------------------------------------------------
#teachers encloses teachers box
------------------------------------------------------
*/

#teachers 
{
	margin: 0;
	width: 160px;
	padding: 12px 0 12px 12px;
	float: left;
	background: transparent;
}

	#teachers_text
	{
	}
	
	#teachers_text h2
	{
		padding: 0 0 12px 0;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 1.5em;
	}
	
	#teachers_text p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 12px 0 0 0;
	}	




/* 
------------------------------------------------------
#schools encloses schools box
------------------------------------------------------
*/

#schools 
{
	margin: 0;
	width: 160px;
	padding: 12px 0 12px 12px;
	float: left;
	background: transparent;
}

	#schools_text
	{
	}
	
	#schools_text h2
	{
		padding: 0 0 12px 0;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 1.5em;
	}
	
	#schools_text p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 12px 0 0 0;
	}	




/* 
------------------------------------------------------
#paper encloses paper box
------------------------------------------------------
*/

#paper 
{
	margin: 0;
	padding: 0 12px 12px 12px;
	float: left;
	background: transparent;
}

	#paper_text
	{
	}
	
	#paper_text h2
	{
		padding: 0 0 0 0;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 1.5em;
	}
	
	#paper_text p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 12px 0 12px 0;
	}	




/* 
------------------------------------------------------
#desktop encloses desktop box
------------------------------------------------------
*/

#desktop 
{
	margin: 0;
	width: 240px;
	padding: 0 0 12px 12px;
	float: left;
	background: transparent;
}

	#desktop_text
	{
	}
	
	#desktop_text h2
	{
		padding: 0 0 12px 0;
		width: 196px;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 1.5em;
	}
	
	#desktop_text p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 12px 0 24px 0;
	}	




/* 
------------------------------------------------------
#handheld encloses handheld box
------------------------------------------------------
*/

#handheld 
{
	margin: 0;
	width: 240px;
	padding: 0 0 12px 12px;
	float: left;
	background: transparent;
}

	#handheld_text
	{
	}
	
	#handheld_text h2
	{
		padding: 0 0 12px 0;
		width: 196px;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 1.5em;
	}
	
	#handheld_text p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 12px 0 24px 0;
	}	




/* 
------------------------------------------------------
#mediascape encloses mediascape box on CAS page
------------------------------------------------------
*/

#mediascape 
{
	margin: 0;
	width: 332px;
	padding: 12px 0 12px 12px;
	float: left;
	background: transparent;
}

	#mediascape_text
	{
	}
	
	#mediascape_text h2
	{
		margin: 0 0 0 0;
		padding: 0 0 12px 0;
		height: 2em;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 100%;
	}
	
	#mediascape_text p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 12px 0 0 0;
	}	




/* 
------------------------------------------------------
#soundscape encloses soundscape box
------------------------------------------------------
*/

#soundscape 
{
	margin: 0;
	width: 160px;
	padding: 12px 0 12px 12px;
	float: left;
	background: transparent;
}

	#soundscape_text
	{
	}
	
	#soundscape_text h2
	{
		margin: 0 0 0 0;
		padding: 0 0 12px 0;
		height: 2em;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 100%;
	}
	
	#soundscape_text p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 12px 0 0 0;
	}	




/* 
------------------------------------------------------
#media encloses media box
------------------------------------------------------
*/

#media 
{
	margin: 0;
	width: 332px;
	padding: 12px 0 12px 12px;
	float: left;
	background: transparent;
}

	#media_text
	{
	}
	
	#media_text h2
	{
		margin: 0 0 0 0;
		padding: 0 0 12px 0;
		height: 2em;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 100%;
	}
	
	#media_text p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 12px 0 0 0;
	}	




/* 
------------------------------------------------------
#library encloses samples box
------------------------------------------------------
*/

#library 
{
	margin: 0;
	width: 160px;
	padding: 12px 0 12px 12px;
	float: left;
	background: transparent;
}

	#library_text
	{
	}
	
	#library_text h2
	{
		margin: 0 0 0 0;
		padding: 0 0 12px 0;
		height: 2em;
		font-weight: bold;
		font-size: 1.5em;
		color: #1d316e;
		line-height: 100%;
	}
	
	#library_text p
	{
		color: #1d316e;
		font-size: 1.16em;
		line-height: 1.5em;
		padding: 12px 0 0 0;
	}	




/* 
------------------------------------------------------
#glossary_table lists glossary items
------------------------------------------------------
*/

table#glossary_table
{
	margin: 12px 0 0 0;
	border-collapse: collapse; 
	table-layout: fixed;
	clear: left;
	width: 480px;
}

	div.help_copy table#glossary_table
	{
		width: 420px;
	}

	table#glossary_table th
	{
		padding: 4px 0;
		border-top: 1px solid #ddd;
		border-bottom: 1px solid #ddd;
		font-size: 1.16em;
		color: #1d316e;
		line-height: 1.5em;
		font-weight: bold;
		text-align: left;
	}
	
		table#glossary_table th.col_one
		{
			width: 144px;
		}
		
		table#glossary_table th.col_two
		{
		}
		
	table#glossary_table td
	{
		padding: 2px 0;
		border-bottom: 1px solid #ddd;
	}
	
		table#glossary_table td.col_one
		{
			font-size: 1.16em;
			color: #1d316e;
			line-height: 1.5em;
			font-style: normal;
			width: 144px;
		}
		
		table#glossary_table td.col_two
		{
			font-size: 1.16em;
			color: #1d316e;
			line-height: 1.5em;
			font-style: normal;
		}
		


/* 
------------------------------------------------------
.letterlinks is a <ul> listing all letters of the alphabet
at the top of the glossary page
------------------------------------------------------
*/

ul.letterlinks 
{
	margin: 0;
	padding: 0;
	list-style: none;
}

	ul.letterlinks li
	{
		display: inline;
		margin: 0 7px 0 0;
		padding: 0;
		float: left;
	}
		
		ul.letterlinks li a
		{
			text-decoration: underline;
			padding: 0 0 7px 0;
		}
		
	


/* 
------------------------------------------------------
#faq_content_list is a ul at the top of pages that
require links to internal sections of the page
------------------------------------------------------
*/

ul.faq_content_list
{
	color: #3e6af0;
	font-size: 1.5em;
	font-weight: bold;
	line-height: 2.33em;
	padding: 0 0 24px 36px;
}

h3.faq_title
{
	color: #1d316e;
	font-size: 1.5em;
	font-weight: bold;
	line-height: 2.33em;
	padding: 0 0 12px 0;
}


.smallblue
{
	color: #1d316e;
	font-size: 12px;
	line-height: 1.33em;
	padding: 0 0 12px 0;
}





/* 
------------------------------------------------------
#sitemap wraps the UL of all pages
------------------------------------------------------
*/

#sitemap ul
{
	font-weight: normal;
	color: #1d316e;
	padding: 0 0 24px 24px;
}

	#sitemap ul li
	{
		font-size: 1.5em;
		line-height: 1.5em;
		padding: 0 0 0 0;
	}
	
		#sitemap ul li ul
		{
			padding: 8px 0 12px 24px;
		}
		
		#sitemap ul li ul li
		{
			font-size: 75%;
			line-height: 90%;
			padding: 0 0 6px 0;
		}
		
			#sitemap ul li ul li ul
			{
				padding: 6px 0 12px 24px;
			}
			
			#sitemap ul li ul li ul li
			{
				font-size: 75%;
				line-height: 90%;
				padding: 0 0 4px 0;
			}
			
				#sitemap ul li ul li ul li ul
				{
					padding: 4px 0 12px 24px;
				}
				
				#sitemap ul li ul li ul li ul li
				{
					font-size: 75%;
					line-height: 90%;
					padding: 0 0 2px 0;
				}





/*
===============================================================
Flash Overlay Styles
===============================================================
These are styles for the Flash movie overlay that is fetched 
with an XmlHttpRequest call. 
Flash movie button styles are also here
===============================================================
*/ 



/* 
------------------------------------------------------
.item_movie_link styles the movie link (list)
------------------------------------------------------
*/

.item_movie_link
{
	padding: 0 0 0 12px;
	border: 0px solid red;
	background-color: transparent;
}

	.item_movie_link ul
	{
		margin: 0;
		list-style: none;	
	}
	
	.item_movie_link li 
	{
		margin: 0;
		padding: 0;
		list-style: none;	
		color: #3e6af0;
		font-weight: bold;
		font-size: 1em;
		line-height: 100%;
	}
	
		.item_movie_link li a
		{
			display: block;
			padding: 4px 4px 4px 28px;
			color: #3e6af0;
			text-decoration: none;
			width: 128px;
			height: 24px;
			border: 0px solid green;
			background: transparent url(/images/interface/play.gif) no-repeat top right;
		}
		
		.item_movie_link li a:hover
		{
			display: block;
			padding: 4px 4px 4px 28px;
			color: #1d316e;
			text-decoration: underline;
			width: 128px;
			height: 24px;
			border: 0px solid green;
			background: transparent url(/images/interface/play_over.gif) no-repeat top right;
		}
		




/* 
------------------------------------------------------
#flash_movie refers to the hidden Flash Movie div
------------------------------------------------------
*/

#flash_container
{
	position: absolute;
	z-index: 100;
	margin: 0;
	width: 700px;
	background: #fff;
}

	#flash_movie 
	{
		margin: 0;
		padding: 12px 12px 0 12px;
		border: 12px solid #bbb;
		background: #fff;
	}
	
	#flash_movie ul
	{
		margin: 0;
		list-style: none;	
	}
	
	#flash_movie li 
	{
		margin: 0;
		padding: 4px 0 4px 4px;
		list-style: none;	
		color: #3e6af0;
		font-weight: bold;
		font-size: 1.16em;
		line-height: 1.33em;
		background: transparent url(/images/interface/previous.gif) no-repeat top left;
	}
	
		#flash_movie li 
		{
			margin: 0;
			padding: 0;
			list-style: none;	
			color: #3e6af0;
			font-weight: bold;
			font-size: 1.16em;
			line-height: 1.33em;
		}
	
		#flash_movie li a
		{
			display: block;
			padding: 4px 0 4px 28px;
			color: #3e6af0;
			text-decoration: none;
			width: 136px;
			border: 0px solid green;
			background: transparent url(/images/interface/previous.gif) no-repeat top left;
		}
		
		#flash_movie li a:hover
		{
			display: block;
			padding: 4px 0 4px 28px;
			color: #1d316e;
			text-decoration: underline;
			width: 136px;
			border: 0px solid green;
			background: transparent url(/images/interface/previous_over.gif) no-repeat top left;
		}
	


	

/* 
------------------------------------------------------
#flash_space encloses flash movie itself
------------------------------------------------------
*/

#flash_space
{
	clear: both;
	margin: 12px 0 0 0;
	padding: 0 0 0 0;
	text-align: center;
	height: 400px;
	background: transparent;
}

	#flash_space h3
	{
		padding: 48px 0 12px 0;
		margin: 0;
		font-size: 1.5em;
		line-height: 2em;
		font-weight: bold;
		color: #1d316e;
	}
	



/* 
------------------------------------------------------
#flash_area encloses a flash movie when not in an overlay
------------------------------------------------------
*/

#flash_area
{
	clear: both;
	margin: 0 0 0 0;
	padding: 0 0 12px 0;
	text-align: center;
	background: transparent;
}







/* 
------------------------------------------------------
#flash_area_wiam encloses a flash movie when in an overlay
with the 'What Is A Mediascape' page as content
------------------------------------------------------
*/

#flash_area_wiam
{
	clear: both;
	margin: 0 0 0 0;
	padding: 0 0 12px 0;
	text-align: center;
	background: transparent;
	height: 305px;
}

	#flash_area_wiam h3
	{
		padding: 48px 0 12px 0;
		margin: 0;
		font-size: 1.5em;
		line-height: 2em;
		font-weight: bold;
		color: #1d316e;
	}
	






/*
===============================================================
Help Overlay Styles
===============================================================
These are styles for the help overlay that is fetched with an 
XmlHttpRequest call
===============================================================
*/ 



/* 
------------------------------------------------------
#help_01
------------------------------------------------------
*/

#help_01
{
	position: absolute;
	z-index: 100;
	width: 676px;
	border: 12px solid #bbb;
	/*height: 530px;*/
	background: #fff;
	background: #fff url(/images/interface/help_v_border.gif) repeat-y top left;
	overflow: auto;
}

#help_02
{
	position: absolute;
	z-index: 100;
	width: 676px;
	border: 12px solid #bbb;
	/*height: 530px;*/
	background: #fff;
	background: #fff url(/images/interface/help_v_border.gif) repeat-y top left;
	overflow: auto;
}



/* 
------------------------------------------------------
#help_01_content and #help_02_content are the content wrappers
------------------------------------------------------
*/

#help_01_content
{
	padding: 0;
	margin: 0;
	width: 676px;
	float: left;
}

#help_02_content
{
	padding: 0;
	margin: 0;
	width: 676px;
	float: left;
}



/* 
------------------------------------------------------
.help_content is the left column
------------------------------------------------------
*/

.help_content
{
	padding: 0;
	margin: 0;
	width: 490px;
	float: left;
}




/* 
------------------------------------------------------
.help_controls encloses all help controls
------------------------------------------------------
*/

.help_controls 
{
	padding: 30px 30px 0 30px;
	border: 0px solid red;
	background-color: transparent;
}

	.help_controls ul
	{
		margin: 0;
		list-style: none;	
	}
	
	.help_controls li 
	{
		float: left;
		margin: 0 4px 0 0;
		list-style: none;	
		color: #3e6af0;
		font-weight: bold;
		font-size: 1.16em;
		line-height: 1.33em;
	}
	
		.help_controls li a
		{
			display: block;
			padding: 4px 0 4px 28px;
			color: #3e6af0;
			text-decoration: none;
			width: 62px;
			border: 0px solid green;
			background: transparent url(/images/interface/hide.gif) no-repeat top left;
		}
		
		.help_controls li a:hover
		{
			display: block;
			padding: 4px 0 4px 28px;
			color: #1d316e;
			text-decoration: underline;
			width: 62px;
			border: 0px solid green;
			background: transparent url(/images/interface/hide_over.gif) no-repeat top left;
		}
	
		.help_controls li a.hide_all
		{
			display: block;
			padding: 4px 0 4px 28px;
			color: #3e6af0;
			text-decoration: none;
			width: 102px;
			border: 0px solid green;
			background: transparent url(/images/interface/hide_all.gif) no-repeat top left;
		}
		
		.help_controls li a.hide_all:hover
		{
			display: block;
			padding: 4px 0 4px 28px;
			color: #1d316e;
			text-decoration: underline;
			width: 102px;
			border: 0px solid green;
			background: transparent url(/images/interface/hide_all_over.gif) no-repeat top left;
		}
	
	



/* 
------------------------------------------------------
.help_header encloses light blue text and image
------------------------------------------------------
*/

	.help_header
	{
		padding: 0 30px 12px 30px;
		clear: left;
	}

		.help_header h1
		{
			padding: 18px 0 24px 0;
			margin: 0;
			line-height: 32px;
			font-size: 36px;
			font-weight: bold;
			color: #1d316e;
		}
	
		.help_header p
		{
			color: #3e6af0;
			font-size: 1.5em;
			font-weight: bold;
			line-height: 2em;
		}
	
		.help_header img
		{
			float: right;
			padding: 0 0 30px 0;
		}
		


/* 
------------------------------------------------------
.help_copy encloses dark blue text
------------------------------------------------------
*/

	.help_copy
	{
		margin: 0 0 0 0;
		padding: 0 30px 30px 30px;
		clear: right;
		border: 0px solid red;
	}

		.help_copy p
		{
			color: #1d316e;
			font-size: 1.16em;
			line-height: 1.5em;
		}
	
		.help_copy ol
		{
			margin: 0 0 0 0;
			padding: 0 0 0 24px;
			color: #3e6af0;
			font-size: 1.5em;
			font-weight: bold;
			line-height: 2em;
		}
		




/* 
------------------------------------------------------
.help_menu is the right column
------------------------------------------------------
*/

	.help_menu
	{
		margin: 24px 0 0 502px;
	}
	

	.help_menu .learn
	{
		margin: 0;
		padding: 0;
	}
	
	.help_menu .learn_top,
	.help_menu .learn_bottom
	{
		display: none;
		margin: 0;
		padding: 0;
	}
	
	.help_menu .learn_content
	{
		margin: 0;
		padding: 0;
		background: transparent;
	}
	

		.help_menu h2
		{
			font-weight: bold;
			font-size: 1.5em;
			color: #1d316e;
			line-height: 1.5em;
		}
	
		.help_menu ul
		{
			margin: 0;
			padding: 12px 0 0 0;
			list-style: none;	
		}
		
		.help_menu li 
		{
			margin: 0;
			padding: 4px 0 4px 0;
			list-style: none;	
			color: #3e6af0;
			font-weight: bold;
			font-size: 1.16em;
			line-height: 1.25em;
		}
		
			.help_menu li a,
			.help_menu li a:visited,
			ul.learn_more_list li a
			ul.learn_more_list li a:visited
			{
				padding: 0;
				color: #3e6af0;
				text-decoration: none;
				border: 0px solid green;
			}
			
			.help_menu li a:hover,
			ul.learn_more_list li a:hover
			{
				padding: 0;
				color: #1d316e;
				text-decoration: underline;
				border: 0px solid green;
			}



