#center-wrap {position: absolute; left: 50%; width: 800px; margin-left: -400px;} /* for centering the page */
* { margin:0; padding:0; border:0; }
body {margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; background-color: #fff;}
		
		
		/* for resume and portfolio text formatting */

body {font: normal 12px verdana, arial, helvetica, sans-serif; color: #ccc;}
p, ul, li {font: 11px verdana, arial, sans-serif; color: #777; line-height: 16px; }
p, ul { margin:10px 0px; }
li { margin:2px 0px; }
a {font-weight: bold; color: #c8ac95; text-decoration: none;}
a:hover {font-weight: bold; text-decoration: underline;}
ul a {font-weight: bold; color: #884d66; text-decoration: none;}
ul a:hover {text-decoration: underline;}

.main {font: 12px Verdana, Arial, Helvetica, sans-serif; color: #999;}
.main li {font: 12px Verdana, Arial, Helvetica, sans-serif; padding: 0px; margin: 0px; line-height: normal; color: #999; list-style-type: square;}
.main a {color: #999;}
.main a:hover {text-decoration: underline;}

h1 {font: bold 18px Verdana, Arial, Helvetica, sans-serif; }

h2 {font: bold 14px Verdana, Arial, Helvetica, sans-serif;}

h3 {font: bold 12px Verdana, Arial, Helvetica, sans-serif; margin:10px 0px;}

h4 {font: bold 11px Verdana, Arial, Helvetica, sans-serif;}

	.blue {color: #1a83ad;}
	.black {color: #000;}
	.gold {color: #c8ac95;}
	li.gold a {font-weight: normal; color: #c8ac95; text-decoration: none; margin-left: 10px;}
	li.gold a:hover {text-decoration: underline;}
	.gray { color: #999;}

#desc {font: 11px verdana, arial, sans-serif; color: #999; line-height: 16px;}
.moreinfo a {font: normal 10px verdana, sans-serif; color: #c8ac95; text-decoration: underline;}
.moreinfo a:hover {font: normal 10px verdana, sans-serif; color: #c8ac95; text-decoration: none;}

.resumeExp { margin:0; padding:0; }
.resumeExp span { display:block; margin:5px; }

.center { text-align:center; }
.removebreaks { margin: 0px; padding:0px; }
.nobullets { list-style-type:none; }
.indent { margin-left:20px; }
.normal { font-weight:normal; text-decoration:none; }
.bold { font-weight:bold; }
.textright { text-align:right; }
.textleft { text-align:left; }
.nonsense { font-style:italic; padding:10px; }
.bot-margin { margin-bottom:10px; }

.floatR { float:right; }
.floatL { float:left; }

/* -------------------------------------------------------------------------------------------------------------------- */
/*                                               Masthead Content                                                       */
/* -------------------------------------------------------------------------------------------------------------------- */
#masthead {position: absolute; top: 50px; width: 780px;}

	#logo {position: absolute; top: 0px; left: 0px; background: url(../images/logo_jf.gif) no-repeat; width: 400px; height: 83px;}
	#title {position: absolute; top: 60px; right: 2px;}
	#line {position: absolute; top:85px; left: 0px; width: 780px; height:1px; border-bottom: 2px solid #585858;}
	
/* -------------------------------------------------------------------------------------------------------------------- */
/*                                                 Navigation (primary)                                                 */
/* -------------------------------------------------------------------------------------------------------------------- */
	#navigation {position: absolute; top:90px; right: 0px; overflow: hidden;  width: 350px; font: 11px Myriad, arial, sans-serif;}
	#navigation ul, #navigation li {margin: 0; padding: 0;}
	#navigation ul {padding-left: 0px;}

		#nav {float: right; width: 100%; letter-spacing: 2px;}
		#nav a {text-decoration: none;}
		#nav li {float: right; list-style: none; margin-left: 15px;}
		#nav li a {margin-right: 0em; font-weight: 600; color: #999;}
		#nav li ul {display: none; border: none;}
		#nav a:hover {color: #1a83ad;}
		
	#heading {position: absolute; top: 0px; left: 0px; width: 100px; font: 14px bold myriad, arial, sans-serif; color: #c8ac95;}

/* -------------------------------------------------------------------------------------------------------------------- */
/*                                              Main Column                                                             */
/* -------------------------------------------------------------------------------------------------------------------- */
#content {position: absolute; top: 180px; width: 780px;}
	.portfolio {margin-top: -10px; height: 400px;}
	.contact {margin-top: -10px; height: 600px;}

	/* ----------  GENERAL  -------- */
#info-box {position: absolute;}
#main-box {position: absolute;}
.thumb-box {position: absolute; top: 0px; left: 203px; width: 130px; display: none; height: 450px; border-left: 1px dotted #ccc;}
	.bucket-l {top: 0px; left: 53px; width: 225px;}
	.bucket-r {top: 0px; right: 0px; width: 450px; border: 1px dotted #ccc;}
	.moreinfo {position: relative; float: left; width: 100px; text-align: left;}
		.space-short { margin: -14px 0px 0px 25px;}
		.space-long { margin: -14px 0px 0px 60px;}
	.links {top: 0px; left: 53px; width: 400px;}
	
	#content-box1 {position: absolute; top: 80px; left: 330px; width: 450px; display: none; border-top: 1px dotted #ccc;}
	#content-box2 {position: absolute; top: 80px; left: 330px; width: 450px; display: none; border-top: 1px dotted #ccc;}
	#content-box3 {position: absolute; top: 80px; left: 330px; width: 450px; display: none; border-top: 1px dotted #ccc;}

	#box-text {position: absolute; top: 0px; height: 470px; overflow: auto;}
		.bio {left: 0px; width: 330px;}
		.resume {left: 0px; width: 380px; padding-right: 15px; _margin-right: 15px;}
		.text-r {right: 100px;}
	#image {position: absolute; width: 100px;}
		.img-l {left: 0px;}
		.img-r {right: 0px;}
		.img-about {top: 0px;}
		.img-contact {top: 90px;}
	
	/* ----------  HOME  -------- */
	#services1 {position:absolute; top:0px; left:13px; width:350px; height:14px;}
	#services2 {position:absolute; top:22px; left:198px; width:230px;}
		ul.servtext { width:100%; }
		ul.servtext li { float:left; list-style:none; letter-spacing:1px; font:normal 9px Myriad, arial, sans-serif; color:#c8ac95;  }

	#text {position: absolute; top: 80px; left: 53px; width: 140px; font: 11px Myriad, arial, sans-serif; color: #1a83ad;
		   text-align: left; letter-spacing: 0px; line-height: 16px; font-weight: 600;}

	/* ----------  PORTFOLIO -------- */	
	.category {top: 0px; left: 13px; width: 180px;}
	#selector1 {}
	#selector2 {}
	#selector3 {}
	#selector4 {}
	#selector5 {}
	#selector6 {}
		ul.thumb {float: left; width: 130px;}
		li.thumb {float: left; display: block; width: 40px; height: 40px; margin: 5px; border: 1px dotted #ccc;}
	#full-display {position: absolute; top: 5px; left: 320px; width: 450px;}
	#desc {top: 610px; left: 273px; width: 450px; height:100px; text-align:left; margin:0px; padding:0px; text-align:justify; }
	#subject {position: absolute; top: 0px; left: 65px; width: 180px; height: 400px; text-align: left;
			font-size: 11px; border-right: 1px solid #ccc;}
	.hide { display:none; }
	#subject ul {margin: 5px; padding: 0; list-style-type: none; _margin: 0px;}
		.indent ul {margin-top: 20px;}
	#subject li {margin: 0; padding: 2px 0px 2px 15px;}
	#subject a {width: 100%; font: Myriad, arial, sans-serif; color: #000;
			  font-weight: 700; text-decoration: none; padding: 0px;}
	#subject a:hover {color: #579bba;}
	#subject li li a {margin: 0px;}
	
	/* ----------  CONTACT -------- */
		.formpad {padding: 10px 0px 10px 10px;}
		label, input {display: block; float: left; margin-bottom: 1px; _margin-bottom: 6px;}
		label {text-align: right; width: 100px; padding-right: 20px;}
		input {color: #7d626e; background: #fff; border: 1px solid #1a83ad; text-align: left;}
			.clear {clear: left;}
		textarea {width: 300px; height: 50px; background-color: #fff; border: 1px solid #1a83ad; margin-left: 0px;
				font: 12px Arial, sans-serif; color: #4d4d4d; padding: 3px;}
		#checkbox {margin-left: 120px; margin-top: 2px; width: 20px; color: #1a83ad; background: #fff; border: none; _margin-left: 85px;}
			.alignleft {text-align:left; line-height: 18px; color: #7d626e;}
		#submitbutton {margin-left: 60px; margin-top: 5px; width: 90px; text-align: center; background: #fff; _margin-left: 50px;}
		#resetbutton {margin-left: 120px; margin-top: 5px; width: 90px;text-align: center; background: #fff;}

#display {position: absolute; left:318px; top:170px; width: 350px; height:400px;}

/* -------------------------------------------------------------------------------------------------------------------- */
/*                                                 Footer                                                               */
/* -------------------------------------------------------------------------------------------------------------------- */
#footer { position:absolute; width:780px; }
.foot-index {top: 400px;}
.foot-general {top: 710px;}
.foot-content {margin-top:0px; top: 500px;}
	#adjective {position: relative; top: 0px; left: 13px; width: 70px;}
		ul.adjtext {width: 100%; }
		ul.adjtext li {float: left; list-style: none; letter-spacing: 1px; font:normal 11px Myriad, arial, sans-serif; color: #c8ac95; line-height:19px; margin: 0; padding: 0;}
	#footline {position: absolute; top: 48px; left: 0px; _margin-top: -8px; width: 780px; border-top: 1px solid #585858;}
	.copyright {text-align: right; width: 200px; font: 9px Myriad, arial, sans-serif; color: #ccc;}