@import '../shared/gallery.css?v=200812';
@import '../shared/sharing.css';

/* Resets & overrides ------------------------------------------------------ */
html {
  background: none;
}

/* Firefox has an unfortunate habit of showing the right scrollbar when a page is long and hiding
   it when the page doesn't reach below the fold, thus creating an undesireable "jump".
   This "fixes" the jump by keeping the scroll bar displayed at all times. */
html { overflow-y: scroll; }

table.no-border-cell td {
  border: none;
}

/* Links & type ------------------------------------------------------------ */
body {
  background-color: #000;
  color: #000;
  margin: 0;
}

/* Design framework images ------------------------------------------------- */
#wrap { /* Background watermark */
  background-color: #000;
  min-width: 990px; /* 1024x768 min screen rez */
}

/* Main layout ------------------------------------------------------------- */
#title {
  height: 75px;
  position: relative;
}

#title h1, #title h2, #title h3, #title h4 {
  color: #fff;
  margin: 0;
}

/* Article headline */
#title h1 {
  font: normal 200% Arial;
  margin-left: 240px;
  padding-top: 10px;
}

/* Article tagline */
#title h2 {
  font: normal 125% Arial;
  margin-left: 240px;
  padding-top: 5px;
}

/* Article byline */
#title h3 {
  font: normal 150% Arial;
  position: absolute;
  right: 35px;
  top: 13px;
}

/* Article publish date */
#title h4 {
  font: bold 100% Arial;
  position: absolute;
  right: 35px;
  top: 49px;
}

#container {
  overflow: auto; /* Float containment */
}

/* IE6 "overflow: auto;" is not enough to contain the float, need to trigger "hasLayout" */
body.ie6 #container { height: 1%; }

#nav {
  float: left;
  padding: 5px 10px;
  width: 215px;
}

/* Navigation list of articles */
#nav ul {
  border-top: 2px solid #fff;
  margin: 0;
}

#nav li {
  border-bottom: 2px solid #fff;
  font-size: 110%;
  list-style: none;
}

#nav li a {
  color: #fff;
  display: block;
  padding: 5px 5px 5px 10px;
  text-decoration: none;
}

/* IE6 ignores "display: block;" rule, unless we trigger "hasLayout" */
body.ie6 #nav li a { height: 1%; }

#nav a:hover, #nav li#current {
  background-color: #333;
}

/* Article content */
#content {
  background-color: #fff;
  color: #000;
  margin: 0 30px 0 235px; /* Left/right margins match background image widths */
  padding: 5px;
}

#content3 {
  overflow: hidden; /* float containment */
}

/* IE6 "The IE6 Three Pixel Text-Jog" http://www.positioniseverything.net/explorer/threepxtest.html */
body.ie6 #content table { margin-right: -3px; }

/* Blogs ---------------------------------------------------------------------- */
.fullBlogArticle a:link, .fullBlogArticle a:visited, .fullBlogArticle a:hover,
.blogArticle a:link, .blogArticle a:visited, .blogArticle a:hover {
  color: #fff;
}

/* Blog - Articles Displayed in Full */
.fullBlogArticle {
  border-bottom: 2px solid #000;
  margin-bottom: 2em;
  padding-bottom: 2em;
}

.fullBlogArticle .blogArtHead {
  font-size: 153.9%;
  margin: 0 0 .25em;
}

.fullBlogArticle .blogArtHead a:link, .fullBlogArticle .blogArtHead a:visited, .fullBlogArticle .blogArtHead a:hover {
  color: #000;
}

.fullBlogArticle .blogArtTag {
  font-size: 123.1%;
  margin: 0 0 .25em;
}

.fullBlogArticle .blogArtByline {
  font-size: 93%;
  font-weight: bold;
}

.fullBlogArticle .blogArtComments {
  margin: 1em 0;
  padding-left: 8px;
}

.fullBlogArticle .blogArtComments a {
  font-weight: bold;
  padding-left: 5px;
}

/* Blog - Article Abstracts */
.blogArticle {
  margin-bottom: 1em;
  padding-bottom: .5em;
}

.blogArticle .blogArtHead {
  margin: 0 0 .25em;
}

.blogArticle .blogArtTag {
  margin: 0 0 .25em;
}

.blogArticle .blogArtByline {
  font-size: 93%;
}

.blogArticle .blogArtAbs img {
  padding: 0 5px 0 8px;
}

.blogArticle .blogArtAbs span {
  font-size: 93%;
}

/* Related Sites -------------------------------------------------------------- */
.relatedSites {
  border-bottom: 1px solid #ddd;
  clear: both;
}

.relatedSites h3 {
  border-bottom: 1px solid #ddd;
  font-size: 1em;
  line-height: 1em;
  margin: 0;
  padding: 0 0 .25em;
}

.relatedSites p {
  margin: .5em;
}

.relatedSites ul {
  margin: .5em;
  padding: 0 0 0 1.2em;
}

/* Feedback ------------------------------------------------------------------- */
#feedbackBox {
  clear: both;
  padding: 2.5em 0 1em;
}
body.ie6 #feedbackBox { height: 1%; }

#feedbackBox h3 {
  background: #333 url(images/icon_feedback.gif) no-repeat scroll 5px 7px;
  color: #fff;
  font-size: 1em;
  margin: 0;
  padding: .3em 0 .3em 23px;
}

#feedbackBox table {
  font-size: .9em;
  margin-bottom: 0;
  width: 100%;
}

#feedbackBox tr.rowA td { background-color: #fff; }
#feedbackBox th, #feedbackBox tr.rowB td { background-color: #ddd; }

#feedbackBox th, #feedbackBox td {
  border: 0;
  color: #000;
}

#feedbackBox th { white-space: nowrap; }

#feedbackBox th#postedBy { width: 15%; }

#feedbackBox td { vertical-align: top; }

#feedbackBox td span { display: none; }

#feedbackBox p {
  background-color: #333;
  color: #fff;
  font-size: .9em;
  margin: 0;
  padding: .5em;
}

#feedbackBox a { font-weight: bold; }

#feedbackBox p a:link, #feedbackBox p a:visited {
  color: #fff;
  text-decoration: none;
}

#feedbackBox p a:hover {
  color: #eee;
  text-decoration: underline;
}

#feedbackBox .backgroundError { background-color: #ddd; }

#feedbackBox .formItems label {
  display: block;
  float: left;
  text-align: right;
  width: 170px;
}

#feedbackBox p.formItems span {
  display: block;
  margin-left: 180px;
}

#feedbackBox p.formItems span label {
  display: inline;
  float: none;
  margin: 0;
  padding: 0;
  width: auto;
}

#feedbackBox .formItems input, #feedbackBox .formItems textarea { width: 95%; }

#feedbackBox #fbYes, #feedbackBox #fbNo { width: auto; }

#feedbackBox .formItems span.spacer {
  clear: both;
  display: block;
  height: 1px;
  overflow: hidden;
}

#feedbackBox .formButtons { text-align: center; }

#feedbackBox noscript {
  color: #000;
  font-weight: bold;
}

body.ie6 #feedbackBox p.formItems span label { position: relative; }

#extraDiv1, #extraDiv2, #extraDiv3, #extraDiv4, #extraDiv5, #extraDiv6 {
  display: none;
}

.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}
body.ie6 .clearfix, body.ie7 .clearfix { zoom: 1; }

.hideBlogLink {
  display: none;
}