/* Main stylesheet for OPM */


/* Tag rules that define generic styles */

body {
	font-family: Arial, Verdana;
	font-size: 80%;
	color: #484848;
	line-height: 1.5em;
	text-align: center;
}

img {
border: 0; }

a {
color: #146372;
}

a:hover {
opacity: 0.8;
text-decoration: underline; }

h2 {
font-size: 1.5em; }

/* Site wrappers that build the structure */

#container {
width: 981px;
margin: 0 auto 0 auto;
text-align: left; }

.content_wrapper {
background: url(../images/container_background.gif) repeat-y;
height: 100%; }

.content_wrapper.no_right_column {
background: url(../images/container_background_no_right.gif) repeat-y; }

.homepage_wrapper
{
  background: url(../images/homepage_container_wrapper.gif) repeat-y;
  height: 100%; 
}

/* this makes sure the wrapper wraps any floating elements */
.content_wrapper:after, .homepage_wrapper:after {
clear: both;
display: block;
content: ".";
visibility: hidden;
height: 1px; }


/* header classes */
#head {
position: relative;
height: 55px;
background: #ffffff; }

/* I commented this one out and replaced with hidden text class below 
#head h1, #head h2 {
display: none; }
*/

#head .hiddentext {
display: none; }

#head p {
float: right; }

#head .logo {
width: 99px;
background: url(../images/head_logo.jpg) no-repeat;
left: 0px; }

#head .right {
width: 412px;
background: url(../images/head_right.jpg) no-repeat;
left: 115px; }

#head .logo, #head .right, #head .message {
height: 49px;
position: absolute;
top: 0px; }

#head .message {
top: 15px;
right: 0px;
font-size: 1em; }


/* header navigation */

#navigation {
background: url(../images/nav_background.jpg) repeat-x;
height: 38px;
position: relative; }

#navigation ul {
margin: 0 0 0 1px;
padding: 0;
list-style: none; }

#navigation li {
width: 124px;
float: left;
text-align: center;
color: #222222;
line-height: 26px;
background: url(../images/nav_seperator.jpg) no-repeat top right; }

#navigation li a {
color: #000000;
text-decoration: none;
display: block; }

#navigation li a:hover {
text-decoration: underline;
color: #ffffff; }

#navigation .search {
position: absolute;
top: 4px;
right: 0px;
width: 170px; }

#navigation .search .button {
width: 18px;
height: 20px;
background: url(../images/search_button.gif) no-repeat;
position: absolute;
top: 0px;
left: 0px;
color: transparent;
text-indent: -9999px;
cursor: pointer; 
font-size: 0px;}

#navigation .search .field {
	position: absolute;
	top: 0px;
	left: 15px;
	padding: 1px 3px 0 5px;
	width: 136px;
	background: url(../images/search_end_right.gif) top right no-repeat;
	background-image: url(../images/search_end_right.gif);
}

#navigation .search .button, #navigation .search .field {
border: 0px;
height: 23px; }


/* homepage and main content area classes */

#main, #homepage {
float: left;
width: 793px;
margin: 0 11px 0 11px; }

#main .banner,   #homepage .rotating_images {
width: 793px;
height: 272px;
padding-bottom: 7px;
border-bottom: 1px solid #959595; 
position: relative;}

#main .banner p, #main .banner h2,     #homepage .banner p, #homepage .banner h2 {
display: none; }

#main .column,   #homepage .column {
width: 185px;
padding: 0 5px 0 5px;
float: left;
margin-top: 7px;
border-right: 1px solid #959595;
text-align: center; }

#main .column.last,   #homepage .column.last {
border: 0px; }

#main h2, #main h3, #main ul, #main p,   #homepage h2, #homepage h3, #homepage ul, #homepage p {
text-align: left; }

#main .browncontrast {
	color: #603}

#main h3,   #homepage h3 {
font-size: 1.2em;
color: #1A9B97;
font-family: Arial, Verdana;
margin: 0 0 10px 0; }

#main ul,   #homepage ul {
margin: 0;
list-style-position: inside;
}

#main ul li,     #homepage ul li {
line-height: 1.7em; }

#homepage a {
color: #1A9B97;
text-decoration: none;
font-weight: bold;
}

#homepage a:hover {
opacity: 0.8;
text-decoration: underline; }

#main {
width: 784px; }

#main img {
padding: 7px 10px 10px 3px;
border: 0px; }

#main img.cogs {
padding-left: 26px;
margin-bottom: 10px; }

#main img.breakthrough {
padding-left: 6px; }

#main img.childrens_services {
padding-left: 28px; }

#main img.annual_review {
padding-left: 5px; }

#main a:hover {
opacity: 0.8;
background-color: #ffffff;
text-decoration: underline;}

#main ul li a:hover,     #homepage ul li a:hover{
	background-color: #ffffff;
text-decoration: underline;}

#main h3.staff_category {
color: #333333;
border-bottom: 1px solid #666666;
padding: 20px 0 0 0;
margin: 0 0 20px 0;
clear: both; }

#main .main_content {
padding: 0 25px 0 25px; }

#main .main_content h2, #main .main_content h3 {
color: #008C8D; }


#homepage .columns h3 {
	font-size: 1.4em;
	font-weight: normal;
}
.clearone {
clear: both;
}

/* pages with left navigation classes */
#main.with_left_navigation {
width: 605px;
margin-right: 0px; }

#main.with_left_navigation img {
padding-top: 0px; }

#main.with_left_navigation a {
color: #0d868e;
text-decoration: none; }

#main.with_left_navigation a:hover {
text-decoration: underline;
opacity: 0.8; }

#main.with_left_navigation ul {
margin-left: 0px;
list-style-position: outside; }

#main.with_left_navigation ul li {
margin-bottom: 7px; }

#main.with_left_navigation ul.pages {
list-style: none;
list-style-position: inside; }

#main.with_left_navigation .page_banner {
margin-left: 3px; }


/* Left hand column structure and navigation */

#left {
width: 175px;
float: left;
padding-bottom: 150px; }

#left h3 {
padding: 7px 0 5px 6px;
margin: 0;
background: #008c8d; 
color: #ffffff;
font-weight: normal;
background: url(../images/left_nav_titles.jpg) repeat-x;}

#left h3 a{
  color: #ffffff;
  text-decoration: none;  
}

#left h3 a:hover
{
  color: #dddddd;
  text-decoration: underline; 
}

#left ul {
list-style: none;
list-style-position: outside;
margin: 0 0 15px 0;
padding: 0; }

#left ul li {
background: url(../images/page_nav_background.jpg) repeat-x;
line-height: 1.4em;
padding: 12px 0 12px 5px; }

#left ul li a {
text-decoration: none;
color: #000000;
display: block; }

#left ul li a:hover {
opacity: 0.5;
text-decoration: underline; }

#left ul li ul {
margin-left: -5px;
margin-top: 7px; }

#left ul li ul li {
background: #f1f3f2;
padding-left: 15px;
border: 0px;
padding: 10px;
line-height: 1em; }



/* right hand column boxes, adverts and lists */
#right {
width: 176px;
float: right;
height: 100%;
border-left: 1px solid #959595;
padding-left: 6px;
text-align: left; 
}

#right ul {
list-style: none;
margin: 0 0 0 0;
padding: 0; }

#right a {
font-weight: bold;
text-decoration: none;
color: #0d868e;
padding-bottom: 10px; }

#right a:hover {
opacity: 0.8; }

#right .ad {
	width: 175px;
	font-size: 1.6em;
	margin: 8px 0 8px 0;
	vertical-align: middle;
}
#right .ad_small {
	width: 175px;
	font-size: 1.2em;
	margin: 8px 0 8px 0;
	vertical-align: middle;
	
}
#right .ad a
{
opacity: 0.6;
line-height: 1em;
font-size: 1.1em;
margin: 0px;
padding: 10px;
font-weight: bold;
color: #ffffff;
display: block;
height: 100%;
}
#right .ad a:hover {
opacity: 1;
}

/* rightcol classes allow you to add boxes in the right column (kept separate from other right hand column styles because wanted to stop them getting confused with the advert boxes on the right (see above and below). the reason for having both classes and ids was so that we could add more than one on a page. However, this does not seem to work: if you use <div class="rightcol"> the formatting is not pretty and some of the text goes white  */

#rightcol {
  border: 1px solid #cccccc;
  width: 173px; 
margin-bottom: 9px;
}
.rightcol {
  border: 1px solid #cccccc;
  width: 173px; 
margin-bottom: 9px;
}

#rightcol ul ul {
	list-style-type:disc;
  	margin-left: 10px;
    padding-left: 20px;
}
#rightcol p, #rightcol ul {
font-size: 1em;
  line-height: 1.4em;
  color:#000066;
  }

#rightcol li  {

  background-image: url(../images/bullet_pink.gif); 
  background-repeat: no-repeat;
  background-position: 5px left;
    margin-left: 10px;
  padding-left: 20px;
}

.rightcol ul ul {
	list-style-type:disc;
  	margin-left: 10px;
    padding-left: 20px;
}
.rightcol p, .rightcol ul {
font-size: 1em;
  line-height: 1.4em;
  color:#000066;
  }

.rightcol li  {

  background-image: url(../images/bullet_pink.gif); 
  background-repeat: no-repeat;
  background-position: 5px left;
    margin-left: 10px;
  padding-left: 20px;
}

#rightcol .text {
color: #000066; 
font-weight: bold;
margin-bottom: 2px;
font-size: 1em;
padding: 0 9px 0 9px;
line-height: 1.1em; }

#rightcol .text a, a:link, a:visited {
font-size: 1em;
color: #146372; 
text-decoration:underline;
}


/* advert boxes used on the homepage */
#right .subscribe {
background: url(../images/ad_subscribe.jpg) no-repeat;
color: #95998A; }

#right .forum {
background: url(../images/ad_forum.jpg) no-repeat;
color: #40AF86; }

#right .blog {
background: url(../images/ad_blog.jpg) no-repeat;
color: #146372; }

#right .public_services {
background: url(../images/ad_public_services.jpg) no-repeat;
height: 245px;
color: #3eA5F4; }

#right .subscribe, #right .forum, #right .blog {
height: 131px;
margin-bottom: 4px; }

#right img {
margin-bottom: 15px; }

#right .resource_library, #right .case_studies {
border: 1px solid #cccccc;
text-align: center;
background: url(../images/icon_download_big.gif) no-repeat 28px 30px;
width: 173px; 
margin-bottom: 9px;}

#right .case_studies 
{
background: none;
margin-top: 15px;
}

#right .resource_library a, #right .case_studies a {
color: #666666; }

#right .resource_library ul, #right .case_studies ul {
text-align: left; }

#right .resource_library ul li, #right .case_studies ul li {
margin: 0;
padding: 0;
line-height: 1.4em;
font-size: 1.1em; }

#right .resource_library ul li a, #right .case_studies ul li a {
background: url(../images/page_icon_resource.gif) no-repeat;
padding-left: 25px;
padding-top: 10px;
min-height: 30px;
margin: 7px 0 7px 5px;
display: block;
color: #008C8D; }

#right .resource_library h3, #right .case_studies h3 {
padding: 0 0 110px 0;
margin: 7px 0 0 0;
font-size: 1.4em; 
color: #666666;}

#right .case_studies h3
{
padding: 0 0 5px 0;
}

#right .resource_library p, #right .case_studies p {
font-size: 1.2em; }

#right .quote {
background: #0095DA;
color: #ffffff;
padding-bottom: 20px;
margin: 0 0 8px 0;
width: 175px; }

#right .another_quote
{
display: block;
text-align: right;
color: #ffffff;
padding-top: 7px;
padding-right: 10px;
}
#right p {
	font-size: 1.2em;
	font-weight: bold;
	padding: 9px;
	opacity: 0.6;
	line-height: 1.1em;
	margin: 0;
}

#right p a {
	font-size: 1em;
	color: #ffffff;
}

#right .organisation {
font-size: 1.1em;
padding: 0 9px 0 9px;
line-height: 1em; }

/* I commented this out because we don't need a div with our annual review as the background
#right .annual_review {
background: url(../images/opm_images/annual_review.jpg) no-repeat;
width: 175px;
height: 238px;
display: block;
text-indent: -9999px;
margin-top: 10px; }
*/

/* I made this style so we can  paste different images */
#right .images {
width: 175px;
margin-top: 10px;
margin-bottom: 10px; }

ul.icons a {
color: #229A98;
text-decoration: none; }


/* forms used on search and resource areas */
form ol {
list-style: none; }

form ol {
	line-height: 3em;
}

form ol li label{
	display: inline-block;
	width: 200px;
	text-align: right;
	margin-right: 10px;
}

#category_submit, #resource_submit, #resource_type_submit, #user_session_submit, #user_submit {
	margin-left: 220px;
}

li.text_area label{
	display: block;
}

li.text_area textarea{
	margin-left: 214px;
	width: 580px;
	height: 100px;
}

fieldset {
	padding: 5px;
}

fieldset#categories span {
	display: inline-block;
	width: 300px;
	margin-left: 5px;
}

.resources #search_resources {
padding-top: 30px;
padding-bottom: 30px; }


/* filter / refinement form classes */
.resources #filter_resources {
padding-top: 30px;
margin-bottom: 50px;
border-top: 1px dashed #cccccc; 
display: block;
width: 100%;}

.resources #filter_resources h3 {
font-size: 1.5em;
font-weight: normal; }

.resources #filter_resources .element {
margin: 5px 0 5px 0; 
width: 480px;}

.resources #filter_resources .clear {
clear: both;
padding-top: 20px; }

.resources .button
{
  margin-top: 2px;
  margin-left: 5px;
  position: relative;
  top: 1px;
  font-size: 0px;
  color: #29A0F4;
  text-indent: -9999px;
}

/* blue "go" button */
.button {
border: 0;
background: url(../images/button_go.gif) no-repeat;
height: 36px;
width: 31px;
cursor: pointer;
color: #29A0F4;
}

/* resources results classes */
.resources_results .button
{
  text-indent: -999px;
  font-size: 0px;
}
.column {
float: left; }

.resources_results {
background: url(../images/resources_results_background.gif) repeat-y;
height: 100%;
min-height: 100%; }

.resources_results .column.main {
width: 717px;
margin-right: 15px;
position: relative; }

.resources_results .column.main h2 {
border-bottom: 1px solid #999999;
font-size: 1.5em;
padding: 6px 0 10px 25px;
margin: 0;
color: #666666; }

.resources_results .column.main .count {
position: absolute;
right: 20px;
top: 10px;
font-weight: bold;
color: #666666; }


/* resources results refinement / filtering form classes */
.resources_results .column.refine {
width: 247px; }

.resources_results .column.refine .button {
margin-top: 30px; }

.resources_results .column.refine .keywords {
padding: 10px 0 10px 0; }

.resources_results .column.refine .keywords .field {
position: relative;
width: 250px;
padding: 5px 0 5px 0; }

.resources_results .column.refine .keywords .field .element {
padding: 0 0 0 80px; }

.resources_results .column.refine .keywords .field label {
width: 70px;
position: absolute;
left: 0;
top: 6px;
line-height: 20px; 
text-align: right;}

.resources_results .column.refine .categories {
padding: 10px 0 10px 0; }

.column.refine .categories .field 
{
  margin-bottom: 6px;
}
.column.refine .categories .field label
{
  line-height: 1.5em;
}

/* classes to create counter red circles */
.resources_results .column.refine .categories .singles, .resources_results .column.refine .categories .tens, .resources_results .column.refine .categories .hundreds {
float: left;
background: red;
color: white;
width: 16px;
text-align: center;
font-size: 0.9em;
line-height: 15px;
height: 15px; }

.resources_results .column.refine .categories .singles {
background: url(../images/counter_singles.gif) no-repeat;
width: 16px; }

.resources_results .column.refine .categories .tens {
background: url(../images/counter_tens.gif) no-repeat;
width: 26px; }

.resources_results .column.refine .categories .hundreds {
background: url(../images/counter_hundreds.gif) no-repeat;
width: 38px; }

.resources_results .column.refine .categories .field {
position: relative;
width: 250px;
padding: 10px 0 15px 0; 
}

/* refinement category listing */
.resources_results .column.refine .categories .field label {
position: relative;
text-align: right;
width: 175px;
float: left;
margin-right: 5px; }

.resources_results .column.refine .categories .field input {
padding: 0;
width: 20px;
float: right; }

.resources_results .column.refine h4 {
background: url(../images/resources_title_background.jpg) repeat-y;
height: 29px;
width: 239px;
text-align: left;
line-height: 29px;
padding-left: 10px;
margin: 0; }

/* make sure the resources result div wraps the contents*/
.resources_results:after {
clear: both;
display: block;
content: ".";
visibility: hidden;
height: 1px; }


/* classes to style each resource result */
.resources 
{
  padding-top: 30px;
}

.resources .inactive {
background-color: #FFEA9C;
}
.resources .resource, * .resource {
clear: both;
border-bottom: 1px dashed #cccccc;
padding: 0 0 20px 0;
margin-bottom: 20px;
padding-left: 100px;
position: relative; 
min-height: 110px;}

.resources .resource img.large,   * .resource img.large {
float: right;
border: 1px solid #999999; }

.resources .resource .image,   * .resource .image {
position: absolute;
top: 8px;
left: 10px; 
padding-bottom: 20px;}

/* pdf frame with image, can be used to add effect to PDF thumbs */
.resources .resource .image .frame,     * .resource .image .frame {
width: 71px;
border: 1px solid #999999;
height: 105px;
background: url(../images/pdf_cover.png) no-repeat;
z-index: 30;
position: absolute; }

.resources .resource .image img,     * .resource .image img {
position: absolute;
top: 2px;
left: 1px;
z-index: 20;
width: 71px;
height: 105px; }

.resources .resource .info 
{
  border: 0px;
  margin: 0 0 0 -3px;
  padding: 0px;
}
.resources .resource .info td,   * .resource .info td
{
  font-size: 0.9em;
  line-height: 1.5em;
    font-weight: bold;
  padding-right: 27px;
}

.resources .resource h3, .resources .resource h3 a,   * .resource h3, * .resource h3 a {
color: #007CD2;
text-decoration: none;
padding: 4px 0 0 0;
margin: 5px 0 3px 0;
font-size: 1.2em;
line-height: 1.2em; }

.resources .resource h3 a:hover,   * .resource h3 a:hover {
text-decoration: underline; }

.resources .resource .download,   * .resource .download {
background: url(../images/icon_download.gif) no-repeat;
height: 25px;
padding-left: 25px;
display: block;
margin-top: 10px;
text-decoration: none;
color: #333333;
font-weight: bold;
padding-top: 4px; }

/* underlines links when hovered over in resources */
.resources .resource .download:hover,   * .resource .download:hover {
text-decoration: underline; }


/* admin classes */
#admin_navigation_padding {
height: 100px; }

#admin_navigation {
z-index: 50;
height: 93px;
background-color: #000000;
background: url(../images/transpBlack90.png);
position: fixed;
left: 0;
bottom: 0;
width: 100%; }

#admin_navigation #admin_container {
width: 981px;
margin: 20px auto 0 auto;
text-align: left;
color: white; }

#admin_navigation #admin_container a {
color: white;
text-decoration: none; }

#admin_navigation #admin_container a:hover {
text-decoration: underline; }

#admin_navigation #admin_container ol {
list-style: none;
float: left;
width: 200px;
padding: 0;
margin: 0 0 7px 0; }

#admin_navigation #admin_container p {
clear: both;
font-size: .8em;
text-align: right; }


/* People page classes to style each person*/
.people {
clear: both; 
}
.people a .summary {
color: #333333; }

.person {
float: left;
width: 232px;
margin: 0 12px 26px 0;
padding: 0; }
.person .name, .person .job {
color: #0098CA;
font-weight: bold; }

.person .image {
float: left;
width: 67px;
height: 90px;
padding: 0 5px 0 0;
position: relative; }

.person .image img {
margin: 0;
padding: 0;
position: absolute;
top: -3px;
left: -3px; }
.person a, .person a:hover {
text-decoration: none; }

.person .summary {
margin-top: 3px;
padding-left: 71px; }


/* general site error styling */
.errors {
color: #550000;
border: 1px solid #550000;
padding: 10px; }

.errors h2 {
font-size: 12px; }


/* footer styling */
.footer {
font-size: 0.8em;
color: #333333;
clear: both;
border-top: 1px solid #999999;
margin-top: 15px;
padding-top: 15px; 
margin-bottom: 50px;}

.pagination {
text-align: center; }


/* Search refinement form classes */
.refine_search h4 {
padding: 5px 0 0 0;
margin: 0 0 10px 0;
font-size: 1.2em; }

.refine_search .checkboxes {
margin: 10px 0 26px 53px; }

.refine_search .checkboxes input {
top: 3px;
position: relative; }

.refine_search .checkboxes label {
padding: 0 0 0 20px;
height: 20px;
display: inline-block; }


/*
  Icons for search form, currently not in use. 
  
.refine_search .checkboxes .checkbox_resource label {
background: url(../images/search_form_icon_resources.gif) no-repeat; }

.refine_search .checkboxes .checkbox_page label {
background: url(../images/search_form_icon_page.gif) no-repeat; }

.refine_search .checkboxes .checkbox_member label {
background: url(../images/search_form_icon_members.gif) no-repeat; }*/

.refine_search .date {
margin: 13px 0 6px 10px;
}

.refine_search .date input {
width: 80px; }

.refine_search .date label {
width: 60px;
padding-right: 6px;
display: inline-block;
text-align: right; }

.refine_search .black {
margin: 12px 0 0 63px;
background: url(../images/button_black.gif) no-repeat;
width: 120px;
height: 26px;
font-weight: bold;
text-transform: uppercase;
color: #ffffff;
font-size: 1.2em;
text-indent: 0px; }


/* Search results classes */
.search_results {
position: relative; }

.search_results h2 {
margin: 0; }

.search_results .total {
margin: 3px 0 0 23px; }

.search_results .results {
margin: 20px 0 0 0; }

.search_results .results .result {
clear: both;
position: relative;
margin-bottom: 18px;
padding-bottom: 18px;
padding-left: 27px;
border-bottom: 1px dashed #cccccc; }

.search_results .results .result h4 {
font-size: 1.em;
font-weight: normal;
margin: 0 0 4px 0; }

.search_results .results .result h4 a {
text-decoration: none;
font-weight: bold;
color: #003399; 
font-size: 1.3em;
margin: 0 0 4px 0; }

.search_results .results .result h4 a:hover {
text-decoration: underline; }

.search_results .results .result .summary {
width: 650px; }

.relevance {
	margin-top:5px;
	background-color: #aaa;
	height: 7px;
	overflow:hidden;
}
.relevance span {
	color:#aaa;
}
	


/* Icons for search results file types */

.search_results .results .result ul.icons {
position: absolute;
left: -39px;
top: 0;
list-style: none;
margin: 0; }

.search_results .results .result ul.icons li {
font-size: 0px;
color: #ffffff;
text-indent: -9999px;
height: 28px;
width: 21px;
border: 0px; }

.search_results .results .result ul.icons .pdf {
background: url(../images/search_results_icon_acrobat.jpg) no-repeat top center; }

.search_results .results .result ul.icons .ppt {
background: url(../images/search_results_icon_powerpoint.jpg) no-repeat top center; }

.search_results .results .result ul.icons .doc {
background: url(../images/search_results_icon_word.jpg) no-repeat top center; }

.search_results .results .result ul.icons .xls {
background: url(../images/search_results_icon_excel.jpg) no-repeat top center; }

.search_results .results .result ul.icons .page {
background: url(../images/search_results_icon_webpage.jpg) no-repeat top center; }

.search_results .results .result ul.icons .resource {
background: url(../images/search_results_resources.jpg) no-repeat top center; }

.search_results .results .result ul.icons .member {
background: url(../images/search_results_members.jpg) no-repeat top center; }

.search_results .results .result ul.icons li {
padding: 0;
margin: 0; }

/* List styling on all main content areas and homepage */
#main ul, #homepage ul {
list-style: none;
list-style-position: outside;
padding: 0 0 0 20px;
margin: 0; }

#main ul li,   #homepage ul li {
background: url(../images/bullet_green.gif) no-repeat 0 6px;
padding: 3px 0 3px 18px;
margin: 0;
line-height: 1.3em; }

#main ul li.black,     #homepage ul li.black {
background-image: url(../images/bullet_black.gif); }

#main ul li.dark_grey,     #homepage ul li.dark_grey {
background-image: url(../images/bullet_dark_grey.gif); }

#main ul li.grey,     #homepage ul li.grey {
background-image: url(../images/bullet_grey.gif); }

#main ul li.green,     #homepage ul li.green {
background-image: url(../images/bullet_green.gif); }

#main ul li.aqua,     #homepage ul li.aqua {
background-image: url(../images/bullet_aqua.gif); }

#main ul li.cyan,     #homepage ul li.cyan {
background-image: url(../images/bullet_cyan.gif); }

#main ul li.blue,     #homepage ul li.blue {
background-image: url(../images/bullet_blue.gif); }

#main ul li.purple,     #homepage ul li.purple {
background-image: url(../images/bullet_purple.gif); }

#main ul li.pink,     #homepage ul li.pink {
background-image: url(../images/bullet_pink.gif); }

#main ul li.red,     #homepage ul li.red {
background-image: url(../images/bullet_red.gif); }

#main ul li.orange,     #homepage ul li.orange {
background-image: url(../images/bullet_orange.gif); }

#main ul li.yellow,     #homepage ul li.yellow {
background-image: url(../images/bullet_yellow.gif); }

#main ul li a,     #homepage ul li a {
font-weight: bold; }

#homepage {
margin: 0; }

#homepage ul.icons {
padding: 0; }


/* latest news on homepage */
.latest_news
{
  padding: 4px 15px 0 15px;
  border-right: 1px solid #999999;
  border-left: 1px solid #999999;
}
.latest_news h3
{
padding-bottom: 3px;
}
.latest_news h4, .latest_news p
{
	margin: 0px;
	padding: 0px;
}

.latest_news p
{
margin-bottom: 10px;
}
.larger li a
{
font-size: 1.3em;
color: #003333;
}

#homepage ul.icons li {
padding-top: 5px;
padding-bottom: 5px;
background-position: 0 9px; }


/* standardised colours that can be used on any element */
.black {
background: #231F20; }

.dark_grey {
background: #636466; }

.grey {
background: #939598; }

.green {
background: #7bA28C; }

.aqua {
background: #008C8D; }

.cyan {
background: #0095DA; }

.blue {
background: #00549A; }

.purple {
background: #832B7C; }

.pink {
background: #D80F81; }

.red {
background: #DA2128; }

.orange {
background: #F26522; }

.yellow {
background: #DDB109; }

/* dialog box that appears on people page */
#dialog_box {
background: url(../images/status_dialog_box.gif) no-repeat;
width: 398px;
height: 140px;
opacity: 0.6;
filter: alpha(opacity=60);
-moz-opacity: 0.6;
position: absolute;
top: 0;
left: 0;
display: none;
z-index: 20000; }

#dialog_box .message {
font-size: 2em;
color: white;
width: 300px;
height: 140px;
line-height: 140px;
float: left;
text-shadow: #666666 0 1px;
text-align: center; }
#dialog_box .loading {
background: url(../images/loading_icon.gif) no-repeat;
height: 48px;
width: 48px;
float: right;
margin: 45px 40px 0 0; }



/* classes for the inline login form used on search and resources areas */
#inline_login {
background: url(../images/inline_login.png) no-repeat;
width: 570px;
height: 121px;
opacity: 0;
filter: alpha(opacity=0);
-moz-opacity: 0;
position: absolute;
top: 0;
left: 0;
display: none;
z-index: 20000;
color: #ffffff;
text-align: left;
padding-left: 55px; }

#inline_login h2 {
margin: 19px 0 7px 0;
font-size: 1.5em; }

#inline_login p {
margin: 0 0 7px 0;
padding: 0;
font-size: 1.2em; }

#inline_login a {
color: #63B5D9; }

#inline_login .input_text {
width: 195px;
height: 21px;
font-size: 1.1em;
font-weight: bold;
border: 2px solid #999999;
padding: 5px 0 0 3px;
margin-right: 3px; }

#inline_login .button {
background: url(../images/button_black_small.gif) no-repeat;
height: 26px;
width: 80px;
font-size: 1.2em;
color: #ffffff;
text-indent: 0px;
text-transform: uppercase;
margin-top: 2px; }

#inline_login #inline_close
{
width: 14px;
height: 14px;
background: url(../images/inline_close.gif) no-repeat;
cursor: pointer;
position: absolute;
top: 18px;
left: 540px;
text-indent: -9999px;

}


/* Forces the background to appear dimmed when dialog box appears */
#background_overlay {
width: 100%;
height: 100%;
background: #000000;
opacity: 0;
filter: alpha(opacity=0);
-moz-opacity: 0;
position: absolute;
top: 0;
left: 0;
z-index: 20001;
display: none; }

/* popup dialog box used for people page */
#people_popup {
	width: 557px;
	height: 370px;
	position: absolute;
	top: -2000px;
	left: -2000px;
	opacity: 0;
	filter: alpha(opacity=0);
	-moz-opacity: 0;
	z-index: 20002;
	background-image: url(../images/people_popup.gif);
	background-repeat: no-repeat;
}

#people_popup #people_data {
width: 529px;
margin: 25px 5px 6px 20px;
padding-right: 15px;
text-align: left;
line-height: 1.5em;
color: #666666; }

#people_popup #people_data img {
position: absolute;
top: 75px;
left: 17px; }

#people_popup #people_data .details {
overflow: auto;
height: 220px;
margin: 17px 0 0 0;
padding: 0; }

#people_popup #people_data .details p {
padding-left: 135px;
padding-right: 30px;
padding-top: 0;
margin-top: 0; }

#people_popup #people_data .details a {
color: #006699;
font-weight: bold; }

#people_popup h1 {
margin: 0;
padding: 0;
font-size: 1.4em;
color: #666666;
border-bottom: 1px solid #999999;
margin-bottom: 3px; }

#people_popup h2 {
margin: 0;
padding: 0;
font-size: 1.1em;
color: #0098CA;
margin-top: 3px; }

a.close {
background: url(../images/icon_close.gif) no-repeat top right;
height: 20px;
width: 130px;
padding-right: 24px;
position: absolute;
bottom: 20px;
right: 20px;
text-align: right;
text-decoration: none;
color: #666666; }


/* banners used on each services index page */
.page_head {
	width: 605px;
	height: 238px;
	font-family: Georgia, Times;
	color: #ffffff;
	background: #00A77F;
	margin: 0 0 30px 0;
	position: relative;
}



.page_head.one {
background: url(../images/services_banners/1.jpg) no-repeat; }

.page_head.two {
background: url(../images/services_banners/2.jpg) no-repeat; }

.page_head.three {
background: url(../images/services_banners/3.jpg) no-repeat; }

.page_head.four {
background: url(../images/services_banners/4.jpg) no-repeat; }

.page_head.five {
background: url(../images/services_banners/5.jpg) no-repeat; }

.page_head.six {
background: url(../images/services_banners/6.jpg) no-repeat; }

.page_head.seven {
background: url(../images/services_banners/7.jpg) no-repeat; }

.page_head.nihr {
background: url(../images/services_banners/NIHR_banner.jpg) no-repeat; 
height: 200px;}

.page_head .content
{
	position: absolute;
	/* I added the width  below. check this works OK */
	width: 427px;
	
}

.page_head h1 {
	font-size: 2.7em;
	line-height: 1em;
	margin: 0;
	font-weight: normal;
}

.page_head p {
	font-size: 1.4em;
	line-height: 1.4em;
	width: 460px;
}

.page_head.one .content
{
	top: 30px;
	left: 64px;
}
.page_head.two .content
{
  top: 40px;
  left: 56px;
}
.page_head.three .content
{
  top: 40px;
  left: 15px;
}
.page_head.three .content p
{
  width: 380px;
}
.page_head.five .content
{
  top: 15px;
  left: 57px;
}
.page_head.five .content p
{
  width: 390px;
}
.page_head.six .content
{
  top: 20px;
  left: 44px;
}

.page_head.seven .content
{
  top: 30px;
  left: 124px;
}

/* my extra pages and styles*/
/*this one does not seem to work, although it appears to work in DMW */
.fltright {
float: right;
margin: 5px 0 5px 5px;
}
.fltleft {
float: left;
margin: 5px 5px 5px 0px;
}
/* I don't think page head eight is needed, but left it for now just in case*/
.page_head.eight {
background: url(../images/services_banners/1.jpg) no-repeat; }
.page_head.eight .content
{
  top: 20px;
  left: 80px;
}
.page_head.eight .content p
{
  width: 420px;
}

/*use on contact_us and people pages which need the shorter banner */
.page_head.nine {
width: 605px;
	height: 136px;
background: url(../images/services_banners/9small.jpg) no-repeat; }

.page_head.nine .content
{
  top: 20px;
  left: 80px;
}
.page_head.nine .content p
{
  width: 420px;
}
/*use on services and about OPM pages which need slightly narrower text box*/
.page_head.ten {
background: url(../images/services_banners/1.jpg) no-repeat; }

.page_head.ten .content
{
	top: 20px;
	left: 80px;
}
.page_head.ten .content p
{
  width: 380px;
}
/*end my test*/


/* featured resources on services index pages */

.featured_resources.with_pad {
padding-top: 30px; }

.featured_resources a.title {
font-size: 1.3em;
font-weight: bold;
background: url(../images/page_icon_resource.gif) no-repeat;
display: block;
padding: 9px 0 3px 25px;
margin: 0; }

.featured_resources .summary {
clear: both;
margin: 0 0 10px 0;
padding: 0 0 10px 0;
border-bottom: 1px dashed #cccccc; }

.featured_resources .summary.last {
border-bottom: 1px solid #cccccc; }


/* larger headline and paragraph text for about us pages */
.large_head h1 {
font-weight: normal;
font-size: 2.6em;
color: #008C8D; 
margin: 40px 0 0 0;
}

.large_head h2 {
font-weight: normal;
font-size: 2.6em;
margin: 40px 0 0 0;
font-family: Georgia, Times new roman; }

.large_head p {
font-size: 1.4em;
line-height: 1.5em; }


/* Quote styling in main content area */
.main_content .quote {
font-size: 1.3em;
font-style: italic;
line-height: 1.4em;
padding: 15px 15px 0 15px;
margin: 0;
color: #008C8D; }

.main_content .author {
font-weight: bold;
padding: 0 15px 20px 15px; }

.main_content img {
  float: right;
  margin: 0 5px 5px 0;
}

/* Control button for rotator on homepage */
#rotator_control
{
  width: 30px;
  height: 20px;
  text-indent: -9999px;
  display: block;
  font-size: 0px;
  color: transparent;
  position: absolute;
  right: 10px;
  bottom: 15px;
  z-index: 99999;
}
.pause
{
  background: url(../images/rotator_pause.gif) no-repeat;
}
.play
{
  background: url(../images/rotator_play.gif) no-repeat;
}

/* Search result ratings graphic. Width is set dynamically */
.relevance
{
  height: 6px;
  width: 250px;
  background: #cccccc;
}
/* hide span inside relevance, only used for screen readers */
.relevance span
{
  text-indent: -9999px;
  font-size: 0px;
}
/*I added this one. Use if with a span to make small text for PDF sizes*/
.smalltext {
font-size: xx-small;
}