body {
	font-family: Arial, Helvetica, sans-serif;
	color: #000000;
	background-color: #FFFFFF;
	margin: 5px;	
}

/* The main wrapper div, position relative. All other div's are absolute within this div. */
#wrapper {
	position: relative;
	width:100%;
	border: 2px solid #C8570D;
}

/* Note oontent height is reset in bf.css and bd.css */
#content {
	font-size: 0.8em;
	position: static;
	background-color: #FFFFFF;
	padding: 34px 185px 20px 180px;
	margin : 0px auto;
	text-align: left;
	background-image: url(../images/content-back.gif);
	background-repeat: repeat-y;
	border: none;
	min-height: 500px;
	height: auto !important;  /* for modern browsers */
  	height: 550px;  /* for IE */
}
/* Fix for IE */
* html #content   /* this selector recognized by IE only */
{width: 100%;}

/* Add a bit of space between points in lists */
.spaced-lst li {margin-bottom: 0.5em;}

/* Site header (Top banner of the site) */
#header {
	position: relative;
	left: 0px;
	top: 0px;
	height: 74px;
	background-image: url(../images/def-header.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	background-color: #E38011;
	border-bottom-style: solid;
	border-bottom-width: 10px;
	border-top-style: none;
	border-right-style: none;
	border-left-style: none;
	border-bottom-color: #F6A977;
}
/* Fix for IE */
* html #header   /* this selector recognized by IE only */
{height: 84px;}

#logo {
	margin: 0px;
	padding: 0px;
	height: 65px;
	width: 220px;
	left: 17px;
	top: 7px;
	position: absolute;
}

/* Space for bread crumb trail if required */
#bread {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.6em;
	color: #666666;
	background-color: #FFFFFF;
	margin: 0px;
	padding: 0px 10px 0px 5px;
	border-bottom-width: 3px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: solid;
	border-left-style: none;
	border-bottom-color: #F6A977;
	left: 0px;
	top: 84px;
	position: absolute;
	width: 99%;
}
* html #bread {	width: 100%;}

/* The outer div for the navigation */
#rightbar {
	right: 4px;
	top: 7px;
	position: absolute;
	width: 172px;
	padding: 0px;
	margin: 0px auto;
	background-color: #CCCCCC;
}
#rightbar br {
	line-height: 5px;
}
#bf-box a, #bd-box a, #pf-box a, #pd-box a {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #FFFFFF;
	padding: 2px 5px 2px 22px;
	text-align: left;
	text-decoration: none;
	font-size: 0.95em;
}
#bf-box a:hover, #bd-box a:hover, #pf-box a:hover, #pd-box a:hover  {
	text-decoration: underline;
	font-size: 0.95em;
}

#rightbartext {
	padding: 8px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.85em;
	line-height: 110%;
}
#bf-box, #bd-box, #pf-box, #pd-box{
	background-color: #FFFFFF;
	background-repeat: no-repeat;
	background-image: url(../images/bf-back.jpg);
	background-position: center top;
	height: 75px;
	border: 1px solid #666666;

}
#pf-box {background-image: url(../images/pf-back.jpg);}
#pd-box {background-image: url(../images/pd-back.jpg);}
#bd-box {background-image: url(../images/bd-back.jpg);}
* html #bd-box, * html #bf-box, * html #pf-box, * html #pd-box { height: 77px;}

#footer {
	min-height: 20px;
	height: auto !important;  /* for modern browsers */
  	height: 20px;  /* for IE */
	padding:5px;
	bottom: 0px;
	position: relative;
	text-align: center;
	background-color: #333333;
	font-size: 0.8em;
	color: #FFFFFF;
	clear: both;
}
#footer a, #footer a:hover {color: #FFFFFF; font-weight: normal;}

#credit {color: #A5A58D;}
#credit a {color: #A5A58D;}

#footer2 {
  	height: 53px;
	padding:5px;
	position: relative;
	text-align: center;
	background-color: #CCCCCC;
	border: 1px solid #333333;
	font-size: 0.8em;
}

#menu {
	left: 0px;
	top: 104px;
	position: absolute;
	width: 173px;
	padding: 0px;
}
* html #menu {top: 117px;} /* Fix for IE */

/* Remove menu indents */
#navpanel {
	padding-left:0px;
	margin-left:0px;
	position: absolute;
	left: 0px;
	top: 0px;
  }

/* Remove sub-list indents */
#navpanel ul {
  padding-left:0px;
  margin-left:0px;
  width: 173px;
}
#navpanel li {
  list-style-type:none;
  position: relative;
  } 

/* Set menu link font colour on hover */
#navpanel ul a, #navpanel ul a:visited {
	display: block;
	font-weight: bold;
	font-size: 0.95em;
	color: #FFFFFF;
	padding: 4px 4px 4px 22px;
	border: 1px solid #CCCCCC;
	background-repeat: no-repeat;
	background-position: 5px center;
	margin:0px 0px 0px;
	text-decoration: none;
}
#navpanel ul a:hover  {text-decoration: underline;}
#navpanel ul ul a, #navpanel ul ul a:visited {
	display: block;
	font-weight: normal;
	font-size: 0.95em;
	color: #333333;
	padding: 2px 2px 2px 27px;
	border: none;
	background-repeat: no-repeat;
	background-position: 10px 5px;
	margin:0px 0px 0px;
	text-decoration: none;
}
#navpanel ul ul a:hover  {	text-decoration: underline;	}

* html #navpanel ul li {float: left; /* cure IE5.x "whitespace in lists" problem */width: 100%;}
* html #navpanel ul li a {height: 1%; /* make links honour display: block; properly */} 
* html #navpanel ul ul li {float: left; /* cure IE5.x "whitespace in lists" problem */width: 100%;}
* html #navpanel ul ul li a {height: 1%; /* make links honour display: block; properly */} 
.defmenu a {background-color: #C8570D; background-image: url(../images/def-icon-2.gif);}
.defmenu a:hover {background-image: url(../images/def-icon.gif);}
.pfmenu a {	background-color: #68732B; 	background-image: url(../images/pf-icon-2.gif);}
.pfmenu a:hover {background-image: url(../images/pf-icon.gif);}
.pdmenu a {	background-color: #990000; 	background-image: url(../images/pd-icon-2.gif);}
.pdmenu a:hover {background-image: url(../images/pd-icon.gif);}
.bfmenu a {	background-color: #336699; 	background-image: url(../images/bf-icon-2.gif);}
.bfmenu a:hover {background-image: url(../images/bf-icon.gif);}
.bdmenu a {	background-color: #5738A7; 	background-image: url(../images/bd-icon-2.gif);}
.bdmenu a:hover {background-image: url(../images/bd-icon.gif);}
.admenu a {	background-color: #333333; 	background-image: url(../images/grey-icon-2.gif);}
.admenu a:hover {background-image: url(../images/grey-icon.gif);}
.pfsub a {background-color: #CCCCCC; background-image: url(../images/white-icon.gif);}
.pfsub a:hover {background-image: url(../images/pf-icon-gr-2.gif);}
.pdsub a {background-color: #CCCCCC; background-image: url(../images/white-icon.gif);}
.pdsub a:hover {background-image: url(../images/pd-icon-gr-2.gif);}
.bfsub a {background-color: #CCCCCC; background-image: url(../images/white-icon.gif);}
.bfsub a:hover {background-image: url(../images/bf-icon-gr-2.gif);}
.bdsub a {background-color: #CCCCCC; background-image: url(../images/white-icon.gif);}
.bdsub a:hover {background-image: url(../images/bd-icon-gr-2.gif);}
.adsub a {background-color: #CCCCCC; background-image: url(../images/white-icon.gif);}
.adsub a:hover {background-image: url(../images/grey-icon-gr-2.gif);}

a {
	color: #0066CC;
	text-decoration: underline;
	background-color: none;
    font-weight: bold;
}
a:hover {
	color: #C8570D;
	text-decoration: underline;
	background-color: none;
}

/* Image Styles */
img.right {
	background: #FFFFFF;
	margin-left: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
	float: right;
	border: 1px solid #000000;
}

img.left {
	background: #FFFFFF;
	margin-right: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
	float: left;
    border: 1px solid #000000;
}

/* Headings */
h1 {
	font-size: 1.5em;
	color: #FFFFFF;
	font-weight: bold;
	background-color: #C8570D;
	background-image: url(../images/def-icon.gif);
	background-repeat: no-repeat;
	background-position: 5px center;
	text-align: left;
	margin: 0px;
	padding: 2px 2px 2px 25px;
}

h2 {
	font-size: 1.5em;
	color: #333333;
	font-weight: bold;
	padding: 2px 2px 2px 25px;
	border: 1px solid #C8570D;
	line-height: 1.1em;
	margin: 0px;
	background-image: url(../images/def-h1-icon.gif);
	background-repeat: no-repeat;
	background-position: 5px 5px;
}

h3 {
	font-size: 1.2em;
	color: #333333;
	font-weight: bold;
	padding-left: 10px;
}
h4 {
	font-size: 1em;
	color: #333333;
	font-weight: bold;
	padding-left: 10px;
}

h6 {
	font-size: 1em;
	color: #333333;
	font-weight: normal;
}
p {
	text-align: left;
	padding: 0px 5px 5px 10px;}


/* The 4 info boxes on the home page for personal/business finance/debt (pf, bf, pd and bd) */

.col1 {	float: left; text-align: left; margin: 0px 0px 5px 20px; width:47%; border: 1px solid #333333; }
.col2 {	float: left; text-align: left; margin: 0px 0px 5px 5px; width:47%; border: 1px solid #333333; }

.ind20 {padding-left: 20px;}

.pflink a, .pdlink a, .bflink a, .bdlink a {font-weight: normal;}

.pflink a:link, .pflink a:visited {color: #000000;}
.pflink a:hover  {color: #68732B;}

.pdlink a:link, .pdlink a:visited {color: #000000;}
.pdlink a:hover  {color: #990000;}

.bflink a:link, .bflink a:visited {color: #000000;}
.bflink a:hover  {color: #336699;}

.bdlink a:link, .bdlink a:visited {color: #000000;}
.bdlink a:hover  {color: #5738A7;}

/* Headings for the 4 info boxes on the home page and elsewhere for pf bf, pd and bd */

.pfheader, .pdheader, .bfheader, .bdheader {
	color: #FFFFFF;
	background-repeat: no-repeat;
	background-position: 5px center;
	text-align: left;
	margin: 0px;
	padding: 3px 3px 6px 23px;
	font-size: 1em;
	border: none;
	line-height: 1em;
}

.pfheader {background-color: #68732B; background-image: url(../images/pf-icon.gif);}
.pdheader {background-color: #990000; background-image: url(../images/pd-icon.gif);}
.bfheader {background-color: #336699; background-image: url(../images/bf-icon.gif);}
.bdheader {background-color: #5738A7; background-image: url(../images/bd-icon.gif);}

.pfheader a:link {color: #FFFFFF;}
.pfheader a:visited {color: #FFFFFF;}
.pdheader a:link {color: #FFFFFF;}
.pdheader a:visited {color: #FFFFFF;}
.bfheader a:link {color: #FFFFFF;}
.bfheader a:visited {color: #FFFFFF;}
.bdheader a:link {color: #FFFFFF;}
.bdheader a:visited {color: #FFFFFF;}

.clearleft {clear: left;}

/* Floatmenu styles links to look like the list items in the left-hand menu and is called float menu as can be placed anywhere on the page */
.floatmenu {
	padding: 0 0 0 1em;
}

/* You can use floatmenu to style lists if required but IE displays list items containing anchors 1 line apart so may not use */
.floatmenu ul {list-style-type: none; padding: 0; margin: 0 0 0 1em;}

.floatmenu a {
	display: list-item;
	font-size: 1em;
	font-weight: normal;
	color: #000000;
	margin-left: 2.5em;
	margin-top: 0.2em;
	list-style-type: square;
	list-style-image: url(../images/white-icon.gif);
}

.floatmenu-pf a:hover  {
	color: #68732B;
	list-style-image: url(../images/pf-icon-gr-2.gif);
}

.floatmenu-pd a:hover  {
	color: #990000;
	list-style-image: url(../images/pd-icon-gr-2.gif);
}

.floatmenu-bf a:hover  {
	color: #336699;
	list-style-image: url(../images/bf-icon-gr-2.gif);
}

.floatmenu-bd a:hover  {
	color: #5738A7;
	list-style-image: url(../images/bd-icon-gr-2.gif);
}


/* Note bank top reset in bf.css and bd.css */
#bank {
	font-weight: bold;
	color: #FFFFFF;
	padding: 10px;
	height: 175px;
	width: 150px;
	position: absolute;
	left: 10px;
	top: 307px;
	text-align: center;
	border: 1px none #336699;
}
* html #bank {top: 350px;}	/* Fix for IE */

/* Popup menu in footer */
#navfooter	/* This is the ID of the top level list i.e. the horizontal one */
{
	padding: 0 0 0 35%;
	margin: 0;
	text-align: center;
}

#navfooter li
{
	float: left;			/* Make list horizontal */	
	position: relative;
	list-style: none;		/* Remove bullets */
	width: 10em;			/* Define column widths */
	padding-bottom: 0.5em;	/* top + bottom = vertical space between list items */
	padding-top: 0.5em;
}

#navfooter ul 
{
	padding: 0;
	margin: 0;
	display: none;
	position: absolute; 
	bottom: 3.5em;	/* Space between bottom of vert col and horizontal col. */
	left: 0;
	background-color: #CCCCCC;
	border: 1px solid #333333;
}

/* Adjustment for IE */
* html #navfooter ul  {	bottom: 3.2em;} /* Cannot be > 3.2em to work in IE */

#navfooter li > ul {top: auto;}

#navfooter li:hover ul { display: block; }
#navfooter a {
	text-decoration: none;
	color: #333333;
	font-weight: normal;
}

#navfooter a:hover {color: #C8570D;}

