@charset "UTF-8";
/* CSS Document */

/* basic */
img,div,id,p,a,h1,h2,h3,h4,h5,class,span,ul,li,table,tr,td {
	border: none;
	margin: 0;
	padding: 0;
	text-decoration: none;
	list-style: none;
	}
ul,li {
	display: inline;
	}


/* specific tags */
.email {
	background: url(../tools/buttons/emailbutt.jpg) no-repeat top;
	width: 220px;
	height: 36px;
	}
.email a {
	display: block;
	width: 220px;
	height: 36px;
	}
.email:hover {
	background-position: bottom;
	}
.email span {
	display: none;
	}
.phone {
	background: url(../tools/phone.jpg) no-repeat center;
	width: 174px;
	height: 36px;
	}
.phone span {
	display: none;
	}
.nav1 {
	background: url(../tools/buttons/aboutbutt.jpg) no-repeat top;
	width: 70px;
	height: 33px;
	}
.nav1:hover {
	background-position: bottom;
	}
.nav1 a {
	display: block;
	width: 70px;
	height: 33px;
	}
.nav1 span {
	display: none;
	}
.nav2 {
	background: url(../tools/buttons/blogbutt.jpg) no-repeat top;
	width: 90px;
	height: 33px;
	}
.nav2:hover {
	background-position: bottom;
	}
.nav2 a {
	display: block;
	width: 90px;
	height: 33px;
	}
.nav2 span {
	display: none;
	}
.nav3 {
	background: url(../tools/buttons/riverbutt.jpg) no-repeat top;
	width: 146px;
	height: 33px;
	}
.nav3:hover {
	background-position: bottom;
	}
.nav3 a {
	display: block;
	width: 146px;
	height: 33px;
	}
.nav3 span {
	display: none;
	}
#container {
	width: 955px;
	margin-left: 20px;
	text-align: center;
	}
#header {
	float: right;
	width: 815px;
	}
#thumbnails {
	float: left;
	border: #948983 solid 2px;
	padding: 10px;
	}
#viewer {
	float: right;
	}
#logo {
	background: url(../tools/title.jpg) no-repeat center;
	width: 412px;
	height: 47px;
	float: left;
	}
#logo a {
	display: block;
	width: 412px;
	height: 47px;
	}
#logo span {
	display: none;
	}
#sublogo {
	background: url(../tools/list.jpg) no-repeat center;
	width: 808px;
	height: 25px;
	display: block;
	border-top: #948983 solid 2px;
	border-bottom: #948983 solid 2px;
	margin-left: 3px;
	float: left;
	}
#sublogo span {
	display: none;
	}
#copy {
	clear: left;
	background: url(../tools/copyright.jpg) no-repeat center;
	width: 110px;
	height: 30px;
	}
#copy span {
	display: none;
	}
#contact {	
	margin-top: 10px;
	float: left;
	height: 25px;
	}
#navigation {
	float: left;
	margin: 10px 0 5px 10px
	}
#thumbnails td {
	padding: 1px;
	}
	
	/* about */
	
#aboutcontainer {
	width: 700px;
	}
#bio1 {
	background: url(../tools/bio1.jpg) no-repeat center;
	width: 700px;
	height: 75px;
	float: left;
	}
#bio1 span {
	display: none;
	}
#bio2 {
	background: url(../tools/bio2.jpg) no-repeat center;
	width: 590px;
	height: 26px;
	float: left;
	margin: 5px 0px 0px 0px
	}
#bio2 span {
	display: none;
	}
#john {
	background: url(../tools/john.jpg) no-repeat center;
	width: 80px;
	height: 22px;
	float: left;
	margin-top: 7px;
	}
#john a {
	display: block;
	width: 80px;
	height: 22px;
	}
#john span {
	display: none;
	}
#bioimg {
	margin: 10px 0 0 10px;
	}
#resume {
	background: url(../tools/buttons/resumebutt.jpg) no-repeat center;
	width: 204px;
	height: 22px;
	float: left;
	margin: 10px 0 0px 0
	}
#resume a {
	display: block;
	width: 204px;
	height: 22px;
	}
#resume span {
	display: none;
	}
#client {
	background: url(../tools/client.jpg) no-repeat center;
	width: 700px;
	height: 53px;
	float: left;
	margin: 20px 0px 0px 0px
	}
#client span {
	display: none;
	}
#connect {
	background: url(../tools/connect.jpg) no-repeat center;
	width: 590px;
	height: 26px;
	float: left;
	margin: 15px 0px 0px 0px
	}
#conncet span {
	display: none;
	}	
#twitter {
	background: url(../tools/twitter.gif) no-repeat center;
	width: 40px;
	height: 40px;
	float: left;
	margin: 10px 4px 0px 20px;
	}
#twitter a {
	display: block;
	width: 40px;
	height: 40px;
	}
#twitter span {
	display: none;
	}
#face {
	background: url(../tools/face.gif) no-repeat center;
	width: 40px;
	height: 40px;
	float: left;
	margin: 10px 4px 0 0;
	}
#face a {
	display: block;
	width: 40px;
	height: 40px;
	}
#face span {
	display: none;
	}
#linked {
	background: url(../tools/linked.gif) no-repeat center;
	width: 40px;
	height: 40px;
	float: left;
	margin: 10px 0 0 0;
	}
#linked a {
	display: block;
	width: 40px;
	height: 40px;
	}
#linked span {
	display: none;
	}