/* CSS Document */
@charset "utf-8";

/* Default layout attributes */
body 
	{
		font-size:1.0em;
		margin: 0;
		padding: 0;
		text-align:justify;
		color: #00F;
		width:1024px;
		background-color: #ffffcc;
		font-family:Arial, Helvetica, sans-serif;
		font-weight: bolder;
		background-image:url(images/barracuda.jpg);
	}

/* Used for text outside a container - e.g. Home page introduction section */
.oneColElsCtr #mainContent 
	{
		padding: 10px 20px 5px 10px ; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	}

/* ++++++++++++++++++ Link Styles for Anchors +++++++++++++++++++ */
a:hover
	{
		background-color:#ffffa0;		/* Set background colour to cream */
	}
	
:link
	{
		color:#00F;						/* Anchor link is Blue */
	}
	
:visited
	{
		color:#00F;						/* Visited link is Blue (don't want to change colour) */
	}

/* ++++++++++++++++++++++ Container Styles ++++++++++++++++++++++ */

/* Create the main banner container */
.banner
	{
		position:absolute;
		left:30%;
		top:10px;
		width:60%;
		background-image:url(transparent.gif);		/* Want a clear background */
		z-index:3;
	}
			
/* Create the Breadcrumb container */
.breadCrumb
	{
		position:absolute;
		left:165px;
		top:160px;
		background-color:#ffffa0;			/* Set background colour to cream */
		text-decoration:none;
		text-shadow:none;
		font-size:1.0em;
		font-weight: bold;
		width: 80%;
		height:auto;
		border:thin solid;					/* Add a thin border */
		border-color:#000;					/* In black */
		z-index:3;
	}

/* Create the unordered list style */
.breadCrumb ul
	{
		padding: 3px 0 3px 3px;				/* top, right, bottom, left padding */
		margin: 0;
		text-align: left;
		text-decoration:none;
	}

/* Create the unordered list (non-anchor) item style */
.breadCrumb ul li
	{
		text-decoration:none;
		text-shadow:none;
		color:#a8c5f0;						/* Pale Blue text */
		display: inline;					/* Horizontal list */
	}

/* Create the unordered list (anchor) item style */
.breadCrumb ul li a
	{
		color:#00f;							/* Blue text */
		padding: 3px 3px 4px 3px; 			/* top, right, bottom, left padding */
		margin-right: 20px; 				/* spacing between each menu link */
		text-decoration:none;
		text-shadow:none;
	}

/* Create the style for mouse hovering or selecting anchor element on breadcrumb */
.breadCrumb ul li a:hover, .breadCrumb ul li a.selected
	{
		text-decoration: none;
		background-color:#a8c5f0;			/* Change the background to pale blue when mouse hovers on breadcrumb */
		color: #ffffcc;						/* Change text colour to yellow */
		padding-bottom:4px;
	}

/* Create Sharklab container */
.sharkLab
	{
		position:absolute;
		left:75%;
		top:10px;
		width:80%;
		background-image:url(transparent.gif);		/* Want a clear background */
		z-index:3;
	}

/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
/* Create the Toolbar container - positioned underneath Main page banner */
.toolBar
	{
		position:absolute;
		left:165px;
		top:213px;
		background-color:#ffffa0;			/* Set background colour to blue */
		font-family:"Times New Roman", Times, serif;
		text-shadow:none;
		text-decoration:none;
		font-size:1.2em;
		font-weight: bold;
		text-align:center;
		width: 80%;
		height:auto;
		border:thin solid;					/* Add a thin border */
		border-color:#000;					/* In black */
	}

/* Create the unordered list style */
.toolBar ul
	{
		padding: 1px 0 1px 0;				/* top, right, bottom, left padding */
		margin: 0;
		text-align: center;
		text-decoration:none;
	}

/* Create the unordered list (non-anchor) item style */
.toolBar ul li
	{
		text-decoration:none;
		text-shadow:none;
		color:#a8c5f0;						/* Pale Blue text */
		display: inline;					/* Horizontal list */
	}

/* Create the unordered list (anchor) item style */
.toolBar ul li a
	{
		color:#00f;							/* Blue text */
		padding: 1px 3px 1px 3px; 			/* top, right, bottom, left padding */
		margin-right: 20px; 				/* spacing between each menu link */
		text-decoration:none;
		text-shadow:none;
	}

/* Create the style for mouse hovering or selecting anchor element on breadcrumb */
.toolBar ul li a:hover, .toolBar ul li a.selected
	{
		text-decoration: none;
		background-color:#a8c5f0;			/* Change the background to pale blue when mouse hovers on breadcrumb */
		color: #ffffcc;						/* Change text colour to yellow */
		padding-bottom:1px;
	}
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

/* Create the page title container */
.pageTitle
	{
		position:absolute;
		left:165px;
		top:187px;
		width:80%;
		background-color:#a8c5f0;				/* Pale blue background bar */
		border: thin solid;
		border-color:#000;
		text-align:center;
		font-size:1.2em;						/* Larger text on title */
		font-family:"Copperplate Gothic Light";
		font-weight:bolder;
		color:#00f;								/* Page Title text is Blue */
		text-shadow:#0033FF 0.1em 0.1em 0.2em;
		padding-top:0.1em;						/* Create some top & bottom padding */
		padding-bottom:0.1em;
		z-index:3;
	}
			
/* Create the main body container - container to hold either text or other divs */
.mainContent
	{
		position:absolute;
		left:165px;
		top:220px;
		width:1100px;
		height:768px;
		border:none;
		padding-left:10px;
		padding-right:10px;
		z-index:0;
	}

/* Create the Taurus container */
.taurus
	{
		position:fixed;
		left:10px;
		top:10px;
		width:190px;
		font-size:0.8em;
		color:#00F;							/* Text is Blue */
		font-family: "Times New Roman", Times, serif;
		font-weight: bolder;
		padding-top:0.1em;					/* Put some padding in */
		padding-bottom:0.1em;
		border:none;						/* No border required */
	}

/* Create the W3C container */
.w3c
	{
		position:fixed;
		left:46px;
		top:103px;
		width:109px;
		text-align:center;
		border:none;						/* No border requried */
		z-index:1;							/* We want this to be on top of anything else */
	}

/* Create the Site Map container */
.siteMap
	{
		position:absolute;
		left:165px;
		top:134px;
		width:90px;
		text-align:left;
		font-size:0.8em;
		padding-top:0.1em;
		padding-bottom:0.1em;
		z-index:3;							/* We want this to be on top of anything else */
	}

/* Create the Contact Us container */
.contactUs
	{
	position:absolute;
	left:230px;
	top:134px;
	width:125px;
	text-align:center;
	font-size:0.8em;
	padding-top:0.1em;					/* Add some padding top & bottom */
	padding-bottom:0.1em;
	z-index:3;							/* We want this to be on top of anything else */
	}

/* Post It Note container */
.postItNote
	{
		position:absolute;
		height:auto;
		background-color:#ffffcc;
		border: thin solid;
		border-color:#000;					/* Thin black border */
		font-size:1.0em;					/* Larger text to stand out */
	}

/* Post It Note Header section */
.postItNote H1
	{
		background-color:#a8c5f0;			/* Pale blue background */
		text-align:center;
		font-size:1.1em;
		font-family:"Times New Roman", Times, serif;
		color:#00007f;
		text-shadow:#0033FF 0.1em 0.1em 0.2em;
		border-bottom:thin solid;
		margin:0px;
		padding-left:5px;
		padding-right:5px;
		padding-bottom:2px;
	}
	
/* Post It Note Content section (Justified) */
.postItNote H2
	{
		text-align:justify;
		font-size:0.8em;
		margin:0px;
		color:#000;					/* Text is black */
		font-weight:200;			/* Lightweight */
		padding-left:5px;
		padding-right:5px;
		padding-top:10px;
		padding-bottom:5px;
	}

/* Post It Note Content section (Centred) */
.postItNote H3
	{
		text-align:center;
		font-size:0.8em;
		margin:0px;
		color:#000;					/* Text is black */
		font-weight:200;			/* Lightweight */
		padding-left:5px;
		padding-right:5px;
		padding-top:10px;
		padding-bottom:5px;
	}

/* Report content container - used for simple reports in the main display area */
.newsContent
	{
		position:absolute;
		left:200px;
		top:425px;
		width:100px;
		height:auto;
		padding-left:10px;
		padding-right:10px;
		font-size:0.9em;
		z-index:2;					/* Ensure nothing can over-write it */
	}

/* +++++++++++++++++++++++++++++++ Shadow containers ++++++++++++++++++++++++ */
/* For shadowing reports and single image */
.content, .shadow, .imageContent
	{
		position: relative;
		bottom: 8px;
		right: 8px;
	}

.shadow
	{
		background-color: #ccc;			/* Shadow is grey */
	}

/* Used for text reports to allow the shadow background */
.content
	{
		background-color: #ffffcc;		/* Cream colour for the content box */
		border: 1px solid #000;
		padding: 0.5em;
	}

/* Used for images only to use the shadow background */
.imageContent
	{
		background-color: #ffffcc;		/* Cream background on image */
	}

				
/* ++++++++++++++++++++++ Heading Styles ++++++++++++++++++++++ */
/* Create the prompt (small) text for forms etc */
.dropshadowtextsmall
	{
		font-size:1.1em;
		font-family:"Copperplate Gothic Light";
		color:#00007F;					/* Pale Blue text colour */
		text-shadow:#0033FF 0.1em 0.1em 0.2em
	}

/* Create the prompt (large) text for form titles */
.dropshadowtextlarge
	{
		font-size:1.5em;
		font-family:"Copperplate Gothic Light";
		font-weight:bolder;
		color:BLUE;
		text-shadow:#0033FF 0.1em 0.1em 0.2em;
		text-align: center;
		margin-left:5px;
		margin-top:5px;
	}

/* Heading style for tables */	
.tableHeadingStyle
	{
		color:#A8C5F0;					/* Pale Blue text colour */
		font-weight:bolder;
		font-size:1.15em;
		font-family: "Times New Roman", Times, serif;
		background-color:#545FBA;		/* Darker blue for background */
		text-align:center;
	}
			
/* Create style for table content */
.tableContentStyle
	{
		color:#00F;						/* Blue text */
		font-weight:bold;
		font-size:1em;
		font-family: "Times New Roman", Times, serif;
		background-color:#BBBBFF;
		text-align:center;
	}

/* Smaller font table content */
.tableSmallContentStyle
	{
		color:#000;						/* Black text */
		font-weight:bold;
		font-size:0.8em;
		font-family:Arial, Helvetica, sans-serif;
		background-color:#BBBBFF;
		text-align:left;
	}
	
/* General List Style (Used in Sitemap etc) */
li
	{
		font-size:1.0em;
		font-family:"Times New Roman", Times, serif;
		color:#00007F;					/* Pale Blue */
	}
	
/* Website Navigation menu */
ul.mainMenu
	{
		position:fixed;
		left:20px;
		top:160px;
		background-color:#ffffa0;		/* Yellow background */
		border:thin solid;				/* Add a border */
		border-color:#a8c5f0;			/* In pale blue */
		list-style: none;
		margin: 0;
		padding: 0;
		border-bottom: 1px solid #FF0;
		width:140px;
		display:block;					/* Vertical block */
		text-align:center;
		font-size:0.9em;
	}

/* Create the border style for the list items in an unordered list */
ul.mainMenu li
	{
		border-bottom: 1px solid #a8c5f0;	
		border-top: 1px solid #a8c5f0;
		border-left: 1px solid #a8c5f0;
		border-right: 1px solid #a8c5f0;
	}

/* Create the Navigation menu Anchor elements */
ul.mainMenu li a
	{
		display:block;					/* Vertical menu list */
		width:140px;
		color:#00F;						/* Text in blue */
		font-weight:bold;
		padding: 6px 0px;
		font-size:1.1em;
		text-decoration:none;
		text-shadow:none;
	}

/* Create the style for mouse hovering over menu item */
ul.mainMenu li a:hover
	{
		background-color:#a8c5f0;		/* Change the colour to pale blue */
		color: #ffffcc;					/* Change the text colour to yellow */
	}

/* Image containers for left, right & centre giving appropriate padding */
img.left
	{
		float:left;
		padding-right:10px;
		border:none;
	}

img.right
	{
		float:right;
		padding-left:10px;
		padding-right:3px;
		padding-top:5px;
		border:none;
	}
	
img.center
	{
		display:block;
		margin-left:auto;
		margin-right:auto;
		border:none;
	}