/* ----------- letscounthedays ----------- */
/* The Online Portfolio of Shay Howe */
/* www.shayhowe.com */

/* -------------------------------------------------------------------------- */
/* --- Universal Styles --- */

/* ----------- da Reset ----------- */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header,  hgroup, menu, nav, section, time, mark, audio, video { background: transparent; border: 0; font-size: 100%; margin: 0; outline: 0; padding: 0; vertical-align: baseline; }
body { line-height: 1; }
article, aside, dialog, figure, footer, header, hgroup, nav, section { display: block; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }
a:hover, a:active, a:focus { outline: none; }

/* ----------- General Styles ----------- */
* { margin: 0; padding: 0; }
body { background: #f3f3f3; color: #777; font: 14px/20px Arial, Helvetica, sans-serif; }
html { margin: 0 auto;width: 950px; }
article { clear: both; padding-top: 20px; }
article#main { float: left; width: 660px; }
aside { float: right; padding-top: 20px; width: 274px; }
::selection { background: #f60; color: #fff; }
::-moz-selection { background: #f60; color: #fff; }
.clear { clear: both; }
.none { display: none; }

/* ----------- The Box ----------- */
section { background: #fff; box-shadow: 2px 2px 0px #e6e6e6; margin-bottom: 20px; -moz-box-shadow: 2px 2px 0px #e6e6e6; -webkit-box-shadow: 2px 2px 0px #e6e6e6; }
section h2 { background: #e8e8e8; border-bottom: 1px solid #d0d0d0; border-top: 1px solid #d0d0d0; color: #444; line-height: 18px; margin: 0px; padding: 5px 15px 4px 15px; text-shadow: 1px 1px 0px #fff; text-transform: uppercase; }
section h1 { color: #f60; font-size: 20px; letter-spacing: -.2px; padding: 16px 15px 18px 15px; /* text-shadow: 1px 1px 0px #ddd; */ }
section h3 { color: #444; font-size: 15px; letter-spacing: -.2px; padding: 0px 15px 2px 15px; }
section h3 span { color: #777; font-size: 14px; font-weight: normal; letter-spacing: -.2px; }
section h4 { color: #f60; font-size: 20px; letter-spacing: -.2px; padding: 0px 15px 18px 15px; /* text-shadow: 1px 1px 0px #ddd; */ }
section p { padding: 0px 15px 18px 15px; }
section a { color: #f60; text-decoration: none; }
section a:hover { background: #f3f3f3; border-bottom: 1px solid #d0d0d0; }
section a:active { color: #555; }
section p a, section li a, section h1 a { padding: 1px; }
section h1 a:hover { color: #444; }
section h1 a:active { color: #777; }
section a h2 { color: #444; background: #e8e8e8; border-bottom: 1px solid #d0d0d0; border-top: 1px solid #d0d0d0; }
section a:hover h2 { color: #f60; background: #e5e5e5; border-bottom: 1px solid #c7c7c7; border-top: 1px solid #c7c7c7; line-height: 18px; margin: 0px; padding: 5px 15px 4px 15px; }
section a:active h2 { color: #666; padding: 6px 15px 3px 15px; }
section img { background: #fff; border: 1px solid #d0d0d0; padding: 2px; }
section img.rt-top { float: right; margin: 0px 15px 15px 15px; }
section img.no-brd { border: none; }
section a:hover img { background: #fff; border: 1px solid #999; }
section .byline { background: #f3f3f3; line-height: 28px; padding: 0px 15px; }
section a.btn { background: url(../img/btn-lt.png) left top no-repeat; color: #777; cursor: pointer; display: inline-block; height: 26px; line-height: 26px; margin: 0px 15px 18px 15px; padding: 0px 0px 0px 15px; -moz-transition: color 0.15s ease-in-out; -webkit-transition: color 0.15s ease-in-out; }
section a.btn span { background: url(../img/btn-rt.png) right top no-repeat; display: inline-block; padding-right: 15px; text-shadow: 1px 1px 0px #fff; }
section a.btn:hover { background-position: left bottom; border-bottom: none; color: #666; }
section a.btn:hover span { background-position: right bottom; }
section a.btn:active { color: #f60; margin: 1px 15px 17px 15px; }
section abbr { border-bottom: 1px dotted #d0d0d0; }
section a:hover abbr { border-bottom: none; }
section blockquote { background: #f3f3f3; border-left: 1px solid #d0d0d0; color: #999; font-style: italic; margin: 0px 30px 18px 30px; padding: 5px 15px; text-shadow: 1px 1px 0px #f8f8f8; }
section blockquote span { color: #bbb; display: block; font-size: 13px; font-style: normal; margin-top: 10px; }

/* ----------- Header ----------- */
#panel { display: none; margin-top: 20px; }
#panel .top { background: #e8e8e8; border-bottom: 1px solid #d0d0d0; border-top: 1px solid #d0d0d0; color: #444; font-weight: bold; line-height: 18px; margin: 0px; padding: 5px 15px; text-transform: uppercase; }
#panel .top .lt { display: inline; float: left; text-shadow: 1px 1px 0px #fff; width: 600px; }
#panel .top .rt { display: inline; float: right; text-align: right; width: 200px; }
#panel .top .rt a { color: #aaa; font-size: 12px; font-style: italic; font-weight: normal; text-shadow: 1px 1px 0px #fff; text-transform: none; }
#panel .top .rt a:hover { background: none; border: none; color: #f60; }
#panel .top .rt a:active { color: #444; }
#panel form.contact { float: left; margin: 16px 30px 0px 15px; width: 630px; }
#panel .contact-box { float: left; margin: 16px 0px 0px 0px; width: 275px; }
header a { color: #ddd; text-decoration: none; }
header a:hover { color: #fff; }
header div.bar { background: #444; color: #ddd; height: 32px; line-height: 32px; padding: 0px 15px; text-shadow: 1px 1px 1px #222; }
header div a { float: left; }
header div span { float: right; }
header a h1 { background: url(../img/logo.png) top left no-repeat; display: inline-block; float: left; height: 74px; margin: 24px 0px 16px 0px; text-indent: -9999px; width: 461px; }
header a:hover h1 { background-position: bottom left; }
header .page-title { float: left; margin: 49px 0px 0px 15px; width: 474px; }
header .page-title strong { color: #777; display: block; font-size: 24px; margin-bottom: 5px; text-transform: uppercase; }
header .page-title em { color: #aaa; font-size: 16px; font-style: normal; }

/* ----------- Nav ----------- */
nav { border-top: 8px solid #444; clear: both; }
nav ul li { border-left: 1px solid #d0d0d0; float: left; }
nav ul li a { background: #f3f3f3; color: #444; display: block; font-weight: bold; height: 42px; padding: 6px 50px 0px 12px; text-decoration: none; text-shadow: 1px 1px 0px #fff; -moz-transition: background 0.15s ease-in-out; -webkit-transition: background 0.15s ease-in-out; }
nav ul li a em { color: #aaa; display: block; font-weight: normal; line-height: 14px; text-transform: lowercase; -moz-transition: color 0.15s ease-in-out; -webkit-transition: color 0.15s ease-in-out; }
nav ul li a:hover { background: #fff; }
nav ul li a:hover em { color: #f60; }
nav ul li a:active { height: 41px; padding-top: 7px; }
nav li a.nav-on, nav li a.nav-on:hover { background: #e6e6e6; cursor: default; }
nav li a.nav-on em, nav li a.nav-on:hover em { color: #f60; }

/* ----------- Footer ----------- */
footer { background: #444; clear: both; color: #ddd; height: 32px; line-height: 32px; padding: 0px 15px; text-shadow: 1px 1px 1px #222; }
footer a { color: #ddd; text-decoration: none; }
footer a:hover { color: #fff; }
footer .rt { display: inline; float: left; width: 460px; }
footer .lt { display: inline; float: right; text-align: right; width: 460px; }

/* ----------- Slider ----------- */

#slider {
	text-transform: uppercase;
	color: #444;
	font-weight: bold;
}

#slider .tabs {
	display: inline;
	float: left;
	width: 460px;
	text-shadow: 1px 1px 0px #fff;
}

#slider .tabs a {
	color: #aaa;
	background: none;
	border: none;
	cursor: pointer;
}

#slider .tabs a:hover {
	color: #444;
	background: none;
	border: none;
}

#slider .tabs a.current {
	color: #f60;
	cursor: default;
}

#slider .next {
	display: inline;
	float: right;
	width: 460px;
	text-shadow: 1px 1px 0px #fff;
}

#slider a.forward {
	color: #444;
	float: right;
	padding-right: 15px;
	background: url(../img/next-arw-off.png) right center no-repeat;
	cursor: pointer;
}

#slider a.forward:hover {
	color: #f60;
	background: url(../img/next-arw-on.png) right center no-repeat;
	border: none;
}

/* ----------- Content Box ----------- */

.contact-box p strong { display: block; color: #f60; }
.contact-box p a { color: #777; }
.contact-box p a:hover { color: #f60; }
.contact-box p a:active { color: #444; }
.contact-box span.phone { padding-left: 20px; background: url(../img/contact-box/contact.png) 0px 0px no-repeat; }
.contact-box span.phone:hover { background: url(../img/contact-box/contact.png) 0px -20px no-repeat; }
.contact-box a.email { padding-left: 22px; background: url(../img/contact-box/contact.png) 0px -37px no-repeat; }
.contact-box a.email:hover { background: #f3f3f3 url(../img/contact-box/contact.png) 0px -57px no-repeat; }
.contact-box span.location { padding-left: 20px; background: url(../img/contact-box/contact.png) 0px -80px no-repeat; }
.contact-box span.location:hover { background: url(../img/contact-box/contact.png) 0px -100px no-repeat; }
.contact-box a.aim { padding-left: 20px; background: url(../img/contact-box/contact.png) 0px -120px no-repeat; }
.contact-box a.aim:hover { background: #f3f3f3 url(../img/contact-box/contact.png) 0px -120px no-repeat; }
.contact-box a.html { padding-left: 20px; margin-right: 26px; background: url(../img/contact-box/contact.png) 0px -138px no-repeat; }
.contact-box a.html:hover { background: #f3f3f3 url(../img/contact-box/contact.png) 0px -158px no-repeat; }
.contact-box a.pdf { padding-left: 20px; margin-right: 26px; background: url(../img/contact-box/contact.png) 0px -180px no-repeat; }
.contact-box a.pdf:hover { background: #f3f3f3 url(../img/contact-box/contact.png) 0px -200px no-repeat; }
.contact-box a.word { padding-left: 20px; background: url(../img/contact-box/contact.png) 0px -220px no-repeat; }
.contact-box a.word:hover { background: #f3f3f3 url(../img/contact-box/contact.png) 0px -240px no-repeat; }
.contact-box a.linkedin { padding-left: 20px; margin-right: 26px; background: url(../img/contact-box/contact.png) 0px -260px no-repeat; }
.contact-box a.linkedin:hover { background: #f3f3f3 url(../img/contact-box/contact.png) 0px -260px no-repeat; }
.contact-box span.twitter { padding-left: 20px; background: url(../img/contact-box/contact.png) 0px -280px no-repeat; }
.contact-box span.twitter a { padding: 0px 1px 0px 0px; }
.contact-box span.twitter:hover { color: #f60; padding-bottom: 2px; border-bottom: 1px solid #d0d0d0; background: #f3f3f3 url(../img/contact-box/contact.png) 0px -280px no-repeat; }
.contact-box span.twitter:hover a { color: #f60; border-bottom: none; }

/* ----------- Twitter Box ----------- */

#twitter-box strong { color: #f60; display: block; margin-top: 16px; }
#twitter-box em { display: block; color: #aaa; font-size: 12px; font-style: italic; line-height: normal; }
#twitter-box span { display: block; color: #aaa; font-size: 12px; font-style: italic; margin-top: 2px; }
#twitter-box ul { margin: 0px 15px 18px 15px; }
#twitter-box ul li a:hover { color: #444; }
#twitter-box ul li a:active { color: #666; }
#twitter-box a.twitter { display: block; height: 26px; width: 114px; line-height: 26px; color: #777; text-indent: 38px; background: url(../img/btn-twitter.jpg) top left no-repeat; -moz-transition: color 0.15s ease-in-out; -webkit-transition: color 0.15s ease-in-out; }
#twitter-box a.twitter:hover { color: #666; background-position: top right; border: none; }
#twitter-box a.twitter:active { color: #f60; }
#twitter-box p #follow-placeholder { cursor: default; }

/* ----------- Currently Box ----------- */

#currently-box strong {
	display: block;
	color: #f60;
	margin: 16px 15px 0px 15px;
}

#currently-box ul.sq {
	list-style: square;
	margin: 0px 15px 2px 30px;
}

/* ----------- Contact Form ----------- */

form.contact {
	margin: 0px 15px;
}

form.contact .col-1 {
	float: left;
	width: 324px;
}

form.contact .col-2 {
	float: left;
	width: 306px;
}

form.contact label {
	display: block;
	color: #f60;
	font-weight: bold;
	margin-bottom: 2px;
	cursor: pointer;
}

form.contact label[for="message"] {
	clear: both;
}

form.contact input[type="text"] {
	color: #aaa;
	font: italic 14px/20px Arial, Helvetica, sans-serif;
	width: 290px;
	padding: 7px;
	margin-bottom: 18px;
	border: 1px solid #d0d0d0;
	background: url(../img/input.png) top left no-repeat;
}

form.contact input[type="text"]:hover, form.contact input[type="text"]:focus, form.contact input[type="text"]:active {
	color: #777;
	border: 1px solid #999;
}

form.contact textarea {
	color: #aaa;
	font: italic 14px/20px Arial, Helvetica, sans-serif;
	width: 614px;
	padding: 7px;
	margin-bottom: 18px;
	border: 1px solid #d0d0d0;
	background: url(../img/textarea.png) top left no-repeat;
}

form.contact textarea:hover, form.contact textarea:focus, form.contact textarea:active {
	color: #777;
	border: 1px solid #999;
}

form.contact p {
	padding-left: 0px;
}

form.contact input[type="submit"] {
	display: block;
	height: 26px;
	width: 62px;
	font: 14px/26px Arial, Helvetica, sans-serif;
	text-align: center;
	color: #777;
	border: none;
	background: url(../img/btn-form.jpg) top left no-repeat;
	-moz-transition: color 0.15s ease-in-out; 
	-webkit-transition: color 0.15s ease-in-out;
	cursor: pointer;
}

form.contact input[type="submit"]:hover, form.contact input[type="submit"]:focus {
	color: #666;
	background-position: top right;
}

form.contact input[type="submit"]:active {
	color: #f60;
}

#hire {
	height: 504px;
}

#hire p strong {
	color: #444;
}

/* -------------------------------------------------------------------------- */
/* --- Home Page Styles --- */

/* ----------- Welcome ----------- */

#welcome {
	height: 226px;
}

#welcome .col-1 {
	float: left;
	width: 440px;
}

#welcome .col-2 {
	float: left;
	padding-top: 38px;
}

#welcome ul {
	float: left;
}

#welcome ul li {
	padding: 0px 60px 0px 20px;
	line-height: 24px;
	background: url(../img/tick.png) left center no-repeat;
}

#welcome ul.col-last li {
	padding-right: 0px;
}

#welcome ul li a {
	color: #777;
}

#welcome ul li a:hover {
	color: #f60;
}

#welcome ul li a:active {
	color: #555;
}

/* ----------- Recent Projects ----------- */

#recent-projects {
	height: 390px;
}

#recent-projects .images {
	position: relative;
}

#recent-projects .images div {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 950px;
}

#recent-projects .images div h1,
#recent-projects .images div p {
	width: 352px;
}


#recent-projects .images div a img {
	float: right;
	margin: 15px;
}


/* ----------- Recent Articles ----------- */

#recent-articles {
	float: left;
	display: inline;
	height: 500px;
	width: 388px;
	margin-right: 16px;
}

#recent-articles em {
	display: block;
	color: #aaa;
	font-size: 12px;
	font-style: italic;
	margin-top: -16px;
	padding: 0px 15px 18px 15px;
}

#recent-articles a img {
	display: block;
}

#recent-articles a.btn {
	margin-bottom: 1px;
}

#recent-articles a.btn:active {
	margin-top: 1px;
	margin-bottom: 0px;
}

#recent-articles .article-1,
#recent-articles .article-2 {
	float: left;
	width: 178px;
	margin: 18px 0px;
}

#recent-articles .article-1 {
	padding-right: 15px;
	border-right: 1px solid #d0d0d0;
}

#recent-articles .article-1 a img {
	margin-left: 15px;
}

#recent-articles .article-1 h1,
#recent-articles .article-1 p {
	padding-right: 0px;
}


#recent-articles .article-2 {
	padding-left: 15px;
}

#recent-articles .article-2 h1,
#recent-articles .article-2 em,
#recent-articles .article-2 p {
	padding-left: 0px;
}

#recent-articles .article-2 a.btn {
	margin-left: 0px;
}

/* ----------- Personal Overview ----------- */

#personal-overview {
	float: left;
	display: inline;
	height: 500px;
	width: 546px;
}

#personal-overview .overview-1 {
	float: left;
	width: 258px;
	margin-top: 18px;
	margin-right: 30px;
}

#personal-overview .overview-1 a img {
	display: block;
	margin-left: 15px;
}

#personal-overview .overview-1 p {
	padding-right: 0px;
}

#personal-overview .overview-2 {
	float: left;
	width: 243px;
	padding-right: 15px;
	margin-top: 18px;
}

#personal-overview .overview-2 strong {
	color: #f60;
	display: block;
}

#personal-overview .overview-2 em {
	display: block;
	color: #aaa;
	font-size: 12px;
	font-style: italic;
	line-height: normal;
	margin-bottom: 18px;
}

#personal-overview .overview-2 span {
	display: block;
	color: #aaa;
	font-size: 12px;
	font-style: italic;
	margin: 2px 0px 22px 0px;
}

#personal-overview .overview-2 #twitter_update_list a:hover {
	color: #444;
}

#personal-overview .overview-2 #twitter_update_list a:active {
	color: #666;
}

#personal-overview .overview-2 ul.sq { 
	list-style: square;
	margin-left: 15px;
	margin-bottom: 22px;
}

/* -------------------------------------------------------------------------- */
/* --- Portfolio Category Pages Styles --- */

/* ----------- Portfolio Intro ----------- */

#portfolio-intro {
	height: 222px;
}

#portfolio-intro .col-1 {
	float: left;
	margin: 16px 0px 18px 0px;
	width: 680px;
	border-right: 1px solid #d0d0d0;
}

#portfolio-intro .col-1 h1 {
	padding-top: 0px;
}

#portfolio-intro .col-1 p {
	padding-bottom: 0px;
}

#portfolio-intro .col-2 {
	float: left;
	width: 260px;
}

/* ----------- Featured Projects ----------- */

#featured-projects {
	height: 510px;
}

#featured-projects .images {
	position: relative;
}

#featured-projects .images div {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 950px;
}

#featured-projects .images div h1,
#featured-projects .images div p {
	width: 300px;
}

#featured-projects .images div p strong {
	display: block;
	color: #444;
}


#featured-projects .images div a img {
	float: right;
	margin: 15px;
}

/* -------------------------------------------------------------------------- */
/* --- Portfolio Category Pages Styles --- */

/* ----------- Project Overview ----------- */

#project-overview {
	height: 510px;
}

#project-overview .overview-info {
	float: left;
	width: 331px;
}

#project-overview .overview-info p strong {
	display: block;
	color: #444;
}

#project-overview #preview {
	float: left;
	margin: 15px;
}

#project-overview .images {
	position: relative;
}

#project-overview .images div {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
}

#project-overview .images div img {
	display: block;
}

#project-overview-branding {
	height: 482px;
}

#project-overview-branding .overview-info {
	float: left;
	width: 331px;
}

#project-overview-branding .overview-info p strong {
	display: block;
	color: #444;
}

#project-overview-branding a img {
	display: block;
	float: right;
	margin: 15px;
}

/* -------------------------------------------------------------------------- */
/* --- About/Resume Pages Styles --- */

/* ----------- Resume ----------- */

.resume-lt {
	float: left;
	width: 150px;
}

.resume-rt {
	float: right;
	width: 480px;
	padding: 16px 20px 0px 0px;
}

.resume-rt strong {
	display: block;
	color: #f60;
}

.resume-rt em {
	display: block;
	color: #444;
	font-style: normal;
}

/* -------------------------------------------------------------------------- */
/* --- Services Page Styles --- */

/* --- Skills --- */

#skills ul.col-1 {
	float: left;
	margin: 0px 0px 18px 15px;
	width: 210px;
}

#skills ul.col-2,
#skills ul.col-3 {
	float: left;
	width: 210px;
}

#skills ul li {
	padding-left: 20px;
	line-height: 24px;
	background: url(../img/tick.png) left center no-repeat;
}

#skills p {
	clear: both;
}

/* --- Services --- */

#services p {
	position: relative;
	margin-left: 15px;
	padding-left: 84px;
}

#services p strong {
	display: block;
	color: #f60;
}

p#web-design {
	background: url(../img/services/services.png) 0px 0px no-repeat;
}

p#web-design:hover {
	background: url(../img/services/services.png) 0px  -120px no-repeat;
}

p#coding {
	background: url(../img/services/services.png) 0px -240px no-repeat;
}

p#coding:hover {
	background: url(../img/services/services.png) 0px -360px no-repeat;
}

p#blog {
	background: url(../img/services/services.png) 0px -480px no-repeat;
}

p#blog:hover {
	background: url(../img/services/services.png) 0px -600px no-repeat;
}

p#ux {
	background: url(../img/services/services.png) 0px -720px no-repeat;
}

p#ux:hover {
	background: url(../img/services/services.png) 0px -840px no-repeat;
}

p#seo {
	background: url(../img/services/services.png) 0px -960px no-repeat;
}

p#seo:hover {
	background: url(../img/services/services.png) 0px -1080px no-repeat;
}

p#branding {
	background: url(../img/services/services.png) 0px -1200px no-repeat;
}

p#branding:hover {
	background: url(../img/services/services.png) 0px -1320px no-repeat;
}

p#print {
	background: url(../img/services/services.png) 0px -1440px no-repeat;
}

p#print:hover {
	background: url(../img/services/services.png) 0px -1560px no-repeat;
}

p#stats {
	background: url(../img/services/services.png) 0px -1680px no-repeat;
}

p#stats:hover {
	background: url(../img/services/services.png) 0px -1800px no-repeat;
}

p#copywriting {
	background: url(../img/services/services.png) 0px -1920px no-repeat;
}

p#copywriting:hover {
	background: url(../img/services/services.png) 0px -2040px no-repeat;
}

p#email-marketing {
	background: url(../img/services/services.png) 0px -2160px no-repeat;
}

p#email-marketing:hover {
	background: url(../img/services/services.png) 0px -2280px no-repeat;
}

/* -------------------------------------------------------------------------- */
/* --- Notebook Style --- */

/* --- General Box --- */

.post .byline {
	height: 28px;
	text-shadow: 1px 1px 0px #fff;
}

.post .byline a:hover {
	color: #444;
	background: none;
	border: none; 
}

.post .byline a:active {
	color: #666;
}

.post .byline span.time {
	float: left;
	padding-left: 20px;
	background: url(../img/notebook/notebook.png) 0px -97px no-repeat;
}

.post .byline span.time:hover {
	background: url(../img/notebook/notebook.png) 0px -120px no-repeat;
}

.post .byline div {
	display: inline-block;
	float: right;
	height: 16px;
	margin-top: 6px;
}

.post .byline a.comment {
	float: right;
	padding-left: 20px;
	background: url(../img/notebook/notebook.png) 0px -142px no-repeat;
}

.post .byline a.comment:hover {
	background: url(../img/notebook/notebook.png) 0px -163px no-repeat;
}

.post a:hover {
	color: #444;
}

.post a:active {
	color: #666;
}

.post img {
	display: block;
	margin: 0px auto;
	margin-bottom: 18px;
}

.post p.full {
	font-size: 13px;
	line-height: 18px;
	color: #999;
	margin: -18px 0px 18px 21px;
	width: 587px;
	padding: 5px 15px;
	background: #f3f3f3;
	border-bottom: 1px solid #d0d0d0;
	text-shadow: 1px 1px 0px #f8f8f8;
}

.post a:hover p.full {
	border-bottom: 1px solid #999;
}

.post p.full strong {
	color: #777;
}

.post p.full em {
	padding-bottom: 0px;
	border-bottom: none;
}

.post p.sm {
	border-top: 1px solid #e8e8e8;
	margin: 0px 15px;
	padding: 10px 0px 18px 0px;
	color: #999;
	font-size: 12px;
	font-style: italic;
}

.post ul {
	list-style: square;
	margin: 0px 15px 18px 40px;
}

.post ol {
	list-style: decimal;
	margin: 0px 15px 18px 50px;
}

.post strong {
	color: #444;
}

.post em {
	padding-bottom: 1px;
	border-bottom: 1px dotted #d0d0d0;
}

.post img.top-rt {
	float: right;
	margin: 0px 15px 18px 15px;
}

.post table {
	margin: 0px 15px 18px 15px;
}

section a.more-link {
	display: inline-block;
	height: 26px;
	margin: 0px 15px 18px 15px;
	padding: 0px 0px 0px 15px;
	line-height: 26px;
	color: #777;
	background: url(../img/btn-lt.png) left top no-repeat;
	-moz-transition: color 0.15s ease-in-out; 
	-webkit-transition: color 0.15s ease-in-out;
	cursor: pointer;
}

section a.more-link span {
	display: inline-block;
	padding-right: 15px;
	background: url(../img/btn-rt.png) right top no-repeat;
	text-shadow: 1px 1px 0px #fff;
}

section a.more-link:hover {
	color: #666;
	background-position: left bottom;
	border-bottom: none;
}

section a.more-link:hover span {
	background-position: right bottom;
}

section a.more-link:active {
	color: #f60;
	margin: 1px 15px 17px 15px;
}

a.archives {
	display: inline-block;
	color: #f60;
	text-decoration: none;
	margin: 0px 0px 18px 15px;
}

a.archives:hover {
	color: #444;
}

a.archives:active {
	color: #666;
	margin: 0px 0px 17px 15px;
	padding-top: 1px;
}

.post .byline span.tags {
	padding-left: 20px;
	background: url(../img/notebook/notebook.png) 0px -191px no-repeat;
}

.post .byline span.tags:hover {
	background: url(../img/notebook/notebook.png) 0px -213px no-repeat;
}

a.top {
	display: inline-block;
	color: #f60;
	text-decoration: none;
	margin: 0px 0px 18px 15px;
	padding-left: 9px;
	background: url(../img/notebook/notebook.png) 0px -310px no-repeat;
}

a.top:hover {
	color: #444;
}

a.top:active {
	color: #666;
	margin: 0px 0px 17px 15px;
	padding-top: 1px;
}

pre {
	margin: 0px 15px 18px 15px;
	padding: 5px 15px ;
	background: #f3f3f3;
	border-left: 1px solid #d0d0d0;
	text-shadow: 1px 1px 0px #f8f8f8;
}

p code {
	padding: 1px;
	background: #f3f3f3;
	border-bottom: 1px dotted #d0d0d0;
	text-shadow: 1px 1px 0px #f8f8f8;
}

/* --- Social Media Sharing --- */

#share .retweet {
	float: left; 
	display: inline; 
	margin: 0px 15px;
}

#share a {
	display: inline-block;
	height: 65px;
	text-align: center;
	cursor: pointer;
	background: none;
}

#share a div {
	float: left;
	display: inline;
	height: 59px;
	padding: 3px 8px;
	background: none;
}

#share a img {
	display: block;
	margin: 0px auto;
	border: none;
	background: none;
}

#share a em {
	display: block;
	font-style: normal;
}

#share a:hover {
	background: url(../img/notebook/buble-rt.png) top right no-repeat;
	border: none;
}

#share a:hover div {
	background: url(../img/notebook/buble-lt.png) top left no-repeat;
	color: #444;
}

#share a:active img {
	padding-top: 3px;
}

#share a:active div {
	color: #666;
}

#share a.delicious div {
	width: 57px;
}

#share a.digg div {
	width: 36px;
}

#share a.stumbleupon div {
	width: 84px;
}

#share a.facebook div {
	width: 62px;
}

#share a.reddit div {
	width: 40px;
}

#share a.designfloat div {
	width: 80px;
}

#share a.designmoo div {
	width: 76px;
}

/* --- Related Articles --- */

#related .top {
	margin: 0px;
	padding: 5px 15px 4px 15px;
	color: #444;
	text-transform: uppercase;
	font-weight: bold;
	line-height: 18px;
	border-top: 1px solid #d0d0d0;
	border-bottom: 1px solid #d0d0d0;
	background: #e8e8e8;
}

#related .top .lt {
	display: inline;
	float: left;
	width: 315px;
	text-shadow: 1px 1px 0px #fff;
}

#related .top .rt {
	display: inline;
	float: right;
	width: 315px;
	text-align: right;
}

#related .top .rt a {
	color: #aaa;
	font-size: 12px;
	font-weight: normal;
	text-transform: none;
	text-shadow: 1px 1px 0px #fff;
}

#related .top .rt a:hover {
	background: none;
	border: none;
	color: #f60;
}

#related .top .rt a:active {
	color: #444;
}

#related .article {
	float: left;
	width: 135px;
	margin: 0px 15px;
}

#related .article a img {
	display: block;
	height: 88px;
	width: 129px;
	margin-bottom: 4px;
}

#related .article a strong {
	display: inline-block;
	font-weight: normal;
	line-height: 16px;
	padding: 1px;
}

#related .article a:hover strong {
	color: #444;
	background: #f3f3f3;
	border-bottom: 1px solid #d0d0d0;
}

#related .article a:active strong {
	color: #666;
}

#related .article a em {
	display: block;
	color: #aaa;
	font-size: 12px;
}

#related p {
	padding-bottom: 0px;
}

/* --- Comment Form --- */

form#commentform {
	margin: 0px 15px;
}

form#commentform .comment-rules {
	float: right;
	width: 276px;
	padding: 15px;
	background: #f3f3f3;
}

form#commentform .comment-rules strong {
	display: block;
	color: #f60;
}

form#commentform .comment-rules ul {
	margin-left: 20px;
	list-style: square;
}

form#commentform .comment-rules ul li {
	margin-top: 12px;
}

form#commentform label {
	display: block;
	color: #f60;
	font-weight: bold;
	margin-bottom: 2px;
	cursor: pointer;
}

form#commentform input[type="text"] {
	color: #aaa;
	font: italic 14px/20px Arial, Helvetica, sans-serif;
	width: 290px;
	padding: 7px;
	margin-bottom: 18px;
	border: 1px solid #d0d0d0;
	background: url(../img/input.png) top left no-repeat;
}

form#commentform input[type="text"]:hover, form#commentform input[type="text"]:focus, form#commentform input[type="text"]:active {
	color: #777;
	border: 1px solid #999;
}

form#commentform textarea {
	color: #aaa;
	font: 14px/20px Arial, Helvetica, sans-serif;
	width: 614px;
	padding: 7px;
	margin-bottom: 18px;
	border: 1px solid #d0d0d0;
	background: url(../img/textarea.png) top left no-repeat;
}

form#commentform textarea:hover, form#commentform textarea:focus, form#commentform textarea:active {
	color: #777;
	border: 1px solid #999;
}

form#commentform input[type="submit"] {
	display: block;
	height: 26px;
	width: 62px;
	font: 14px/26px Arial, Helvetica, sans-serif;
	text-align: center;
	color: #777;
	border: none;
	background: url(../img/btn-form.jpg) top left no-repeat;
	-moz-transition: color 0.15s ease-in-out; 
	-webkit-transition: color 0.15s ease-in-out;
	cursor: pointer;
}

form#commentform input[type="submit"]:hover, form#commentform input[type="submit"]:focus {
	color: #666;
	background-position: top right;
}

form#commentform input[type="submit"]:active {
	color: #f60;
}

/* --- Comment List --- */

.comment .top {
	margin: 0px 0px 16px 0px;
	padding: 5px 15px 4px 15px;
	color: #444;
	text-transform: uppercase;
	font-weight: bold;
	line-height: 18px;
	border-top: 1px solid #d0d0d0;
	border-bottom: 1px solid #d0d0d0;
	background: #e8e8e8;
}

.comment .top .lt {
	display: inline;
	float: left;
	width: 556px;
	text-shadow: 1px 1px 0px #fff;
}

.comment .top .lt em {
	display: inline;
	float: right;
	color: #aaa;
	font-size: 12px;
	text-transform: none;
	font-style: italic;
	font-weight: normal;
}


.comment .top .rt {
	display: inline;
	float: right;
	width: 0px;
}

.comment .avatar {
	float: right;
	width: 54px;
	margin: -38px 15px 15px 15px;
	padding: 0;
}

.comment .avatar img {
	height: 48px;
	width: 48px;
	border: 1px solid #d0d0d0;
	padding: 2px;
	margin: 0;
}

.comment .top .lt a {
	color: #444;
}

.comment .top .lt a:hover {
	color: #f60;
	background: none;
	border: none;
}

.comment .top .lt a:active {
	color: #666;
}

.comment .top .lt span {
	color: #aaa;
	font-size: 12px;
	font-weight: normal;
	text-transform: none;
	font-style: italic;
}

.comment .comment-approval {
	color: #aaa;
	font-size: 12px;
}
.comment p i {
	font-size: 12px;
	color: #aaa;
}

.comment img {
	border: none;
}

/* --- Author Layout --- */

#author a img {
	float: right;
	margin: -21px 15px 15px 15px;
}

#author a:hover {
	color: #444;
}

#author a:active {
	color: #666;
}

/* --- Contribute - Sidebar --- */

#contribute {
	background: #fff url(../img/notebook/notebook.png) 180px -298px no-repeat;
}

#contribute:hover {
	background: #fff url(../img/notebook/notebook.png) 180px -422px no-repeat;
}

#contribute p {
	padding: 16px 110px 18px 15px;
}

#contribute a:hover {
	color: #444;
}

#contribute a:active {
	color: #666;
}

/* --- Archives List --- */

#archives ul {
	margin: 16px 15px 0px 15px;
	line-height: 24px;
}

#archives ul li em {
	color: #aaa;
	font-size: 12px;
	margin-right: 10px;
}

#archives ul li a {
	padding-left: 20px;
	background: url(../img/notebook/notebook.png) 0px -273px no-repeat;
}

#archives ul li a:hover {
	color: #444;
	background: #f3f3f3 url(../img/notebook/notebook.png) 0px -293px no-repeat;
}

#archives ul li a:active {
	color: #666;
}

/* --- Category Layout --- */

p.links span a {
	display: inline-block;
	color: #f60;
	text-decoration: none;
	margin: 0px 15px 18px 15px;
}

p.links span a:hover {
	color: #444;
}

p.links span a:active {
	color: #666;
	margin-bottom: 17px;
	padding-top: 1px;
}

span.link-rt a {
	float: right;
}

/* --- Subscribe - Sidebar --- */
#subscribe a:active { color: #666; }
#subscribe a.rss { display: inline-block; margin: 16px 15px 2px 15px; padding-left: 20px; background: url(../img/notebook/notebook.png) 0px 2px no-repeat; }
#subscribe a.rss:hover { color: #444; margin-bottom: 1px; background: #f3f3f3 url(../img/notebook/notebook.png) 0px -18px no-repeat; }
#subscribe a.email { display: inline-block; margin: 2px 15px; padding-left: 20px; background: url(../img/notebook/notebook.png) 0px -58px no-repeat; }
#subscribe a.email:hover { color: #444; margin-bottom: 1px; background: #f3f3f3 url(../img/notebook/notebook.png) 0px -38px no-repeat; }
#subscribe span.twitter { color: #f60; display: inline-block; margin: 2px 15px 18px 15px; padding-left: 20px; background: url(../img/notebook/notebook.png) 0px -78px no-repeat; }
#subscribe span.twitter:hover { color: #444; border-bottom: 1px solid #d0d0d0; margin-bottom: 17px; background: #f3f3f3 url(../img/notebook/notebook.png) 0px -78px no-repeat; }
#subscribe span.twitter a { padding: 0px 1px 0px 0px; }
#subscribe span.twitter:hover a { color: #444; border-bottom: none; }

/* --- Sponsors - Sidebar --- */

section a.for-sale {
	display: block;
	width: 232px;
	height: 50px;
	background: #f3f3f3;
	color: #f60;
	text-align: center;
	font: bold 14px/20px Arial, Helvetica, sans-serif;
	margin: 18px auto;
	padding-top: 8px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border: 1px solid #d0d0d0;
}

section a.for-sale span {
	font: normal 12px/18px Arial, Helvetica, sans-serif;
	color: #aaa;
	font-style: italic;
}

section a.sale-2 {
	margin-bottom: 0px;
}

section a.for-sale:hover {
	color: #444;
	background: #e8e8e8;
	border-color: #999;
}

section a.for-sale:hover span {
	color: #666;
}

section a.for-sale:active {
	color: #666;
}

/* --- Search - Sidebar --- */

form#searchform {
	padding-bottom: 18px;
}

form#searchform input[type="text"] {
	color: #aaa;
	font: italic 14px/20px Arial, Helvetica, sans-serif;
	width: 224px;
	margin: 16px 15px 10px 15px;
	padding: 7px;
	border: 1px solid #d0d0d0;
	background: url(../img/notebook/search-input.png) top left no-repeat;
}

form#searchform input[type="text"]:hover, form#searchform input[type="text"]:focus, form#searchform input[type="text"]:active {
	color: #777;
	border: 1px solid #999;
}

form#searchform input[type="submit"] {
	display: block;
	height: 26px;
	width: 74px;
	margin: 0px 15px;
	font: 14px/26px Arial, Helvetica, sans-serif;
	text-align: center;
	color: #777;
	border: none;
	background: url(../img/notebook/btn-search.jpg) top left no-repeat;
	text-shadow: 1px 1px 0px #fff;
	-moz-transition: color 0.15s ease-in-out; 
	-webkit-transition: color 0.15s ease-in-out;
	cursor: pointer;
}

form#searchform input[type="submit"]:hover, form#searchform input[type="submit"]:focus {
	color: #666;
	background-position: top right;
}

form#searchform input[type="submit"]:active {
	color: #f60;
}

/* --- Categories - Sidebar --- */

#categories ul {
	margin: 16px 15px 0px 15px;
}

#categories ul li a {
	padding-left: 22px;
	line-height: 24px;
	background: url(../img/notebook/notebook.png) 0px -234px no-repeat;
}

#categories ul li a:hover {
	color: #444;
	background: #f3f3f3 url(../img/notebook/notebook.png) 0px -254px no-repeat;
}

#categories ul li a:active {
	color: #666;
}

/* --- Article List - Sidebar --- */

.article-list ul {
	margin: 16px 15px 0px 15px;
}

.article-list ul li span a {
	display: inline-block;
	margin: 3px 0px 2px 0px;
	padding-left: 22px;
	line-height: 18px;
	background: url(../img/notebook/notebook.png) 0px -273px no-repeat;
}

.article-list ul li span a:hover {
	color: #444;
	padding-bottom: 0px;
	background: #f3f3f3 url(../img/notebook/notebook.png) 0px -293px no-repeat;
}

.article-list ul li span a:active {
	color: #666;
}

/* -------------------------------------------------------------------------- */
/* --- 404 Pages Styles --- */

/* ----------- Erorr 404 ----------- */

#error-1 img {
	float: left;
	border: none;
	padding: 16px 15px 0px 15px;
}

#error-1 strong {
	display: block;
	color: #444;
	font-size: 16px;
	margin-bottom: 18px;
}

#error-1 ul {
	margin: 16px 15px 0px 205px;
	list-style-type: square;
}

#error-2 strong {
	display: block;
	color: #444;
	margin: 16px 15px 18px 15px;
}

#error-2 ul {
	margin: 16px 15px 0px 35px;
	list-style-type: square;
}

/* -------------------------------------------------------------------------- */
/* --- Greet Box Plugin --- */

.greet_block {
	background: #ffc;
	border: 1px solid #d0d0d0;
	margin: 16px 15px 0px 15px;
	padding: 10px;
	width: 608px; 
	color: #777;
	font: 14px/20px Arial, Helvetica, sans-serif;
}

.greet_block strong {
	color: #444;
}

.post .greet_block a img {
	float: left;
	margin: 0px 0px 0px 0px;
	padding: 0px 10px 0px 0px;
	border: none;
	background: none;
}

.greet_block a, .greet_block a strong {
	color: #f60;
}

.greet_block a:hover, .greet_block a:hover strong {
	color: #444;
}

.greet_block a:active, .greet_block a:active strong {
	color: #666;
}

.greet_block_close {
	display: block;
	background: #fff;
	border: 1px solid #d0d0d0;
	float: right;
	height: 15px;
	width: 15px;
	line-height: 15px;
	margin: 0px 0px 0px 10px;
	text-align: center;
}
.greet_block_close:hover {
	background: #eee;
}

.post .greet_block_close a {
	color: #bbb;
	font: bold 11px/15px Verdana, Arial, Helvetica, sans-serif;
	padding: 0px 0px 0px 0px;
	text-transform: uppercase;
}

.post .greet_block_close a:hover {
	color: #999;
	border: none;
}

.greet_search_after {
	border-top: 1px solid #d0d0d0;
	font-size: 11px;
	line-height: 15px;
	margin: 10px 0px 0px 0px;
	padding: 10px 0px 0px 0px;
}

.greet_search_after ul {
	margin: 2px 0px 2px 20px;
}

.greet_search_after ul li {
	margin-top: 10px;
}

#greet_search_link {
	cursor: pointer;
}

/* -------------------------------------------------------------------------- */
/* --- Facebox Style --- */

#facebox .b { background:url(../img/facebox/b.png); }
#facebox .tl {
	background:url(../img/facebox/tl.png);
}
#facebox .tr {
	background:url(../img/facebox/tr.png);
}
#facebox .bl {
	background:url(../img/facebox/bl.png);
}
#facebox .br {
	background:url(../img/facebox/br.png);
}

#facebox {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	text-align: left;
}

#facebox .popup {
	position: relative;
}

#facebox table {
	border-collapse: collapse;
}

#facebox td {
	border-bottom: 0;
	padding: 0;
}

#facebox .body {
	padding: 10px;
	background: #fff;
	width: 370px;
}

#facebox .loading {
	text-align: center;
}

#facebox .image {
	text-align: center;
}

#facebox img {
	border: 0;
	margin: 0;
}

#facebox .footer {
	border-top: 1px solid #DDDDDD;
	padding-top: 5px;
	margin-top: 10px;
	text-align: right;
}

#facebox .tl, #facebox .tr, #facebox .bl, #facebox .br {
	height: 10px;
	width: 10px;
	overflow: hidden;
	padding: 0;
}

#facebox_overlay {
	position: fixed;
	top: 0px;
	left: 0px;
	height:100%;
	width:100%;
}

.facebox_hide {
	z-index:-100;
}

.facebox_overlayBG {
	background-color: #000;
	z-index: 99;
}

* html #facebox_overlay { /* ie6 hack */
	position: absolute;
	height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

/* -------------------------------------------------------------------------- */
/* --- Specific Post Style --- */

#post-963 h3 em { display: block; font-size: 14px; color: #999; font-weight: normal; border: none; margin-bottom: 3px; }
#post-963 img { float: left; margin: 3px 15px; }
#post-963 img.cover { float: right; border: none; margin: 0px 15px 15px 15px; }

#post-997 p.full { margin-bottom: 26px; }
#post-997 p.full strong { color: #444; }

#post-1076 table { width: 620px; }
#post-1076 table tr td { border-bottom: 1px solid #e0e0e0; padding: 3px 6px; text-align: right; text-shadow: 1px 1px 0px #fff; }
#post-1076 table tr td.lt { text-align: left; }
#post-1076 table thead tr td { border: 1px solid #d0d0d0; border-width: 1px 0px; background: #f3f3f3; font-weight: bold; color: #444; }
#post-1076 table tr.even td { background: #f6f6f6; }
section#post-1076 p.last-updated { padding-bottom: 30px; margin-top: -12px; color: #aaa; font-size: 12px; font-style: italic; }