/* 
----------------------------------------------------------------------------- 
GLOBAL RESET
-----------------------------------------------------------------------------*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,table,th,td,embed,object{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img,abbr{border:0;}
address,caption,cite,code,dfn,em,h1,h2,h3,h4,h5,h6,strong,th,var{font-style:normal;font-weight:normal;}
ul {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:1.0em;}
q:before,q:after{content:'';}
a,ins{text-decoration:none;}


/* 
----------------------------------------------------------------------------- 
BASIC INLINE/TEXT STYLING
-----------------------------------------------------------------------------*/
body
{
	font: 14px/24px 'Lucida Grande', Geneva, Arial, Verdana, sans-serif;
	/* DYNAMIC: 90% white on background color */
	color: #EAEAEA;
	text-shadow: 0 0 0 #000;
}

a
{
	color: #FFF;
	font-weight: bold;
}

a:visited
{
	border-bottom: none;
}

a:hover
{
	/* DYNAMIC: 50% white on background color */
	color: #979797;
}

a.img,
a.img:hover
{
	border-bottom: none !important;
}

.over:hover img,
input.over:hover
{
	opacity: 0.5;
}

p,ul,ol,pre,.image,
h1,h2,h3,h4,h5,h6
{
	margin-bottom: 24px;
}

ul ul
{
	margin-bottom: 0;
}

strong,h1,h2,h3,h4,h5,h6
{
	font-weight: bold;
	/* DYNAMIC: 50% white on background color */
	color: #979797;
}

em
{
	font-style: italic;
}

img
{
	vertical-align: middle;
}

pre,
code,
.image
{
	background: url(img/bg-screen.png) 0 0 repeat;
	padding: 24px;
}

code
{
	padding: 1px;
}

pre,code
{
	font: 10px/16px 'Monaco', 'Courier New', Courier, monospace;
}

pre code
{
	display: block;
	background-image: none;
	overflow: auto;
}

.image img
{
	border: 1px solid #FFF;
}

blockquote,
li
{
	font-size: 12px;
	line-height: 20px;
}

blockquote
{
	padding: 2px 0 2px 48px;
	background: url(img/bg-quote.png) 12px 0 no-repeat;
}

li
{
	margin-bottom: 4px;
}

ul li
{
	background: url(img/bg-bullet.png) 9px 5px no-repeat;
	padding-left: 24px;
}

ol li
{
	margin-left: 24px;
}

/* STILL NEED TABLE STYLES */

/* 
----------------------------------------------------------------------------- 
BASIC FORM STYLES	
-----------------------------------------------------------------------------*/
form table
{
	width: 100%;
}

form span
{
	display: block;
	padding: 1px;
	/* DYNAMIC: 15% black on background color */
	border: 1px solid #272727;
	background-color: #FFF;
}

form input
{
	font-size: inherit;
	vertical-align: middle;
}

form span input,
form span textarea,
form span select
{
	margin: 0;
	font-size: inherit;
	font-family: inherit;
	width: 100%;
	color: #282828;
	
	/* DYNAMIC: 80% white on background color */
	background-color: #D5D5D5;
	border: 1px solid #C3C3C3;
	border-top-color: #7C7C7C;
	border-bottom-color: #DDD;
}

form span input:focus,
form span textarea:focus,
form span select:focus,
form span:hover input,
form span:hover textarea,
form span:hover select
{
	background-color: #FFF;
}

form span.inline
{
	display: inline-block;
	float: left;
	width: auto;
	margin-top: 3px;
	margin-right: 8px;
}

form div.inline span
{
	display: inline-block;
	vertical-align: middle;
}

form div.inline span input,
form div.inline span textarea,
form div.inline span select
{
	width: auto;
}

form span.inline input
{
	width: auto;
	border: none;
	background-color: transparent !important;
}

td.cinch
{
	width: 1%;
}


/* 
----------------------------------------------------------------------------- 
COMMENT FORM STYLES
-----------------------------------------------------------------------------*/
form
{
	width: 384px;
	font-size: 12px;
	position: relative;
}

form .note
{
	position: absolute;
	top: 48px;
	left: 408px;
	line-height: 20px;
	width: 144px;
}

.form-top
{
	background: url(img/bg-form-top.png) 0 0 no-repeat;
}

.form-bottom
{
	background: url(img/bg-form-bottom.png) 0 100% no-repeat;
	padding-top: 0;
}

.form-bottom td
{
	padding-left: 24px;
}

.form-bottom td:first-child
{
	padding-left: 0;
}

form fieldset
{
	padding: 24px;
}

#comment_body,
#contact_form_msg
{
	height: 240px;
}

.btn-row
{
	position: relative;
	line-height: 24px;
	padding-top: 9px;
}

#comment_form .form-bottom span,
#contact_form_form .form-bottom span
{
	width: 92px;
}

#remember-cc
{
	position: absolute;
	top: 10px;
	left: 240px;
	width: 120px;
}

#comment_form #remember-cc span,
#contact_form_form #remember-cc span
{
	width: auto;
}

/* 
----------------------------------------------------------------------------- 
DETACHED
-----------------------------------------------------------------------------*/
#toggle_comment_form
{
	position: absolute;
	top: 29px;
	right: 24px;
}

#detached-container
{
	position: fixed;
	top: 337px;
	left: 0;
	width: 100%;
	height: 1px;
	z-index: 1000;
}

#detached
{
	margin: 0 auto;
	width: 816px;
	height: 1px;
}

#detached form
{
	margin-left: 432px;
}

/* 
----------------------------------------------------------------------------- 
LAYOUT

Header position differs from column positioning because of the unique nature
of the overline that continues off to the right of the screen.
-----------------------------------------------------------------------------*/
html
{
	/* DYNAMIC: background color #2E2E2E 
	background: url(img/bg-grid.png) 50% 0 repeat;
	height: 100%;*/
}
body
{
    background: url(img/bg-top.png) 50% 0 no-repeat;
	padding-top: 1px;
}

#header,
#content,
#footer
{	
	width: 816px;
	margin: 0 auto;
	position: relative;
	height:30px;
}

#top
{
	margin-top: 48px;
	height: 216px;
}

#content
{	
	width: 816px;
	margin: 0 auto;
}

#bottom
{
	margin-top: 20px;
	padding-top: 24px;
	background: url(img/bg-bottom.png) 50% 0 no-repeat;
	height:50px;
}


/* 
----------------------------------------------------------------------------- 
HEADER
-----------------------------------------------------------------------------*/
#logo
{
	position: absolute;
	top: 20px;
	left: 0px;
}
#cat
{
	position: absolute;
	top: 30px;
	left: 285px;
}

#endtroducing
{
	position: absolute;
	top: 118px;
	left: 576px;
	font-size: 10px;
	line-height: 14px;
	/* DYNAMIC: 50% white on background color */
	color: #979797;
}

#etc
{
	position: absolute;
	top: 118px;
	left: 288px;
	font-size: 10px;
	line-height: 14px;
	/* DYNAMIC: 50% white on background color */
	color: #979797;
}

#endtroducing .mint
{
	float: left;
	margin: -5px 0 0 -24px;
}

/* 
----------------------------------------------------------------------------- 
NAVIGATION
-----------------------------------------------------------------------------*/
#nav
{
	margin-left: 288px;
	width: 264px;
	background: url(img/bg-rule-accent.png) 0 0 repeat-x;
}

#nav:after
{
	display: list-item;
	content: '';
	clear: both;
	height: 0;
	visibility: hidden;
}

#nav li
{
	float: left;
	background-image: none;
	padding: 0;
	width: 48px;
	margin-left: 24px;
	font-size: 10px;
	line-height: 24px;
	padding-top: 24px;
	text-transform: uppercase;
}

#nav li.first-child
{
	margin-left: 0;
}

/* 
----------------------------------------------------------------------------- 
INTERFACE LINKS
-----------------------------------------------------------------------------*/
#header a,
#footer a,
.meta a,
a.tla
{
	text-decoration: none;
	border-bottom: none;
}

#header a:visited,
#footer a:visited,
.meta a:visited,
a.tla:visited
{
	text-decoration: none;
}

#header a:hover,
#footer a:hover,
.meta a:hover,
a.tla:hover
{
	/* DYNAMIC: 50% white on background color */
	color: #979797;
}

/* 
----------------------------------------------------------------------------- 
GLOBAL SEARCH
-----------------------------------------------------------------------------*/
#search
{
	position: absolute;
	top: 24px;
	left: 576px;
	width: 240px;
}

#search span
{
	width: 164px;
}

#footer
{
	font-size: 12px;
	line-height: 24px;
	padding-bottom: 48px;
}

#footer .first-child
{
	margin-right: 24px;
}

/* 
----------------------------------------------------------------------------- 
FLOATED COLUMNS
-----------------------------------------------------------------------------*/
.r:after
{
	display: block;
	content: '';
	clear: both;
	height: 0;
	visibility: hidden;
}

.c
{
	float: left;
	margin-left: 24px;
	width: 240px;
}

.c:first-child,
.c.first-child
{
	margin-left: 0;
}

.w6  { width: 144px; }
.w7  { width: 168px; }
.w8  { width: 192px; }
.w10 { width: 240px; }
.w12 { width: 288px; }
.w14 { width: 312px; }
.w15 { width: 336px; }
.w16 { width: 384px; }
.w23 { width: 552px; }
.w25 { width: 600px; }
.m2 { margin-left: 48px; }
.m8 { margin-left: 192px; }
.m17 { margin-left: 408px; }
.m26 { margin-left: 624px; }

/* 
----------------------------------------------------------------------------- 
POST META
-----------------------------------------------------------------------------*/
.meta dt
{
	border-top: 1px solid #FFF;
	float: left;
	clear: left;
	font-size: 10px;
	line-height: 24px;
	color: #979797;
	width: 48px;
}

.meta dd
{
	border-top: 1px solid #FFF;
	clear: right;
	font-size: 12px;
	line-height: 20px;
	padding: 2px 0 2px 60px;	
}

.meta dd span
{
	/* DYNAMIC: 50% white on background color */
	color: #979797;
	font-weight: normal;
}

.meta a
{
	border-bottom: none;
}

/* 
----------------------------------------------------------------------------- 
POST/LINK CONTAINERS
-----------------------------------------------------------------------------*/
.post .c:first-child
{
	/** /
	border-top: 1px solid #FFF;
	padding-top: 47px;
	/**/
}

.link
{
	margin-top: 72px;
}

.tla
{
	margin-right: 12px;
}

/* 
----------------------------------------------------------------------------- 
REPLACED TEXT
-----------------------------------------------------------------------------*/
h1
{
	font: 32px/48px 'HelveticaNeue-CondensedBold', 'Arial Narrow', Helvetica, Arial, sans-serif;
	text-transform: uppercase;
	white-space: nowrap;
	font-weight: bold;
	color: #FFF;
}

h1 em
{
	font-style: normal;
	font-weight: bold;
}

h1 embed
{
	margin: -1px 0 1px -2px;
}

/* 
----------------------------------------------------------------------------- 
COMMENTS HEAD
-----------------------------------------------------------------------------*/
h2,h3,h4,h5,h6
{
	text-transform: uppercase;
	font-size: 10px;
}

#comments h2
{
	border-bottom: 1px solid #FFF;
	margin-bottom: 23px;
	width: 552px;
}

#comments h2 em
{
	font-style: normal;
	color: #FFF;
	
	background: url(img/icon-comments.png) 4px 9px no-repeat;
	padding-left: 24px;
	float: left;
	width: 24px;
}

#comments h2 em span
{
	/* DYNAMIC: 50% white on background color */
	color: #979797;
}

/* 
----------------------------------------------------------------------------- 
COMMENTS
-----------------------------------------------------------------------------*/
.comment
{
	position: relative;
	width: 552px;
	margin-bottom: 24px;
}

.me
{
	background: url(img/logo-screen.png) 6px 24px no-repeat;
}

.body
{
	font-size: 12px;
	line-height: 20px;
	padding: 2px 0;
}

.no
{
	position: absolute;
	top: 0;
	left: 0;
	font-size: 10px;
	font-style: normal;
	color: #FFF;
	
	background: url(img/icon-comment.png) 6px 9px no-repeat;
	padding-left: 24px;
}

.no span
{
	/* DYNAMIC: 50% white on background color */
	color: #979797;
}

#comments .meta dt
{
	width: 30px;
}

#comments .meta dd
{
	font-size: 10px;
	line-height: 14px;
	padding: 5px 0 5px 38px;
}

#comments.preview
{
	border-top: 1px solid #FFF;
	padding-top: 23px;
	width: 552px;
}

.commenting-on dt
{
	width: 72px;
}

.commenting-on dd
{
	padding-left: 84px;
}

/* 
----------------------------------------------------------------------------- 
ARCHIVE
-----------------------------------------------------------------------------*/
.archive
{
	width: 552px;
	border-top: 1px solid #FFF;
	padding-top: 47px;
}

.archive p
{
	width: 384px;
}

.archive ul
{
	background: url(img/bg-feeds.png) 0 0 no-repeat;
	width: 96px;
	margin-left: 72px;
	padding-top: 6px;
}

.archive li
{
	background-image: none;
	margin: 0;
	font-size: 12px;
	line-height: 18px;
}


/* 
----------------------------------------------------------------------------- 
ARCHIVE CATEGORIES
-----------------------------------------------------------------------------*/
.categories li
{
	font-size: 12px;
	line-height: 23px;
	margin: 0;
	padding: 1px 0 0 0;
	background: url(img/bg-rule.png) 0 0 repeat-x;
}

.categories li a
{
	display: block;
}

.categories table
{
	/* DYNAMIC: 50% white on background color */
	color: #979797;
	font-size: 12px;
}

.categories th
{
	font-size: 10px;
	background: url(img/bg-rule-accent.png) 0 0 repeat-x;
}

.categories td
{
	padding-left: 4px;
	background: url(img/bg-rule.png) 0 0 repeat-x;
}

.categories td.alt a
{
	font-weight: normal;
}

/* 
----------------------------------------------------------------------------- 
ARCHIVE MONTH
-----------------------------------------------------------------------------*/
.days .r
{
	background: url(img/bg-rule.png) 0 0 repeat-x;
}

.days
{
	font-size: 12px;
	line-height: 20px;
}

span.meta
{
	font-size: 10px;
}

span.meta span
{
	font-weight: normal;
	/* DYNAMIC: 50% white on background color */
	color: #979797;
}

.day-posts li,
.day-comments li
{
	background: none;
	padding: 0;
	/* DYNAMIC: 50% white on background color */
	color: #979797;
}

.day-comments li em
{
	color: #FFF;
	font-style: normal;
}


/*----------------------------------------------------------------------------- 
CATEGORY ARCHIVE
-----------------------------------------------------------------------------*/
.category-posts
{
	font-size: 12px;
	line-height: 20px;
	
	/** /
	background: url(img/bg-rule.png) 0 0 repeat-x;
	padding: 24px 216px 0 0;
	/**/
}

.category-posts em
{
	font-style: normal;
	/* DYNAMIC: 50% white on background color */
	color: #979797;
}

.ignore-elsewhere
{
	background: url(img/bg-screen.png) 0 0 repeat;
	padding: 0 6px;
	width: 180px;
}

/*----------------------------------------------------------------------------- 
ABOUT
-----------------------------------------------------------------------------*/
.about .c
{
	width: 384px;
}

/* 
----------------------------------------------------------------------------- 
HOMEPAGE
-----------------------------------------------------------------------------*/
.posts
{
	width: 528px;
	margin-left: 288px !important;
}

.posts h1
{
	margin: 0;
}

.posts .meta
{
	margin-bottom: 48px;
}

.links
{
	margin-left: -816px;
	margin-bottom: 48px;
	width: 216px;
	font-size: 12px;
	line-height: 20px;
}

.comments
{
	border-top: 1px solid #FFF;
	margin-bottom: -1px;
	font-size: 12px;
	line-height: 20px;
}

.comments .meta
{
	width: 240px;
	margin-left: 0;
}

.comments .meta dt
{
	width: 24px;
	color: #FFF;
}

.comments .meta dt span
{
	/* DYNAMIC: 50% white on background color */
	color: #979797;
}

.comments .meta dd
{
	padding-left: 36px;
}

.comments .first-child
{
	margin-right: 48px;
}

.home-categories
{
	border-top: 1px solid #FFF;
	margin-bottom: -1px;
}

a.toggle
{
	color: #FFF;
	padding: 0 2px 1px;
}

#endtroducing .admin,
.comment .admin
{
	display: none;
}

#endtroducing:hover .admin,
.comment:hover .admin
{
	display: block;
}

p.admin
{
	visibility: hidden;
}

.c:hover p.admin
{
	visibility: visible;
}

img.inline
{
	float: left;
	margin: 0 12px 12px 0;
}