/* css reset */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;
}
body {line-height: 1;}
ol, ul {list-style: none;}
table {border-collapse: collapse; border-spacing: 0;}
td, th {text-align: left; vertical-align: top}
header, section, article, aside, nav, footer {display: block;}

body {background: #fff; color: #555c66; font-family: 'Droid Serif', serif;}

/*
colors

*/

.l {text-align: left !important;}
.r {text-align: right;}
.c {text-align: center;}
.nowrap {white-space: nowrap;}

a {color: #4a9fa6; text-decoration: none;}
/*a:visited {color: #;} */
a:hover {color: #feb239;}

figure.frontendimage {
	float: left;
}

figure.frontendimage > img {
	width: 10vw;
	float: left;
	border: 1px solid #aaa;
}

figure.frontendimage figcaption p {
	text-indent: 0em;
	width:10vw;
	font-size: small;
	font-style: oblique;
	color: #aaa;
	position: relative;
    top: 1em;
  
}


/* indicate external links with web-standardish dual overlapping squares --vzm */
a[target='_blank']::after {content: '\29C9'; vertical-align: super; font-size: smaller; width:50%;}
#blog::after, #adminentry::after {content: ''; vertical-align: baseline; font-size: medium; width:100%} /* don't put the icon after our Blog tab in the header */
#adminentry { padding-left: 4em; color: red; font-size:smaller;}

.hilight {background-color: yellow !important;}
.note {font-size: 80%; color: #a19c99;}
.filter {color: #555c66; border-bottom: 1px dotted #333;}
.filter:hover {border-color: #feb239;}

p {margin: 0 0 1em;}
hr {border: 1px solid #ddd; border-width: 1px 0 0; margin: 1em 0; height: 1px;}
h1, h2 {font-weight: normal; line-height: 1.1;}
h1 {font-size: 30px; margin: 0 0 20px;}
h1 span {display: block; font-size: 70%; color: #666;}
iframe {width: 100%; margin: 1em 0;}

header {position: fixed; width: 100%; color: #5a907e;

	/* 
	 background: rgba(241,239,238,.9); */
	background: -webkit-linear-gradient(hsl(205, 70%, 91%),hsl(205, 70%, 91%),hsla(20, 10%, 94%, 0.9));
	background: -o-linear-gradient(hsl(205, 70%, 91%),hsl(205, 70%, 91%),hsla(20, 10%, 94%, 0.9));
	background: -moz-linear-gradient(hsl(205, 70%, 91%),hsl(205, 70%, 91%),hsla(20, 10%, 94%, 0.9));
    background: linear-gradient(hsl(205, 70%, 91%),hsl(205, 70%, 91%),hsla(20, 10%, 94%, 0.9))
	/* */
}
#logo {font-size: 42px; margin: 20px; line-height: 1.1;}
#logo a {color: #4a7f6d;}
#logo #header-details {margin-top: 10px;}
#logo span {font-size: 16px; display: block; width: 70%;}
#logo span span {display: inline; width: auto; margin: 4px 0 0; font-size: 13px;}
#logo span #stats {display: block; color: #a19c99;}
header nav {background: #84d0b2; overflow: auto; padding: 8px 0 0 12px; color: #555c66;}
header nav li {float: left; margin: 0 3px 0 0;}
header nav #nav-browse, header nav li a {padding: 10px 12px; float: left;}
header nav li a {background: #62bb9d; color: #fff; font-weight: 700; -webkit-border-radius: 6px 6px 0 0; -moz-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0;}
header nav #nav-browse {text-transform: uppercase; font-size: 80%; color: #4a7f6d;}
header nav li a:hover {background: #5a907e; color: #fff;}
#entryno header nav #nav-entryno a, #title header nav #nav-title a, #year header nav #nav-year a, #author header nav #nav-author a, #subject header nav #nav-subject a, #place header nav #nav-place a, #about header nav #nav-about a {background: #fff; color: #555c66;}
header nav #nav-about, header nav #nav-blog {float: right;}
header nav #nav-blog {margin-right: 20px;}

#st-search-input {position: absolute; top: 10px; right: 20px; font-size: 16px;}
.st-modal-scrollable * {font-size: 14px !important; font-family: 'Droid Serif', serif;}
.st-search-summary, .st-search-summary * {font-size: 16px !important;}

section {padding: 230px 0 50px; line-height: 1.4;}

#currently {text-transform: uppercase; margin: 0 0 1em;}
#collist .note {position: absolute; top: 3px; right: 5px; background: #cecbc9; color: #fff; width: 2em /*22px */; height: 18px; padding: 4px 6px 3px; text-align: center; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;}

#collist {width: 190px; top: 230px; position: fixed; border: 8px solid #f1efee; border-width: 8px 8px 8px 0; background: #fff; z-index: 2;}
#collist ul {overflow: auto; height: inherit;}
#collist ul, #collist li {margin: 0; padding: 0; list-style: none;}
#collist a {display: block; text-decoration: none; border-bottom: 1px solid #f1efee; padding: 6px 44px 6px 20px; position: relative; line-height: 1.2;}
#collist a:hover {background: #feb239; color: #fff !important;}
#collist a:hover .note {background: rgba(255,255,255,.4);}
#collist a.current {background: #51aeb6; color: #fff !important}
#collist a.current .note {background: rgba(255,255,255,.4);}
#collist .parent {font-size: 80%; display: block;}
#collist .indent {padding-left: 1em;}
#collist .seealso {font-size: 90%; border-top: 1px solid #fff; margin-top: -1px; color: #aaa;}
#collist .seealso span {color: #4a9fa6;}
#collist .seealso:hover span {color: #fff;}
#collist .seealso .note, #collist .see .note {display: none;}

/* mac os x lion scrollbar fix */
#collist ul::-webkit-scrollbar {-webkit-appearance: none;}
#collist ul::-webkit-scrollbar:vertical {width: 13px; border-left: 1px solid #f1efee;}
#collist ul::-webkit-scrollbar-thumb {border-radius: 8px; border: 3px solid #fff; /* should match background, can't be transparent */ background-color: rgba(85,92,102,.6);}

.list h1 {margin: 0 230px 50px;}
.list #content {margin: 0 120px 0 230px;}
#subject.list #content {margin-bottom: 100px;}
#inner #content {margin: 0;}
.list.wider #content, .list.wider h1, #entry section #content {margin-left: 120px;}
.list td {padding: 3em; border-top: 3px solid #f1efee;}
#entry.list td {border-top: none;}
.list h2 {font-size: 100%; margin: 0; line-height: 1.4; font-weight: 700; display: inline;}
.list p {margin: 0; text-indent: 2em;}
#about.list p {margin: 0 0 1.4em; text-indent: 0;}
#about.list #content {padding: 0 50px 50px 0;}

.content section {margin: 0 120px 0 230px;}

#buttonnav {margin: 0 auto 3em; overflow: auto;}
#buttonnav li {list-style: none; display: inline; margin: 0;}
#buttonnav span, #buttonnav a {float: left; width: 19px; padding: 0 2px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; text-align: center; margin: 0 4px 4px 0; border: 2px solid #51aeb6;}
#buttonnav span {background: #eee; color: #aaa; border-color: #eee;}
#buttonnav span.current {background: #51aeb6; border-color: #51aeb6; color: #fff !important;}
#buttonnav a {background: #fff; font-weight: bold; }
#buttonnav a:hover {background: #feb239; border-color: #feb239; color: #fff !important;}


footer {font-size: 12px; position: fixed; bottom: 0; width: 100%; background: #f1efee; color: #a19c99;}
footer a, footer a:visited {font-weight: bold;}
footer ul {width: 100%; overflow: auto; padding: 12px 0; margin: 0; float: left;}
footer ul li {margin: 4px 0;}
footer .l {float: left; clear: left; margin-left: 16px;}
footer .r {float: right; clear: right; margin-right: 16px;}
footer #fb {float: right; margin-top: 4px;}
footer .credit a {font-weight: normal; text-decoration: none;}

/*
	nav toggle is the hamburger menu in the tab bar
*/
#navtoggle {width: 30px; height: 11px; border: 3px solid #fff; border-width: 3px 0; position: relative; float: right; margin: 20px 10px 10px; display: none; z-index: 2; position: relative;}
#navtoggle:before {content: ""; width: 30px; height: 3px; position: absolute; top: 4px; left: 0; background: #fff;}
#navtoggle:after {content: "menu"; position: absolute; top: -22px; right: -2px; font-size: 12px; font-weight: bold; text-transform: uppercase; color: #fff;}

.show-tablet-down, .show-mobile-down {display: none;}
#logo .title-small {display:inline;font-size:22px;}
#logo .alt-urls {display:inline;}

@media only screen and (min-width : 1230px) {
	#collist {width: 300px;}
	.list h1, .list #content {margin-left: 350px;}
}

@media only screen and (max-width : 850px) {
	/*
	 this does the hamburger menu
	*/
	#navtoggle {display: block;}
	header nav ul {display: none;}
	header nav {padding-left: 0;}
	header nav ul li, header nav ul li a, header nav #nav-browse, header nav #nav-about {float: none; display: block; margin: 0;}
	header nav ul li a {padding-left: 20px; margin: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
	header nav #nav-browse {padding-top: 20px;}
	footer .l, footer .r {float: none; clear: none; text-align: center !important; margin: 8px; line-height: 1.3;}
}

@media only screen and (max-width : 1024px) {
	.show-tablet-down {display: block;}
}

@media only screen and (max-width : 770px) { 
	
	header, footer {position: relative; overflow: auto;}
	#logo span {width: 100%;}
	#logo .alt-urls {display: block; line-height:18px;}
	#st-search-input {position: relative; top: auto; right: auto; margin: 0 0 20px 20px;}

	section {padding: 20px 0;}
	.list h1 {margin: 0 20px 50px;}
	.list #content, .content section {margin: 0 20px;}
	.list.wider #content, .list.wider h1, #entry section #content {margin-left: 20px;}

	.list td {padding: 1.4em .4em; border-top: 3px solid #f1efee;}
	
	#collist {top: 0; left: 0; width: 240px; height: 100% !important; border-color: #cecbc9; border-width: 0 34px 0 0; overflow-x: visible;}
	#collist a {padding: 14px 44px 14px 20px;}
    #collist .note {top: 9px;}
    #collist .toggle {width: 0; height: 0; border-top: 14px solid transparent; border-bottom: 14px solid transparent; border-right: 16px solid #fff; position: absolute; top: 50%; right: -24px; margin-top: -24px; cursor: pointer;}
	#collist.closed .toggle {border-left: 16px solid #fff; border-right: 0; cursor: pointer;}
    body.slideleft {left: 240px; padding-left: 34px; overflow-x: hidden; position: relative;}

} 


@media only screen and (max-width : 560px) {
	#logo {font-size: 7vw; font-weight: 700px;}
	#logo #stats {font-size: 60%; font-weight: 400;}
	.show-mobile-down {display: block;}
	#logo .title-small {display:inline;font-size:18px;}
}

@media only screen and (max-width : 400px) {
	.list td {display: block;}
	.list td:nth-child(odd) {padding-bottom: 0;}
	.list td:nth-child(even) {padding-top: 0; border-top-width: 1px;}
}