@font-face {
  font-family: 'AfterHeadlineLight';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/AfterHeadlineLight/AfterHeadlineLight.woff2') format('woff2'),
	   url('/fonts/AfterHeadlineLight/AfterHeadlineLight.woff') format('woff'),
 	   url('/fonts/AfterHeadlineLight/AfterHeadlineLight.ttf') format('truetype');
}
address
{
	font-style: normal;	/* Italics in the sidebar breaks links in the main div */
}
body
{
	margin: 12px;
	border: none;
}
body,
pre,
td,
th
{
	font-size: medium;
}
body,
td,
th
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
cite
{
	font-style: italic; /* Make IE match Firefox */ 
}
del 
{
	color: #999999;
}
form,
fieldset
{
	margin: 0;
	padding: 0;
	border: none;
}
h1
{
	font-weight: normal;
	font-size: medium;
}
ins,
ins *
{
	text-decoration: none;
	background-color: #ffffe7;
}
a img.iStructure 
{
	background-color: white;	/* This prevents yellow bars to the left and right of the image on the last (inserted) row of the TiHKAL browse page */
}
pre
{
	font-family: "Courier New", Courier, monospace;
}
img
{
	border: none;
}
table
{
	border: none;
}
td
{
	vertical-align: top;
}
td img
{
	display: block;
}
th
{
	font-weight: normal;
}
img.iStructure
{
	border: #e0e0e0 1px solid;
}
img.iStructure:hover
{
	border: #6699cc 1px solid;
}
/*
	Div level styles
*/
div#dMain div.tabBox,
div#dMain h1
{
	clear: both;
	float: left;
	letter-spacing: 0.10ex;
	text-align: left;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	width: 100%;	/* keeps the border as wide as the div */
}
div#dMain h1 {
	background-color: #F0FFFF;
	border-top:#bbbbbb 1px solid;
	border-bottom: #bbbbbb 1px solid;
	padding: 1.5ex 0;
}
div#dSidebar
{
	line-height: 125%;
	font-size: small;
	margin-right: 2%;
	text-align: justify;
	margin-top: -2.25ex;
}
div#dSidebar h1
{
	color: #990000;
	letter-spacing: 0.6ex;	
	text-align: center;
	margin-top: 3.5ex;
	margin-bottom: -1ex;
}
div#dBanner
{
	padding: 10px 0 20px 0;
	background-color: #F0FFFF;
	border-top: #bbbbbb 1px solid;
	border-bottom: #bbbbbb 1px solid;
	letter-spacing: 0.1em;
	text-align: left;
	color: #333333;
}
.pReference 
{
	font-size: small;
	line-height: 130% !important;
	text-align: left;
	text-indent: 0	!important;
	margin-bottom: 2px;	/* This is mandantory to make link underlines visible */
}
.pReference .sSub, 	/* Move subscripts up to avoid collision with href underlining */
.pReference .sSup	/* Move superscripts down to avoid collision with href underlining */ 
{
	font-size: 0.6em;
}
.pReference .sSub 
{
	top: 0;
}
.pReference .sSup 
{
	left: 0;
	bottom: 0.7em;
}
/*
	Span level styles
*/
/*
	The reason for doing this, rather than using <sub> and <sup>, 
	goes beyond the current theology of markup. The old tags mess up 
	the line spacing wheras this way it remains uniform.
*/
.sSub,
.sSup {
	position: relative;
	font-size: 0.6em;
}
.sSub
{
	top: 0.3em;
}
.sSup
{
	bottom: 0.6em; 	
}
table.tBrowse
{
	width: 100%;
}
.tBanner img
{
	border: none;
}
.tBanner td
{
	vertical-align: top;
}
table.tBrowse div.namePI
{
	padding-bottom: 0.3em;
}
table.tBrowse td,
table.tBrowse th
{
	color: #333333;
}
table.tBrowse th
{
	letter-spacing: 0.3ex;
	vertical-align: bottom;
}
table.tBrowse td.tdCode,
table.tBrowse td.tdName
{
	padding-left: 10px;
}	
table.tBrowse td.tdCode,
table.tBrowse th.tdCode
{
	min-width: 110px;
}
table.tBrowse td.tdName 
{
	max-width: 100%;	/* makes this column the liquid one */
}
table.tBrowse td.tdId
{
	padding-right: 10px;
}	
.tdStructure
{
	vertical-align: bottom;
}
.tdCode,
.tdName,
.tdMP
{
	text-align: left;
}
.tdId
{
	text-align: right;
}
.tdStructure
{
	text-align: left;
}
table.tBanner,
table.tBanner table {
	padding: 0;
}
table.tBanner table {
	border-collapse: collapse;
}
table.tBanner td,
table.tBanner th {
	border-width: 0; 
	padding: 0;
}
td.tdNav table {
	width: 630px; 
}
td.tdNav img {
	display: block;
}
table.tBanner {
	width: 100%;
	margin-bottom: 10px;
}
table.tBanner td.tdNav
{
	width: 60%;
}
table.tBanner td.tdTools
{
	width: 40%;
}
table.tBanner td.tdTools div.dGoogle
{
	float: left;
	width: 150px;
}
table.tBanner td.tdTools div.dFacebook
{
	float: left;
	width: 150px;
	padding-left: 10px;
}
table.tBanner td.tdTools div.dReddit
{
	padding-top: 8px;
}
table.tBanner td.tdTools div.dBrand
{
	float: left;
	width: 65px;
	padding-left: 10px;
}
.sSearchBox
{
	margin-top: 0;
	width: 134px;
}
.sSearchButton,
.sContactButton
{
	margin-top: 0;
	width: 140px;
}
.sSearchBox
{
	margin-bottom: 4px;
}
.sSearchButton
{
	margin-bottom: 8px;
}
.sContactButton
{
	margin-bottom: 0;
}
table.tBanner form 
{
	/* margin-top: -20px; There is a margin atop forms, in IE anyway, that sticks in my craw */
	margin-left: 0;
	margin-top: 0;
	margin-bottom: 0;
}
img.sContactButton
{
	border: 1px solid #d3d3d3; /* lightgray */
}
img.sContactButton:hover 
{
	border: 1px solid #2f4f4f; /* darkstategray */
}
/*.sExternalTitle {
	color: #4477aa; /* #6699CC; */
}*/
a.sDOI 
{
	color:#999999;
}
img.iExtLink {
	display: inline;
}
abbr[title],
span[title]
{
    cursor: help;
	text-decoration: none; /* Nullify Chrome's fiddling ca. 19 May 2017 */
}
abbr[title] 
{
    padding-bottom: 1px;
    border-bottom: 1px dotted #79AFDE;
}
span.sErowid,
span.sPrint
{
	background-color: #ffffe7;	
	border-bottom: none;
}
span.sErowid
{
	color: #999999;
	text-decoration: line-through;
	border-bottom: none;
}
label.sLabel,
span.sLabel {
	color: #990000;	 
	border-bottom: none;
	font-weight: normal;
	margin-bottom: auto; /* override bootstrap */
}
label.sLabel:after {
	content: ":";
}
/*label.sLabel {
	margin-right: 1ex;
}
*/
table#tSkeletons span.sCount
{
	color: #999999;
}
div.dImageId
{
	z-index: 3;
	right: 10px;
	bottom: 10px;
	font-size: 70%;
	letter-spacing: 0.1ex;
	font-weight: bold;
	font-style: italic;
	opacity: 0.5;
	filter:alpha(opacity=50);
	color:#686417;
	position: absolute;
	float: left;
}
.tdStructure div.quiet {
	float: left;
	position: relative;
}
/*
span.sInBook {
	font-style:italic;
	color: #000;
}
*/
/*
	Odds and ends
*/
.lastUpdated {
	text-align:center;
    margin-bottom: 1em; /* keeps it from crashing into stuff on smaller devices */
}
.logo {
    font-size: 20px;
    font-family: 'AfterHeadlineLight';
	text-transform: lowercase;
	letter-spacing: .075ex;
}
/* 
	tooltip. this needs more work, I want grey but totally opaque background and this aint it.
*/
.tooltip-inner {
	letter-spacing: 0.08em;
	background: rgba(0, 0, 0, 1);
	color: white;
	padding: 1em 1em;
	text-align: left;
	max-width: none;
	white-space: nowrap;
}
.tooltip-inner div {
	background: rgba(0, 0, 0, 1);
	max-width: 350px;
	white-space: normal;
}