body{
  font-size: 100%;
  font-family:arial, verdana, tahoma;
}

a {color: #e70e0e; } /*this is the color of the red pixel in the elliott tartan picture */
a:visited { color: #0000FF; /*#9999CC;*/ }
a:hover { color: #B40404 /*#6666CC*/; }
hr {border-top: #e70e0e; } 
hr.sep {border-top:1px solid #ccc;}

/*span, ul,ol { font-size: 12px; font-family: verdana,arial, geneva, helvetica, sans-serif }*/
/*p { font-size: 1em; font-family: verdana,arial, geneva, helvetica, sans-serif } */
table,td,caption  { font-size: 13px; font-family: verdana,arial, geneva, helvetica, sans-serif}
th        { font-size: 13px; font-family: verdana,arial, geneva, helvetica, sans-serif; text-decoration: none}
h1        { font-size: 1.2em;  color: #b22222 }
h2        { font-size: 1em; text-decoration:bold;color: #b22222; }
h3        { font-size: 14px; font-family: verdana,arial, geneva, helvetica, sans-serif; }
li        { padding-bottom:6px; }
a.navbar {
/*  color:#b22222;*/
  font-size:.85em;
}
.story_navlink {font-size:.85em; color:green;text-decoration:none;}
.nextbn {
    float: right;
	width: 100px;
}
.prevbn {
    float: left;
	width: 100px;
}
.menubn {
    float: left;
	width: 200px;
  padding-left:20%;
  padding-right:20%;
}

.topnav{
	font-size: 1em;
    padding-top:4px;
}
.topnav div{
	display:block;
	background-color: white;
	color: black;
	text-decoration: none;
	border-bottom: 1px solid #b9b9b9;
	border-top: 1px solid #b9b9b9;
	margin-right:10px;
	text-align:center;
}
.topnav a {
	display:block;
	padding: 4px 4px;
	background-color: white;
	text-decoration: none;
	color: #e70e0e;
}
.topnav a:hover{
	background-color: white;
	color: #B40404;
}
#toclink {font-size:.85em;text-align:center;}
#toc {text-align:left; 
  border-top: 1px solid #b9b9b9;
  border-bottom: 1px solid #b9b9b9;
}

#topnavbar { padding-left:60px;}
#header {width:75%;}
#footer {width:75%;}

.subtitle {font-size:.85em; padding-left:10px; color:black;}

.mono {font-family: "Courier New",Courier,mono}
.serif {font-family: "Times New Roman",Times,serif }
.sansserif {font-family: Arial,Helvetica,"sans serif" }

.bold {font-weight: bold; }
.nobold {font-weight: Normal; }
.italic {font-style: italic; }

.copyright { font-size: 10; font-weight: Normal; font-family: "sans-serif" }
div.bodytext  { width:75%; }
.figure    { font-size: 10; font-weight: bold; font-family: "sans-serif"; }
.ref {
  font-weight: bold;
  font-style: italic;
  font-family: sans-serif;
}
.quote {font-size:1em; font-style:italic; }
.quotation {margin-left:20px;font-style:italic;color:#6666CC;}
#manifest td, th {border:1px solid black; padding: 2px;}
th.timeline {border:1px solid #6666CC; padding: 2px;width:10%;}
td.timeline {border:1px solid black; padding: 2px;vertical-align:top;}

/* footnote styles */
hr.footnote_sep { width:25%; text-align:left; margin-left:0; }
p.footnote_text { font-style:italic; }
p.firstline { margin-top:0; }


/* sidepic and footnote/sidenotes */
div.sidepic{
  border: 1px solid #ccc;
  float:right;
  width:8em;
  margin-left:.3em; margin-right:-.3em;
}
div.leftpic{
  border: 1px solid #ccc;
  float:left;
  width:8em;
  margin-right:.3em;
}
.sidepic, .leftpic p{
  margin:0;
  font-style:normal;
      color:#6666CC;
  font-size:.75em;

}
div.sidenotes{
    display: block;
    float:right;
    width: 30%;
/*    height: 400px; */
    border: 1px solid #ccc;
    margin-left: .6em;
    padding:.3em;
    color:;
    font-size:.83em;
    font-style:italic;
}
span.sidenotes{
      color:#6666CC;
    font-size:.83em;
    font-style:italic;
    margin-left:.5em;
}
p.comment{
    color:#6666CC;
    font-size:1em;
    font-style:italic;
}
.footnote {font-weight:bold; font-style:normal; color:#b22222;}

/* lightbox */
#wrapper {
    width:600px; 
    margin:0 auto; /*centers the div horizontally in all browsers (except IE)*/
    background:#fff; 
    text-align:left; /*resets text alignment from body tag */
    border:1px solid #ccc;
    border-top:none; 
    padding:25px; 
    /*Let's add some CSS3 styles, these will degrade gracefully in older browser and IE*/
    border-radius:0 0 5px 5px;
    -moz-border-radius:0 0 5px 5px;
    -webkit-border-radius: 0 0 5px 5px; 
    box-shadow:0 0 5px #ccc;
    -moz-box-shadow:0 0 5px #ccc;
    -webkit-box-shadow:0 0 5px #ccc;
}        
#lightbox {
    position:fixed; /* keeps the lightbox window in the current viewport */
    top:0; 
    left:0; 
    width:100%; 
    height:100%; 
    background:url(overlay.png) repeat; 
    text-align:center;
}
#lightbox p {
    text-align:right; 
    color:#fff; 
    margin-right:20px; 
    font-size:12px; 
}
#lightbox img {
    box-shadow:0 0 25px #111;
    -webkit-box-shadow:0 0 25px #111;
    -moz-box-shadow:0 0 25px #111;
    max-width:940px;
}
hr.sep {border:1px solid #ccc;}

.arrow-up {
  width: 0; 
  height: 0; 
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  
  border-bottom: 5px solid black;
}

.arrow-down {
  width: 0; 
  height: 0; 
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  
  border-top: 20px solid #f00;
}