/* **********************************************************************
   layout
   ********************************************************************** */

div#outer-wrapper, div#outerWrapper {
  width:960px;
  position:relative; /* the header takes its starting point from this div */
  margin:0 auto; /* center the layout */
  background-position:left top;
  background-repeat:repeat-y;
  background-color:#fff;
}
body div#outer-wrapper {
  background-image:url(/images/fake-left-col-142.gif);
}
body.alfa div#outer-wrapper {
  background-image:url(/images/fake-left-right-cols-142-135.gif);
}
div#inner-wrapper, div#innerWrapper {
  width:100%;
  position:relative; /* the page info takes its starting point from this div */
}
div#header {
  line-height:1;
}
div#local-nav {
  width:132px;
  position:relative;
  left:-795px;
  margin-top:162px; /* matches starting point of left rail content on old-style pages */
  padding-bottom:46px; /* clearance for the page info */
}
body.charlie div#local-nav {
  position:relative;
  left:-808px;
}
div#main-content {
  float:left;
  position:relative;
  left:152px;
  margin-top:91px; /* has to clear the header */
  padding-bottom:92px; /* need to allow enough room for the page info */
}
div#page-variables {
  position:absolute; 
  left:152px; /* to align with left edge of content DIV */
  bottom:0.5em; /* sits at bottom of inner wrapper */
  font-size:11px;
}
div#sidebar {
  float:left; /* to align with right edge of outer wrapper */
  position:relative;
  left:165px;
  margin-top:91px; /* has to clear the header */
  padding:0;
  display:inline; /* for IE6 doubled float-margin bug??? */
  background-color:transparent;
  font-size:13px;
  padding-bottom:46px; /* clearance for the page info */
}
div#footer {
  width:953px; /* width of outer wrapper minus 7px of white space at left */
  float:right; /* to align with right edge of outer wrapper, leaving white space at left */
  padding:0;
  background-image:url(/images/footer-bg.gif); /* i need to rename this image!!! */
  background-position:left top;
  background-repeat:repeat-x;
  background-color:#324395;
  color:#fff;
}
body.alfa div#main-content, 
body.alfa div#page-variables {
  width:663px;
}
body.bravo div#main-content,
body.bravo div#page-variables {
  width:530px;
}
body.alfa div#sidebar {
  width:132px;
}
body.bravo div#sidebar {
  width:265px;
}
body.charlie div#main-content {
  width:808px;
}

/* ----------------------------------------------------------------------
   clearfix - see http://www.webtoolkit.info/css-clearfix.html
   ---------------------------------------------------------------------- */
   
.clearfix:before,
.clearfix:after {
  content: ".";
  display: block;
  overflow: hidden;
  visibility: hidden;
  font-size: 0;
  line-height: 0;
  width: 0;
  height: 0;
}
.clearfix:after {
  clear: both;
}
.clearfix {
  zoom: 1;
}
* html .clearfix {
  height: 1%;
}

/* **********************************************************************
   local nav
   ********************************************************************** */

/* ----------------------------------------------------------------------
   dynamically applied classes

   lnt-item:
      indicates a list item is part of the navigation trail

   lnt-link:
      indicates a link is part of the navigation trail (for IE6)

   lnt-first-item:
      indicates a list item is the first item in the navigation trail

   lnt-last-item:
      indicates a list item is the last item in the navigation trail or 
      is part of the last submenu being displayed

   lnt-penul-item:
      indicates a list item is the penultimate item in the navigation trail

   lnt-gen-item:
      indicates a list item is part of the navigation trail but is neither 
      the first nor last nor penultimate item

   lnt-last-menu:
      indicates there are no more submenus below a certain level
   ---------------------------------------------------------------------- */

div#local-nav ul {
  list-style:none; /* don't know why this should be necessary! */
}
div#local-nav ul, div#local-nav ul ul {
  margin:0;
  padding-top:0;
  padding-bottom:0;
  list-style:none;
  line-height:normal; /* to preserve appearance of old-style nav */
}
div#local-nav ul {
  padding-left:6px;
  padding-right:6px;
}
div#local-nav ul ul {
  padding-left:4px;
  padding-right:0;
}
.js div#local-nav ul ul {
  padding-left:0;
}
.js div#local-nav ul li.lnt-last-item ul, 
.js div#local-nav ul ul.lnt-last-menu {
  position:relative;
  left:-6px;
}
div#local-nav ul {
  text-align:left;
}
div#local-nav ul li, 
.js div#local-nav ul ul li.lnt-item {
  margin-top:0;
  padding-bottom:0;
  background:none;
}
div#local-nav ul a, 
.js div#local-nav ul span {
  width:100%;
  display:block;
  font-size:8pt;
}
div#local-nav ul a:link,
.js div#local-nav ul li.lnt-item a:link {
  color:#4d4d4d;
  text-decoration:none;
}
div#local-nav ul a:visited,
.js div#local-nav ul li.lnt-item a:visited {
  color:#4d4d4d;
  text-decoration:none;
}
div#local-nav ul a:hover,
.js div#local-nav ul li.lnt-item a:hover {
  color:#bf0023;
  text-decoration:none;
}
div#local-nav ul a:active,
.js div#local-nav ul li.lnt-item a:active {
  color:#4d4d4d;
  text-decoration:none;
}
.js div#local-nav ul li.lnt-last-item ul, 
.js div#local-nav ul ul.lnt-last-menu {
  display:block;
  width:122px;
  margin-top:0;
  margin-left:0;
  margin-bottom:3px;
  border-top:2px solid #324395;
  border-bottom:2px solid #324395;
  padding:4px 5px;
  background-color:#fff;
  text-indent:0;
  text-align:right;
}
.js div#local-nav ul ul {
  margin:0;
  border:none;
  padding:0;
  background-color:transparent;
  text-align:left;
}
.js div#local-nav ul ul a:link,
.js div#local-nav ul li.lnt-last-item ul a:link, 
.js div#local-nav ul ul.lnt-last-menu a:link {
  color:#4d4d4d;
  text-decoration:none;
}
.js div#local-nav ul ul a:visited,
.js div#local-nav ul li.lnt-last-item ul a:visited, 
.js div#local-nav ul ul.lnt-last-menu a:visited {
  color:#4d4d4d;
  text-decoration:none;
}
.js div#local-nav ul ul a:hover,
.js div#local-nav ul li.lnt-last-item ul a:hover, 
.js div#local-nav ul ul.lnt-last-menu a:hover {
  color:#00f;
  text-decoration:none;
}
.js div#local-nav ul ul a:active,
.js div#local-nav ul li.lnt-last-item ul a:active, 
.js div#local-nav ul ul.lnt-last-menu a:active {
  color:#4d4d4d;
  text-decoration:none;
}
.js div#local-nav ul li.lnt-last-item span.lnt-span, 
.js div#local-nav ul li.lnt-last-item a.lnt-last-link {
  font-weight:bold;
}
div#local-nav ul a, 
.js div#local-nav ul ul li.lnt-item a,
.js div#local-nav ul ul li.lnt-item span {
  padding-top:2px;
  padding-bottom:6px;
}
.js div#local-nav ul ul a, 
.js div#local-nav ul li.lnt-last-item ul a, 
.js div#local-nav ul li ul.lnt-last-menu a,
.js div#local-nav ul li ul.lnt-last-menu span {
  padding-top:2px;
  padding-bottom:1px;
}

/* ----------------------------------------------------------------------
   rules for displaying list items
   (the order in which these rules appear is CRITICAL!)
   ---------------------------------------------------------------------- */

.js div#local-nav ul ul li, 
.js div#local-nav ul li.lnt-gen-item ul li, 
.js div#local-nav ul li.lnt-penul-item ul li {
  display:none;
}
.js div#local-nav ul li.lnt-item, 
.js div#local-nav ul li.lnt-last-item,
.js div#local-nav ul ul.lnt-last-menu li {
  display:list-item !important;
}
.js div#local-nav ul li.lnt-last-item ul ul {
  display:none;
}

/* ----------------------------------------------------------------------
   breadcrumbs
   ---------------------------------------------------------------------- */

.js div#breadcrumbs {
  visibility:hidden;
  height:2em;
  overflow:hidden;
}
.js ul#breadcrumb-links {
  margin-left:0;
  padding-left:0;
  list-style:none;
  font-size:11px;
}
.js ul#breadcrumb-links li {
  display:inline;
}
.js div#breadcrumbs {
  padding-bottom:0.25em;
}
.js div.index div#breadcrumbs,
.js div.destination div#breadcrumbs {
  border-bottom:1px solid #eee;
}

/* **********************************************************************
   general dynamic styles
   ********************************************************************** */

/* ----------------------------------------------------------------------
   sortable tables
   ---------------------------------------------------------------------- */

.js table.sortable thead tr .header {
  padding-left:15px; /* create space for the background images */
  background-image: url(/images/sort-arrows-454545.gif);
  background-repeat: no-repeat;
  background-position: 4px center;
}
.js table.sortable thead tr .sorttable_sorted {
  background-image: url(/images/sort-arrow-fwd-454545.gif);
}
.js table.sortable thead tr .sorttable_sorted_reverse {
  background-image: url(/images/sort-arrow-rev-454545.gif);
}
.js table.sortable thead tr .header a {
  border-bottom:1px solid #bf0023;
}
.js table.sortable thead tr .header a:link {
  color:#bf0023;
}
.js table.sortable thead tr .header a:visited {
  color:#bf0023;
}
.js table.sortable thead tr .header a:hover {
  border-bottom:none;
  color:#bf0023;
  text-decoration:none;
}
.js table.sortable thead tr .header a:active {
  color:#bf0023;
}

/* ----------------------------------------------------------------------
   table-filter forms
   ---------------------------------------------------------------------- */

.js form.table-filter {
  clear:both;
  margin:0;
  padding:0;
  background-color: #eee;
  padding: 6px;
  text-align: center;
}
.js form.table-filter fieldset {
  /* border:1px solid #ccc; */
  border:none;
  padding: 0;
}
/*
.js form.table-filter legend {
  font-weight: bold;
  padding-bottom: 4px;
}
*/
.js form.table-filter label {
  display: inline;
}
.js form.table-filter legend, 
.js form.table-filter label, 
.js form.table-filter select, 
.js form.table-filter input {
  font-size: 11px;
  margin: 0 2px;
}

/* ----------------------------------------------------------------------
   ajax regions
   ---------------------------------------------------------------------- */

.js div.ajax {
  text-align:left;
  font-size:11px;
}
.js div.ajax h2 {
  text-align:center;
  font-size:13px;
}
.js div.ajax ul li {
  margin-bottom:0.75em;
}
.js div.ajax-loading {
  width:100%;
  display:block;
  margin-top:0.75em;
  height:22px;
  background: #eee url(/about/offices/owb/images/loading.gif) no-repeat center 5px;
}

/* ----------------------------------------------------------------------
   teasers on menu- and index-level pages
   ---------------------------------------------------------------------- */

.js div.main-section p.teaser, 
.js div.index p.teaser {
  clear:both;
  margin-top:0;
}