/* common styles throughout site
----------------------------------------------- */
* {margin:0;padding:0; border: 0px none;}
ul, ol, li {list-style-type:none;}
a {color: #273B68; text-decoration: none;}
a:hover {text-decoration: underline;}

body {
font: 62.5% "Lucida Grande", Arial, Helvetica, sans-serif; 
margin: 0 auto;
text-align: center;
background: #B4DFE5 url(img/bg.gif) top left repeat-x;
color: #2e2213;
}
#wrapper {
margin: 0 auto;
width: 910px;
text-align: left;
}



/* common font & image throughout site
----------------------------------------------- */
h1 {
font: bold 2em/1.2em "Lucida Grande", Arial, Helvetica, sans-serif; 
color: #000000;
letter-spacing: -0.02em;
margin: 5px 12px 10px;
 }
h2 {font: bold 1.4em/1.2em "Lucida Grande", Arial, Helvetica, sans-serif; }
h3 {font: bold 1.4em/1.2em "Lucida Grande", Arial, Helvetica, sans-serif; }
h4 {font: bold 1.3em/1.2em "Lucida Grande", Arial, Helvetica, sans-serif; }
h5 {
font: bold 1.2em/1.8em "Lucida Grande", Arial, Helvetica, sans-serif; 
height: 22px;
text-indent: 12px;
clear: both;
margin: 0 0 6px 0;
background: url(img/h5-bg.gif) top left no-repeat;
}
h6 {
font: normal 1.4em/1.3em "Lucida Grande", Arial, Helvetica, sans-serif; 
margin: 0 12px 12px;
color: #2060BF;
}
p { font: normal 1.1em/1.3em "Lucida Grande", Arial, Helvetica, sans-serif; }
input, select, textarea {
border: 1px solid #133A6C;
background: #fff;
padding: 2px 3px;
font-size: 1.2em;
margin: 0;
font: normal 1.1em/1.2em "Lucida Grande", Arial, Helvetica, sans-serif; 
}
img.right {float: right; margin: 6px 24px 12px;}
img.right-border {
float: right; 
margin: 6px 24px 12px;
padding: 1px;
border: 4px solid #D3E4FC;
}
ul#columns li.middle p span {font-size: 1.1em; font-weight: bold;}
#clearall { clear: both;}
a.arrow {
background: url('img/arrow.gif') 0 1px no-repeat ;
padding: 0 0 0 17px;
font-weight: bold;
}



/* top area with logo etc...
----------------------------------------------- */
#top {
width: 900px;
height: 100px;
margin: 0 auto;
}
#logo {
width: 350px;
float: left;
font: normal 2.5em/1.2em "Lucida Grande", Arial, Helvetica, sans-serif; 
}
#logo img {margin: 30px 0 0 0;}

#banner {
width: 468px;
height: 60px;
float: right;
background: #fff;
font: normal 1.3em/1.2em "Lucida Grande", Arial, Helvetica, sans-serif;
margin: 20px 0 0 0;
color: #000;
text-align: center; 
}


/* main navigation
----------------------------------------------- */
#nav-wrapper {
margin: 0 auto;
width: 900px;
text-align: left;
}
ul#nav {
width: 895px;
height: 36px;
float: left;
background: url('img/nav-border.gif') top left no-repeat;
padding: 0 0 0 2px;
}
ul#nav li {
display: block;
float: left;
font: normal 1.3em/2.6em "Lucida Grande", Arial, Helvetica, sans-serif; 
}
ul#nav li a {
text-decoration: none; 
color: #111;
background: url('img/nav-border.gif') top right no-repeat ;
display: block;
float: left;
height: 36px;
padding: 0 20px 0 18px;
}
ul#nav li a.active, ul#nav li a:hover {
background: url('img/nav-hover.gif') top right no-repeat ;
color: #0E0E8E;
}
ul#nav li a.active div { 
height: 36px;
float: left;
background: url('img/nav-active.gif') center bottom no-repeat ;
font-weight: bold;
}


/* sub navigation under main navigation
----------------------------------------------- */
#sub-nav {
height: 48px;
margin: 0 auto;
width: 900px;
}
#sub-nav p {
color: #fff;
font: normal 1.1em/1.2em "Lucida Grande", Arial, Helvetica, sans-serif; 
margin: 0 0 0 15px;
padding: 12px 0 0 0;
}
#sub-nav table {
color: #fff;
font: normal 1.1em/1.2em "Lucida Grande", Arial, Helvetica, sans-serif; 
float: right;
margin: 7px 0 0 0;
padding: 0;
}
#sub-nav table td {padding: 0 5px 0 0; height: 25px;}
#sub-nav table select {margin: 0 25px 0 0;}
#sub-nav table input.go {
width: 36px;
height: 21px;
padding: 0;
border: 0px none;
outline: none
}	





/* container with white background
----------------------------------------------- */
#container {
width: 910px;
background: #fff url('img/container-bg.gif') top left no-repeat ;
float: left;
margin: 0 0 25px;
}
#container-bottom {
width: 910px;
background: #fff url('img/container-bottom.gif') top left no-repeat ;
float: left;
height: 15px;
font: normal 0.1em/0.1em "Lucida Grande", Arial, Helvetica, sans-serif; 
}



/* columns
----------------------------------------------- */
ul#columns {width: 876px;margin: 5px auto 0;}
ul#columns li {float: left;}
ul#columns li.left {width: 211px;}
ul#columns li.middle {width: 475px;}
ul#columns li.right {width: 190px;}



/* left column elements
----------------------------------------------- */
#experts {
width: 200px;
background: url('img/expert-bg.jpg') top left no-repeat ;
margin: 0 0 12px;
float: left;
}
#experts p {
text-align: center;
margin: 235px 0 0 0;
}
#newsletter {
width: 200px;
background: url('img/newsletter-bg.gif') top left no-repeat ;
margin: 0 0 12px;
float: left;
}
#newsletter div {
width: 200px;
background: url('img/newsletter-btm.gif') bottom left no-repeat ;
float: left;
}
#newsletter h3 {margin: 14px 12px}
#newsletter form {margin: 0px 12px 5px 12px;}
#newsletter input {margin: 10px 10px 10px 10px; width: 75%;}
#newsletter input.join {
width: 71px;
height: 22px;
padding: 0;
border: 0px none;
outline: none;
color: #2e2213;
}	

#newsletter p {margin-left:10px;}




/* middle column elements
----------------------------------------------- */
ul#columns li.middle p {
margin: 0 12px 12px;
line-height: 1.5em;
}
/* bordered box */
#box-one {
width: 464px;
float: left;
margin: 0 0 12px;
background: url('img/box-one-bg.gif') top left repeat-y;
}
#box-one div {
width: 464px;
padding: 0 0 12px;
float: left;
background: url('img/box-one-btm.gif') bottom left no-repeat ;
}
#box-one h2 {
background: url('img/box-one-head.gif') top left no-repeat ;
height: 31px;
text-indent: 12px;
line-height: 2.2em;
}
ul#columns li.middle #box-one div p {
margin: 10px 12px 0 12px;
line-height: 1.3em;
}
#box-one ul {
display: inline;
float: left;
width: 464px;
margin: 12px 0 0 0;
}
#box-one ul li {
display: inline;
width: 230px;
float: left;
font: normal 1.2em/1.2em "Lucida Grande", Arial, Helvetica, sans-serif; 
}
#box-one ul li a {
background: url('img/arrow.gif') 0 2px no-repeat ;
padding: 0 0 7px 18px;
margin: 0 0 0 12px;
display: block;
}
/* solid colour box */
#box-two { 
width: 464px;
float: left;
margin: 0 0 12px;
background: #BED6FA url('img/box-two-top.gif') top left no-repeat ;
}
#box-two div {
width: 464px;
padding: 12px 0;
float: left;
background: url('img/box-two-btm.gif') bottom left no-repeat ;
}
ul#columns li.middle #box-two div p {line-height: 1.3em; margin-bottom: 6px;}
#box-two div ul {
margin: 0 auto;
width: 440px;
}
#box-two div ul li {
display: block;
width: 440px;
margin: 0 0 6px;
background: #fff url('img/box-two-li-top.gif') top left no-repeat ;
float: left;
}
#box-two div ul li div {
width: 440px;
padding: 0;
background: url('img/box-two-li-btm.gif') bottom left no-repeat ;
float: left;
}
#box-two div ul li div h4 {margin: 8px 12px 2px 12px;}
#box-two div ul li img {
float: right;
margin: 12px 12px 6px 12px;
}
#box-two h2 {margin: 0 12px 14px;}
/* bordered box with 2 columns header */
#box-three {
width: 464px;
float: left;
margin: 0 0 12px;
background: url('img/box-three-bg.gif') top left repeat-y;
}
#box-three div {
width: 464px;
padding: 0 0 12px;
float: left;
background: url('img/box-three-btm.gif') bottom left no-repeat ;
}
#box-three #left, #box-three #right {
width: 232px;
float: left;
padding: 0;
background: none;
} 
#box-three h2 {
height: 31px;
text-indent: 12px;
line-height: 2.2em;
}
#box-three #left p {
font: normal 1.1em/1.3em "Lucida Grande", Arial, Helvetica, sans-serif; 
margin: 8px 12px 0 12px;
}
#box-three #left p span {
font-size: 0.9em;
color: #999;
}
#box-three #left p a {font-weight: normal; font-size: 11px; line-height: 1.5em;}
#box-three #right ul {
margin: 10px 0 0 0;
float: left;
}
#box-three #right ul li {
font: bold 1.2em/1.2em "Lucida Grande", Arial, Helvetica, sans-serif; 
margin: 0 0 6px;
width: 220px;
}
#box-three #right ul#articles li a {
background: url('img/article.gif') 0 1px no-repeat ;
padding-left:16px;
float: left;
margin-left: 12px;
}
ul#box-four li {
width: 226px;
float: left;
background: url('img/box-four.gif') 0 0 no-repeat ;
margin: 0 0 12px 0;
}
ul#box-four li.alt {margin-right: 11px;}
ul#box-four li div { float: left; background: url('img/box-four-btm.gif') bottom left no-repeat ; }
ul#columns li.middle ul#box-four li div h4 {margin: 10px 12px 3px 12px;}
ul#columns li.middle ul#box-four li div p { margin: 0 12px 10px;line-height:1.3em;}
ul#box-four li div img {
float: right; 
margin: 10px;
padding: 1px;
border: 4px solid #D3E4FC;
}




/* right column elements
----------------------------------------------- */
ul#columns li.right div {
width: 190px;
background: #E1E2F3 url('img/right-div-bg.gif') bottom left no-repeat ;
margin: 0 0 12px;
padding: 0 0 12px;
float: left;
}
ul#columns li.right div h3 {
color: #fff;
line-height: 2em;
text-indent: 12px;
height: 28px;
background: #0845A1 url('img/right-div-top.gif') top left no-repeat ;
}
ul#columns li.right div p {
font: normal 1.1em/1.3em "Lucida Grande", Arial, Helvetica, sans-serif; 
margin: 8px 12px 0 12px;
}
ul#columns li.right div p span {
font-size: 0.9em;
color: #999;
}
ul#columns li.right div p a {font-weight: bold; font-size: 1.1em; line-height: 1.5em;}
ul#columns li.right div ul, #box-three #right ul {margin: 10px 0 0 0;float: left;}
ul#columns li.right div ul li {
font: normal 1.1em/1.2em "Lucida Grande", Arial, Helvetica, sans-serif; 
margin: 0 0 5px;
width: 170px;
}
ul#columns li.right div ul li a, #box-three #right ul li a {
float: left;
margin-left: 12px;
}
ul#columns li.right div ul#articles li a, #box-three #right ul#articles li a {
background: url('img/article.gif') 0 1px no-repeat ;
padding-left:16px;
}



/* form elements for middle column
----------------------------------------------- */
ul#columns li.middle label {

width: 115px;
margin-right: 12px;
margin-top:10px;
text-align: right;
line-height: 2.1em;
}
ul#columns li.middle input, ul#columns li.middle textarea {
width: 220px;
margin: 10px 30px 0px 0;
}


ul#columns li.middle input.send, ul#columns li.middle input.search {
padding: 0;
background: none;
border: 0px none;
outline: none;
color: #2e2213;
}	
ul#columns li.middle input.send {
width: 129px;
height: 22px;
margin-left: 127px;
}
ul#columns li.middle input.search {
margin: 0 0 0 5px;
width: 61px;
height: 22px;
}	
table#question {
font: normal 1.1em/1.2em "Lucida Grande", Arial, Helvetica, sans-serif; 
margin: 0 12px;
}
table#question td {padding: 0 6px 8px 0;}
ul#columns li.middle table#question input, ul#columns li.middle table#question textarea {margin: 0;}
ul#columns li.middle table#question input.boxes {
width: 1em;
margin: 0 0 0 8px; 
border: 0px none;
background: none;
}



#footerpages .list
{
padding-left: 30px;
background:url(img/arrowlist.gif) no-repeat left top;
}

#sitemap
{
}

#sitemap h4
{
font-size:16px;
margin:20px 10px 10px 10px;
}



#columns li.middle #sitemap p
{
margin:0;
padding:5px 10px 5px 10px;
}
#columns li.middle #sitemap p a
{
font-size:12px;
margin:0px;
padding:0;
}
/* footer
----------------------------------------------- */
#footer {
width: 900px;
float: left;
margin: 50px 0 0 0 ;
}
#footer p {
color: #111;
margin: 0 0 8px;
text-align: center;
font: normal 1.1em/1.3em "Lucida Grande", Arial, Helvetica, sans-serif; 
}
#footer p span { margin: 0 5px; color: #aaa;}