/***
	Layout 
***/
html { min-height: 100%; margin-bottom: 1px; padding: 0 7px; }
#content {
	margin: auto;
	max-width: 770px;
}

#header {
	margin: 1.5em 0 0;
	overflow: auto;
}
	#header.minimal { margin: 0; }
	#header h1 { float: left; }
	#nav { float: right; text-align: right; }
	#header hr { clear: both; border: none; margin: 0; height: 0; }
	#header.minimal h1 { float: right; }
	.minimal #nav { display: none; }
	#header.minimal hr { display: none; }

.section {
	clear: both;
	position: relative;
	border-top: 1px solid #CCC;
	margin: 3em 0 1.5em;
	padding: 2.93em 105px 1.5em 210px;
}
	.section.piece { border-top: none; }
	.section.piece > h2 { border-bottom: 1px solid #CCC; }
	.section .body {}
	.section .aside {}
	.section hr {
		display: block;
		clear: both;
		border: none;
		height: 1.5em;
		margin: 3em 0 1.5em;
	}
	.section > .footnote { margin: 4.5em 0 -3em; }
	.section > .aside.footnote { margin: 5.26em 0 -3.5em; }
/*	.section > .footer { margin: -1.75em 0; }*/

	
/* sizes */
.one	{width:070px}
.two	{width:175px}
.three	{width:315px}
.four	{width:455px}
.five	{width:560px}
.six	{width:665px}
.seven	{width:770px}

/* positions */
.left	{
	float:left; clear:left;
	margin-right:35px; margin-left:-210px;
}
.right	{
	float:right; clear: right;
	margin-left:35px; margin-right:-105px;
}
.inset {clear:none}
.right.inset, .hug {margin-right:0}
.left.inset, .hug {margin-left:0}


/***
	Typography
***/
@font-face {
  font-family: 'Bitstream Vera Sans Mono';
  src: url(../misc/bnp/VeraMono.ttf) format("truetype");
}

body { font: normal normal normal 14px/21px Georgia, serif; word-wrap: break-word; }
p, ul, ol, pre { margin-bottom: 1.5em; }
pre { padding: 0.714em; word-wrap: normal; overflow: auto; }
code {
	font-size: 0.857em;
	line-height: 1.5em;
	font-family: Monaco, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace;
}
pre code { font-family: 'Bitstream Vera Sans Mono', Monaco, 'Courier New', Courier, monospace;  }
a { text-decoration: none; }
strong, h5 { font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-weight: normal; }
h1, h2, h3, h4, dt {
/*	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;*/
	font-family: Palatino, 'Palatino Linotype', "URW Palladio L", Georgia, serif;
	font-weight: normal;
}
h1 {
	font-size: 2em;
	line-height: 1.75em;
	height: 1.75em; /* for webkit when using different font families on the same line */
	margin-top: 0.75em;
	margin-bottom: 0.5em;
}
h2 {
	font-size: 1.715em;
	line-height: 1.5em;
	margin-top: 1.125em;
}
h4, h3+h4 {
	font-family: Georgia, serif;
	font-size: 1.143em;
	line-height: 1.3125em;
	margin: 0.6875em 0 0.625em;
}
*+h4 { margin-top: 3.313em; }
h5 {
	font-variant: small-caps;
	text-transform: lowercase;
	letter-spacing: 0.1em;
	line-height: 0.715em;
	margin-bottom: 0.786em;
}
h3, dt {
	font-weight: bold;
	font-size: 0.856em;
	letter-spacing: 1px;
	text-transform: uppercase;
}
blockquote {
	margin-left: 2em;
	border-left: solid 0.5em #F3F3F3;
	padding-left: 1em;
}
strong, abbr {
	font-size: 0.857em;
	line-height: 1em;
}
abbr { letter-spacing: 0.1em; }
span.amp,
.footer:after {
	font-family: Baskerville, Palatino, "Book Antiqua", "Hoefler Text", Constantia, "URW Palladio L", Georgia, serif;
	font-style: italic;
}
span.amp { line-height: 1em; }
.copy { font-family: Helvetica, Arial, sans-serif; }
.solo { margin-bottom: 1em; }

h1 span {
	font-family: Monaco, Consolas, Courier, 'Courier New', monospace;
	position: relative; z-index: 5;
}
h1 em {
	font-family: Palatino, 'Palatino Linotype', "URW Palladio L", Georgia, serif;
	margin-left: 1em;
	position: relative; z-index: 5;
}
h1 .amp {
	position: absolute;
	z-index: 1;
	font-size: 3em;
	margin-left: -0.3em;
	margin-top: 0.095em;
	line-height: 0.584em;
	height: 0.584em; /* for webkit */
}
.minimal h1 {
	font-size: 1em;
	line-height: 1.714em;
	height: 1.714em; /* for webkit when using different font families on the same line */
	margin-top: 0.786em;
	margin-bottom: 0.5em;
}

#nav {
	font-family: Palatino, 'Palatino Linotype', "URW Palladio L", Georgia, serif;
	font-style: italic;
}
#nav a.current,
#nav a:hover { padding-left: 32px; /* marker width */ }

.section > h2 {
	float: left;
	margin: -2.5em -105px 0 -35px;
	padding: 0 105px 0.375em 35px;
	width: 100%;
}
.section.piece h2 {
	float: none;
	line-height: 1.75em;
	margin: 0.25em 0 0.875em;
	padding: 0 0 0.625em;
}
.section > * + h2 {
	float: none;
	margin: 1.125em 0 0;
	padding: 0;
	width: auto;
}
.section h2 a {
	padding-right: 63px; /* (marker width-4) + gap */
}
.section > h3 {
	float: left;
	margin: -4.5em -105px 0 -35px;
	padding: 0 105px 1.84em 35px;
	width: 100%;
	background: #FFF;
}
.section > * + h3 {
	float: none;
	margin: 0;
	padding: 0;
	width: auto;
}

.listing p.aside { text-align: right; }

.section .body > h3 { display: none; }
.section .body > h3 + h4 { margin: 0 0 1.3125em;}
.section .body * + h4 { margin-top: 3.3125em; }
.section a:hover { text-decoration: underline; }
.aside { font-size: 0.857em; }
.aside ul, ul.aside,
.aside ol, ol.aside,
.aside p, p.aside,
.aside dd { margin-bottom: 1.75em; }
.aside.left p:first-child a:first-child {
	display: block;
	font-weight: bold;
	text-align: center;
	-webkit-border-radius: 0.834em;
	-moz-border-radius: 0.834em;
	border-radius: 0.834em;
}

p.solo { margin-bottom: 0.75em; }

.body li:before {
	display: block;
	margin: 0 0 -1.5em -2.75em;
	width: 2em;
	text-align: right;
}
.body ul li:before { content: "·"; font-weight: bold; }
.body ol { counter-reset: number; }
.body ol li { counter-increment: number; }
.body ol li:before { content: counter(number); }


.footnote dl {
	padding-left: 5.5em;
}
.footnote dt {
	float: left; clear: left;
	font-size: 0.72em;
	line-height: 1.7em;
	margin-top: 0.4em;
	min-width: 7em;
	margin-right: 1em;
	margin-left: -8em;
	text-align: right;
}
.footnote dt:after {
	content: ":";
	margin-left: 0.2em;
}

.footer:before {
	content: ".";
	overflow: hidden; text-indent: -20em;
	position: absolute;
	top: -0.75em; left: 0px;
	width: 210px;
}
.footer:after {
	content: "&";
	text-align: center;
	font-size: 3em;
	position: absolute;
	top: 1.5em; left: 0;
	width: 175px;
}



/***
	Colours & Backgrounds
***/
body {
	color: #7C311A;
	background: #FFF;	
}

a { color: #008591; }
a:hover { color: #914F1F; }
a:focus, a:active { background: #DDD; }
abbr { border-bottom: 1px dotted #DDD; }
pre {
	-webkit-border-radius: 1px;
	border-bottom: 1px solid #F3F3F3;
	border-left: 1em solid #F3F3F3;
/*	background: #FAFAFA;*/
}
pre code,
h2, h4, h5 { color: #442108; }
h1 { color: #7C311A; }
h3 { color: #999490; }
h1 a, h1 a:hover { color: inherit; }
h1 .amp,
.footer:after { color: #CCC; }
a:hover .amp { color: #999; }
span.imhi { color: #FFF; }
.imhi abbr { border-bottom: 1px dotted #FFF; }

#nav a.current,
#nav a:hover { background: #FFF url(../misc/bnp/nav-marker.gif) no-repeat left center; }

.section h2 { background: #FFF; }
.section h2 a { background: url(../misc/bnp/anchor.gif) no-repeat right center; }
.section hr { background: #FFF url(../misc/bnp/end-marker.gif) no-repeat center center; }

.body blockquote { color: #776460; }
.body a { color: #333;  }
.body a:hover { color: #008591; }
.body li:before { color: #999490; }

.aside { color: #776460; }
.aside dt,
.aside h3 { color: #442108; }

.aside.left p:first-child { background: url(../misc/bnp/leaf.png) no-repeat left center; }
.aside.left p:first-child a:first-child { text-shadow: #EEE 1px 1px 1px; text-decoration: none; }
.aside.left p:first-child a:first-child:hover {
	color: #FFF;
	background: #2798A2;
	text-shadow: #368 1px 1px 1px;
}
.aside.left p:first-child a:first-child:active {
	background: #7C311A;
	text-shadow: #421 1px 1px 1px;
	-webkit-box-shadow: #000 -1px -1px 5px;
	-moz-box-shadow: inset rgba(0, 0, 0, 1) 1px 2px 4px;
}


img.frame, .frame img { border: 1px solid #EEE; }

.footer:before { color: #FFF; background:#FFF; }
