/*  This style sheet is designed to fit an elastic centered 3-column layout
	Left and right columns are fixed width but content within them scalable to default font
	Centre column liquid */

/* 	Margins and padding set to 0 in containing divs and then adjusted for elements contained within them such as <p> -
	this is to avoid box rendering inconsistencies between browsers */

/* 	Page font is set to a sans-serif style and 95% of the user's default size as 100% is too big for most people's taste */

html {
	}
body {
	margin: 0;
	padding: 0;
	background-color: #ffffff;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 95%;
	/*color: #666666;*/
	color:#000;
	}

#container {
	/* This div is included in case a faux left column is needed, but isn't used in the current design */
	background-image: url(../images/nav_col_base_green.jpg);
	background-repeat: repeat-y;
	background-position: left;
	margin: 0;
	padding: 0;
	}

#container2 {
	/* This div is included in case a faux right column is needed, but isn't used in the current design */
	background-image: url(../images/more_col_base.jpg); 
	background-repeat: repeat-y;
	background-position: right; 
	margin: 0;
	padding: 0;
	}

#left_col {
	/*This is the containing div for the left column */
	float: left;
	width: 227px;
	display: inline; /* Removes double margin problem in IE versions up to IE6 - only needed on first float in a row */
	padding: 0;
	margin: 0;
	background-color:#ffffff;
	border-right: 1px solid #eadfea;
	}

#right_col {
	/*This is the containing div for the right column */
	float: right; 
	width: 227px; 
	padding: 0;
	margin: 0;
	background-color:#ffffff;
	}

#content {
	/* This is the containing div for the liquid center column, therefore no width is given */
	background-color: #ffffff;
	margin-top: 0;
	margin-left: 227px; /* Leaves a fixed space for the left column to slot in */
	margin-bottom: 0;
	margin-right: 227px; /* Leaves a fixed space for the right column to slot in */
	padding-top: 2em;
	}
#content h2 {
	}

/********************************************************************************************************/
/*** General site-wide styles for HTML tags ***/
a:link {
	color: #663333;
	text-decoration: underline;
	}
a:visited {
	color: #663333;
	text-decoration: underline;
	}
a:hover {
	color: #cc9999;
	text-decoration: none;
	}
a:active, a:focus {
	color: #cccc99;
	text-decoration: none;
	}

p {
	margin: 0;
	padding: 0.5em 0.7em; /* This gives a 0.5em spacing between paragraphs and a 0.7em padding to the right and left */
	}
h1 {
	margin: 0;
	padding: 0.5em 0.5em; /* All headings are placed slightly to the left of paragraph edges */
	line-height: 1.1em;
	font-size: 1.2em;
	}
h2 {	
	margin: 0;
	padding: 0.5em 0.5em;
	font-size: 1.2em;
	}
h3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;	
	font-size: 1.0em;
	font-weight: bold;
	margin: 0;
	padding: 0.5em 0.5em;
	}
h4 {
	font-family: Verdana, Arial, Helvetica, sans-serif;	
	font-size: 1em;
	font-style: italic;
	margin: 0;
	padding: 0.5em 0.5em;
	}
table {
	}
td, th {
	padding: 2px;
	/* vertical-align: top; */
	}
textarea {
	}
ul {	
	font-family: Verdana, Arial, Helvetica, sans-serif;	
	font-size: 0.8em;	
	list-style-type: square;	
	list-style-position: outside
	}
	
/********************************************************************************************************/
/*** Sub-page styles ***/
/*** Banner ***/
#banner {
	background-color: #996699;
	width: 100%;
	height: 2em;
	margin: 0;
	padding: 0;
	color: #ffffff;
	border-bottom: 0.1em solid #663333;
	}
#banner h1 {
	/* Developing insight, delivering improvement */
	margin: 0;
	padding: 0.5em 0em 0.3em 0.5em;
	font-size: 0.8em;
	font-weight: bold;
	font-style: italic;
	}	
/********************************************************************************************************/

.cleardiv {
	clear: both;
	line-height: 1em;
	}

/********************************************************************************************************/
/*** Navigation bar across top of page ***/
#top_menu {
	background-color: #cccc99;
	margin: 0;
	padding: 0;
	}

#top_menu ul {
	display: inline; /* Displays list of links in one line instead of down the page */
	padding: 0;
	margin-left: 0.5em;
	list-style-type: none;
	line-height: 3em;
	}
#top_menu ul li {
	display: inline;
	padding-bottom: 0.5em;
	}
#top_menu ul li a {
	background-color: #cccc99;
	color: #663333;
	padding-top: 0.7em; /* Padding the link makes the background color fill the whole height of the div and not just behind the words */
	padding-bottom: 0.7em;
	padding-left: 0.3em;
	padding-right: 0.3em;
	text-decoration: none;
	}
#top_menu ul li a:visited {
	text-decoration: none;
	}
#top_menu ul li a:hover {
	background-color: #663333;
	color: #ffffff;
	padding-top: 0.7em; /* Padding the link makes the background color fill the whole height of the div and not just behind the words */
	padding-bottom: 0.7em;
	padding-left: 0.3em;
	padding-right: 0.3em;
	text-decoration: none;
	}

/********************************************************************************************************/
/*** Indicates whether people are looking at the 'Company profile' area or the 'Learning zone' ***/	
#zone {
	float: left;
	width: 233px; /* I set this a bit wider than the containing left-col div so that it spills into the center column and hides the border */
	background-color: #ffffff;
	position: relative; /* IE hack to prevent double margin */
	background-repeat: no-repeat; /* The image itself is specified inline as it is different depending on which page you are looking at */
	background-position: center bottom;
	height: 160px;
	color: #ffffff;
	padding-top: 0.8em;
	margin-bottom: 0.3em;
	margin-top: 0em;
	}

#zone h2 {
	padding-top: 40px; /* Positions the heading in the right place over the background image */
	padding-left: 30px;
	font-size: 1.5em;
	text-align: left;
	}

/********************************************************************************************************/
/*** A set of links specific to that page ***/
#sub_links{
	background-image: url(../images/H3eadfea.gif);
	background-repeat: no-repeat;
	background-position: center top;
	float: left;
	width: 227px;
	}

#sub_links h3 {
	margin: 0;
	padding: 30px 40px 10px 0; /* Positions the text so that it tucks in behind the arrow image */
	color: #996699;
	font-size: 1.1em;
	font-weight: normal;
	text-align: right;
	}
#sub_links p {
	}
#sub_links ul {
	margin: 0 3em 0 1em ; 
	padding: 0;
	}
#sub_links ul li {
	list-style-type: none;
	padding: 0.1em 1em 0.1em 0;
	}
#sub_links ul li a {
	color: #663333;
	text-decoration: none;
	padding: 0.3em;
	display: block;	
	background-color: #eadfea;
	}
#sub_links ul li a:hover, #sub_links ul li a:active {
	color: #ffffff;
	text-decoration: none;
	background-color: #996699;
	padding: 0.3em;	
	display: block;	
	}
	
#sub_links ul li a.about {
	background-color: #996666;
	color: #ffffff;
	text-decoration: none;
	padding: 0.3em;
	display: block;	
	}
#sub_links ul li a.about:hover, #sub_links ul li a.about:active{
	background-color: #dfd0d0;
	color: #663333;
	text-decoration: none;
	padding: 0.3em;
	display: block;	
	}
#sub_links ul li a.learning {
	background-color: #996699;
	color: #ffffff;
	text-decoration: none;
	padding: 0.3em;
	display: block;	
	}
#sub_links ul li a.learning:hover, #sub_links ul li a.learning:active{
	background-color: #eadfea;
	color: #663333;
	text-decoration: none;
	padding: 0.3em;
	display: block;	
	}
#sub_links ul li a.housekeeping {
	background-color: #cc99cc;
	color: #ffffff;
	text-decoration: none;
	padding: 0.3em;
	display: block;	
	}
#sub_links ul li a.housekeeping:hover, #sub_links ul li a.housekeeping:active{
	background-color: #ecdbed;
	color: #663333;
	text-decoration: none;
	padding: 0.3em;
	display: block;	
	}

#sub_links ul li a.about_sub {
	background-color: #dfd0d0;
	color: #663333;
	text-decoration: none;
	padding: 0.3em;
	display: block;	
	}
#sub_links ul li a.about_sub:hover, #sub_links ul li a.about_sub:active{
	background-color: #996666;
	color: #ffffff;
	text-decoration: none;
	padding: 0.3em;
	display: block;	
	}
#sub_links ul li a.learning_sub {
	background-color: #eadfea;
	color: #663333;
	text-decoration: none;
	padding: 0.3em;
	display: block;	
	}
#sub_links ul li a.learning_sub:hover, #sub_links ul li a.learning_sub:active{
	background-color: #996699;
	color: #ffffff;
	text-decoration: none;
	padding: 0.3em;
	display: block;	
	}
	
/********************************************************************************************************/
/*** List of links to key insights for the future ***/
#insights {
	background-image: url(../images/H3dfd0d0.gif);
	background-repeat: no-repeat;
	background-position: center top;
	float: left;
	width: 227px;
	}
#insights h3 {
	margin: 0;
	padding: 30px 40px 10px 0;  /* Positions the text so that it tucks in behind the arrow image */
	color: #996666;
	font-size: 1.1em;
	font-weight: normal;
	text-align: right;
	}
#insights ul {
	margin: 0 3em 0 1em ;
	padding: 0;
	}
#insights ul li {
	list-style-type: none;
	padding: 0.1em 1em 0.1em 0;
	}
#insights ul li a {
	color: #ffffff;
	text-decoration: none;
	padding: 0.3em;
	display: block;	
	background-color: #996666;
	}
#insights ul li a:hover, #insights ul li a:active {
	color: #663333;
	text-decoration: none;
	background-color: #dfd0d0;
	padding: 0.3em;	
	display: block;	
	}

/********************************************************************************************************/
/*** List of links to recent policy areas ***/
#policy {
	background-image: url(../images/H3ecdbec.gif);
	background-repeat: no-repeat;
	background-position: center top;
	float: left;
	width: 227px;
	}
#policy h3 {
	margin: 0;
	padding: 30px 40px 10px 0;  /* Positions the text so that it tucks in behind the arrow image */
	color: #cc99cc;
	font-size: 1.1em;
	font-weight: normal;
	text-align: right;
	}
#policy ul {
	margin: 0 3em 0 1em ;
	padding: 0;
	}
#policy ul li {
	list-style-type: none;
	padding: 0.1em 1em 0.1em 0;
	}
#policy ul li a {
	color: #663333;
	text-decoration: none;
	padding: 0.3em;
	display: block;	
	background-color: #ecdbec;
	}
#policy ul li a:hover {
	color: #ffffff;
	text-decoration: none;
	background-color: #cc99cc;
	padding: 0.3em;	
	display: block;	
	}
	
/********************************************************************************************************/
/*** Text box in the right column, randomly loaded comments from clients ***/
#more {
	/* Has a pale mauve background; rounded corners are created with background images in the 'toprounded' and 'bottomrounded' divs */
	position: relative; /* Not sure if this is required - it was part of a hack to remove double margins in old versions of IE */
	width: 215px;
	background-color: #eadfea;
	margin: 0 10px 0 0; /* gives a space to the right of the box */
	padding: 0;
	}
#more h3 {
	color: #996699;
	}
#more p {
	font-size: 80%;
	padding: 0.9em;
	}
#more ul {
	}
#more ul li {
	}
#more ul li a {
	}
#more ul li a:hover {
	}

/********************************************************************************************************/
/*** W3C standards ***/
#standards, #jobs {
	position: relative;
	width: 215px;
	background-color: #ffffff;
	margin: 1.2em 10px 1.2em 0;
	border: 1px solid #eadfea;
	}
#standards h3 {
	background-color: #996666;
	color: #ffffff;
	}
#standards p, #jobs p {
	font-size: 80%;
	padding: 0.9em;
	}
#jobs h3 {
	background-color: #996699;
	color: #ffffff;
	}
/********************************************************************************************************/
/*** Styles for the box ***/
#partnerships {
	float: left;
	width: 210px;
	background-color: #ffffff;
	border: 1px solid #eadfea;
	margin: 1.2em 5px 1.2em 10px;
	}
#partnerships h3 {
	background-color: #996666;
	color: #ffffff;
	}
#partnerships p {
	font-size: 80%;
	padding: 0.9em;
	}
#partnerships ul, #jobs ul {
	margin: 0; 
	padding: 1em 1em 1em 2em; /* Moves the logos 2ems from the left */
	}
#partnerships ul li, #jobs ul li {
	list-style-type: none;
	padding-bottom: 0.3em;
	}
#partnerships ul li a, #jobs ul li a {
	}
#partnerships ul li a:hover, #jobs ul li a:hover {
	}
	
/********************************************************************************************************/
/* Sets the styles for the CMS box */

#cms {
	float: left;
	width: 210px;
	background-color: #ffffff;
	border: 1px solid #eadfea;
	margin: 1.2em 5px 1.2em 10px;
	}
#cms h3 {
	background-color: #996666;
	color: #ffffff;
	}
#cms p {
	}
#cms ul {
	}
#cms ul li {
	}
#cms ul li a {
	}
#cms ul li a:hover {
	}

/********************************************************************************************************/
/* Sets the styles for the search box */

#search {
	float: left;
	width: 210px;
	background-color: #ffffff;
	border: 1px solid #eadfea;
	margin: 1.2em 5px 1.2em 10px;
	}
#search h3 {
	background-color: #996699;
	color: #ffffff;
	}
#search p {
	font-size: 0.8em;
	}
#search ul {
	}
#search ul li {
	}
#search ul li a {
	}
#search ul li a:hover {
	}

/********************************************************************************************************/
/*** Sets the styles for the footer bar ***/
#sub_footer {
	background-color: #cccc99;
	width: 100%;
	clear: both;
	text-align: right;
	color: #666666;
	}
#sub_footer ul {
	padding: 0;
	margin: 0;
	list-style-type: none;
	line-height: 3em;
	padding-right: 1em;
	}
#sub_footer ul li {
	display: inline; /* Displays list of links in one line rather than down the page */
	padding-bottom: 0.5em; 
	}
#sub_footer ul li a {
	background-color: #cccc99;
	color: #663333;
	padding-top: 0.7em; /* Padding the link makes the background color fill the whole height of the div and not just behind the words */
	padding-bottom: 0.7em;
	padding-left: 0.3em;
	padding-right: 0.3em;
	text-decoration: none;
	}
#sub_footer ul li a:visited {
	text-decoration: none;
	}
#sub_footer ul li a:hover {
	background-color: #663333;
	color: #ffffff;
	padding-top: 0.7em; /* Padding the link makes the background color fill the whole height of the div and not just behind the words */
	padding-bottom: 0.7em;
	padding-left: 0.3em;
	padding-right: 0.3em;
	text-decoration: none;
	}
/********************************************************************************************************/
/********************************************************************************************************/
/*** Bits and pieces ***/

/*** Price list styles ***/
th.product {
	text-align: left;
	border-top: 1px solid #666666;
	border-bottom: 1px solid #666666;
	}
td.product {
	padding-left: 2em;
	}
td.price {
	text-align: right;
	}

/********************************************************************************************************/
ul.accesskeys li {
	list-style-type: none;
	}

/********************************************************************************************************/
/*** Styles for the forms throughout the site ***/
.form_background {
	/*border: solid 1px #666666;*/
	background-color: #ffffff;
	margin: 0 2em 0 2em;
	padding: 0.5em;
	}
.form_label {
	text-align: right;
	font-size: 80%;
	}
.form_control {
	text-align: left;
	font-size: 80%;
	}
.fieldset {
	width: 25em; 
	margin-left: auto; 
	margin-right: auto; 
	text-align: center;
	}
.legend {
	background-color: #ffffff; 
	color: #996699; 
	padding: 2px;
	}
	
/********************************************************************************************************/
/*** Styles for contact page ***/
#registered {
	margin: 0;
	padding: 0.5em 0.7em 0.7em 0.7em;
	}
.contact_details {
	margin: 0;
	padding: 0.5em 1em 1em 0.7em;
	}
.contact_name {
	font-weight: bold;
	}

/********************************************************************************************************/
/*** Styles for giving rounded corners to the 'more' box ***/
.toprounded {
	width: 215px; 
	height: 9px; /* constrains the div height to the height of the image in compliant browsers */
	font-size: 7px; /* height workaround for older versions of IE */
	padding: 0; 
	margin: 8em 0 0 0; /* top margin to clear logo - needs 8 ems because the font size is so small */	
	background-image: url(../images/toprounded.gif); 
	background-repeat: no-repeat; 
	background-position: center top;
	}
.bottomrounded {
	width: 215px; 
	height: 9px; /* constrains the div height to the height of the image in compliant browsers */
	font-size: 6px; /* height workaround for older versions of IE */
	padding: 0; 
	margin: 0 0 0 0;	
	background-image: url(../images/bottomrounded.gif); 
	background-repeat: no-repeat; 
	background-position: center top;
	}
/********************************************************************************************************/
/*** Styles for notice board ***/
#notices {
	float: left;
	width: 210px;
	background-color: #ffffff;
	border: 1px solid #eadfea;
	margin: 1.2em 5px 1.2em 10px;
	}
#notices h3 {
	background-color: #996666;
	color: #ffffff;
	}
#notices p {
	font-size: 0.8em;
	padding: 0.9em;
}
#marqueecontainer{
position: relative;
width: 200px; /*marquee width */
height: 200px; /*marquee height */
background-color: white;
overflow: hidden;
border: 0;
padding: 2px;
}