/* ----- CONSISTENCY ----- */
html {font-size: 100.01%; overflow: -moz-scrollbars-vertical;} /* force Firefox browser window scrollbar to always appear */
html,body,address,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,legend,p,blockquote,table,caption,th,td,img{margin:0;padding:0;}
abbr, acronym {border-bottom: 1px dotted #000; cursor: help; font-style: normal;}
a img, a:link img, a:visited img {border: none; border-width: 0; vertical-align: top;}
label {cursor: pointer;} /* label elements are clickable, demonstrate visually */
input {margin: 0;}
hr {display: none;}


/* - - - - - - - - - - - - - - - - - - - - - - - - - -
	CORE IDENTIFIERS - font sizes 60,69,76,83,89
- - - - - - - - - - - - - - - - - - - - - - - - - - */

body, input, select, textarea, table {
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Helvetica, Arial, sans-serif;
	/*font-family: "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;*/
	font-size: 100%;
}
body {
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Helvetica, Arial, sans-serif;
	font-size: 62%;
	line-height: 1.6;
	padding: 0;
	margin: 0;
	text-align: center;
}
/* html > body {font-size: 12px;} explicitly state font size in px for smarter, px resizable browsers */
#container {font-size: 1.3em; text-align: left;}
#header {}
#navigation {
	margin: 0 auto;
	width: 525px;
}
#navigation {padding: 10px 0;}
#navigation ul, #navigation li {list-style: none;}
#navigation ul {font-size: .9em; margin: 0; padding: 0;}
#navigation ul li {float: left; margin: 0; padding: 0 12px 0 0;}
#navigation ul li a, #navigation ul li a:active, #navigation ul li a:visited {text-decoration: none;}
#navigation ul li a:hover {text-decoration: none;}
#title-bar {
	margin: 0 auto;
	width: 525px;
}
#title-bar .content {
	padding: 25px 0 20px 0;
}
#title-bar h1, #title-bar h2 {
	color: #595959;
}
#title-bar h1 {
	font-size: 1.7em;
	font-family: Georgia, sans-serif;
	font-style: italic;
	font-weight: bold;
	line-height: normal;
	margin: 0 0 14px 0;
}
#title-bar h2 {
	font-size: 1.4em;
	font-family: Georgia, sans-serif;
	font-style: italic;
	font-weight: normal;
	line-height: 1.4em;
	margin: 0;
}
#primary {
	margin: 0 auto;
	padding: 1em 0 0 0;
	width: 525px;
}
#secondary {}
#tertiary {}
#footer {
	font-size: 0.9em;
	margin: 0 auto;
	padding: 1.5em 0;
	text-align: center;
	width: 525px;
}
#footer p {
	margin: 0 0 0.2em 0;
}

#recipes #primary .icon {padding: 1px 20px 1px 0;}
#contact span.figure.gutter, #development span.figure.gutter, 
#presentations span.figure.gutter, #resume span.figure.gutter {float: right; margin: 1.5em 0 1em 1em;}

/* ----- HEADINGS ----- */
h1, h2, h3, h4, h5, h6 {margin: 15px 0;}
h1 {font-size: 240%;}
h2 {font-size: 180%;}
h3 {font-size: 140%;}
h4 {font-size: 100%;}
h5 {font-size: 100%;}
h6 {font-size: 100%;}

h4.job-title, h4.recipe-title {
	margin: 0;
}
h5.job-date {
	margin: 0 0 5px 0;
}

/* ----- PARAGRAPHS ----- */
p {margin: 0 0 1.5em;}

/* ----- LISTS ----- */
ol, ul {line-height: normal; margin: 0 0 1.5em 0; padding-left: 2em;}
ol li, ul li {line-height: 1.5em; margin: 0 0 0.5em 0;}
ul ul, ul ol, ol ul, ol ol {margin-top: 0; margin-bottom: 0;}

/* ----- COLUMNAR LISTS ----- */
ul.columnar {list-style: none; margin: 5px 0; padding: 0;}
ul.columnar li {display: block; float: left; margin: 0; padding: 0; width: 200px;}
ul.columnar li div.content {padding: 1em;}
.column-title {margin: 0; padding: 0.5em; font-size: 100%;}

/* ----- DEFINITION LISTS ----- */
dl {padding: 0 0 1em 0;}
dt {font-weight: bold;}
dd {margin: 0 0 1em 2em;}
dl.vertical dt {margin-top: 1em;}
dl.vertical dd {margin: 0;}

/* ----- QUOTES/CITATIONS ----- */
blockquote {padding: 0 1em;}
blockquote p {font-size: 110%; font-style: italic;}
blockquote p, blockquote p cite {font-family: Georgia, Times, serif;}

/* ----- FIGURES ----- */
span.figure {display: block; margin-bottom: 2em; text-align: center;}
span.figure.gutter {float: left; margin: 1.5em 1em 1em 0;}
span.figure img {display: block;}
span.figure strong {text-transform: uppercase;}

/* ----- CODE ----- */
code, pre, kbd {font-family: "Consolas", "Courier New", Courier, mono, serif;}
code, pre {margin: 1em 0;}

/* ----- TABLES ----- */
table {line-height: normal; table-layout: fixed; width: 100%;}
caption, th {caption-side: top; font-weight: bold;}
caption span, th, td {padding: 5px; text-align: left; vertical-align: top;}

/* ----- TUMBLR----- */
#tumblr ol {margin: 0;}
#tumblr .tumblr_title, #tumblr .tumblr_link {font-size: 14px; font-weight: bold; margin: 0px 0px 5px 0px;}
#tumblr .tumblr_post {display: block; font-weight: normal; list-style: none; margin: 2em 0; padding: 0;}
#tumblr ol ol {margin: 1.5em 0 1.7em 2em;}
#tumblr code {background-color: #FFF; border: 1px solid #C1CAD3; border-left-width: 6px; display: block; padding: 0.5em;}

/* ----- CLASS HELPERS ----- */
.hide {display: none;}
.icon {padding: 1px 0 1px 20px;}
.content {padding: 0 1em;}
.note {margin-top: 0; padding: 1em 0;}
.info, .success, .warning {padding: 1em;}
.warning ol {margin-bottom: 0; margin-top: 0.5em;}
.accessible {height: 1px; left: -9999em; overflow: hidden; position: absolute; top: 0; width: 1px;}
.clear:after {clear: both; content: "."; display: block; height: 0; visibility: hidden;}
.clear {min-width: 0; display: inline-block; /* \*/display: block;}
* html .clear {/* \*/height: 1%;}

p.note {padding-top: 0;}

/* ----- FORMS ----- */
form {margin: 1.5em 0;}
form div.field, form div.control {padding: 1em 0;}
form div.field .required {cursor: help; font-style: normal; font-weight: bold;}
form div.help {line-height: 1.5em; margin-top: 3px;}
form.familiar div.field .label, form.familiar legend span {display: block; font-weight: bold; margin: 0 0 2px 0;}
form.unfamiliar div.field .label {display: block; float: left; margin: 0 10px 0 0; text-align: right;}
form.unfamiliar fieldset {position: relative;}
form.unfamiliar legend span {display: block; float: none; left: 0; position: absolute; text-align: right; top: 0;}
form.unfamiliar.scan div.field .label, form.unfamiliar.scan legend span {text-align: left;}
/* mulitple selection */
form ol.selection, form ol.selection li, form ol.selection li input {list-style: none; margin: 0; padding: 0;}
form ol.selection li label {display: block; padding: 0 0 5px 0;}
form ol.selection.scroll {height: 10em; overflow: auto;}
form ol.selection.scroll li label {padding: 3px 3px 3px 23px; text-indent: -19px;}
form ol.selection.scroll li label input {text-indent: -19px; width: 15px;}
/* field sizes */
input.small, select.small, textarea.small, form ol.selection.small {width: 15em;}
input.medium, select.medium, textarea.medium, form ol.selection.medium {width: 20em;}
input.large, select.large, textarea.large, form ol.selection.large {width: 25em;}
textarea.short, form ol.selection.scroll.short {height: 10em;}
textarea.tall, form ol.selection.scroll.tall {height: 20em;}
/* label widths */
form.unfamiliar.small .label, form.unfamiliar.small legend span {width: 12em;}
form.unfamiliar.medium .label, form.unfamiliar.medium legend span {width: 15em;}
form.unfamiliar.large .label, form.unfamiliar.large legend span {width: 18em;}
form.unfamiliar.small .help, form.unfamiliar.small .selection, form.unfamiliar.small div.control {margin-left: 13em;}
form.unfamiliar.medium .help, form.unfamiliar.medium .selection, form.unfamiliar.medium div.control {margin-left: 16em;}
form.unfamiliar.large .help, form.unfamiliar.large .selection, form.unfamiliar.large div.control {margin-left: 19em;}

#contact form {margin-top: 0;}


/* - - - - - - - - - - - - - - - - - - - - - - - - -
	Hacks - fixes rendering bugs (DO NOT REMOVE)
- - - - - - - - - - - - - - - - - - - - - - - - - */
.clear:after {clear: both; content: "."; display: block; height: 0; visibility: hidden;}
.clear {min-width: 0; display: inline-block; /* \*/display: block;}
* html .clear, * html form ol.selection li label {/* \*/height: 1%;}
* html form.unfamiliar .help {padding-left: 3px;}
* html form.unfamiliar ol.selection, * html form.unfamiliar select.selection {left: 3px; position: relative;}
* html form div.control input {overflow: visible; padding: 0 .25em; width: auto;} /* IE6 button width fix */
* html form div fieldset legend {margin-left: -7px;}	/* for IE6 as legend is indented */