* { margin: 0; padding: 0; }
body  /* Changed font family */ { font-family: Verdana, Arial, Helvetica, sans-serif; line-height: 1.6; text-align: center; }
h1 { color: #ff4500; font-size: 1.8em; text-align: center; text-transform: capitalize; word-spacing: 4px; margin-bottom: 1.2em; padding-top: 10px; padding-bottom: 0; border-bottom: 1px solid #ff4500  }
h2 { color: #00f; font-size: 1.6em; text-align: left; text-transform: capitalize; word-spacing: 2px; margin-top: 1.2em; margin-bottom: 0; }
h3 { color: #00f; font-size: 1.4em; font-weight: bold; text-align: left; text-transform: capitalize; word-spacing: 2px; margin-top: 1.2em; }
h4 { color: #00f; font-weight: bold; text-align: left; text-transform: capitalize; word-spacing: 2px;}
h5 { color: #ff4500; font-weight: bold; background-color: #ccc4ff; text-align: left; word-spacing: 2px;}
p   { line-height: 1.4em; text-align: left; margin-bottom: 1em; }
h4, h5, p, td { font-size: 1.2em; text-align: left; margin-top: 0.4em; }
ul, li, ol  /* No idea why need to reduce font size wrt p */ { font-size: 1.1em; margin-top: 0.2em; margin-left: 1.4em; }
ul { margin-bottom: 1.2em; }
ul ul  /*  Controls 2nd tier nested list */ { margin-bottom: 0; margin-left: 2em; }
li li  /* Need to reduce font size wrt 1st tier lists  */ { font-size: 0.9em; font-family: Verdana, Arial, Helvetica, sans-serif; margin-top: 0; margin-bottom: 0; }
td { vertical-align: top;}
img { border-style: none; }
.bold_centre { font-weight: 700; text-align: center; }
.bold_blue_left { color: #00f; font-size: 1.4em; font-weight: 700; text-align: left; }
.bold_blue_centre { color: #00f; font-size: 1.4em; font-weight: 700; text-align: center; }
.centre { text-align: center; }
#contact  /* To float right txt must precede the element it is to go next to */ { float: right; margin: 6px 12px; padding: 6px 12px; }
#contact2 { margin: 6px 12px; padding: 6px 12px; border: solid 1px #000; }
.contactText  /* Same as H3 (bar margin/pading). Used to prevent problems with accessibility */ { color: #00f; font-size: 1.4em; font-weight: bold; text-align: left; text-transform: capitalize; word-spacing: 2px; letter-spacing: 1px; margin-top: 0; padding-top: 0; }
/*-----------Navigation-----------*/
#mainNav  /*  font size & left magrin required to over ride Body */ { font-size: 1em; background-color: #eef; margin-top: 1em; margin-left: 0; padding: 20px 0; }
#mainNav li  /* Have over writing generic classes for ul, li */ { list-style: none; font-size: 1em; font-weight: bold; line-height: 3em; text-decoration: none; text-align: center; text-transform: lowercase; word-spacing: 4px; vertical-align: middle; margin: 0; padding: 0; border-top: 1px solid #99c; }
#mainNav li + li + li + li + li + li + li + li + li + li +li   /* This adds the boarder to the bottom of the last item in the list. If UL used boarder some distance away from last item in the list */ { border-bottom: 1px solid #99c; }
#mainNav li a { text-decoration: none; width: 18em; display: block; }
#mainNav li a:link { color: #395584 }
#mainNav li a:visited { color: #ff4500 }
#mainNav li a:hover { color: #9b9b9b }
#mainNav li a:active { color: #95ff90 }
skiplinks { position: absolute; left: -500em; }
/*-----------Control of txt & corners for RHS-----------*/
#secondaryContent { margin-top: 1em; margin-right: 1em; }
#secondaryContent h3  /* Info here not as important as in main area hence use of h3. Also removes possible confusion re accessibility */ { color: #fff; font-size: 1.2em; text-align: left; margin-right: 0; margin-bottom: 4px; padding-right: 0; padding-bottom: 0; padding-left: 4px; border-bottom: 1px solid #fff; }
#secondaryContent h3:first-child  /* Used to pull the first header (& hence all items) up the page */ { margin-top: 0; padding-top: 10px; }
#secondaryContent p { font-size: 1.1em; margin-top: 0; margin-right: 12px; margin-left: 12px; }
.box { background: #ff8f00 url(../images/bottom_left_O.gif) no-repeat left bottom; margin-bottom: 3em; }
.box-outer  /* Bottom left - uesd #secondaryContent   */ { background-image: url(../images/target.gif); background-repeat: no-repeat; background-attachment: scroll; background-position: right bottom; padding-bottom: 0.5em; }
.box-inner { background-image: url(../images/top_left_O.gif); background-repeat: no-repeat; background-attachment: scroll; background-position: left top; }
.topRight { background-image: url(../images/top_right_O.gif); background-repeat: no-repeat; background-attachment: scroll; background-position: right top; }
/*-----------Layout----------- */
body { font-size: 62.5%; background-color: #e1ebef; text-align: center; }
#wrapper { background-color: #fff; width: 100em; max-width: 100%; margin: 0 auto; text-align: left; border-top: 4px solid #f78f1e; border-left: 4px solid #f78f1e; border-right: 4px solid #f78f1e; }
#branding { background-color: #005daa; position: relative; height: 150px; border-bottom: 4px solid #f78f1e; }
#mainNav   { width: 18em; max-width: 18%; float: left; }
#content  /* Padding as per top in Secondary Content */ { width: 80em; max-width: 80%; float: right; padding-bottom: 1em; }
#mainContent { width: 53em; max-width: 66%; float: left; }
#mainContentH  /* No secondaryContent */ { width: 79em; max-width: 97%; float: left; }
#secondaryContent { width: 24em; max-width: 31%; float: right; } 
#footer { clear: both; }
/*-----------Heading-----------*/
#logo { position: absolute; top: 0; left: 5px; z-index: 1000; float: left; }
#slogan  /* Line height provents IE from partially hidding slogan */ { color: #fff; font-size: 1.3em; font-weight: 700; line-height: 1.4em; position: absolute; top: 35px; right: 25px; z-index: 4000; float: right; padding-right: 5px; }
#globe { position: absolute; top: 0; right: 5px; z-index: 3000; float: right; margin-top: 0; margin-right: 0; }
/*-----------Links within the text-----------*/
a  { text-decoration: none   }
a:link { color: #b00000 ; font-weight: 700; }
a:visited { color: #b00000 }
a:hover { color: #9b9b9b }
a:active { color: #9b9b9b ; }
a[href^="mailto:"] { color: #008000; font-weight: 500; background: url(../images/email.gif) no-repeat right top; padding-right: 20px; }
/*-----------Footer-----------*/
#footer   { background-color: #f78f1e; padding-top: 6px; padding-bottom: 1px; }
.footer_menu  /* Margin to close gap btw rows */ { color: #fff; font-size: 1em; text-decoration: none; text-align: center; margin-top: 1px; margin-bottom: 0; }
.footer_menu a:link       { color: #fff ; font-weight: 700; }
.footer_menu a:visited       { color: #808080 ; font-weight: 700; }
.footer_menu a:hover    { color: #9b9b9b ; font-weight: 700; }
.footer_menu a:active        { color: #9b9b9b ; font-weight: 700; }
.designedby      { color: #fff; font-size: 1em; text-align: center; margin-top: 0; }
/*-----------Accessibility-----------*/
skiplinks { position: absolute; left: -500em; }
/*-----------Form Control-----------*/
fieldset { margin: 1em 0; padding: 1em; border: solid 1px #cc0c00; }
legend { font-weight: bold; }
label { width: 10.5em; float: left; display: block; }
input { width: 180px; }
input[type="text"], textarea { border-color: #999 #ccc #ccc #999; border-style: solid; border-width: 2px 1px 1px 2px; }
input.radio { width: auto; float: left; margin-right: 1em; }
textarea { width: 300px; height: 100px; }
input:focus, textarea:focus { background-color: #ffc; }
#sourceLabel { text-indent: -1000em; width: 1em; }
#source { margin-left: 120px; }
.red  /* Colour for * as in requred info. */ { color: #fd0017; }
.error  /* for error messages */ { color: #f00; margin-left: 0.8em; padding-left: 0.8em; }
#submit { color: white; font-size: 1.2em; background-color: #b00000; position: relative; top: -1.6em; right: 1.5em; width: auto; float: right; }
/*Stacking radio buttons
*/
#radio div { width: 30em; float: left; }
#radio label { width: 30em; float: none; }
/*------------Form styling - PPC ------------*/
#more {
  margin: 0;
	padding: 0;
	border: none;
	background: transparent;
}
#more label { color: #066; width: 19em; float: none; display: inline; }
#want label  /* Width affects more! */ { color: #066; width: 12em; float: none; display: inline; }
input.checkbox { width: auto; float: left; margin-right: 1em; }
.cell  /* Control of a list within a table */ { font-size: 0.9em; }
/*-----------Portfolio-----------*/
.captioned_photo_l { margin: 0.5em 0 1em 1em; padding: 0; line-height: 1em; width: 96%; border: solid 1px #f96161; }
.captioned_photo_l p { width: auto; margin: 0; padding: 1em 0; color: #000; font-size: 1.1em; font-family: verdana, sans-serif; font-weight: normal; font-style: normal; font-variant: normal; text-align: center; }
.captioned_photo_l p + p { color: #000; font-family: verdana, sans-serif; font-weight: normal; font-style: normal; font-variant: normal; line-height: 1.75em; text-align: left; margin: 0; padding: 0 0 1em 0.4em; width: auto; }
.captioned_photo_l img { text-align: center; float: right; margin: 1em 0.6em; padding: 0; border: solid 1px #f96161; display: block; }
/*-----------Website Audit-----------*/
#essential, #premium { background-color: #e0d2ff; margin-bottom: 1.2em; border: solid 2px #99c; }
#essential h3, #premium h3 { text-align: center; margin-top: 0; }
#essential p, #premium p { margin-right: 0.3em; margin-left: 0.3em; padding-right: 0.3em; padding-left: 0.3em; }
/*--------- home page contents ---------*/
.left1  /* Width 47% to fix a IE7 prob */ { position: relative; float: left; width: 47%; height: 240px; clear: left; border-top: 3px solid #e7eff3; border-left: 3px solid #e7eff3; }

.right1 { position: relative; float: right; width: 48%; height: 240px; clear: right; border-top: 3px solid #e7eff3; border-left: 3px solid #e7eff3; }
.left2  /* Width 47% to fix a IE7 prob */ { position: relative; float: left; width: 47%; clear: left; margin-top: 16px; border-top: 3px solid #e7eff3; border-left: 3px solid #e7eff3; }
.right2 { position: relative; float: right; width: 48%; clear: right; margin-top: 16px; border-top: 3px solid #e7eff3; border-left: 3px solid #e7eff3; }
#mainContentH  h2 { font-size: 1.3em; margin-top: 0; margin-left: 0.5em; padding-top: 0; }
#mainContentH p { margin-right: 0.5em; margin-left: 0.5em; }
.image-r { float: right; padding-bottom: 0.6em; padding-left: 0.6em; }
.clear { clear: both; font-size: 0px; height: 0px; margin: 0; padding: 0; }
/*-----------E-newsletters-----------*/
#eRHS  /* ex mainNav */ { background-color: #eef; width: 25em; float: right; max-width: 31%; margin-top: 1.5em; margin-right: 4em; }
#eRHS h2 { margin-top: 0.2em; }
#eRHS li { font-size: 1em; line-height: 1em; margin-right: 0; margin-bottom: 1em; margin-left: 0; padding-right: 0; padding-left: 0; border-bottom: 0.1em solid #395584; list-style-type: none; }
#eRHS li a { text-decoration: none; display: block; }
#eRHS li a:link { color: #395584 }
#eRHS li a:visited       { color: #808080 }
#eRHS li a:hover { color: #95ff90 }
#econtent  /* Main content area */ { width: 57em; float: left; max-width: 57%; margin-left: 4em; }
.eNews  /* Use for Related Articles */ { background-color: #eef; border: ridge 0.2em #99c; }
#boxed { margin-left: 1.5em; }
#boxed p { margin-right: 0.5em; margin-left: 0.5em; padding-right: 0.5em; padding-left: 0.5em; }
#imageRight { position: relative; float: right; }
/*----------- Table Control -----------*/
#kw
 /* Name of table in: ppc-c-reply.html */ { font-variant: normal; line-height: normal; border:solid 1px #cc0c00; margin:0 auto 20px; border-collapse: collapse; }

#kw  /* Hack for IE6 & 7 */ {
  border-spacing: 0; /* Gecko, Webkit, IE 8 */
  ~border-spacing: expression(this.cellSpacing=0); /* IE 6, 7 */
}

#kw td
{ text-align:left; vertical-align:top;  padding: 0.4em 1em; }
#kw caption { color: #00f; font-size: 1.2em; font-weight: 700; margin-bottom: 0.8em; }
#kw .bold
{ font-weight: 700; background-color: #fff; }
#kw .odd { background-color: #edf5ff; }
#kw .even { background-color: #fff; }

