/* 
Title:		Master styles for screen media
Author: 	dan@simplebits.com
*/

body {
	padding: 0 1in;
	font-family: "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", Arial, sans-serif;
	color: #444;
	font-size: 62.5%;
	background: #fff;
	}

/* links */

a:link, a:visited {
	color: #369;
	text-decoration: none;
	outline: none;
	}
a:hover {
	color: #39c;
	}

/* page structures 
--------------------------------------------- */

div.full {
	border-bottom: 1px solid #d9d9d9;
	}
div.main {
	padding: 10px 15px 10px 5px;
	}

/* article structure */

div.article div.content {
	width: 540px;
	}

/* header 
--------------------------------------------- */

#logo {
	width: 546px;
	padding-bottom: 2px;
	border-bottom: 10px solid #000;
	}

#logo a img {
	width: 100px;
	}
	
/* nav */

#nav, #search, ul.tools, ol.page, div.page-ee, div.adv, #comment_form, .sidebar, div.index div.main-2, #updates, div.secondary {
	display: none;
	}

/* main styles 
--------------------------------------------- */

h3.sub,
h2.sub {
	margin: 0 0 10px 0;
	padding: 0 0 5px 0;
	font-size: 1.1em;
	font-weight: bold;
	line-height: 1em;
	text-transform: uppercase;
	letter-spacing: 2px;
	color: #333;
	border-bottom: 1px solid #ccc;
	}
h3.alt,
h2.alt {
	padding-bottom: 0;
	border-bottom: none;
	}

/* lst style */

ol.lst {
	margin: 15px 0 0 0;
	}
ol.lst li {
	margin: 0 0 20px 0;
	}
ol.lst li.top {
	margin-bottom: 15px;
	}


/* article styles 
--------------------------------------------- */

/* title */

div.article div.content a {
	text-decoration: underline;
	}
#title h1 {
	margin: 0 0 10px 0;
	font-family: Georgia, serif;
	font-size: 2.7em;
	line-height: 1.1em;
	font-weight: normal;
	color: #111;
	}
#title h1 a {
	text-decoration: none;
	}
#title h2.sub {
	margin: 0 0 5px 0;
	}
#title h2.callout,
h2.deck {
	margin: 20px 0 20px 0;
	font-family: Georgia, serif;
	font-size: 1.8em;
	font-weight: normal;
	line-height: 1.4em;
	color: #000;
	}
h2.deck {
	margin-top: 0;
	}
#title p.by {
	margin: 0 0 15px 0;
	font-size: 1.2em;
	line-height: 1.4em;
	}

/* article body */

div.article-body {
	font-family: Georgia, serif;
	font-size: 1.4em;
	line-height: 1.5em;
	}
div.article-body h2 {
	margin: 0 0 5px 0;
	font-family: "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", Arial, sans-serif;
	font-size: 1.3em;
	line-height: 1.4em;
	font-weight: normal;
	color: #000;
	}
div.article-body h2.alt {
	margin: 15px 0 5px 0;
	padding: 10px 0 0 0;
	border-top: 1px solid #ccc;
	}
div.article-body h3 {
	margin: 0 0 5px 0;
	font-family: "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", Arial, sans-serif;
	font-size: .8em;
	font-style: normal;
	line-height: 1.4em;
	text-transform: uppercase;
	letter-spacing: .1em;
	color: #000;
	}
div.article-body p {
	margin: 0 0 20px 0;
	}
div.article-body ul {
	margin: 0 0 25px 0;
	}
div.article-body ul li {
	margin: 0 0 5px 10px;
	padding: 0 0 0 9px;
	line-height: 1.4em;
	background: url(http://www.thememagazine.com/includes/img/icon-bullet.gif) no-repeat 0 7px;
	}
div.article-body ol {
	margin: 0 0 25px 10px;
	padding: 0 0 0 10px;
	}
div.article-body ol li {
	margin: 0 0 5px 10px;
	line-height: 1.4em;
	list-style: decimal;
	}

/* tags */

p.tags {
	margin: 0 0 15px 0;
	padding: 6px 8px;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	background: #f0f0f0;
	}
p.tags strong {
	font-weight: normal;
	text-transform: uppercase;
	letter-spacing: .1em;
	}
p.tags a {
	color: #333;
	}
p.tags a:hover {
	color: #666;
	}
	
/* photo figures */

div.fig {
	margin: 0 0 15px 0;
	}
div.half { /* 260px wide images */
	float: left;
	width: 260px;
	margin: 4px 12px 5px 0
	}
div.half img {
	width: 260px;
	}
div.third { /* 160px wide images */
	float: left;
	width: 160px;
	margin: 4px 12px 10px 0
	}
div.third img {
	width: 160px;
	}
div.fig p {
	margin: 7px 0 0 0;
	font-family: "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", Arial, sans-serif;
	font-size: .7em;
	line-height: 1.1em;
	font-style: italic;
	color: #666;
	}
div.fig p a {
	color: #666;
	}
div.fig p a:hover {
	color: #333;
	}

/* blockquotes */

blockquote {
	margin: 0 0 20px 0;
	font-family: Georgia, serif;
	font-size: 1.3em;
	line-height: 1.4em;
	color: #000;
	}
blockquote.half {
	float: left;
	width: 250px;
	margin: 0 12px 5px 0;
	padding: 8px 5px;
	font-family: Georgia, serif;
	font-size: 1.3em;
	line-height: 1.4em;
	color: #000;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	}
div.article-body blockquote.half p {
	margin: 0;
	}

/* comments */

#comments {
	padding: 20px 0 0 0;
	border-top: 1px solid #ccc;
	}
#comments dl {
	margin: 15px 0 20px 0;
	border-bottom: 1px solid #ccc;
	}
#comments dl dt {
	margin: 0 0 5px 0;
	font-size: 1.1em;
	}
#comments dl dt strong {
	font-size: 1.1em;
	}
#comments dl dt span.date {
	text-transform: uppercase;
	letter-spacing: .1em;
	}
#comments dl dd {
	margin: 0 0 25px 0;
	font-family: Georgia, serif;
	font-size: 1.2em;
	line-height: 1.5em;
	}


/* blog styles 
--------------------------------------------- */

div.post {
	border-bottom: 1px solid #ccc;
	margin: 0 0 15px 0;
	}
div.post-title h2 {
	margin: 0 0 10px 0;
	font-family: Georgia, serif;
	font-size: 2.2em;
	line-height: 1.1em;
	font-weight: normal;
	color: #111;
	}
div.post-title h2 a {
	text-decoration: none;
	}
div.post-title p.by {
	margin: 0 0 15px 0;
	font-size: 1.2em;
	line-height: 1.4em;
	}
div.post-title p.by a {
	text-decoration: underline;
	}
div.post-title p.by a.comments {
	padding-left: 16px;
	background: url(http://www.thememagazine.com/includes/img/icon-comment.gif) no-repeat 0 2px;
	}
div.post p.tags {
	font-family: "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", Arial, sans-serif;
	font-size: .8em;
	}
div.post p.tags a {
	text-decoration: underline;
	color: #333;
	}
div.post p.tags a:hover {
	color: #666;
	}

/* misc. 
--------------------------------------------- */

hr, .hide {
	display: none;
	}
a img {
	border: none;
	}

/* self-clear floats */

.group:after {
	content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
    }