/*-------------------------+
  
 |    !Spit personality    |
 
 +-------------------------*/


/* Imports
=====================================================================*/
@import "reset.css";  /* Reset styles */
@import "ie.css";  /* Internet Explorer */


/* Fonts
======================================================================*/
body { background: url(background-spitpersonality-body.jpg) top center no-repeat; font-family: Georgia, "Times New Roman", Times, serif;}

.btn,
.call,
.call-l,
.call-r,
.insertLeft,
.insertRight,
#footer,
h1,
.mute,
.pages,
.slider-wrap,
.txt,
.txt-sm {
	font-family: lucida grande, Tahoma, Verdana, Arial, sans-serif;
}

code, kbd, pre { font-family: Consolas, "Courier New", Courier, monospace; }


/* Basics
======================================================================*/
a, em, strong { color: #cc0000; }
li a { color:#b4a036; }
a:hover { color: #aaa; text-decoration: none; }
acronym { border-bottom: 1px dotted #000; cursor: help; font-size: 0.85em; font-variant: small-caps; }
blockquote, embed, dl, object, ol, p, pre, ul { margin-bottom: 1.5em; }
blockquote { margin: 0 0 0 3em; }
blockquote cite { display: block; text-align: right; }
blockquote cite, blockquote cite a { color: #a5a8aa; }
body { color: #444; font-size: 90%; line-height: 1.5; padding: 0 3em 3em; }
cite, em, var { font-style: italic; }
dt { margin-top: 0.5em; }
h1 { color: #cc0000; font-size: 2.2em; font-weight: bold; line-height: 2em; text-transform: uppercase; letter-spacing: 0.1em;  margin-top: -15px; }
h2, h3, h4, h5, h6 { letter-spacing: -0.02em; }
h2 { font-size: 2em; line-height: 1.15em; margin-bottom: 0.45em; }
h2, h3, h4, strong { font-weight: bold; }
h2 a, h3 a { text-decoration: none; }
h3 { font-size: 1.46em; line-height: 1.2; }
hr { background: #e5e6e7; border: 0; clear: both; color: #e5e6e7; height: 1px; margin: 1em 0; }
li { margin-bottom: 0.25em; }
ol { list-style: decimal; margin-left: 2em; }

pre {
	margin-left: 2em;
	text-indent: -2em;
	white-space: pre-wrap;       /* css-3 */
	white-space: -moz-pre-wrap;  /* Mozilla */
	white-space: -pre-wrap;      /* Opera 4-6 */
	white-space: -o-pre-wrap;    /* Opera 7 */
	word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

ul li { background: url(bullet.gif) no-repeat 0 0.7em; padding-left: 1.1em; }


/* Core layout
======================================================================*/
.clear { clear: both; }
#page { margin: 0 auto; max-width: 62.8em; min-width: 600px; }

/*--- Baseline checker ----*/
.baseline { background: url(baseline.gif) 0 6px; }

/*--- Content ----*/
#content-primary { float: left; width: 65.5%; }
#content-primary, #content-secondary { margin-bottom: 1.535em; }
#content-secondary { float: right; width: 31.1%; }

/*--- Home ---*/
#about #content-primary,
#about #content-secondary,
#home #content-primary,
#home #content-secondary,
#portfolio #content-primary,
#portfolio #content-secondary {
	width: 48.6%;
}

/* Content
======================================================================*/
.skip { left: -999em; position: absolute; top: -999em; }

/*--- Affiliate links ---*/
#affiliates a { text-decoration: none; }
#affiliates a:hover { text-decoration: underline; }
#affiliates img { display: block; margin: 0 auto; }
#affiliates li { background: none; margin-bottom: 1.535em; padding: 0; }
#affiliates, #affiliates li { text-align: center; }

/*--- Callouts ---*/
.call-l, .insertLeft { float: left; margin: 0.5em 2em 1em 0; }
.call-r, .insertRight { float: right; margin: 0.5em 0 1em 2em; }
.call, .call-l, .call-r, .insertLeft, .insertRight { font-size: 0.733em; line-height: 1.9em; }

.call, .call a,
.call-l, .call-l a,
.call-r, .call-r a,
.insertLeft, .insertLeft a,
.insertRight, .insertRight a {
	color: #777;
}

/*--- Comments ---*/
#comments { list-style: none; margin-left: 0; }

#comments li {
	background: #f5f5f6;
	clear: both;
	margin-bottom: 1.535em;
	padding: 1.7em 10em 2em 2em;
	position: relative;
}

.comment-number {
	color: #eaebec;
	font-size: 6em;
	font-weight: bold;
	line-height: 1.1;
	position: absolute;
	right: 0.25em;
	text-decoration: none;
	top: 0;
}

.comment-number:hover { color: #d0d1d3; }

/*--- Entries ---*/
#entry h2 { font-size: 1.46em; line-height: 1.2; }
#entry h3 { margin-bottom: 0.2em; }

/*--- Feed link ---*/
.feed { background: url(icon-feed.gif) no-repeat 0 0; padding-left: 18px; }
.mail { background: url(icon-mail.gif) no-repeat 0 0; padding-left: 18px; }
.contact { background: url(icon-contact.gif) no-repeat 0 0; padding-left: 18px; }


/*--- Footer ---*/
#footer { border-top: 1px solid #e5e6e7; clear: both; font-size: 0.733em; line-height: 1.9em; padding-top: 1.9em; }
#footer, #footer a, #footer strong { color: #a5a8aa; }
#footer li { background: none; display: inline; margin-right: 1.5em; padding: 0; }
#footer .url { display: none; }

	/* Subfooter */
	#subfooter { border-top: 1px solid #ddd; font-size: 0.75em; padding-top: 1em; }
	#subfooter a { text-decoration: none; }
	#subfooter a:hover { text-decoration: underline; }
	#subfooter h3 { float: left; width: 12.5%; }
	#subfooter li { background: none; float: left; margin: 0 1.5% 0 0; padding: 0; width: 12.78%; }
	#subfooter ul { float: right; width: 87.5%; }

/*--- Forms ---*/
.form label { float: left; margin-right: 5%; text-align: right; width: 15%; }

	/* Alerts */
	.alert { color: #ff4200; }
	div.alert { border: 3px double #ff7575; margin-bottom: 1.535em; padding: 0.6em 1em 0; }
	div.alert li { background: none; padding: 0; }
	div.alert ul { list-style: disc; margin-left: 1.5em; }
	
	/* Buttons */
	.btn { overflow: visible; padding: 0.2em 0.5em; }
	.btns { margin-left: 20%; }
	
	/* Search */
	.search { font-size: 0.9em; position: absolute; right: 0; top: 0.9em; text-align: right; white-space: nowrap; }
	.search p { margin: 0; }
	.search .txt { margin: 0; width: 13em; }
	
	/* Text boxes*/
	.txt { padding: 0.2em; width: 47.2%; }
	.txt, .txt-sm { margin-right: 0.7em; }
	.txt-sm { text-align: center; text-transform: uppercase; width: 3em; }

/*--- Full view ---*/
#full { text-align: center; }
#full img { border: 1px solid #e5e6e7; }

/*--- Header ---*/
#header { border-bottom: 1px solid #e5e6e7; margin: 1.05em 0 1.9em; padding-bottom: 0.9em; position: relative; }
#home #header { margin-bottom: 0.8em; }
#tagline { color: #aaa; font-style: italic; font-size: 1.1em; padding-top: 0.5em; }

	/* Logo */
	#logo a { display: block; }
	#logo img { border-right: 1px solid #e5e6e7; float: left; margin-right: 1.6em; padding-right: 1.6em; }
	#logo, #nav, #tagline { margin-bottom: 0; }
	
	/* Navigation */
	#nav { font-size: 1.5em; }
	#nav a { text-decoration: none; }
	#nav a:hover { text-decoration: underline; }
	#nav li { background: none; display: inline; margin-right: 1em; padding: 0; }
	#nav li.current { font-weight: bold; }

/*--- Home ---*/
#home h2 { margin: 0; }
#home hr { margin: 0 0 0.4em; }
#home #content-primary a { text-decoration: none; }
#home #content-secondary a { text-decoration: underline; }

/*--- Intro ---*/
#intro { font-size: 2em; line-height: 1.5; margin-bottom: 0.5em; }

/*--- Muted text ---*/
.cite, .mute { font-size: 0.733em; line-height: 1.9em; }
.cite, .cite a, .mute, .mute a { color: #b4a036; }
dt .mute { margin-left: 0.5em; }
.mute { margin: -10px 0 0 0; }

/*--- Secondary navigation ---*/
#nav-secondary li { background: none; border-bottom: 1px solid #e5e6e7; margin-bottom: 0.54em; padding: 0 0 0.54em; }
#nav-secondary .mute { margin-left: 0.5em; }

/*--- Slideshows ---*/
.slideshow a { display: table-cell; height: 106px; text-align: center; vertical-align: middle; width: 75px; }
.slideshow a:hover img { border-color: #000; }
.slideshow img { border: 1px solid #ddd; vertical-align: middle; }
.slideshow li { background: none; float: left; margin: 0 1em 1em 0; padding: 0; }
.slideshow span { height: 100%; vertical-align: middle; }

/*--- Thumbnails ---*/
#home #thumbs li { float: none; width: 100%; }
#thumbs { margin-top: 0.5em; }
#thumbs a:hover img { border: none; }
#thumbs img { border: none; display: block; margin-bottom: 0.3em; }
#thumbs li { background: none; float: left; margin-bottom: 3em; padding: 0; width: 48.6%; }
#thumbs li.alt { float: right; }
#thumbs .mute { margin-left: 0.7em; }

/*--- Viewing options ---*/
#view { clear: both; font-size: 0.85em; margin-bottom: 1.535em; }
#view a, #view strong { margin: 0 0.3em; }
#view p { border-right: 1px solid #babcbe; display: inline; margin-right: 1em; padding-right: 1em; }
#view p.last { border: 0; margin: 0; padding: 0; }
#view strong a { margin: 0; }