/* Sitewide formatting for display on a screen
 * Created 2nd Jan 2009 by Craig Fowler
 * http://www.craigfowler.me.uk
 */

/* -----------------------------------------------------------------------------
 * Start with a general reset rule to get rid of inconsistent browser default
 * styles
 */
* {
  margin: 0;
  padding: 0;
  line-height: inherit;
  vertical-align: inherit;
  list-style-type: inherit;
  color: inherit;
  font-size: inherit;
  text-decoration: none;
  font-weight: inherit;
  font-style: inherit;
}
body {
  font-size: medium;
  color: #000;
  background-color: #FFF;
  list-style-type: none;
}

/* -----------------------------------------------------------------------------
 * Laying out the page
 */
div#meta-header-background {
  position: absolute;
  width: 100%;
  height: 103px;
  background-color: #2E73AC;
}
div#page-outer {
  background-image: url(/graphics/header-background.png);
  background-repeat: repeat-x;
  background-position: left top;
  position: relative;
  text-align: center;
  overflow: visible;
  height: 103px;
}
div#page-inner {
  width: 900px;
  margin: 0 auto;
  text-align: left;
}

/* -----------------------------------------------------------------------------
 * The header region
 */
div#region-header {
  height: 103px;
  position: relative;
}
div#region-header div.logo {
  width: 165px;
  height: 90px;
  top: 4px;
  left: 20px;
  position: absolute;
  background-image: url(/graphics/logo-transparent.png);
}

/* -----------------------------------------------------------------------------
 * The main navigation
 */
div#region-navigation {
  margin: -25px 0 -25px 245px;
  vertical-align: top;
}
div#region-navigation li {
  float: left;
  position: relative;
  margin: 0 1.2em 0 0;
  font-family: "DejaVu Sans", Verdana, Helvetica, Arial, sans-serif;
  font-size: 85%;
  color: #CCC;
  text-transform: lowercase;
}
div#region-navigation a {
  padding: 0.2em 0.4em;
  color: #FFF;
}
div#region-navigation a:hover {
  color: #333;
}

/* -----------------------------------------------------------------------------
 * The page content area
 */
div#region-content-outer {
  clear: both;
  padding: 30px 0 0;
}

/* =============================================================================
 * The main page content
 */
div#region-content-inner {
  line-height: 1.45em;
  font-family: "DejaVu Sans", Verdana, Helvetica, Arial, sans-serif;
}
div#region-content-inner p {
  margin: 0 0 0.8em;
}
div#region-content-inner h1,
div#region-content-inner h2,
div#region-content-inner h3,
div#region-content-inner h4,
div#region-content-inner h5,
div#region-content-inner h6 {
  color: #666;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.45em;
}
div#region-content-inner h2,
div#region-content-inner h3,
div#region-content-inner h4 {
  margin: 0.4em 0 0;
}
div#region-content-inner h1 {
  font-size: 240%;
  margin: 0 0 20px;
  padding: 0 0 0.1em;
  border-bottom: 1px solid #DDD;
  text-transform: capitalize;
}
div#region-content-inner h2 {
  font-size: 180%;
  font-weight: bold;
  font-style: italic;
}
div#region-content-inner h3 {
  font-size: 160%;
}
div#region-content-inner h4 {
  font-size: 120%;
  font-weight: bold;
}
div#region-content-inner ul {
  list-style: none outside url(/graphics/bullet-black.png);
  padding: 0 0 0 2em;
  margin: 0 0 0.8em;
}
div#region-content-inner ul ul {
  list-style: none outside url(/graphics/bullet-blue.png);
  margin: 0;
}
div#region-content-inner ul ul ul {
  list-style: circle outside none;
}
div#region-content-inner ul.nostyle {
  list-style: none outside none;
  margin: 0;
  padding: 0;
}
div#region-content-inner ul.nostyle li {
  margin: 0 0 0.8em 0;
}
div#region-content-inner ol {
  list-style: decimal outside none;
  padding: 0 0 0 2em;
  margin: 0 0 0.8em;
}
div#region-content-inner ol ol {
  list-style: lower-alpha outside none;
  margin: 0;
}
div#region-content-inner ol ol ol {
  list-style: lower-roman outside none;
}
div#region-content-inner table {
  border-right: 1px solid #CCC;
  border-bottom: 1px solid #CCC;
  border-collapse: collapse;
  margin: 0 0 0.8em;
}
div#region-content-inner th {
  color: #2e73ac;
  font-weight: bold;
  background-color: #DDD;
}
div#region-content-inner td, div#region-content-inner th {
  border-top: 1px solid #CCC;
  border-left: 1px solid #CCC;
  padding: 1px 6px;
}
div#region-content-inner a {
  color: #2e73ac;
  border-bottom: 1px solid #2e73ac;
  padding: 0 0 1px;
}
div#region-content-inner a.block {
  padding: 0;
  border-bottom: 0 none transparent;
}

div#region-content-inner a:hover {
  color: #039;
}
div#region-content-inner a:visited {
  color: #930;
  border-bottom: 1px solid #930;
}
div#region-content-inner a.block:visited {
  border-bottom: 0 none transparent;
}
div#region-content-inner strong {
  font-weight: bold;
}
div#region-content-inner address {
  display: block;
  margin: 0 0 0.8em 0;
}
div#region-content-inner em {
  font-style: italic;
}
div#region-content-inner img {
  border: 0 none transparent;
}
div#region-content-inner .photo {
  padding: 1px;
  border: 1px solid #CCC;
}
div#region-content-inner .left, div#region-content-inner .right {
  position: relative;
}
div#region-content-inner .left {
  float: left;
  margin: 0 1em 0.8em 0;
  clear: left;
}
div#region-content-inner .right {
  margin: 0 0 0.8em 1em;
  float: right;
  clear: right;
}
div#region-content-inner .center {
  margin: 0 auto 0.8em;
  clear: both;
  display: block;
  text-align: center;
}
div#region-content-inner .clear-float {
  clear: both;
}
div#region-content-inner div.tri-column div.column {
  width: 32%;
  margin: 0 2% 0 0;
  position: relative;
  float: left;
}
div#region-content-inner div.tri-column div.three {
  margin: 0;
}



/* =============================================================================
 * The page footer
 */
div#region-footer {
  clear: both;
  margin: 20px 0;
  padding: 10px 0 0;
  border-top: 1px solid #DDD;
  color: #999;
  font-size: 90%;
}
div#region-footer ul.links li {
  float: left;
  position: relative;
  margin: 0 1.2em 0 0;
}
div#region-footer a {
  color: #999;
  text-decoration: underline;
}
div#region-footer a:hover {
  color: #333;
}
div#region-footer div.notices {
  clear: both;
  padding: 0.4em 0 0;
}


/* -----------------------------------------------------------------------------
 * Hide things that are only in the page code for the benefit of accessibility
 * and search engines
 */
.hidden-structure {
  display: block;
  width: 1px;
  height: 1px;
  margin: -1px 0 0 -1px;
  overflow: hidden;
  padding: 0;
  border: 0 none transparent;
}