/*  content  */
.indented {
  margin-top: .5em;
  margin-left: 3em;
}
.indented .indented {
  margin-top: .4em;
  margin-left: 2em;
}
.indented .indented:first-letter {
  padding-top: 0em;
  padding-bottom: .5em;
  padding-left: .5em;
  border-left: .1em solid black;
}
.indented .indented.exception:first-letter {
  border: none;
}


/*  books and booklets bibliography styles  */
.source {
  /*  A source contains title, contributors,
      other biblio, notes, and excerpts.  */
    margin: 1em 1em 2em 1em;
}

.source .source {
    margin-top: 0em;
    margin-bottom: 0em;
    margin-left: 1em;
}

.title {
    display: block;
    font-size: 1.1em;
    font-weight: bold;
    font-style: normal;
}

.contributors {
    display: block;
    margin-left: 1em;
}

.biblio {
    display: block;
    margin-left: 1.1em;  /*  Compensate for change in font-size.  */
    font-size: 0.9em;
}

.note {
  /*  Make a little smaller. Indent a bit more.  */
  display: block;
  margin-left: 2.2em;  /*  Compensate for change in font-size.  */
  font-size: 0.9em;
}
.note:before {
  content: "[";
}
.note:after {
  content: "]";
}

.source .source .title {
    font-size: 1em;
    font-weight: normal;
}

.source .source .title a {
    font-weight: bold;
}

.excerpt {
  /*  Excerpts are like sources and can contain the same info.  */
  /*  Indent a little bit more to distinguish
      from the source's biblio info.  */
    display: block;
    margin-left: 2em;
}

.excerpt .title {
/*    font-size: 1.0em;
*/    font-weight: normal;
    font-style: italic;
}

.title + .biblio {
  /*  Don't decrease font-size as much since there's nothing
      between the title and the biblio.  */
  font-size: 1.0em;
  margin-left: 1em;  /*  Compensate for change in font-size.  */
}
.title + .excerpt {
  /*  Don't indent as much since there's nothing
      between the title and the excerpt.  */
  margin-left: 1em;
}
.excerpt .title + .biblio {
  /*  Don't decrease font-size as much since there's nothing
      between the title and the biblio.  */
  font-size: 0.9em;
  margin-left: 1.1em;  /*  Compensate for change in font-size.  */
}

/*  newspaper bibliography styles  */
.newspaper_source {
  /*  A newspaper source contains article title,
      article question, date, newspaper name,
      page location, and notes.  */
    margin: 1em 1em 2em 1em;
}

.newspaper_source .title {
}

.newspaper_source .question {
}

.newspaper_source .date {
    margin-left: 1em;
}

.newspaper_name {
    font-style: italic;
}

.page_location {
}

.newspaper_source .note:before,
.newspaper_source .note:after {
  content: "";
}

/*  interview bibliography styles  */
.interview_source {
  /*  An interview source contains contributors, title,
      publication name, date, and page location.  */
    margin: 1em 1em 2em 1em;
}
.interview_source a + * {
  /*  Wanted the contributors and title to be the link, but didn't want to make another container for block display. Making the <a> display as block causes the empty space spanning horizontally across the width of the page to become active. Instead, ensuring the next element is displayed as block, though it likely is already.  */
  display: block;
}
.interview_source .title,
.interview_source .contributors {
  font-size: 1.1em;
  margin-left: inherit;
  display: inline;
}
.publication_name {
  display: block;
  font-style: italic;
}
.publication_name, .interview_source .date {
  margin-left: 1em;
}

/*  illustrations bibliography styles  */
.illustration_source {
  /*  An illustration source contains contributors, title,
      publication name, date, biblio, and page location.  */
    margin: 1em 1em 2em 1em;
}
.illustration_source .date {
  margin-left: 1em;
}


/*  illustartions - images and titles  */
.illustration, .illustrations {
  margin: 1em;
  text-align: center;
}
.illustration .title,
.illustrations .title {
  clear: both;
  margin-top: 1em;
  text-transform: lowercase;
  font-family: Arial, sans-serif;
  font-size: .8em;
  font-weight: bold;
}
.illustrations {
  width: 100%;
}
.illustrations .illustration {
  display: table-cell;
  padding: 1em;
  width: 50%;
}
.illustrations .illustration img {
  width: 100%;
}


/*  footnote popups  */
.footnote_popup_shown {
  position: absolute;
  display: inline;
  z-index: 10;
  margin: 1.7em .1em 0em -3em;
  padding: .5em 1em .5em 1em;
  width: auto;
  max-width: 40%;
  text-indent: 0em;
  line-height: 1.2em;
  border: .2em solid brown; 
  -webkit-border-radius: .5em;
  -moz-border-radius: .5em;
  -webkit-box-shadow: 0em .1em .4em rgb(0, 0, 0);
  text-align: left;
  font-weight: normal;
  font-style: normal;
}
.footnote_popup_shown + a {
  outline: brown solid .2em;
  outline-offset: -.1em;
}
.footnote_popup_shown, .footnote_popup_shown + a  {
  background-color: rgb(64, 64, 64); /* IE doesn't do alpha. */
  background-color: rgba(0, 0, 0, .8);
  color: white;
}
.footnote_popup_hidden {
  display: none;
}


/*  footnotes  */
#footnote_list {
  margin-top: 3em;
  margin-bottom: 1em;
}
#footnote_list hr {
  margin: 1em 0em 1em 0em;
  width: 50%;
  border: .2em solid gray;
}
.footnote  {
  margin: 1em 0em 0em 0em;
  /* Shifts the content for emphasizing the footnote number with a negative text-indent. Similates a numbered list. */
  margin-left: 2.5em;
}
.footnote span.MsoFootnoteReference {
  float: left; /* Separates the reference number from the rest of the footnote. */
  width: 0em; /* The content will be outside the box after the text-indent happens, so collapse the width and it won't affect the footnote content. */
  text-indent: -2.5em; /* Shifts the number outside the box and balances the footnote's shifted margin. Roughly 2em for the text and .5em for extra spacing. */
	vertical-align: baseline;
  font-size: 1em;
}
span.MsoFootnoteReference {
	vertical-align: super;
  font-weight: bold;
  font-size: .7em;
}
.footnote p.outdented,
.footnote p.indented {
  margin-left: 5.1em;
  font-size: .9em;
}
.footnote .excerpt {
  margin-top: .55em;
  margin-left: 1.1em;
  font-size: .9em;
}

a.MsoFootnoteReference:link,
a.MsoFootnoteReference:visited
{
  text-decoration: none;
}

/*  classes that need replacing  */
span.MsoEndnoteReference {
  font-weight:bold;
	vertical-align:super;
  color: green;  /*  identifies for reclassing to footnote  */
}
p.MsoEndnoteText, li.MsoEndnoteText, div.MsoEndnoteText {
  margin-top: 1em;
	margin-right: 0in;
	margin-bottom: 0in;
	margin-left: .1in;
	text-indent: -.1in;
  color: green;  /*  identifies for reclassing to footnote  */
}