body { position: relative; background-color: #efefff; min-width: 40em; }
div.topbar { width: 100%; height: 3em;
	     background-color: #1d253d; color: #c0c0ff;
	     border-bottom: 2px solid #f7ca00; 
	     z-index: 1;
	     overflow: hidden;  /* Fixes some bonkers sizing behavior */
	   }			/* below topbar when contents oflow. */
div.topbar div { height: 100%; width: 10em; float: right; }
div.topbar div.boxlink span { line-height: 3em; white-space: nowrap}

/* The sidebar strange padding and bottom margin, combined with the
   the overflow: hidden style in barbodwrap, which wraps the body and
   the sidbar together, allows the sidebar to have take height of the 
   body (with the 50em minimum specified). */
div.sidebar { width: 7em;
	      background-color: #222b48; color: #c0c0ff;
	      padding-top: 1em;
	      padding-bottom: 1em;
	      border-right: 2px solid #f7ca00;
	      min-height: 50em;
	      z-index: 3;
	      padding-bottom: 50in;
              margin-bottom: -50in;
	    }
div.barbodwrap { overflow: hidden; position: relative; top: -2px; }

/* Common styles for both link boxes and link section headers
   appearing in the left side bar. */
div.sidebar a div.boxlink, div.sidebar div.boxa div.boxlink,
	div.sidebar div.subhead {
    width: 100%; min-height: 1.3em;
    padding-top: 2px;
    text-align: center;
}

span.subhead:before { content: "\25BC"; }

/* Style for subheadings on sidebar. */
div.sidebar span.subhead {
    /*text-decoration: underline;*/
    color: #a0d0ff;
    font-size: 80%;
}

/* The body size and padding, and location with the left side bar. */
div.body { 
    width: -moz-calc(100% - 7em - 8pt - 2px);
    width: -webkit-calc(100% - 7em - 8pt - 2px);
    width: calc(100% - 7em - 8pt - 2px);
    padding-top: 4pt;
    padding-left: 8pt;
}
div.sidebar, div.body { float: left; }

/* Styling of link text on either bar. */
div.sidebar a, div.topbar a { 
    color: #a0d0ff;
    text-decoration: none;
    border: none;
    font-size: 80%;
}

/* Fake Javascript link. */
div.boxa {
    color: #a0d0ff;
    font-size: 80%;
    border: none;
}

div.boxlink, div.subhead {
    text-align: center;
    border: 1pt solid transparent;
}
div.boxlink.selflink {
    /* border-left: 1pt solid #f7ca00; */
    background-color: #403F55;
}

/* Changes the right-side-index box on hover, but disables for the
   current box. */
div.boxlink:hover {
    background-color: #333b58;
    border: 1pt solid #434b68;
}
div.boxlink.selflink:hover { 
    background-color: inherit;
    border: 1pt solid transparent;
    /* border-left: 1pt solid #f7ca00; */
    background-color: #403F55;
    /* background-color: #352F55; */
}

span.title {
    font-size: 180%;
    color: #f7ca00; 
    font-family: 'Philosopher', sans-serif;
    padding-left: 2pt;
}
span.mclink { font-family: 'Courgette', cursive, sans-serif;  }
span.homelink { font-family: 'Courgette', cursive, sans-serif }
span.indexlink { font-family: sans-serif; font-style: italic }

/* Submenus on the left. */
div.indexdrop { position: relative; }
div.indexdrop + a.boxa div.boxlink,
	div.indexdrop + div.boxa div.boxlink, 
	div.indexdrop + div.indexdrop {
    margin-top: 5pt;
}
div.subhead { margin-bottom: -5pt; }
div.indexsub {
    width: 7em; 
    background-color: #352F55;
    z-index: 10;
    position: absolute; left: 4pt; 
    border-top: 1px solid #f7ca00; 
    border-left: 1px solid #f7ca00;
    border-bottom: 1px solid #453F65;
}
div.indexdrop div.indexsub { visibility: hidden; }
div.indexdrop:hover div.indexsub {
    visibility: visible;
    /* position: relative; left: 1em; */
    margin-left: 1em;
}
div.indexdrop.selflink:hover div.indexsub {
    margin-left: 0;
}

/* Non-drop-down submenus. */
span.sublink, div.condsubl { margin-left: 1em; font-size: 70%; }
div.condsubl {
    border-left: 1px groove #f7ca00;
    border-top: 1px groove #f7ca00;
    border-bottom: 1px groove #f7ca00;
}

/* When we're at a page inside the dropdown, it stops dropping. */
div.selflink div.indexsub {
    position: relative;
    visibility: visible;
    /* position: relative; left: 1em; */
    z-index: 9;
}

/* This usually looks better than <sup> and <sub> */
span.sup { position: relative; bottom: 4pt; font-size: 80%;  }
span.sub { position: relative; top: 3pt; font-size: 80%;  }

/* Using h2 and h3 for section headers. */
h2.sec, h3.sec { text-decoration: underline; font-size: 120%;
	 font-family: sans-serif; font-weight: bold; 
	 color: #000044; }
h2.sec { font-size: 120%; margin-top: 8pt; margin-bottom: 1pt; 
	 position: relative; left: -2pt; }
h3.sec { font-size: 110%;
         margin-top: 4pt; margin-bottom: 1pt; left: -2pt; }
h3.sec + p { margin-top: 2pt; }

/* Stuff. */
.lft { text-align: left; }
.rgt { text-align: right; }
.cen, .ctr { text-align: center; }
.bd { font-weight: bold; }
.it { font-style: italic; }
.tt { font-family: monospace; }
.ul { text-decoration: underline; }
.grbig { font-size: 120%; }
.big { font-size: 110%; }
.sans { font-family: sans-serif; }
.mono { font-family: courier, monospace; }

ol, ul { margin-bottom: 3pt; }
li { margin-top: 3pt; }
p + ul, p + ol, div.par + ul, div.par + ol {
    margin-top: 0pt; padding-top: 0pt;
}
h2.sec + p, h3.sec + p, h2.sec + div.par, h3.sec + div.par {
    margin-top: 0
}
p, div.par { margin-bottom: 0; margin-top: 0; }
ul + p, ol + p, p + p, ul + div.par, ol + div.par, div.par + div.par,
	p + div.par, div.par + p {
   margin-top: 10pt;
}
ul + h2.sec, li + h2.sec { margin-top: 12pt; }
ul + h3.sec, li + h3.sec { margin-top: 10pt; }
ul + p.cont, ol + p.cont { margin-top: 0pt; }

a { color: #2255ff; text-decoration: none; }
a:hover { text-decoration: underline }