/* --------------------------------------------
|  GLOBAL STYLES
--------------------------------------------- */

html { border: none; }
body {
	margin: 0;
	padding: 0;
	line-height: 13px;
	text-align: center;
	background: #ffffff url(../graphics/header_bg.png) repeat-x;
}
body, td {
	font-size: 11px;
	font-family: Arial, Helvetica, sans-serif;
	color: #000000;
}
img { border: 0; }
p { margin: 0 0 15px 0; }
a {
	text-decoration: underline;
	color: #cca37a;
}
a:hover {
	text-decoration: underline;
	color: #995c1f;
}
h1, h2, h3, h4, h5, form { margin: 0; }

h1 {
	font-size:14px;
	font-weight:bold;
	color:#3c4345;
	margin-bottom:6px;
	clear:both;
}

h2 {
	font-size:14px;
	font-weight:bold;
	color:#3c4345;
	margin-bottom:6px;
	clear:both;
}

h3 {
	font-size:14px;
	font-weight:bold;
	color:#3c4345;
	margin-bottom:6px;

}
ul {
	margin:0;
	padding:0;
}

strong {
	color:#995c1f;
	font-size:12px;
}


/* --------------------------------------------
|  STRUCTURE
--------------------------------------------- */

#siteContainer {
	width:968px;
	margin: 0 auto;
	text-align: left;
}
/*	#sitePad {
		border-left:1px solid #7b7b7b;
		border-right:1px solid #7b7b7b;
	} */

/* -- HEADER -- */
#header {
	height:110px;
}

#logo {
	position: absolute;
	margin: 25px 0 0 18px;
	width: 311px;
	height: 52px;
	padding: 0;
	font-size: 18px;
	line-height:18px;
	overflow: hidden;
}

#logo a {
	color:#FFFFFF;
	font-size:25px;
	line-height:25px;
	display: block;
	width: 311px;
	height: 52px;
	text-decoration: none;
	cursor:pointer;
	background: url("../graphics/logo-conceptify.png") no-repeat 0 0;
	text-indent:-99999px;
	overflow:hidden;
}

#logo a:hover {
	text-decoration: none;
	cursor:pointer;
}


/* -- PRIMARY NAVIGATION -- */

#nav {
	position:absolute;
	margin: 61px 0 0 520px;
	height:31px;
	width:442px;
	padding:0;
	list-style: none;
}
#nav li {
	float: left;
	padding:0;
	margin:0 0 0 18px;
}
#nav li a {
	outline: none;
	display: block;
	text-decoration: none;
	color:#FFFFFF;
	font-size:16px;
	font-family:Arial, Verdana, Helvetica, sans-serif;
	height: 31px;
	line-height: 31px;
	overflow:hidden;
	text-indent:-99999px;
	background-image: url("../graphics/nav-sprite.png");
}

#bOne {width: 39px; background-position: 0 0;}
#bOne:hover {background-position: 0 -31px;}

#bTwo {width: 67px; background-position: -39px 0;}
#bTwo:hover {background-position: -39px -31px;}

#bThree {width: 68px; background-position: -106px 0;}
#bThree:hover {background-position: -106px -31px;}

#bFour {width: 54px; background-position: -174px 0;}
#bFour:hover {background-position: -174px -31px;}

#bFive {width: 106px; background-position: -228px 0;}
#bFive:hover {background-position: -228px -31px;}


/* -- BODY -- */

#contentArea {
	font-size:11px;
	line-height:14px;
	margin:0 18px 0 18px;
}

.portItem {
	width:290px;
	float:left;
	margin-top:15px;
}

.portImage {
	background:#999999;
	padding:9px;
}
.portImage img {border:1px solid #ffffff;}

.portText {
	background:#ededed;
	padding:9px;
	color:#999999;
}

.portText div {
	margin-top:6px;
}

.portText span {
	color:#995c1f;
}

.colLeft {clear:left;}
.colMid {margin-left:30px;}
.colRight {margin-left:30px;}

#web {padding-top:32px;}
#motion {padding-top:32px;}
#corpid {padding-top:32px;}
#print {padding-top:32px;}


/* HEADERS */

#h-web {
	height:20px;
	background:url(../graphics/h_web.png) no-repeat;
	text-indent:-9999em;
	overflow:hidden;
}

#h-motion {
	height:20px;
	background:url(../graphics/h_motion.png) no-repeat;
	text-indent:-9999em;
	overflow:hidden;
}

#h-corpid {
	height:20px;
	background:url(../graphics/h_corpid.png) no-repeat;
	text-indent:-9999em;
	overflow:hidden;
}

#h-print {
	height:20px;
	background:url(../graphics/h_print.png) no-repeat;
	text-indent:-9999em;
	overflow:hidden;
}

#h-print-extended {
	height:20px;
	background:url(../graphics/h_print_extended.png) no-repeat;
	text-indent:-9999em;
	overflow:hidden;
}

#h-web a, #h-motion a, #h-corpid a, #h-print a {
	text-indent:0 !important;
	position:absolute;
	display:block;
	margin:0px 0 0 850px;
	padding:0 0 0 10px;
	font-size:10px;
	text-decoration:none;
	color:#999;
	height:20px;
}

#h-web a:hover, #h-motion a:hover, #h-corpid a:hover, #h-print a:hover {
	color:#ae8c65;
	background:url(../graphics/back-arrow.png) 0 4px no-repeat;
}


#h-about-joel {
	height:15px;
	background:url(../graphics/h_about_joel.png) no-repeat;
	text-indent:-9999em;
	overflow:hidden;
}

#h-work-experience {
	height:15px;
	background:url(../graphics/h_work_experience.png) no-repeat;
	text-indent:-9999em;
	overflow:hidden;
}

#h-skills {
	height:15px;
	background:url(../graphics/h_skills.png) no-repeat;
	text-indent:-9999em;
	overflow:hidden;
}

#h-education {
	height:15px;
	background:url(../graphics/h_education.png) no-repeat;
	text-indent:-9999em;
	overflow:hidden;
	margin-top:25px;
}

#h-tools {
	height:15px;
	background:url(../graphics/h_tools.png) no-repeat;
	text-indent:-9999em;
	overflow:hidden;
	margin-top:25px;
}

#h-hire-me {
	height:15px;
	background:url(../graphics/h_hire.png) no-repeat;
	text-indent:-9999em;
	overflow:hidden;
	margin-top:25px;
}


.infoItem {
	width:290px;
	float:left;
	margin-top:18px;
	line-height:18px;
	color:#cccccc;
}

.infoItem strong, .infoItem span {
	color:#cca37a;
}

.infoItem a:hover {
	color:#FFFFFF;
}

/* -- FOOTER -- */

#footerBG {
	margin-top:15px;
	background:url(../graphics/footer_bg.png) repeat-x;
}

#footer {
	width:968px;
	margin: 0 auto;
	text-align: left;
	clear:both;
	height:445px;
	font-size:12px;
	line-height:14px;
 	}

#footerPad {
	padding:10px 18px 0 18px;
}

#copyright {
	position:absolute;
	margin:420px 0 0 0;
	padding: 0 0 0 18px;
	color: #FFFFFF;
	font-size:11px;
}

#disclaimer {
	position:absolute;
	z-index:1000;
	margin:420px 0 0 327px;
	font-size:10px;
	color:#cccccc;
}


/* --------------------------------------------
|  CONTENT SPECIFIC
--------------------------------------------- */

.floatLeft { float: left; }
.floatRight { float: right; }
.clearBoth { clear: both; font-size:0; line-height:0;}

/* --------------------------------------------
|  PAGE SPECIFIC
--------------------------------------------- */

.hiddenContent {
	display:none;
	padding:0;
}