/*  site.css
  
This file should contain display styles for the site, as well as structural
styles for #copy. All other structural layout styles should go in layout.css

*/


/*  body
  Ensure background colour and base fonts
*/
body  {
  background: #FFF;
  font-family:  Helvetica, Arial, sans-serif;
  font-size:  12px;
}
  ul.navigation, ul.navigation li {
    list-style: none;
  }


/*  #wrapper
  Define the background colour of the main wrapped area. Also, pull up any
  refactored content from individual areas below
*/
#wrapper  {
  background: #043D04;
}
  #wrapper ul.navigation a,
  #wrapper ul.navigation li.current li a {
    color:  #BDD0BD;
    text-decoration:  none;
  }
  #wrapper ul.navigation li.current a,
  #wrapper ul.navigation a:hover,
  #wrapper ul.navigation li.current li a:hover {
    color:  #FFF;
  }



/*  #masthead
  Define the logo, some text replacement, and the main navigation
*/
#masthead {
}
  #masthead div.logo {
    background: url('/images/site/logo.png') bottom left no-repeat;
  }
    #masthead div.logo a  {
      display:  block;
      width:  100%;
      height: 100%;
    }
    #masthead div.logo b  {
      display:  none;
    }
  #masthead ul.navigation {
    border-top: 1px solid #FFF;
    border-bottom:  1px solid #FFF;
    font-size:  14px;
  }
    #masthead ul.navigation li  {
      float: left;
      margin: 0 10px 0 0;
      padding:  0;
      line-height:  55px;
    }
      #masthead ul.navigation li.pull  {
        float: right;
        margin: 0 0 0 10px;
      }



/*  #trunk
  The trunk contains the page navigation and content.
*/
#trunk  {
}
  #trunk ul.navigation  {
    font-size:  14px;
  }
    #trunk ul.navigation li.section {
      border-bottom:  1px solid #6E916E;
    }
      #trunk ul.navigation li.section a {
        font-size:  12px;
      }
      #trunk ul.navigation li.current a {
        background: url('/images/site/trunk_navigation_li-current.png');
        background-position:  right;
        background-repeat:  no-repeat;
      }
        #trunk ul.navigation li.current li a {
          background: none;
        }
      #trunk ul.navigation li.section a {
        background-position: 172px 1em;
      }
      #trunk ul.navigation li ul  {
        font-size:  90%;
      }

/*  #stage
  A container for anything peripheral to page content
*/
#stage  {
  padding-bottom: 20px;
}

/*  #partners
  A list of the associated partners
*/
#partners {
}
  #partners li {
    list-style: none;
  }
  #partners li.mod {
    background: url('/images/site/partners_mod.png') center no-repeat;
    width:  42px;
  }
  #partners li.dh {
    background: url('/images/site/partners_dh.png') center no-repeat;
    width:  102px;
  }
  #partners li.dhssps {
    background: url('/images/site/partners_dhssps.png') center no-repeat;
    width:  89px;
  }
  #partners li.hs {
    background: url('/images/site/partners_hs.png') center no-repeat;
    width:  98px;
  }
  #partners li.cy {
    background: url('/images/site/partners_cy.png') center no-repeat;
    width:  56px;
  }
  #partners li.last {
  }
    #partners li a {
      display:  block;
      width:  100%;
      height: 50px;
    }
      #partners li b {
        display:  none;
      }


/*  #content
  The content area contains the main content of the page.
*/
#content  {
  background: url('/images/site/content.png') top left repeat-y;
}
  #content h1, #content h2, #content h3, #content h4, #content h5, #content h6 {
    color:  #043D04;
  }
  #content h1 {
    font-size:  24px;
  }
  #content h2 {
    font-size:  18px;
  }


/*  #title
  The title area sits inside #content and defines the page title, as well as
  any date or other metadata.
*/
#title {
  background: #FFF url('/images/site/content_title.png') top right no-repeat;
  border-bottom:  1px dashed #6E916E;
}
  #title h1 {
    padding: 15px 40px 15px 10px;
  }

/*  #copy
  Where the magic happens...
*/
#copy {
  color:  #333;
  line-height:  1.4em;
}

  #copy .date {
    color:  #999;
    padding-bottom: 10px;
  }

  #copy img {
    border: 1px solid #CCC;
    padding:  2px;
    margin: 0 5px 5px;
  }
  #copy img.plain {
    border: none;
    padding:  0;
    margin: 0;
  }
  #copy h2  {
    margin-top: 1.3em;
  }
  #copy h2, #copy h3, #copy h4, #copy h5, #copy h6  {
    line-height:  1.2em;
  }
  
  #copy p {
    margin: 10px;
  }
  #copy a {
    color: #043D04;
    font-weight:  bold;
  }
    #copy a:hover {
      color:  #6E916E;
    }
    #copy a:visited {
      color:  #6E916E;
    }
  #copy blockquote  {
    margin: 20px 10px;
    padding:  0 20px;
    color:  #666;
    background: url('/images/site/blockquote.png') top left no-repeat;
  }
    #copy blockquote.pull  {
      display:  block;
      float:  right;
      text-align: right;
      width:  40%;
      margin: 0 0 10px 20px;
      padding:  10px;
      background: #EEE;
      border-left: 2px solid #999;
    }
    #copy blockquote.pull.left  {
      float:  left;
      text-align: left;
      margin: 0 10px 10px 10px;
      border-left:  none;
      border-right: 2px solid #999;
    }
  
  #copy ul  {
    list-style-type:  circle;
    margin: 20px;
    padding:  0;
  }
    #copy li  {
      margin: 10px;
      padding:  0;
    }
  
  #copy ul.downloads  {
    margin: 0 0 20px 5px;
    border-top: 1px solid #DDD;
    float:  left;
    width:  100%;
  }
  #copy ul.downloads,
  #copy ul.downloads li {
    list-style: none;
  }
    #copy ul.downloads li {
      margin: 0;
      width:  100%;
      float:  left;
      border-bottom: 1px solid #DDD;
    }
      #copy ul.downloads li a {
        display:  block;
        position: relative;
        padding:  5px 5px 5px 20px;
        text-decoration:  none;
        background: url('/system/assets/image/download-arrow.gif') 3px no-repeat;
      }
      #copy ul.downloads li a span  {
        position: absolute;
        right:  5px;
        text-decoration: none;
        color:  #666;
        font-weight:  normal;
        font-style: italic;
      }
    #copy ul.downloads li a:hover {
      background-color: #F6F6F6;
    }


/*  #articles
  A listing of articles for archiving
*/
#articles {
}
  #articles .article  {
    border-top:  1px dotted #CCC;
    margin-bottom:  20px;
  }
  #articles .article h2 {
    margin-bottom:  0;
  }
    #articles .article h2 a {
      color:  #6E916E;
    }
  #articles .article p {
      margin: 0 10px 10px;
  }
    #articles .article p.date {
      margin: 4px 10px 10px;
      font-size:  11px;
    }
  #trunk .article p.more  {
    text-align: left;
    margin: 0 0 0 10px;
  }
    #trunk .article p.more a  {
      color: #043D04;
      font-weight:  bold;
    }
    #trunk .article p.more a:hover  {
      color: #6E916E;
    }

/*  .gallery
  A container for .exhibit divs
*/
#trunk .gallery {
  border-top: 1px dashed #6E916E;
  width:  510px;
}
  #trunk .gallery.exhibit  {
    border-top: none;
  }
  .gallery .exhibit  {
    margin-bottom:  20px;
    margin-left:  20px;
    width:  138px;
    float:  left;
  }
  .gallery h2 a  {
    color:  #6E916E;
  }
    .gallery h2 a:hover  {
      color:  #043D04;
    }
  #trunk .gallery p.more  {
    text-align: right;
    margin: 0 20px 0 0;
  }
    #trunk .gallery p.more a  {
      color: #043D04;
      font-weight:  bold;
    }
    #trunk .gallery p.more a:hover  {
      color: #6E916E;
    }
  #trunk .gallery .exhibit h2 {
    margin-bottom:  0;
    font-size:  12px;
  }
    #trunk .gallery .exhibit h2 a {
      color: #043D04;
    }
    #trunk .gallery .exhibit h2 a:hover {
      color: #6E916E;
    }
  #trunk .gallery .exhibit p {
      margin: 0 10px 10px;
  }
    #trunk .gallery .exhibit p.date {
      margin: 4px 0 10px;
      font-size:  11px;
    }
  #trunk .gallery .exhibit img {
    padding:  4px;
    border:  1px solid #CCC;
  }
  #trunk .gallery br {
    clear:  left;
  }


/*  img.exhibit
  width settings
*/
  #copy img.exhibit {
    width:  494px;
    margin: 0 0 20px;
  }
  #copy img.with_downloads {
    width:  464px;
  }

/*  .pagination
  simple pagination layouts
*/
ul.pagination,
ul.pagination li {
  list-style: none;
  padding:  0;
}
ul.pagination {
  height: 1em;
  border-top: 1px dashed #6E916E;
  text-align: center;
  width:  520px;
  float:  left;
  margin-left:  -10px;
  padding-top:  10px;
  margin-bottom:  -10px;
  position: relative;
}
  ul.pagination li  {
    display:  inline;
    margin: 4px 2px;
  }
    ul.pagination li.next {
      position: absolute;
      top:  6px;
      right: 4px;
    }
    ul.pagination li.previous {
      position: absolute;
      top:  6px;
      left: 4px;
    }
      ul.pagination li.next a,
      ul.pagination li.previous a {
        text-decoration:  none;
      }
  .pagination a {
    font-weight:  bold;
    color: #043D04;
    padding:  2px 8px;
  }
    .pagination a:hover {
      color:  #333;
      background: #BDD0BD;
    }
    ul.pagination li.here a {
      color:  #FFF;
      text-decoration:  none;
      background: #6E916E;
    }
  

/*  #breadcrumbs
  Any location-specific or cataloguing information associated with the page
*/
#breadcrumbs  {
  color:  #6E916E;
  border-top:  1px dashed #6E916E;
}
  #breadcrumbs a  {
    text-decoration:  none;
    color:  #BDD0BD;
  }
  #breadcrumbs a:hover  {
    color:  #6E916E;
  }
  #breadcrumbs p  {
    padding:  10px;
    margin: 0;
  }

/*  #extras
  extra panels of information related to the page - downloads, links etc
*/
#extras  {
}
  #extras .panel  {
    background: url('/images/site/extras_panel.png') top left repeat-y;
  }
    #extras .panel p {
      margin: 0 0 10px;
    }
    #extras .panel h2 {
      font-size:  14px;
      padding:  10px;
      margin: 0;
      background: url('/images/site/extras_panel_h2.png') top left no-repeat;
    }
    #extras .panel div.hr  {
      background: #6E916E;
      height: 1px;
      border: 0;
      margin: 0 2px;
      padding:  0;
    }
    #extras .panel div  {
      padding:  10px 10px 35px;
      background: url('/images/site/extras_panel_div.png') bottom left no-repeat;
    }
      #extras .panel div.downloads  {
        background: none;
        padding:  0;
        margin: 0;
      }
    #extras .downloads ul, #extras .downloads li {
      list-style: none;
      margin: 0;
      padding:  0;
    }
    #extras .downloads ul {
      margin: 0 5px;
    }
    #extras .downloads li {
      margin: 0 0 10px;
    }
      #extras .downloads li a {
        display:  block;
        padding:  0 0 0 12px;
        background: url('/images/site/file_icon.png') top left no-repeat;
        font-weight:  bold;
        color:  #6E916E;
        text-decoration:  none;
      }
        #extras .downloads li.pdf a {
          background-image: url('/images/site/pdf_icon.png');
          margin-left: -3px;
          padding-left: 15px;
        }
        #extras .downloads li a:hover {
          color:  #043D04;
        }
        #extras .downloads li a span {
          display:  block;
          color:  #666;
          font-weight:  normal;
        }


/* .contactform
  a container with a form and an ordered list for fields/labels
*/
#trunk .contactform {
  border-top: 1px dashed #6E916E;
  width:  510px;
  line-height:  1.4em;
}
  #trunk .contactform.simple  {
    border-top: none;
  }
  #trunk .contactform ol,
  #trunk .contactform li  {
    list-style: none;
    margin: 0;
    padding:  0;
  }
  #trunk .contactform li  {
    margin-bottom:  10px;
    position: relative;
  }
  #trunk .contactform li input.text,
  #trunk .contactform li textarea.text,
  #trunk .contactform li input.submit  {
    margin-left:  130px;
  }
  #trunk .contactform li input.text,
  #trunk .contactform li textarea.text {
    width:  280px;
    padding:  3px;
    font-family:  Helvetica, Arial, sans-serif;
    font-size:  12px;
  }
  #trunk .contactform li textarea.text {
    height: 6em;
  }
  #trunk .contactform li label  {
    position: absolute;
    left: 0;
    top:  4px;
    width:  120px;
    text-align: right;
  }
  #trunk .contactform li.narrative label  {
    position: relative;
    display:  block;
    text-align: left;
    width:  380px;
    margin:  10px 10px 10px 30px;
  }
  #trunk .contactform li.narrative textarea.text {
    width:  380px;
    margin-left:  30px;
  }


/*  #footer
  Set the height of the footer area, and define space for the footer
  navigation.
*/
#footer {
  background: url('/images/site/footer.png') top left repeat-x;
}
  #footer ul.navigation {
    border-bottom:  1px solid #043D04;
    font-size:  14px;
  }
    #footer ul.navigation a {
      color:  #043D04;
      text-decoration:  none;
    }
    #footer ul.navigation li  {
      float: left;
      margin: 0 10px 0 0;
      padding:  0;
      line-height:  55px;
    }
      #footer ul.navigation li.pull  {
        float: right;
        margin: 0 0 0 10px;
      }


/* #content.wide
  Some simple width adjustment for #content panels
*/
#content.wide {
  background: url('/images/site/content_wide.png') top left repeat-y;
}
  #content .wide #copy  {
    
  }


