/* Copyright (c) 2006 Simon Turner */

/* ======================= */
/*         General         */
/* ======================= */

body {
  font-family: Arial,Verdana,Helvetica,sans-serif; 
  font-size: 10pt;
  color: #000; 
  background-color: #fff; 
  border: 0px;
  margin: 0px;
  padding: 0px;
  text-align: center;
}

a {
  color: #005091; 
  /* text-decoration: none; */
}

a.tinylink {
  font-size: 7pt;
}

* html a:hover {
  visibility: visible
}

img {
  border: 0px;
}

table {
  border: 0px;
}

ul {
  margin: 0px;
  padding: 0px;
  margin-left: 1pt;
  padding-left: 1pt;
  list-style-position: outside;
}

li {
  margin: 0px;
  padding: 0px;
  margin-left: 1em;
  padding-left: 0em;
  list-style-position: outside;
}

/* ======================= */
/*       Container         */
/* ======================= */

#container {
  position: relative;
  margin: 0px;
  text-align: left;
  background-color: #fff; 
  min-width: 830px; /* Requires conditional elements in page to set effective min width for IE (see layout) */
  width: 100%;
}

/* ======================= */
/*         Header          */
/* ======================= */

#header {
  /* */
}

#title_bar {
  height: 72px;
  background-color: #254158;
}

#title_bar #logo {
  position: absolute;
  left: 18px;
  top: 12px;
}

#title_bar #title {
  position: absolute;
  left: 154px;
  top: 39px;
}

/* ======================= */
/*       Top menu          */
/* ======================= */

#top_menu {
  padding-left: 161px;
  height: 24px;
  background-color: #50819d;
}

#top_menu #top_menu_within {
  width: 650px;
  float: left;
}

#top_menu div {
  white-space: nowrap;
  float: right;
}

#top_menu a {
  text-decoration: none;
  font-size: 8pt;
  font-weight: bold;
  display: block;
  height: 20px;
  float: left;
  padding-top: 4px;
  color: #fcd910; 
}

#top_menu a:hover {
  color: #fff; 
}

.top_menu_spacer {
  width: 13px;
  height: 24px;
  background-image: url("../images/public/top_menu_spacer.png");
}

/* ======================= */
/*       Navigation        */
/* ======================= */

#navigation {
  position: relative;
  height: 25px;
  margin-top: 12px;
  border: 0px;
  border-bottom: 2px;
  border-style: solid;
  border-color: #fcd910;
}

#navigation div {
  float: left;
  font-size: 8pt;
  color: #777;
  padding-right: 5px;
}

#navigation a {
  font-size: 8pt;
  text-decoration: none;
  color: #005091;
}

#navigation a:hover {
  color: #4490d1;
}

#navigation .label {
  margin-left: 36px;
  color: #50819d;
  font-weight: bold;
  display: inline;
}

/* ======================= */
/*         Search          */
/* ======================= */

#navigation #search {
  position: absolute;
  left: 402px;
  top: -13px;
  height: 25px;
  width: 404px;
  color: #50819d; 
  padding: 4px;
  padding-top: 10px;
}

#search .label {
  margin-left: 0px; /* override margin set at navigation */
}

#search input {
  font-size: 9pt;
}

#search .search_field {
  width: 108px;
  margin-left: 4px;
  margin-right: 6px;
}

#search .search_button {
  width: 36px;
}

#search .label {
  margin-left: 0px;
}

#search div {
  float: right;	
}

.search_disabled {
  color: #aaf;
}

.search_header a {
  text-decoration: none;
}

.search_result {
  margin-top: 0px;
  margin-bottom: 6px;
}

.search_criteria {
  background-color: #fef790; /* Same as search stripe */
}

/* ======================= */
/*       Side Menu         */
/* ======================= */

#side_menu {
  position: absolute;
  left: 646px;
  top: 160px;
  width: 160px; 
  margin: 0px;
  padding-left: 0px;
  z-index: 2;
  border: 0px;
}

#side_menu .side_menu_section {
  width: auto;
  background-color: #d9e0ea;
  margin-bottom: 18px;
  padding-bottom: 0px;
}

#side_menu .side_menu_title {
  padding: 2px;
  padding-left: 12px;
  font-weight: bold;
  font-size: 8pt;
  background-color: #99b0ba; /* #a9c0ca; */
  color: #fff;
}

#side_menu .side_menu_link {
  cursor: pointer;
  width: 146px;
  background-color: #fafafa;
  padding: 2px;
  padding-left: 12px;
  border: 0px;
  border-bottom: 2px;
  border-style: solid;
  border-color: #c9d0da; /* #d9e0ea; */
}

#side_menu .side_menu_news_title {
  padding: 2px;
  padding-left: 12px;
  font-weight: bold;
  font-size: 8pt;
  background-color: #50819d;
  color: #fff;
}

#side_menu .side_menu_news {
  width: 142px;
  height: auto;
  background-color: #a9c0ca;
  padding: 2px;
  padding-left: 12px;
  padding-right: 6px;
  border: 0px;
  border-bottom: 2px;
  border-style: solid;
  border-color: #d9e0ea;
}

#side_menu .side_menu_compliance {
  background-color: #fff;
  padding-top: 4px;
  padding-bottom: 4px;
}

#side_menu a {
  color: #356178;
  font-weight: bold;
  font-size: 8pt;
  text-decoration: none;
  width: 136px;
  height: auto;
  display: block;
}

#side_menu .side_menu_compliance a {
  width: 0; /* Override default so width is only size of image*/
}

#side_menu a:hover {
  color: #4490d1;
  text-decoration: none;
}

#gmodules div {
  margin: 0px;
}


/* ======================= */
/*         Pages           */
/* ======================= */

#content {
  clear: both;
  position: relative; /* So position absolutes within are relative to the current content */
  margin-left: 36px;
  margin-right: 13px;
  padding-top: 20px;
  padding-bottom: 20px;
  width: 570px; 
  text-align: left;
  min-height: 545px;
  height:auto !important; /* http://www.dustindiaz.com/min-height-fast-hack  */
  height:545px;
}

.content {
  clear: both;
}

/* ======================= */
/*         Tables          */
/* ======================= */

table.tabular {
  border-collapse: 	collapse;
}

table.tabular td {
  padding: 5px;
}

.table_header td {
  background-color: #bccef5;
  color: #345071;
  font-size: 10pt;
  font-weight: bold;
  margin: 0; 
  vertical-align: top;
}

.table_content td {
  background-color: #e9f0fa;
  color: #444;
  font-size: 9pt;
  vertical-align: top;
}

/* ======================= */
/*         Bars            */
/* ======================= */

.bar_section {
  clear: both;
  background-color: #e9f0fa;
  padding-bottom: 4px;
  margin-bottom: 24px;
}

.bar_section .content {
  margin: 0px;
  margin-left: 12px;            /* Margins not padding because of IE5 and bug with float:left (.option) */
  margin-right: 16px;
  margin-top: 12px;
  background-color: #e9f0fa;
  color: #444;
  font-size: 9pt;
  
}

.bar_section .content div {
  padding-bottom: 0px;
}

.bar_section .bar {
  width: auto;
  height: 16px;
  font-size: 10pt;
  font-weight: bold;
  padding: 4px;
  padding-left: 12px;
  padding-right: 12px;
  background-color: #bccef5; /* #7091bd; */
  color: #345071;
}

.bar_section .bar .caption {
  color: #345071;
}

.contents_list .bar {
  background-color: #fef790;
  color: #356178;
}

.bar_section .option {
  width: 255px;
  margin-bottom: 6px;
  float: left;
  padding-left: 16px;
  background-image: url("../images/public/option.png");
  background-repeat: no-repeat;
}

.bar_section .option a {
  font-size: 9pt;
  color: #005091;
  font-weight: normal;
  text-decoration: none;
}

.bar_section .option a:hover {
  color: #4490d1;
}

.bar_section .subheading {
  font-size: 10pt;
}

.bar_section .para {
  margin-bottom: 12px;
}

/* ======================= */
/*        Article          */
/* ======================= */

.intro {
  font-weight: normal;
}

.sidebar {
  clear: both;
  float: right; 
  width: 248px;
  margin-left: 24px;
  margin-right: 0px;
  margin-top: 5px;
  margin-bottom: 15px;
  background-color: #e9f0fa;
}

.sidebar_heading {
  background-color: #acbef5; /* #7091bd; #fef790;  #d5d5d5; #e5e5e5; /* #d9e0ea; */
  color: #345071; /* #fff; #356178; */
  font-size: 9pt;
  font-weight: bold;
  padding: 4px;
  padding-left: 12px;
  padding-right: 12px;
}

.sidebar_content {
  padding: 12px;
  padding-right: 16px;
  font-size: 9pt;
  color: #444; /* #003051; */
}

.article_image_left {
  float: left;
  margin: 0px;
  margin-top: 5px;
  margin-right: 24px;
  margin-bottom: 15px;
  vertical-align: top;
}

.article_image_right {
  clear: right;
  float: right;
  margin: 0px;
  margin-top: 5px;
  margin-left: 24px;
  margin-bottom: 15px;
  vertical-align: top;
}

a.article_image_enlarge {
  font-size: 8pt;
}

/* ======================= */
/*      Left / Right       */
/* ======================= */

.lhs {
  position: relative; /* Somethings pos abs within */
  float: left;
  width: 249px;
}

.rhs {
  margin-left: 250px;
}

.left {
  float: left;
  width: auto;
}

.right {
  float: right;
  width: auto;
}

.right img {
  margin-left: 15px;
}

/* ======================= */
/*         Forms           */
/* ======================= */

form {
  padding: 0px;
  margin: 0px;
  border: 0px;
}

/* formSection seperates groups of formContent */
.formSection {
  margin-bottom: 20px;
}

/* formContent represents a row of a form */
.formContent {
  position: relative;
  margin-bottom: 5px;
  margin-left: 180px;
}

.formSection .subheading {
   margin-top: 20px;
   margin-bottom: 10px;
}

.formCaption {
  color: #255168;
}

/* formCaption divs sit inside formContent, offset back to the far left 
  (this technique required because "display: table" is not implemented in IE <7) */
div.formCaption {
  position: absolute;
  left: -180px;
  width: 180px;
  height: auto;
  padding-top: 2px;
}

/* When the caption is of unknown length (eg: survey question) then we must use tables for forms */
.formTable td {
  vertical-align: top;
  padding-bottom: 5px;
  padding-right: 5px;
}
.formTable td.formCaption {
  width: 180px;
}

.required {
  background-image: url("../images/public/required.png");
  background-repeat: no-repeat;
  background-position: right;
  color: #356178;
}

.para .required {
  padding-top: 2px;
  width: 90px;
  font-size: 8pt; /* When a form "key" rather than a formCaption */
}

/* ======================= */
/*     Generic styles      */
/* ======================= */

.title {
  padding-top: 0px;
  padding-bottom: 36px;
  width: 580px;
  font-size: 18pt;
  font-weight: bold;
  color: #254158;
  background-color: #fff;
}

.feedback { 
  padding-top: 20px;
  padding-bottom: 10px;
  color: #254158;
  font-size: 8pt;
  float: right;
}

.subheading {
  color: #50819d;
  font-size: 11pt;
  font-weight: bold;
}

.error {
  color: #f00;
  font-weight: bold;
  font-size: 8pt; 
}

.alert {
  color: #f00;
  font-weight: bold;
  font-size: 9pt; 
}

.caption {
  font-size: 8pt;
  font-weight: normal;
  color: #666;
  padding: 2px;
}

.para {
  width: auto;
  margin-bottom: 15px;
}

.flash {
  font-size: 10pt;
  font-weight: bold; 
  color: #c33;
}

.section {
  padding-bottom: 30px;
}

.content_clear { /* Necessary for both IE and FF after forms or .options in content */
  clear: both;
  height: 4px;
}