/* CSS for the Blog */

.blog-entry .tags { margin: 2em; }

.blog-entry-date {
  margin: 0.5em 1em 1em 1em;
  font-size: 10pt;
  text-align: right;
}

.blog-entry-title {
  font-size: 26pt;
  text-decoration: none;
  margin: 0 0 1em -0.2em;
}

.blog-entry-title a          { text-decoration: none; }

.blog-entry-title a:link,
.blog-entry-title a:visited,
.blog-entry-title a:active   { color:#000000; }

.blog-entry-title a:hover    { color:#4899AA; }

.blog-entry-body h2 { margin-left: 0.0em; }
.blog-entry-body h3 { margin-left: 0.3em; }
.blog-entry-body h4 { margin-left: 0.6em; }
.blog-entry-body h5 { margin-left: 0.9em; }
.blog-entry-body h6 { margin-left: 1.2em; }

.blog-entry-body img { padding: 0.75em; }

.blog-entry-spacer {
  height: 0.1em;
  background: #69B5E1;
  margin: 3em 6em 1.5em 6em;
}

.non-public-blog-entry {
  margin: 0em;
  padding: 0.5em;
  color: inherit;
  font-weight: inherit;
  overflow: auto;
}

/*== Useful for placing images in common locations ==*/
/** TODO maybe these could be removed?  double check output */
/* Have an image anchored to the right side,
   But allows text to the left of it. */
.on-right {
  margin-top: 0;
  float: right;
  display: inline-block;
}

/* Have an image anchored to the left side,
   But allows text to the right of it. */
.on-left {
  margin-top: 0;
  float: left;
  display: inline-block;
}

/* Something I use a lot for posts;
   Makes an orange box with a thick-left margin indentation */
.special-note {
  background: #FFFBF2;
  padding: .5em;
  margin-left: 4em;
  border: .1em solid #E86A0B;
  border-radius: .25em;
}

/* Have an image centered, (no text on left/right edges) */
img.in-center {
  margin: 0 auto;
  text-align: center;
  display: block;
}

figcaption {
  margin-top: -0.75em;
  color: #444444;
  text-align: center;
  font-size: 10pt;
  font-style: italic;
}