/***************************
*	Tyler Craft
* 	http://tylercraft.com
***************************/
*{
	margin: 0;
	padding: 0;
	outline: none;
}

body, html {
	height: 100%;
} 

body{
	font: 11px/16px arial, helvetica, sans serif;
	color: #2e2e2e;
	background: #e7e4d9 url("/lib/i/bground-grad.png") top left repeat-x;

	/* IE6 doesn't get the multiple gradient png backgrounds */
	_background: #fdfcf9 url("/lib/i/bground-plaid.gif") top left repeat-y;
}

/***************************
*	GENERAL TAGS
***************************/

a{
	color: #70bdcd;
	font-weight: bold;
	text-decoration: none;
	outline: none;
}

a:hover,
#featured li a:hover h3,
#portfolioWorks .additionalProjects li a:hover h3{
	color: #fff;
	background-color: #70bdcd;
	_background: none;
	_color: #000;
}

img, a img{ border: none;}

p{padding: 3px 0 3px 0;}

/***************************
*	FRAMEWORK CONTAINER
***************************/
#pageContainer{
	position: relative;
	min-height: 99.99%;
	background: url("/lib/i/bground-plaid.png") top left repeat-y;

	/* IE6 doesn't get the multiple gradient png backgrounds */
	_background: none;
}

/***************************
*	PERSONAL INFORMATION (MAST HEAD)
***************************/

#personalInfo{
	height: 263px;
	height: 125px;
	height: auto;
	padding: 53px 0 0 0;
	width: 775px;
	position: absolute;
	left: 0;
	z-index: 50;
}

#personalInfo h1{
	width: 135px;
	height: 38px;
}

#personalInfo h1 a{
	display: block;
	width: 135px;
	height: 38px;
	overflow: hidden;
	text-indent: -9999px;
	background: url("/lib/i/logo.gif") 0 0 no-repeat;
}

#personalInfo h1 a:hover{background: url("/lib/i/logo.gif") 0 -38px no-repeat;}

#personalInfo h2{
	width: 87px;
	height: 18px;
	position: absolute;
	top: 53px;
	left: 135px;
}

#personalInfo #bioPhoto{
	height: 33px;
	width: 33px;
	position: absolute;
	left: 102px;
	top: 91px;
}

#personalInfo #email{
	background: url("/lib/i/bground-email.gif") top left no-repeat;
	width: 640px;
	height: 19px;
	position: absolute;
	top: 73px;
	left: 135px;
}

#personalInfo #email a{
	display: block;
	width: 119px;
	height: 19px;
	overflow: hidden;
	text-indent: -9999px;
	background: url("/lib/i/email.gif") 0 0 no-repeat;
}
#personalInfo #email a:hover{background: url("/lib/i/email.gif") 0 -19px no-repeat;}

/***************************
*	MAIN NAVIGATION
***************************/
#mainNavigation{
	position: absolute;
	z-index: 10;
	top: 84px;
	left: 775px;
	list-style: none;
}

#mainNavigation li{line-height: 14px;}
#mainNavigation li a{
	display: block;
	width: 90px;
	background: url("/lib/i/bground-nav-middle.png") top left repeat-y;
	font-size: 10px;
	font-weight: bold;
	color: #fff;
	text-decoration: none;
	padding: 0 0 0 6px;
	
	/* IE6 - No PNGs */
	_width: 79px;
	_background: #595959;
}

#mainNavigation li.active a, #mainNavigation li a:hover{color: #96cbd4;}

#mainNavigation li#about a{
	padding-top: 10px;
	background: url("/lib/i/bground-nav-top.png") top left no-repeat;
	_background: #595959;
}

/*#mainNavigation li#defocused a{*/
#mainNavigation li#blog a{
	padding-bottom: 11px;
	background: url("/lib/i/bground-nav-bottom.png") bottom left no-repeat;
	_background: #595959;
}

/***************************
*	CONTENT AREA
***************************/

#contentContainer{
	width: 635px;
	padding: 0 0 20px 138px;
	position: relative;
	/*top: 125px;*/
	padding-top: 125px;
	z-index: 2;
	overflow: auto;
	background: url("/lib/i/texture.gif") top left no-repeat;
}

#contentContainer.blog{z-index: 10;}

	/* HOME PAGE */
#contentContainer.home #portfolioPreview{
	background: url("/lib/i/bullet-block.gif") top left no-repeat;
	width: 630px;
	height: 248px;
	overflow: visible;
	padding: 5px 0 0 5px;
	margin: 0 0 21px 0;
}
#contentContainer.home #portfolioPreview:hover{background: url("/lib/i/bullet-block-o.gif") top left no-repeat;}

#contentContainer.home #portfolioPreview ul{list-style: none;}

#contentContainer.home #portfolioPreview ul li{
	border: 1px solid #e4e4e4;
	padding: 3px;
	width: 198px;
	height: 235px;
	float: left;
	margin-right: 3px;
}

#contentContainer.home #portfolioPreview ul li a{
	display: block;
	width: 196px;
	height: 233px;
	border: 1px solid #e4e4e4;
}

	/* My name is Tyler Craft */
#contentContainer.home h1{
	background: url("/lib/i/bullet-block.gif") top left no-repeat;
	padding: 3px 0 0 8px;
	font-size: 11px;
	font-weight: bold;
	width: 180px;
	float: left;
}
#contentContainer.home h1:hover{background: url("/lib/i/bullet-block-o.gif") top left no-repeat;}

#contentContainer.home #quickBio{
	width: 400px;
	padding: 0 18px 0 0;
	float: right;
	color: #969696;
}

#contentContainer.home #quickBio ul li{
	list-style-image: url("/lib/i/bullet-block.gif");
	margin: 0 0 0 15px;
}
#contentContainer.home #quickBio ul li:hover{list-style-image: url("/lib/i/bullet-block-o.gif");}

	/* ABOUT */
#contentContainer.error h1, #contentContainer.about h1, #contentContainer.portfolio h1, #contentContainer.blog h1{
	font-size: 55px;
	line-height: 51px;
	color: #e4f1bf;
	font-weight: bold;
	padding: 3px 0 0 7px;
	width: 540px;
	letter-spacing: -1px;
}

#contentContainer.error h1 strong, #contentContainer.about h1 strong, #contentContainer.portfolio h1 strong, #contentContainer.blog h1 strong{ color: #c6e5eb;}

#contentContainer.about #bio{
	color: #2e2e2e;
	width: 400px;
	padding: 12px 0 0 9px;
	float: left;
}

#contentContainer.about #links{
	width: 200px;
	float: right;
}

#contentContainer.about h4{
	font-size: 10px;
	line-height: 14px;
	color: #000000;
	font-weight: bold;
	padding: 16px 0 0 0;
}

#contentContainer.about ul{
	margin: 5px 0 15px 15px;
}

#contentContainer.about ul li{
	list-style-image: url("/lib/i/bullet-block.gif");
	font-size: 10px;
	line-height: 12px;
}

#contentContainer.about ul li:hover{list-style-image: url("/lib/i/bullet-block-o.gif");}

	/* PORTFOLIO */
#contentContainer.portfolio h1, #contentContainer.blog h1{padding-left: 3px;}
#portfolioWorks{
	width: 428px;
	float: left;
	position: relative;
	left: -3px;
	padding: 6px 0 0 0;
}

#portfolioWorks h2{
	display: block;
	background-color: #e4f1bf;
	font-size: 14px;
	font-weight: bold;
	color: #000;
	line-height: 19px;
	padding: 0 8px 0 8px;
	clear: both;
}

#featured{
	list-style: none;
	padding: 0 0 13px 8px;
}

#featured li{
	overflow: auto;
	padding: 7px 0 4px;
	clear: both;
	position: relative;
}

#featured li img{
	height: 45px;
	width: 45px;
	background-color: #cecece;
	border: 1px solid #c6e5eb;
	float: left;
}

#featured li a{line-height: 13px; cursor: pointer;}
#featured li a h3, #featured li a h4, #featured li a h5{
	font-size: 11px;
	font-weight: bold;
	line-height: 13px;
	color: #70bdcd;
	padding: 0;
	
	width: 365px;
	_width: 360px;
	float: right;
	_float: default;
	clear: right;
}
#featured li a:hover{background-color: none;}
#featured li a h3{padding: 1px 0 0 5px; _margin-top: -13px;}
#featured li a h4, #featured li a h5{font-size: 10px; _padding-left: 5px;}
#featured li a h4, #featured li a:hover h4{text-transform: uppercase; color: #b7a36c;;}
#featured li a h5, #featured li a:hover h5{color: #b8b8b8;}

#portfolioWorks h4{
	font-size: 13px;
	font-weight: bold;
	line-height: 12px;
	color: #cda4b8;
	padding: 6px 0 0 9px;
}

.additionalProjects{
	padding: 10px 0 5px 26px;
}

.additionalProjects li{padding: 0 0 5px;}
#portfolioWorks .additionalProjects li a:hover{background: none;}
.additionalProjects li a h3, #portfolioWorks .additionalProjects li a h4{
	font-size: 11px;
	font-weight: bold;
	line-height: 13px;
	color: #70bdcd;
	padding: 0 0 0 3px;
	position: relative;
	left: -5px;
	*top: -2px;
}
.additionalProjects li a h3{padding-top: 1px;}
#portfolioWorks .additionalProjects li a h4,#portfolioWorks .additionalProjects li a:hover h4{font-size: 10px; text-transform: uppercase; color: #b7a36c;}

.additionalProjects li{list-style-image: url("/lib/i/bullet-block.gif");}
.additionalProjects li:hover{list-style-image: url("/lib/i/bullet-block-o.gif");}

#portfolioMe{
	width: 182px;
	float: right;
	font-size: 10px;
	line-height: 15px;
	font-weight: bold;
	color: #969696;
	padding: 0 15px 0 0;
}

	/* INDIVIDUAL PROJECT */
#contentContainer.portfolioIndividual{
	width: 640px;
	overflow: visible;
	padding: 108px 0 21px 135px;
	margin: 0 0 0 0;
	position: relative;
	overflow: auto;
	_overflow: visible;
}

#contentContainer #back{
	list-style-image: url("/lib/i/bullet-block.gif");
	font-size: 10px;
	line-height: 12px;
	padding: 0 0 5px 25px;
}
#contentContainer #back li:hover{list-style-image: url("/lib/i/bullet-block-o.gif");}

#slideshow{
	position: relative;
	width: 640px;
	height: 316px;
	margin: 0;
}

.portfolioIndividual #details{
	width: 428px;
	float: left;
	margin-top: 9px;
}

.portfolioIndividual #additionalInfo{
	width: 180px;
	float: right;
	margin: 9px 19px 0 0;
	color: #969696;
	line-height: 14px;
	_width: 160px;
	_margin-top: 4px;
}

.portfolioIndividual h2{
	background-color: #e4f1bf;
	font-size: 14px;
	font-weight: bold;
	color: #000;
	line-height: 19px;
	padding: 0 8px 0 8px;
}

.portfolioIndividual h3{
	font-size: 13px;
	font-weight: bold;
	line-height: 12px;
	color: #cda4b8;
	padding: 6px 0 0 9px;
}

.portfolioIndividual h4{
	font-size: 10px;
	font-weight: bold;
	line-height: 13px;
	text-transform: uppercase; 
	color: #b7a36c;
	padding: 2px 0 0 9px;
}

.portfolioIndividual h5{
	font-size: 10px;
	font-weight: bold;
	line-height: 12px;
	color: #969696;
	padding: 8px 0 0 9px;
}

#description{color: #969696;}
#description p{padding: 0 9px 9px;}

#contentContainer #details ul{
	list-style-image: url("/lib/i/bullet-block.gif");
	font-size: 10px;
	line-height: 12px;
	margin-left: 25px;
}
#contentContainer #details ul li:hover{list-style-image: url("/lib/i/bullet-block-o.gif");}

.portfolioIndividual #additionalInfo h4{
	font-size: 11px;
	color: #000000;
	font-weight: bold;
	text-transform: none;
	margin: 0;
	padding: 1px 0 2px;
}

.portfolioIndividual #additionalInfo p{padding: 5px 0 2px;}
.portfolioIndividual #additionalInfo strong{color: #595959;}


	/* BLOG */
.blog h1.blogIndex{
	text-indent: -99999px;
	height: 20px;
}

.blog #content{
	width: 428px;
	float: left;
	position: relative;
	left: -3px;
}

	/* Blog Posts */
.post{
	padding: 6px 0 0 0;
}

.post h2 a{
	display: block;
	background-color: #e4f1bf;
	font-size: 14px;
	font-weight: bold;
	color: #000;
	line-height: 19px;
	padding: 0 8px 0 8px;
	_width: 412px;
}
.post h2 a:hover{
	background-color: #000;
	color: #e4f1bf;
}

.post .postDate{
	font-size: 9px;
	font-weight: bold;
	color: #bdbdbd;
	text-transform: uppercase;
	width: 170px;
	float: left;
	padding: 0 0 2px 11px;
}

.post .postCat{
	font-size: 9px;
	font-weight: bold;
	color: #bdbdbd;
	text-transform: uppercase;
	width: 245px;
	float: right;
	text-align: right;
	padding: 0 2px 2px 0;
}
.post .postCat a{color: #bdbdbd;}
.post .postCat a:hover{color: #000;}

.post .postComments{
	padding: 3px 0 0 11px;
	font-size: 9px;
	font-weight: bold;
	text-transform: uppercase;
}

.post .entry{
	clear: both;
	padding: 0 20px 0 11px;
	color: #2e2e2e;
}

.post .entry ul, .post .entry ol{margin-left: 20px;}

.post .entry img{border: 3px solid #dadada;}

#sidebar{
	width: 186px;
	float: right;
	padding: 4px 10px 0 2px;
}

#sidebar ul{
	list-style: none;
}

#sidebar .textwidget{
	font-weight: bold;
	font-size: 10px;
	line-height: 14px;
	color: #969696;
}

#sidebar .textwidget ul{
	padding: 3px 0 0 0;
}

#sidebar ul ul li{
	margin-left: 12px;
	font-size: 10px;
	line-height: 12px;
	color: #70bdcd;
	list-style-image: url("/lib/i/bullet-block.gif");
}

#sidebar ul ul li:hover{list-style-image: url("/lib/i/bullet-block-o.gif");}

#sidebar.sub .textwidget{display: none;}

#sidebar h2.widgettitle{
	font-size: 10px;
	font-weight: bold;
	line-height: 14px;
	padding: 7px 0 5px 0;
}

#sidebar #searchform input#s{
	width: 147px;
	height: 16px;
	border: 2px solid #70bdcd;
	float: left;
	margin-right: 4px;
}

.pagination{
	height: 20px;
	position: relative;
	padding: 27px 0 20px 0;
}

.pagination .older a, .pagination .newer a{
	height: 20px;
	display: block;
	text-indent: -9999px;
	overflow: hidden;
	position: absolute;
}

.pagination .older a{
	width: 76px;
	left: 11px;
	background: url("/lib/i/btn-olderEntries.gif") top left no-repeat;
}
.pagination .newer a{
	width: 82px;
	right: 0;
	background: url("/lib/i/btn-newerEntries.gif") top left no-repeat;
}

.pagination .older a:hover, .pagination .newer a:hover{background-position: bottom left;}
textarea{
	width: 300px;
}

	/* BLOG COMMENTS */
h3#comments, h4#follow, h3#respond, label#comment{
	font-size: 9px;
	font-weight: bold;
	line-height: 11px;
	padding-left: 12px;
}

h3#comments{
	border-top: 4px solid #ebdbe3;
	color: #000;
	text-transform: uppercase;
	margin: 12px 0 0;
	padding-top: 22px;
}

h4#follow{color: #727272;}

.commentlist{
	margin: 21px 0 0 27px;
}

.commentlist li{
	list-style-image: url("/lib/i/bullet-block.gif");
	font-size: 11px;
	line-height: 15px;
	padding-bottom: 10px;
}

.commentlist li:hover{list-style-image: url("/lib/i/bullet-block-o.gif");}

.commentMeta{
	font-size: 10px;
	line-height: 11px;
	color: #818181;
	font-weight: bold;
}

h3#respond{
	border-top: 4px solid #ebdbe3;
	color: #000;
	text-transform: uppercase;
	margin: 11px 0 8px;
	padding-top: 22px;
}

#commentform input{
	border: 1px solid #bfbfbf;
	width: 220px;
	padding: 3px 2px;
	margin: 0 0 0 13px;
}

#commentform input#submitComment{
	width: auto;
	border: none;
	padding: 0;
}

label#comment{
	color: #000;
	text-transform: uppercase;
	display: block;
	padding: 7px 0 10px 13px;
}

#commentform textarea{
	font: 11px/16px arial, helvetica, sans serif;
	color: #2e2e2e;
	border: 1px solid #bfbfbf;
	width: 400px;
	height: 175px;
	padding: 3px 2px;
	margin: 0 0 0 13px;
}

	/* RESULTS */
.results h2{
	background-color: #e4f1bf;
	font-size: 14px;
	font-weight: bold;
	color: #000;
	line-height: 19px;
	padding: 0 8px 0 8px;
	margin-top: 34px;
}

ol.postListing{margin: 10px 0 0 27px;}
.postListing li{
	list-style-image: url("/lib/i/bullet-block.gif");
	font-size: 9px;
	line-height: 14px;
	font-weight: bold;
	color: #bdbdbd;
	padding-bottom: 3px;
	text-transform: uppercase;
}
.postListing li:hover{list-style-image: url("/lib/i/bullet-block-o.gif");}

.postListing li h3{
	font-size: 11px;
	text-transform: none;
	padding: 0;
	margin: 0;
}

.postListing li p.postMeta{padding: 0; margin: 0;}

/***************************
*	SITE CREDIT
***************************/

#siteCredit{
	position: absolute;
	bottom: 0;
	left: 778px;
	width: 95px;
	height:15px;
}

#siteCredit a{
	color: #96cbd4;
	font-size: 10px;
	font-weight: bold;
	text-decoration: none;
}

#siteCredit a:hover{color: #000;}

/***************************
*	TOOL TIPS
***************************/

.toolTip{
	background: url("/lib/i/bullet-block.gif") bottom left no-repeat;
	z-index: 15;
	padding: 0 0 6px 6px;
}

.toolTip .tip{
	width: 0;
	overflow: hidden;
	
	height: 32px;
	font-size: 10px;
	font-weight: bold;
	padding: 4px 0 0 5px;
	line-height: 12px;
	
	background: url("/lib/i/bground-tooltip.png") top left no-repeat;
	
	/* No transparent PNGs for IE6 */
	_border: 1px solid #b7c3c3;
	_background-color: #fff;
}

.toolTip .tip-title{width: 145px;}
.toolTip .tip-text{display: none;}

.projToolTip{z-index: 50;}
.projToolTip .tip-text{display: none;}
.projToolTip .tip-title{
	height: 45px;
	width: 45px;
	background-color: #cecece;
	border: 1px solid #c6e5eb;
}