/*
Theme Name: Nice Web Type Notes
Theme URI: http://nicewebtype.com/notes/
Description: Notes about web typography.
Version: 1.0
Author: Tim Brown
Author URI: http://tbrown.org/


FONT STACKS
------------------------------------------------
Normal:		"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Helvetica, Arial, sans-serif;
Italic:		Georgia, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Helvetica, Arial, sans-serif;
Code:		"Panic Sans", Monaco, "Courier New", Courier, monospace;


COLORS
------------------------------------------------
662626	Maroon		Border across top of site
1E2630	Slate blue	h5

2a2121	Dark gray	h2, h4, text
666054	Med gray	h3
CCC6BA	Light gray	h2 shadow

f3f5ea	Off white	Body background


SCALE
------------------------------------------------
960 & 11 @ 1:1.618

===============================================*/


@import "/css/reset.css";
@import "/css/shell.css";


#nocss { display: none; }


/* =1 Typography & Color
===============================================*/
body {
	padding-top: 8px;
	border-top: 2px #662626 solid;
	font: 69%/1.618em "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Helvetica, Arial, sans-serif;
	color: #2a2121;
	background: #f3f5ea url(/css/i/nice-light.gif) 227px 319px no-repeat;
	}
h2, h3, h4, h5, h6 {
	margin: 1.5em 0 0.25em;
	font-weight: normal;
	line-height: 1em;
	}
h2 {
	margin-top: 24px;
	margin-bottom: 0.618em;
	margin-left: 8px;
	font-weight: normal;
	font-size: 4.235em;
	color: #2a2121;
	text-shadow: 0 1px 0 #CCC6BA;
	}
h3 {
	margin-top: 0;
	font-weight: normal;
	font-size: 1.618em;
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Helvetica, Arial, sans-serif;
	line-height: 1.3em;
	color: #666054;
	}
.single .note h3 {
	font-size: 2.168em;
	}
p + h3,
table + h3,
p + h4,
ul + h4,
ul + h5,
dl + h3,
dl + h4,
dl + h5,
table + h4,
blockquote + h3,
blockquote + h4,
ol + h4,
pre + h4 {
	margin-top: 1.5em;
	}
p + h5,
pre + h5 {
	margin-top: 2em;
	}
h4 {
	margin: 0 0 0.25em;
	font-size: 1.618em;
	line-height: 1.858em;
	color: #2a2121;
	}
h5 {
	margin-bottom: 0.5em;
	font-size: 1.1em;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: #1E2630;
	}
p {
	margin: 0 0 1em;
	font-size: 1.1em;
	line-height: 1.618em;
	}
p img { margin: 0 0.5em 0 0 }

img.book {
	float: left;
	margin: 0.5em 1em 0.5em 0;
	}

li, address {
	margin: 0 0 0.75em;
	font-size: 1.1em;
	line-height: 1.618em;
	}
.note .post-content h5,
.note .post-content p,
.note .post-content li,
.note .post-content address,
.note .post-content dt,
.note .post-content dd {
	font-size: 1.3em;
	}
.note .post-content dd p,
.note .post-content dd li,
.note .post-content li p,
.note .post-content li li {
	font-size: 1em;
	margin: 0 0 1em;
	}
#comments h5,
#comments p,
#comments li,
#comments address,
#comments dt,
#comments dd {
	font-size: 1.3em;
	}
#comments dd p,
#comments dd li,
#comments li p,
#comments li li {
	font-size: 1em;
	margin: 0 0 1em;
	}
blockquote {
	margin-left: 1.5em;
	font: italic 1.068em/1.5em Georgia, serif;
	color: #735757;
	}
.col ul {
	margin: 1.5em 0 1.5em 1.5em;
	list-style-type: square;
	}
.col ol {
	margin: 0 0 1.5em 2em;
	list-style-type: decimal;
	}
.col ul ul,
.col ul ol,
.col ol ol,
.col ol ul {
	margin-top: 1.5em;
	}
ol.chat {
	list-style: none;
	margin-left: 0;
	}
ol.chat li {
	padding: 10px;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	color: #735757;
	background-color: #fff;
	}
ol.chat li.pers-2 {
	background-color: #f9fefc;
	}
ol.chat li.chat-author {
	background-color: transparent;
	}
ol.chat span {
	font-weight: bold;
	}
li.chat-author span { color: #9D2E2C; }
li.chat-pers1 span { color: #619bc7; }
li.chat-pers2 span { color: #ACD04E; }
li.chat-pers3 span { color: #7C63C3; }
li.chat-pers4 span { color: #79C097; }
li.chat-pers5 span { color: #B77E66; }

ol.chat li p:last-child {
	margin-bottom: 0;
	}
dt {
	margin: 1.5em 0 0.5em;
	font-size: 1em;
	line-height: 1.618em;
	}
dd {
	margin: 0 0 1em;
	font-size: 1em;
	line-height: 1.618em;
	}
address {
	}
em {
	font: italic 1.068em/1.5em Georgia, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Helvetica, Arial, sans-serif;
	}
strong {
	font-weight: bold;
	}
strong.highlight {
	padding: 3px 0;
	font-weight: normal;
	background-color: #ffc;
	}
cite {
	white-space: nowrap;
	font-style: normal;
	}
code {
	font-family: "Panic Sans", Monaco, "Courier New", Courier, monospace;
	color: #4079a5; /*#988483;*/
	text-shadow: none;
	}
pre {
	margin: 0 0 1.5em;
	padding: 8px 10px;
	border-top: 1px #ddd solid;
	background-color: #fff;
	}
pre code {
	font-size: 1.1em;
	}
abbr {
	letter-spacing: 0.1em;
	}
del {
	text-decoration: line-through;
	}
ins {
	background-color: #fff;
	}
sup {
	font-size: 0.618em;
	line-height: 1em;
	vertical-align: super;
	}
sup a:link,
sup a:visited,
sup a:hover,
sup a:active {
	padding: 3px !important;
	}
.caption {
	margin-top: 0;
	font-size: 0.9em;
	color: #a09671;
	}
.quiet {
	font-size: 1em;
	color: #a09671;
	}
.dim {
	color: #ccc;
	}
	

/* Tables & Forms
-----------------------------------------------*/
table {
	margin: 0 0 1.5em;
	font-size: 1.1em;
	line-height: 1.618em;
	}
caption {
	color: #666;
	}
thead th {
	border-bottom: 1px #ddddd2 solid;
	font-weight: normal;
	}
tfoot th {
	border-top: 1px #ddddd2 solid;
	font-weight: normal;
	}
th, td {
	padding: 3px 11px;
	}
form {
	margin: 0 0 3em;
	}
form p {
	margin: 0;
	}
form p.form-submit {
	margin-bottom: 3em;
	}
label {
	display: block;
	/*border-top-left-radius: 4px;
	-webkit-border-top-left-radius: 4px;
	-moz-border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	-webkit-border-top-right-radius: 4px;
	-moz-border-top-right-radius: 4px;*/
	margin: 0.5em 0 0;
	padding: 8px 12px 4px;
	/*max-width: 360px;*/
	color: #6a5757;
	/*background-color: #e6e6da;*/
	}
label strong {
	margin-right: 0.5em;
	}
input,
textarea {
	margin: 0;
	padding: 8px 12px;
	border: 0;
	border-bottom: 1px #CCC6BA dotted;
	/*border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-top-left-radius: 0;
	-webkit-border-top-left-radius: 0;
	-moz-border-top-left-radius: 0;*/
	width: 463px;
	font-size: 1em;
	color: #594646;
	}
p#form-comment textarea {
	border: 1px #CCC6BA solid;
	}
p.form-submit {
	color: #999;
	}
p.form-submit input {
	width: auto;
	margin-right: 1em;
	padding: 8px 12px;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	background-color: #e6e6da;
	}


/* Kerning
-----------------------------------------------*/
span.ot {
	letter-spacing: -0.04em;
	}
	
	
/* Links
-----------------------------------------------*/
a.toggle {
	padding-left: 21px;
	background: transparent url(images/silver/toggle_ud.gif) no-repeat left;
	}

#content a {
	text-decoration: none;
	padding-bottom: 1px;
	}
#content a:link,
#content a:visited {
	font-weight: bold;
	color: #9D2921;
	}
#content a:hover {
	font-weight: bold;
	color: #662626;
	}
cite a:link,
cite a:visited {
	color: #9D2921;
	}
cite a:hover {
	color: #662626;
	}
	
/* Notes headings */
#content .note h3 a:link,
#content .note h3 a:visited {
	text-decoration: none;
	padding-bottom: 1px;
	font-weight: normal;
	color: #662626;
	}
#content .note h3 a:hover {
	padding: 3px 0;
	font-weight: normal;
	color: #9D2921;
	}
	
/* Meta & Footer */
#content .meta a:link,
#content .meta a:visited,
#footer a:link,
#footer a:visited {
	text-decoration: none;
	padding-bottom: 1px;
	font-weight: bold;
	color: #9f9898;
	}
#content .meta a:hover,
#footer a:hover {
	text-decoration: none;
	padding-bottom: 1px;
	font-weight: bold;
	color: #4c4545;
	}
	
/* Sidebar links */
p#follow {
	margin: 47px 0 4px;
	}
p#support,
p#rssfeed {
	margin: 0;
	}
p#follow a,
p#support a,
p#rssfeed a {
	padding: 3px 3px 3px 30px;
	text-decoration: none;
	color: #662626;
	background-color: #f3f5ea;
	}
p#follow a:link,
p#follow a:visited {
	background: #f3f5ea url(/css/i/bird-light.gif) left no-repeat;
	}
p#support a:link,
p#support a:visited {
	background: #f3f5ea url(/css/i/star-light.gif) 4px no-repeat;
	}
p#rssfeed a:link,
p#rssfeed a:visited {
	background: #f3f5ea url(/css/i/rssfeed-light.png) 8px no-repeat;
	}
p#follow a:hover,
p#support a:hover,
p#rssfeed a:hover {
	color: #9D2E2C;
	}



/* =2 Header, Nav, Misc
===============================================*/

/* Masthead
-----------------------------------------------*/
#header {
	position: static;
	}
h1 {
	margin: 13px 0 17px -11px;
	width: 135px;
	height: 106px;
	background: transparent url(/css/i/masthead-light.png) top left no-repeat;
	}
h1 a {
	display: block;
	width: 100%;
	height: 100%;
	text-indent: -9999px;
	margin: 0;
	padding: 0;
	border: none !important;
	background: none !important;
	}

/* Nav
-----------------------------------------------*/
ul#nav {
	border: 5px #1f1b17 solid;
	border-bottom: 7px #1f1b17 solid;
	}
ul#nav li {
	margin: 0;
	padding: 0;
	border-bottom: 1px #1f1b17 solid;
	font-size: 1.1em;
	line-height: 1.5em;
	}
ul#nav li a {
	display: block;
	padding: 0.618em 1.148em !important;
	text-decoration: none;
	text-align: right;
	}
ul#nav li a:link,
ul#nav li a:visited {
	background-color: #453b31;
	color: #fff;
	}
ul#nav li a:hover {
	background-color: #2a2121;
	color: #fff;
	}
body.home ul#nav li#home a:link,
body.home ul#nav li#home a:visited,
body.aboutpage ul#nav li#about a:link,
body.aboutpage ul#nav li#about a:visited,
body.gear ul#nav li#gear a:link,
body.gear ul#nav li#gear a:visited,
body.notes ul#nav li#notes a:link,
body.notes ul#nav li#notes a:visited {
	color: #e4f2aa;
	background-color: #2a2121;
	}

/* Search
-----------------------------------------------*/
#searchform {
	margin-top: 2em;
	}
#searchform input#s {
	width: 100px;
	padding: 0 5px 8px 5px;
	border: 5px #1f1b17 solid;
	border-bottom: 8px #1f1b17 solid;
	background-color: #ecf2d1;
	font-size: 1.1em;
	}
	
/* Content
-----------------------------------------------*/
#about-notes {
	margin-top: 135px;
	padding: 11px;
	width: 266px;
	/*background: rgba(255,255,255,0.5);
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;*/
	}
.note {
	margin: 8px 0 3em !important;
	padding: 0 !important;
	background-color: #eeeee2;
	color: #594646;
	border-top-right-radius: 10px;
	-moz-border-top-right-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
	-moz-border-bottom-right-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
	}
.note .post-content {
	padding: 11px;
	}
.note .meta {
	margin: 0;
	padding: 8px 11px 11px;
	border-top: 1px #ddd6cA solid;
	background-color: #e9e9e0;
	color: #888880;
	border-bottom-right-radius: 10px;
	-moz-border-bottom-right-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
	}
.note .meta p {
	margin: 0;
	}
.note .meta .tags a {
	display: block;
	float: left;
	margin: 0 8px 0 0;
	padding: 5px 8px;
	background-color: #fff;
	}
.prevnext {
	float: right;
	width: 188px;
	padding: 8px 11px;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	color: #888880;
	background-color: #f9f9f0;
	}
.about {
	clear: right;
	margin-top: 88px !important;
	border: 2px #f9f9f0 solid;
	background-color: #e6e6d9;
	}
.post-meta {
	margin: 135px 0 0 -21px !important;
	padding: 11px;
	width: 292px;
	background-color: #fff;
	border-bottom: 1px #e6e6d9 solid;
	}
.post-meta p.old {
	margin: -11px -11px 1em -11px;
	padding: 11px;
	background-color: #ffe;
	}
.figure {
	position: relative;
	float: right;
	width: 288px;
	margin: 0 -309px 0 0 !important;
	}

ul.jump {
	margin: 1.5em 0;
	padding: 1em 0 0.5em 1.5em;
	background-color: #e6e6d9;
	}
ul.jump li {
	list-style: none;
	background: url(images/silver/nwt-empty.gif) no-repeat 0 0.25em;
	}
#content .note ul.jump li a:link {
	padding-left: 1.618em;
	font-weight: normal;
	color: #333;
	}
#content .note ul.jump li a:visited {
	padding-left: 1.618em;
	font-weight: normal;
	color: #333;
	background: url(images/silver/check.gif) no-repeat 0 0.1em;
	}
#content .note ul.jump li a:hover,
#content .note ul.jump li a:active {
	padding-left: 1.618em;
	font-weight: normal;
	color: #9D2E2C;
	background: url(images/silver/arrow_down.gif) no-repeat 0 0.1em;
	}

/* Comments
-----------------------------------------------*/
#comments ol {
	list-style: none;
	margin: 0;
	}
#comments li {
	position: relative;
	clear: left;
	margin: 0 0 2em;
	}
.comm-avatar {
	position: absolute;
	top: 12px;
	left: -64px;
	margin: 0 !important;
	padding: 0 !important;
	}
.comm-avatar img {
	border: 1px #e9e9e0 solid !important;
	}
.comm-bubble {
	max-width: 463px; /* 702px; */
	padding: 8px 12px !important;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color: #e6e6da;
	color: #594646;
	}
li.comm-author .comm-bubble {
	background-color: #fff;
	/*	f9fefc - light blue
		fcfef3 - light yellow  */
	}
.comm-bubble cite {
	font-weight: bold;
	}
.comm-bubble cite span.comm-meta {
	display: none;
	color: #999;
	}
#commentPreview {
	margin: 0;
	padding: 0;
	}


/* Footer
-----------------------------------------------*/
#footer {
	padding: 8px 0 11px;
	border-top: 1px #ddd6cA solid;
	background-color: #e9e9e0;
	color: #888880;
	}