/* ------------------------------------------------------------ */
/* Design: pages is displayed in two-column format. The left    */
/* column is the main column; it contains the text of the page  */
/* and is set to a 33em width. The right column is used for     */
/* additional information / links etc. and is set to 10em       */
/* width.                                                       */
/* Left and right margins are 3em each; there is a 2em spacing  */
/* between the two columns.                                     */
/*                                                              */
/* +----------------------------------------------------------+ */
/* | banner (45em max width)                                  | */
/* +----------------------------------------------------------+ */
/* | left column (30em max width)        || right column      | */
/* |                                     || (13em width)      | */
/* +----------------------------------------------------------+ */
/*                                                              */
/* reset stuff */
body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dd, dt {
  font-size: 100%;
  margin: 0;
  padding: 0;
  font-weight: normal;
  font-style: normal;
}

/* Downloaded the MinionPro family of fonts from the
   fontzone.net website -- 2013-04-25 */
@font-face {
  font-family: MinionPro;
  src: url('MinionPro-Regular.otf');
}
@font-face {
  font-family: MinionPro;
  font-weight: bold;
  src: url('MinionPro-Bold.otf');
}
@font-face {
  font-family: MinionPro;
  font-style: italic;
  src: url('MinionPro-It.otf');
}
@font-face {
  font-family: MinionPro;
  font-weight: bold;
  font-style: italic;
  src: url('MinionPro-BoldIt.otf');
}

body {
  /* a width of 33em results in a 66-character average per line. Add 3em */
  /* each of left and right margin. However, use the 'max width' to      */
  /* also support narrower windows. */
  /* http://webtypography.net/Rhythm_and_Proportion/Horizontal_Motion/2.1.2/ */
  max-width: 51em;

  /* if the window is wider than the body size, center the body content in */
  /* the window. */
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
  margin-bottom: 0;

  padding: 0;

  /* explicitly set default font size */
  font-size: 130%;

  font-family: MinionPro, "Bitstream Charter", Georgia, Times New Roman, Times, serif;

  background-color: #fff3f3;
  color: #440000;
}
div.content {
  margin: 0;
  padding-left: 3em;
  padding-right: 3em;
  padding-top: 0;
  padding-bottom: 2em;
  background-color: #ffffff;
}
@media screen and (max-width: 45em) {
  div.content {
    padding-left: 6.66%;
    padding-right: 6.66%;
  }
}

div.banner {
  padding-top: 1.5em;
  padding-bottom: 1.5em;
}

div.content-right {
  clear: both;
  float: right;
  width: 16em;
  padding: 0.5em;
  padding-left: 1.5em;
  margin-left: 0.8em;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 80%;
  color: #663333;
  text-align: right;
  margin-top: 1.85em;
}
div.content-right-first {
  margin-top: 0.1em !important;
}
div.content-right h2 {
  margin: 0;
  color: #663333;
  border-bottom: dotted 1px #663333;
}
div.content-right ul {
  margin-top: 0.5em;
}
div.content-right li {
  list-style-type: none;
}
div.content-right li a,
div.content-right li a:hover, div-content-right li a:visited {
  text-decoration: none;
  color: #663333;
}
div.main {
  max-width: 30em;
}
/* h1 is used for page header / banner */
h1 {
  margin: 0;
  text-align: center;
  border: solid 1px #440000;
  padding: 0.2em;
  font-family: Crimson, Spatha, Arial, Helvetica, sans-serif;
  color: #440000;
  background-color: #ff7f7;
  font-size: 3em;
  font-weight: 600;  /* using demi-bold version */
}

h2 {
  font-size: 150%;
  text-align: right;
  border-bottom: solid 1px #440000;
  margin-bottom: 1em;
  margin-top: 1em;
  padding-top: 0.66em;
  padding-bottom: 0.33em;
  color: #440000;
}
/* Exception for first chapter: no top margin */
h2#ch1 {
  margin-top: 0;
}
p {
  /* for wider columns, justified seems to work best, see: */
  /* http://webtypography.net/Rhythm_and_Proportion/Horizontal_Motion/2.1.3/ */
  text-align: justify;

  /* word-spacing, see: */
  /* http://webtypography.net/Rhythm_and_Proportion/Horizontal_Motion/2.1.1/ */
  word-spacing: 0.25em;

  /* inter-character spacing, see: */
  /* http://webtypography.net/Rhythm_and_Proportion/Horizontal_Motion/2.1.3/ */
  text-justify: inter-character;

  /* line height is 150% of font size - extra line height makes it easier */
  /* to read, and there is plenty of vertical space on the Web. */
  /* http://webtypography.net/Rhythm_and_Proportion/Vertical_Motion/2.2.1/ */
  line-height: 1.5;

  margin-top: 0;
  margin-bottom: 0;

  font-size: 1em;
}

p + p {
  text-indent: 1.5em;
}

p.first {
  text-indent: 0;
}

p.break {
  text-align: center;
  text-indent: 0;
  margin-top: 1em;
  margin-bottom: 1em;

  /* below, settings to replace the asterisks with a double line */
  font-size: 1pt;
  width: 20%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 20em;
  margin-bottom: 20em;
  border-top: solid 1px #440000;
  border-bottom: solid 1px #440000;
  color: #ffffff;
}

p.break2 {
  text-align: center;
  text-indent: 0;
  margin-top: 1em;
  margin-bottom: 1em;
}

abbr {
  /* aply letter spacing to abbreviations */
  /* http://webtypography.net/Rhythm_and_Proportion/Horizontal_Motion/2.1.6/ */
  letter-spacing: 0.1em;
}

p.end {
  margin-top: 3em;
  margin-bottom: 1em;
  text-align: center;
}
