﻿/*------------------------------------------------------------------------------------------------*/
/*-                                            STLYES.CSS                                        -*/
/*-                     THIS IS USED TO DECLARE TEXT STYLES AND CONTENT STYLES ONLY              -*/
/*-                                   IT DOES NOT DECLARE LAYOUT.                                -*/
/*------------------------------------------------------------------------------------------------*/

/*set overall body text colour, set a base font size of 62.5% which is 10px and a 
  base line height for the whole document, the percentage of 62.5% which is a 10px 
  line-height is aleady set in the reset style sheet*/
body {
 color: #020202;
 font: 62.5%/1.6em Arial, Verdana, Sans-Serif
}
/*################################################### COPY STYLES ####################*/

/*Set website wide styles for everything swirl can out put*/
/*anything that is outside of the base styles can be redeclared after to override the 
  base style, quoteboxes for example*/
#maincontainer {
font-size: 1.3em;
line-height: 1.7em;
}

#maincontainer h1 {
 color: #02431f;
 font-size: 2.6em;
 margin: 6px 0px 10px 0px;
font-weight:600;
word-spacing:-3px;
}

#maincontainer h1.furtherInfo {
 font-size: 1.4em;
 margin: 15px 0px 15px 0px;
}

#maincontainer h2 {
 color: #02431f;
 font-size: 2.1em;
 margin: 16px 0px 20px 0px;
font-weight:normal;
word-spacing:-3px;
line-height:1em;

}
#maincontainer h3 {
 color: #02431f;
 font-weight: bold;
 margin: 0px 0px 5px 0px
}

#maincontainer h4 {
 color: #003579;
 font-size: 1.0em;
 font-weight: bold;
 margin: 0px 0px 0px 0px
}

#maincontainer p {
 margin: 0px 0px 20px 0px;
}

ul.class1 li a,ul.class2 li a, ul#topLinks li a, #navigation ul, h1, h2, #address, #ctl00_mainarea_sidemenu {
font-family: Times New Roman;
}

#maincontainer a {
 color: #02431f;
 font-weight: bold;
 text-decoration: none
}

#maincontainer a:hover {
 text-decoration: underline;
}

#maincontainer strong {
 font-weight: bold
}

#maincontainer em {
 font-style: italic
}

#maincontainer ul {
 list-style: url(../images/bullet.gif);
 margin: 0px 0px 10px 40px;
 padding: 0px 0px 0px 0px;
clear:both;
}

#maincontainer ul li {
 list-style: url(../images/bullet.gif);
 margin: 0px 0px 0px 0px;
 padding: 0px 0px 2px 2px;
}

#maincontainer ol {
 list-style: decimal;
 margin: 0px 0px 10px 20px;
 padding: 0px 0px 0px 0px
}

#maincontainer ol li {
 list-style: decimal;
 padding: 0px 0px 10px 10px
}

.clear {
 clear: both
}

img {
 border: 0px;
 margin: 0px;
 padding: 0px
}

td {
 vertical-align: top
}

/* start to declare more specific stylings if required if they are slightly different to the base styles*/
/* a linked h2 needs to redeclared as the browser will use defaults for example*/



#copyarea #ctl00_mainarea_content2.copy ul.SiteMap {
 list-style: none;
}

#copyarea #ctl00_mainarea_content2.copy ul.SiteMap li {
 list-style: none; 
 background: none;
 padding: 2px 0px 2px 0px;
}

/* ############################################# QUOTE BOXES ###################################*/

/*styling for the quoteboxes and contents if that looks different to the base styling of swirl output*/
/*for example lists maybe different in the quote boxes than the main document*/
.quotes {
 color: #0e3465;
 font-size: 0.9em;
 line-height: 1.4em
}

.quotestop {
 color: #fff
}

.quotes p {
 margin: 0px 0px 10px 0px
}

#maincontainer .quotes h4 {
 color: #7b7b7b;
 font-size: 0.9em;
 font-weight: normal;
 margin: 0px 0px 10px 0px
}
/*############################################## .NET PAGER STYLING ###############################*/

/*used for gridviews if used*/
#maincontainer tr.pager a {
 color: #696969;
 height: 35px;
 padding: 0px 0px 0px 3px;
 text-decoration: underline;
 width: 11px
}

#maincontainer tr.pager span {
 color: #005983
}

/*######################################FOOTER STYLES###############################*/

/* base footer styles, different footer elements maybe require extra declaration if different*/
#footer p {
 color: #433302;
font-size:1.8em;
}

#footer a {
 color: #433302;
 text-decoration: none
}

#footer a:hover {
 text-decoration: underline
}

#address p.small {
font-size:1.2em;
clear:both;
}

#address a:hover {
text-decoration: none;
color:#241c02;
}

#address p {
line-height:1.2em;
}

#address p a {
padding-left:10px;
}

#footercontainer ul.footer-links {
float:left;
width:200px;
margin:0px 60px 0px 0;
}

#footercontainer ul.footer-links li a {
font-size:1.8em;
float:left;
width:200px;
padding:6px 0 5px 0px;
display:block;
border-bottom: dotted 1px #433302;
font-family: Times New Roman;
}

#footercontainer ul.footer-links li a:hover {
padding-left:1px;
}

#footer-small p {
font-size:0.9em;
}

#footer-small p.smallLeft {
float:left;
width:470px;
}

#footer-small p.smallRight {
float:right;
text-align:right;
width:400px;
}


/*################################################################################################
########################### FORM ELEMENTS STYLING ###############################################*/

/*creat a paragrapgh to conatin the label and textbox*/
#maincontainer div.form_element{
 margin: 0 0 10px 0;
 padding: 0;
 width: auto;
float:left;
height:auto;
}

/*float a label of a certain width with the text aligned right to align the textbox perfectly next to 
the label, this will create a column effect*/
.form_element label{
 color: #000;
 float: left;
 font-size: 14px;
 line-height: 16px;
 margin: 0 10px 0 10px;
 padding: 5px 0px 0px 0px;
}

.form_element span label{
 float: none;
 font-weight: normal
}

.form_element label.smlLbl {
width:55px;
}

.form_element label.orgLbl {
padding-right:10px;
}

/*textboxes are styled by using a class as ie 6 will not style them any other way.*/
.textboxes {
 background: #ffffff;
 color: #5e5e5e;
 font-size: 1.1em;
 height: 24px;
 margin: 0px 0px 0px 0px;
 padding: 6px 3px 0px 3px;
 vertical-align: top;
 border:solid 1px #e5e5e0;
 border-left:solid 1px #bfbfbb;
float:left;
}

textarea.txtComments {
 border:solid 1px #e5e5e0;
 border-left:solid 1px #bfbfbb;
width:538px;
height:100px;
resize:none;
}

select.drpTitle {
height:32px;
width:55px;
padding:5px;
border:solid 1px #e5e5e0;
border-left:solid 1px #bfbfbb;
}

input:focus, textarea:focus, select:focus {
border:solid 1px #b6b6b5;
}

span.chkInfo {
width:620px;
float:left;
margin-bottom:10px;
padding-left:5px;
}

span.chkInfo input {
float:left;
}

span.chkInfo label {
float:left;
width:133px;
margin-bottom:5px;
font-size: 14px;
}

#copyarea input.btn_submit {
float:right;
margin:15px 25px 0 0;
}

/*Required field asterix*/
.asterix {
 color: #02431f;
font-size:16px;
}

span.formError {
float:left;
font-weight:bold;
padding-left:10px;
border:solid 1px #fcdada;
padding: 0 5px 0 5px;
background:#ffeeee;
margin: 0 5px 5px 0;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
border-radius:7px;
}

/*used on a label if you need to display an error with a form, login for example*/
.error {
 color: #FF0000;
 font-weight: bold
}

/* ############################################### EXPANDABLE BOXES ###############################*/

/*Styling for the things you click on*/
#maincontainer a.MenuTop {
 border-bottom: dotted 1px #999999;
 color: #02431f;
 cursor: pointer;
 display: block;
 font-weight: bold;
 padding: 3px 0px 3px 20px;
 width: 626px;
margin-bottom:10px;
background: url(../images/closed.png) no-repeat left center;
float:left;
}
/*by default a link underlines on hover, turn it off*/
#maincontainer a.MenuTop:hover {
 text-decoration: underline
}

/*class to change too when clicked*/
#maincontainer a.MenuTopon {
background: url(../images/open.png) no-repeat left center
}

/*container for the expandable content*/
.expandable_box {
 margin: 0px 10px 0px 10px;
 width: 600px;
padding: 0 10px 0 10px;
}

.center {
text-align:center;
}

#copyarea div.slider-wrap p {
 margin: 0px 0px 3px 0px;
word-spacing:normal;
 color: #02431f;
padding:0;
clear:both;
font-family: Times New Roman;
font-weight:normal;
font-size:1.2em;
}

#copyarea div.slider-wrap p a.title {
 color: #02431f;
font-weight:normal;
}


/*######################################## SOCIAL BOX ##############################*/

#social-box {background: #fff; border:solid 1px #cac5b8; padding:3px; width: 232px; margin:20px 0;}
#social-box-inner {background:#e1dcc6; width:206px; padding: 13px;}
#social-box img {margin-left:0px;}

#copyarea #activityFeed ul {list-style: none; list-style-image: none; list-style-type: none; margin:10px 0 0 0;}
#copyarea #activityFeed ul li {list-style: none; list-style-image: none; list-style-type: none; border-top:dotted 1px #ccc1a0; padding:10px 0 10px 22px;}


