/*=== Setup ===*/
*{
	border: 0;
	margin: 0;
	padding: 0
}
body{
	color: #304959;
	font: .8em Arial,Verdana,Helvetica,Sans-Serif;

}
a{
	color: #da3a33;
	text-decoration: none
}
a:hover{
	color: #da3a33;
	text-decoration: underline
}
input,select,textarea{
	border: #999999 1px solid;
	font-size: 11px;
	padding: 2px
}
li{
	list-style: none
}
h2{
	font: 3.1em Georgia,"Times New Roman", Times, serif;
	line-height: 145px;
	color: <% = Session("TitleColor") %>;
	float: right;
	margin-right: 10px;
	font-weight: normal;
}
p{
	padding: 0 0 1em
}
/*=== Layout ===*/
#page{
	margin: 30px auto;
	width: 930px
}
/*=== Header ===*/
#header{
	height: 126px;
	margin-bottom: 1em;
}
#header .spacer{
	float: right;
	padding: 10px 0 0;
	width: 930px
}
/*- Logo -*/
#header h1{
	float: left;
	text-indent: -9999px;
	width: 130px;
}
#header h1 a{
	display: block;
	height: 138px
}
#header h1 a:hover{
	text-decoration: none
}
/*- Intro -*/
#header .intro{
	background: url(../images/intro-bg.gif) no-repeat;
	margin-left: 20px;
	float: left;
	width: 252px;
	height: 136px;
}
#header .intro p{
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
	line-height: 18px;
	padding-left: 15px;
	padding-right: 20px;
	padding-top: 8px;
	color: #86a2b5;
}
/*=== All Columns ===*/
#columns{
	height: 1%;
}
/*Navigation*/
#nav {
	margin-top: 1em;
	float:left;
	width:100%;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 15px;
	color: #344f61;
	line-height:normal;
}
* html #nav{ /*IE only. Add 1em spacing between menu and rest of content*/
	margin-bottom: 1em;
}
#nav ul{
	list-style-type: none;
	margin:0;
	margin-left: 1px;
}
#nav li{
	display:inline;
	margin:0;
	padding:0;
}
#nav a {
	float:left;
	background: url(../images/tab-left.gif) no-repeat left top;
	margin-right:3px;
	padding:0 0 0 9px;
	text-decoration:none;
	cursor: hand;
}
#nav a span {
	float:left;
	display:block;
	background: url(../images/tab-right.gif) no-repeat right top;
	padding:3px 14px 3px 5px;
	font-weight:normal;
	color:#344f61;
}
#nav a.green {
	float:left;
	background: url(../images/tab-left-green.gif) no-repeat left top;
	margin-right:3px;
	padding:0 0 0 9px;
	text-decoration:none;
}
#nav a span.green {
	float:left;
	display:block;
	background: url(../images/tab-right-green.gif) no-repeat right top;
	padding:3px 14px 3px 5px;
	font-weight:normal;
	color:#006c1c;
}
#nav a.blue {
 float:left;
 background: url(../images/tab-left-blue.gif) no-repeat left top;
 margin-right:3px;
 padding:0 0 0 9px;
 text-decoration:none;
}
#nav a span.blue {
 float:left;
 display:block;
 background: url(../images/tab-right-blue.gif) no-repeat right top;
 padding:3px 14px 3px 5px;
 font-weight:normal;
 color:#1c3f95;
}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
#nav a span {float:none;}
/* End IE5-Mac hack */
#nav a:hover green span {
	color: #344f61;
}
#nav green a:hover span {
	color: #006c1c;
}
#nav #current a {
	background-position:0 -125px;
}
#nav #current a span {
	background-position:100% -125px;
	color: #344f61;
}
#nav #green a {
	background-position:0 -125px;
}
#nav #green a span {
	background-position:100% -125px;
	color: #006c1c;
}
#nav a:hover {
	background-position:0% -125px;
}
#nav a:hover span {
	background-position:100% -125px;
}
/*=== content ===*/
#content{
	position: absolute;
	float: right;
	width: 930px;
}
#content strong{
	font-size: 1.18em;
	color: #da3a33
}
#content span a:hover {
	background: url(../images/btn-setup-roll.gif) no-repeat;
}
#content span .design2 {
	background: url(../images/btn-setup.gif) no-repeat;
}
#content .container{
	position: absolute;
	background: url(../images/main-panel.gif) no-repeat;
	margin-left: -5px;
	padding-left: 60px;
	padding-right: 60px;
	padding-top: 40px;
	height: 385px;
	width: 930px;
}
#content .container2{
	position: absolute;
	background: url(../images/main-panel.gif) no-repeat;
	margin-left: -5px;
	padding-left: 40px;
	padding-right: 60px;
	padding-top: 20px;
	height: 385px;
	width: 930px;
}
#content .containerbig{
	position: absolute;
	background: url(../images/main-panel.gif) no-repeat;
	margin-left: -5px;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 10px;
	height: 425px;
	width: 930px;
}
/*=== footer ===*/
#footer{
	position: relative;
	margin-top: 375px;
	float: right;
	margin-right: 10px;
	font-size: .8em;
}
#footer a{
	color: #304959;
	text-decoration: none
}
#footer a:hover{
	color: #da3a33;
	text-decoration: underline
}
/*=== Misc. ===*/
.fix{
	clear: both;
	height: 1px;
	margin: -1px 0 0;
	overflow: hidden
}

/* yahoo search form */
form#search-form {
	position: relative;
	display: block;
	width: 800px;
	height: 28px;
	padding: 0;
	margin: 0;
	border: 1px solid #3F7FBF;	
}
form#search-form input.inp-text {
	float: left;
	margin: 0;
	width: 780px;
	height: 31px;
	background: url(../images/bg-input.jpg) repeat-x;
	font-size: 1.3em;
	font-weight: normal;
	color: #3F7FBF;
	padding: 2px 0.5em;
	border: 0;
}
form#search-form input.submit {
	position: absolute;
	right: 0;
	border: 0;
	border-bottom: 1px solid #3F7FBF;
	padding: 0;
	margin: 0;
}

/* forward form */
form#forward {
	position: relative;
	display: block;
	width: 376px;
	height: 26px;
	padding: 0;
	margin: 0;
}
form#forward input.inp-text {
	float: left;
	margin: 0;
	width: 360px;
	height: 21px;
	background: url(../images/bg-input-2.jpg) repeat-x;
	font-size: 1.3em;
	font-weight: normal;
	color: #3F7FBF;
	padding: 2px 0.3em;
	border: 1px solid #3F7FBF;	
}
form#forward input.submit {
	position: absolute;
	border: 0;
	border-bottom: 1px solid #3F7FBF;
	padding: 0;
	margin: 0;
}
div.forward-area {
	float: left;
	width: 460px;
	height: 300px;
	background: url(../images/bg-counter.jpg) no-repeat;
	color: #344f61;
	padding-left: 40px;
	padding-left: 40px;
}
div.forward-area h1 {
	font: 2em Georgia,"Times New Roman", Times, serif;
	margin-bottom: 1em;
	color: #5B6B7B;
}

/* the fund counter */
div.counter {
	float: left;
	width: 460px;
	height: 300px;
	background: url(../images/bg-counter.jpg) no-repeat;
	color: #344f61;
	padding-left: 30px;
}
div.counter h1 {
	font: 2em Georgia,"Times New Roman", Times, serif;
	margin-bottom: 1em;
	color: #5B6B7B;
}
div.counter span.currency {
	float: left;
	font-size: 3em;
	margin-right: 10px;
	padding-top: 10px;	
	margin-top: 20px;
}
div.counter span.unit {
	display: block;
	float: left;
	width: 46px;
	height: 61px;
	background: #000 url(../images/bg-unit.jpg) no-repeat;
	color: #fff;
	margin-right: 5px;
	padding: 0;
	padding-top: 10px;
	font-weight: bold;
	font-size: 3em;
	text-align: center;
	margin-top: 20px;	
}
div.half-col {
	float: left;
	width: 38%;
	padding-right: 1.5em;
	margin-top: 3px;
	font-size: 0.9em;
	line-height: 1.3em;
}
div.half-colwide {
	float: left;
	width: 44%;
	padding-right: 1.5em;
	margin-top: 3px;
	font-size: 0.9em;
	line-height: 1.3em;
}
div.half-col h1 {
	font: 2em Georgia,"Times New Roman", Times, serif;
	margin-bottom: 0.5em;
	color: #344f61;		
}
div.half-colwide h1 {
	font: 2em Georgia,"Times New Roman", Times, serif;
	margin-bottom: 0.5em;
	color: #344f61;		
}

div.full-col {
	float: left;
	width: 830px;
	padding: 16px;
	padding-right: 1.5em;
	margin-top: 3px;
	font-size: 0.9em;
	line-height: 1.3em;
}
div.full-col h1 {
	font: 2em Georgia,"Times New Roman", Times, serif;
	margin-bottom: 0.5em;
	color: #344f61;		
}

#searchForm a:link { color: #ffffff; font-weight: normal; text-decoration: none; }
#searchForm a:visited { color: #ffffff; font-weight: normal; text-decoration: none; }
#searchForm a:hover { color: #ffffff; font-weight: normal; text-decoration: underline; }
#searchForm a:active { color: #ffffff; font-weight: normal; text-decoration: underline; }
#yahooLogo {
	position: relative;
	top: 2px;
	vertical-align: middle;
}

#searchBut {
	font-family: Georgia, "Times New Roman", Times, serif;
	border: 0px solid #1b74ba;
	background-color: #1b74ba;
	color: white;
	cursor: pointer;
	font-size: 1em;
	font-style: italic;
	font-weight: bold;
	height: 22px;
	padding: 0 8px 0 8px;
	margin-left: -1px;
	vertical-align: middle;
}
#entryBox {
	border: 1px solid #1b74ba;
	color: #000000;
	font-size: 1em;
	height: 14px;
	width: 195px;
	margin: 0px -1px 0px 0px;
	padding: 3px;
	background-repeat: repeat-x;
	background-image: url(http://www.myhpf.co.uk/css/imgs/searchfield.jpg);
	vertical-align: middle;
}
.searchTermRow { position: relative; float: left; width: 600px; color: #202040; padding-bottom: 10px; font-weight: bold; }
.searchTermCat { position: relative; float: left; width: 100%; text-align: left; align: left; margin-right: 6px; }
.searchTerms { position: relative; float: left; align: left; text-align: left; width: 600px; }

#hpSearch a:link { color: #ffffff; font-weight: normal; text-decoration: none; }
#hpSearch a:visited { color: #ffffff; font-weight: normal; text-decoration: none; }
#hpSearch a:hover { color: #ffffff; font-weight: normal; text-decoration: underline; }
#hpSearch a:active { color: #ffffff; font-weight: normal; text-decoration: underline; }
#hpYahooLogo {
	position: relative;
	top: 5px;
	margin-right: 10px;
	vertical-align: middle;
}
#hpSearchBut {
	font-family: Georgia, "Times New Roman", Times, serif;
	border: 0px solid #1b74ba;
	background-color: #1b74ba;
	color: white;
	cursor: pointer;
	font-size: 1.4em;
	font-style: italic;
	font-weight: bold;
	height: 33px;
	padding: 0 15px 0 15px;
	margin-left: -18px;
	vertical-align: middle;
	background: url("../images/search-submit.jpg") no-repeat top;
}
#hpEntryBox {
	border: 1px solid #1b74ba;
	color: #000000;
	font-size: 1.3em;
	height: 25px;
	width: 230px;
	margin: 0px -1px 0px 0px;
	padding: 3px;
	background-repeat: repeat-x;
	background-image: url(http://www.myhpf.co.uk/css/imgs/searchfield-larger.jpg);
	vertical-align: middle;
}

#hpSearch .largeYahoo { float: left; }
#hpSearch .largeSearchBox { color: #000000; font-size: 11px; font-family: Georgia, "Times New Roman", Times, serif; background-repeat: repeat-x; background-image: url(http://www.myhpf.co.uk/css/imgs/searchfield-larger.jpg); width: 230px; height: 23px; float: left; margin: 0 0 0 20px; padding: 3px; border: solid 1px #1b74ba; }
#hpSearch .largeSearchBut { color: #ffffff; font-size: 11px; font-family: Georgia, "Times New Roman", Times, serif; font-style: italic; font-weight: bold; background-color: #1b74ba; width: 75px; height: 31px; float: left; margin: 0; padding: 3px; border: solid 1px #1b74ba; cursor: pointer; position: relative; left:-1px; }
#sbc { 	font: 1em Arial,Verdana,Helvetica,Sans-Serif; position: relative; color: #e43d21; font-weight: normal; text-decoration: none; }
#sbc a:link { color: #3674bd; font-weight: normal; text-decoration: underline; }
#sbc a:visited { color: #3674bd; font-weight: normal; text-decoration: underline; }
#sbc a:hover { color: #3674bd; font-weight: normal; text-decoration: underline; }
#sbc a:active { color: #3674bd; font-weight: normal; text-decoration: underline; }

#topbar{
 background-image: url(http://www.charityhomepages.com/images/clear.gif);
 background-repeat: repeat-x;
 height: 6px;
 background-color: <% = Session("StripColor") %>
}