body {
	font-family: "adobe-garamond-pro-1", "adobe-garamond-pro-2", serif;
	min-width: 480px;
	max-width: 1600px;
}
a {text-decoration: none; color: inherit;}
strong {font-weight: bold;}
em {font-style: italic;}
.clear {clear: both;}

#sidebar { width: 20%; position: fixed; right: 0; top: 0; }
#main    { width: 80%; float: left; }
#sidebar > .inside { margin-top: 80px; }
#main    > .inside { margin: 188px 100px 0 15%; }



#sidebar h1 a {
	display: block;
	padding: 10px 10px 10px 0; width: 13px; height: 23px;
	text-indent: -9999px; background: url('/4/images/logo.gif') 0 10px no-repeat;
}

#sidebar ul.nav {
	margin: 60px 0 0 0; list-style: none;
	font-family: "museo-sans-1","museo-sans-2",serif; font-size: 18px; color: #bbb; line-height: 24px;
}
#sidebar ul.nav li {color: #e6e6e6;}
#sidebar ul.nav li.current, #sidebar ul.nav li:hover {color: #777;}



#main .article { border-top: 4px solid #eee; padding-top: 44px; }
#main .article h2 {
	color: #000; font-family: "superclarendon-1","superclarendon-2",serif; font-size: 42px; font-weight: 200;
	letter-spacing: -1px; text-indent: -2px;
}
#main .article h4, #main .work h4 {
	font-family: "museo-sans-1","museo-sans-2",serif; font-size: 18px; font-weight: bold; line-height: 20px;
}
#main .article .body {margin: 36px 50px 128px 0;}

/* SPECIAL PAGES */
/* About */
#main .article.about { border-top: none; padding-top: 0; }
#main .article.about h2 { border-top: 4px solid #eee; padding-top: 44px; }
#main .article.about img.picture { display: block; float: left; padding-right: 24px; background: #fff; }
#main .article.about .aside {
	display: block;float: right;
	width: 35%;
	margin: 36px 0 128px 50px;
}
#main .article.about .aside h4 {
	font-family: "museo-sans-1","museo-sans-2",serif; font-size: 18px; color: #bbb; font-weight: 500;
	text-transform: uppercase;
	line-height: 20px; margin-bottom: 20px;
}
/* Work index */
#main .work { margin: 0 0 48px 0; }
#main .work h2 {
	border-top: 4px solid #eee; padding-top: 24px;
	color: #000; font-family: "superclarendon-1","superclarendon-2",serif; font-size: 32px; font-weight: 200;
	letter-spacing: -1px; text-indent: -2px;
}
#main .work h3 {
	color: #777; font-family: "superclarendon-1","superclarendon-2",serif;
	font-style: italic; font-size: 18px; font-weight: 200; text-indent: -1px;
	margin: 8px 0 48px 0;
}
/* Notes index */
#main .notes { margin: 0 0 48px 0; }
#main .notes h2 {
	border-top: 4px solid #eee; padding-top: 24px;
	color: #000; font-family: "superclarendon-1","superclarendon-2",serif; font-size: 32px; font-weight: 200;
	letter-spacing: -1px; text-indent: -2px;
}
#main .notes h3 {
	color: #777; font-family: "superclarendon-1","superclarendon-2",serif;
	font-style: italic; font-size: 18px; font-weight: 200;
	text-indent: -1px; margin: 8px 0 48px 0;
}
#main .notes ul li, #main .home ul.recent li { display: block; margin-bottom: 24px; }
#main .notes ul li h4, #main .home ul.recent li h4 {
	font-family: "museo-sans-1","museo-sans-2",serif; font-size: 18px; font-weight: bold;
}
#main .notes ul li h4 a:hover, #main .home ul.recent li h4 a:hover {color: #777;}
#main .notes ul li span.date, #main .home ul.recent li span.date {
	font-family: "superclarendon-1","superclarendon-2",serif; font-size: 12px; color: #bbb; font-weight: 200;
}
/* Home page */
#main .home { margin: 0 0 72px 0; }
#main .home p.colophon {
	border-top: 4px solid #eee; padding-top: 24px;
	
	font-family: "adobe-garamond-pro-1", "adobe-garamond-pro-2", serif;
	font-size: 21px;line-height: 24px;
	color: #555;
}
#main .home h2.recent {
	font-family: "museo-sans-1","museo-sans-2",serif; font-size: 18px; color: #bbb;
	text-transform: uppercase;
	border-bottom: 4px solid #eee;
	margin: 64px 0 24px 0; padding-bottom: 24px;
}
#main .home a.more {
	display: block; margin-top: 4px; padding: 8px 9px 9px 8px;
	font-family: "superclarendon-1","superclarendon-2",serif; font-size: 14px; color: #777;
	font-weight: normal; font-style: italic; letter-spacing: -0.5px;
	float: left; background: #bbb; color: #fff; text-shadow: 0 -1px 0 #777;
	-moz-border-radius: 4px; -webkit-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px;
}
/* Social page */
#main .social { margin: 0 0 48px 0; }
#main .social h2 {
	border-top: 4px solid #eee; padding-top: 24px;
	color: #000; font-family: "superclarendon-1","superclarendon-2",serif; font-size: 32px; font-weight: 200;
	letter-spacing: -1px; text-indent: -2px;
}
#main .social h3 {
	color: #777; font-family: "superclarendon-1","superclarendon-2",serif;
	font-style: italic; font-size: 18px; font-weight: 200; text-indent: -1px;
	margin: 8px 0 48px 0;
}
#main .social h4 {
	font-family: "museo-sans-1","museo-sans-2",serif; font-size: 18px; color: #bbb; font-weight: 500;
	text-transform: uppercase;
	line-height: 20px; margin-bottom: 20px;
}
#main .social .aside {
	display: block;float: right;
	width: 35%;
	margin: 0 0 128px 50px;
}
#main .social .aside p span.foreward { display: none; }
#main .social ul.list li { display: block; margin-bottom: 20px; position: relative; }
#main .social ul.list li div.icon { position: absolute; top: 0; left: 0; width: 32px; height: 32px; }
#main .social ul.list li h4 {
	margin: 0 0 0 42px; padding: 6px 0 0 0;
	font-family: "superclarendon-1","superclarendon-2",serif; font-size: 32px; font-weight: 200;
	text-transform: none;
}
#main .social ul.list li h4 a { text-decoration: none; }
#main .social ul.list li h4 a:hover {color: #777;}
#main .social ul.list li p { margin: 12px 0 0 42px; }
/*
#main .notes ul li { display: block; margin-bottom: 24px; }
#main .notes ul li h4 {
	font-family: "museo-sans-1","museo-sans-2",serif; font-size: 18px; font-weight: bold;
}
#main .notes ul li h4 a:hover {color: #777;}
#main .notes ul li span.date {
	font-family: "superclarendon-1","superclarendon-2",serif; font-size: 12px; color: #bbb; font-weight: 200;
}
*/



#main .generic-lined-header { border-top: 4px solid #eee; padding-top: 32px; }
#main .generic-lined-header h2 {
	color: #000; font-family: "superclarendon-1","superclarendon-2",serif; font-size: 42px; font-weight: 200;
	letter-spacing: -1px; text-indent: -2px;
}


#footer { clear: both; margin-top: 64px; padding: 18px 12% 24px 12%; background: #eee; }
#footer a.icon {
	display: block; float: left;
	font-family: "superclarendon-1","superclarendon-2", serif; font-weight: bold; font-size: 36px; color: #fff;
	text-shadow: 0 0 1px #ddd;
}
#footer div.stuff {
	display: block; float: left; margin: 13px 0 0 12px;
	font-family: "museo-sans-1","museo-sans-2",serif; font-weight: bold; font-size: 14px; color: #bbb;
	text-shadow: 0 1px 0 #fff; letter-spacing: 0.5px;
}

.type {
	font-family: "adobe-garamond-pro-1", "adobe-garamond-pro-2", serif;
	font-size: 16px;
	line-height: 20px;
	color: #555;
}
.type p {margin-bottom: 20px;}
.type a {color: #111; text-decoration: underline;}
.type p.lead {
	font-family: "superclarendon-1","superclarendon-2", serif;
	font-size: 16px; font-weight: 200; color: #333;
}
.type a:hover {text-decoration: none;}
.type .footnotes {margin-top: 20px;}
.type .footnotes ol {list-style: decimal outside; padding-left: 32px;}
.type .footnotes ol li p {margin-bottom: 0; font-size: 14px;}





@media only screen and (max-width: 960px) {
	#sidebar > .inside { margin-top: 50px; }
	#main    > .inside { margin-top: 158px; margin-right: 50px; margin-left: 50px; }
	
	#footer { padding-left: 50px; padding-right: 50px; }
}

@media only screen and (max-width: 640px) {
	#sidebar { width: 100%; float: none; position: relative; }
	#main    { width: 100%; float: none; }
	#sidebar > .inside { margin: 10px 20px 0 20px; }
	#main    > .inside { margin: 20px;  }
	
	#sidebar ul.nav { margin-top: 25px; }
	#sidebar ul.nav li { display: inline; }
	#main .article .body { margin-right: 0; margin-bottom: 72px; }
	
	#footer { padding: 20px; }
	#footer a.icon { font-size: 32px; }
	#footer div.stuff { margin: 12px 0 0 10px; font-size: 11px; }
	
	#main .social .aside {
		float: none;
		width: auto;
		margin-left: 0; margin-bottom: 64px;
	}
	#main .social .aside p span.foreward { display: inline; }
}
