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

.ir {
	overflow: hidden;
	background-repeat: no-repeat;
	height: 0px !important;
	display:block;
}
img {
	border: none;
}
body {
	width:100%;
	height: 100%;
	margin: 0;
	padding: 0;
	font-family:Arial, Helvetica, sans-serif;
	color: #000;
}
.wrap {
	margin: 20px auto 0 auto;
	width: 800px;
	height: 563px;
	background: url(../img/plain_bg.png) no-repeat;
}
#home .wrap {
	background: url(../img/logo_bg.png) no-repeat;
}
.nav {
	margin: 21px 0 0 0;
	padding:0;
	float: left;
	width: 221px;
	list-style-type: none;
	height: 500px;
}
#about .nav {
		background: url(../img/about_image.png) no-repeat right bottom;
}
#design .nav {
	background: url(../img/design_image.png) no-repeat 20px bottom;
}
#illustration .nav {
	background: url(../img/illustration_image.png) no-repeat right 300px;
}
.nav li {
	margin: 0 0 0 30px;
	padding: 0;
	width: 191px;
}
.nav li a {
	padding: 49px 0 0 0;
    height /**/:49px;
}
.nav li a.me {
	background-image: url(../img/me.png);
}
.nav li a.me:hover {
	background-position: 0 -49px;
}
.nav li a.design {
	background-image: url(../img/design.png);
	padding: 60px 0 0 0;
	height /**/:60px;
}
.nav li a.design:hover {
	background-position: 0 -60px;
}
.nav li a.illustration {
	background-image: url(../img/illustration.png);
}
.nav li a.illustration:hover {
	background-position: 0 -49px;
}
.nav li a.home {
	background-image: url(../img/home.png);
}
.nav li a.home:hover {
	background-position: 0 -49px;
}
.nav li a.iphone {
	background-image: url(../img/iphone_version.png);
	padding: 79px 0 0 0;
	height /**/:79px;
	margin: 255px 0 0;
}
.nav li a.iphone:hover {
	background-position: 0 -79px;
}
.content {
	padding: 21px 0 0 23px;
	float: left;
	width: 500px;
	height: 490px;
}
.flickr {
	padding: 2px;
	background: url(../img/flickr_loading.jpg) no-repeat 2px 2px;
	float: left;
	width: 320px;
	height: 480px;
	margin: 10px 0 0 10px;
}
#about h1 {
	padding: 49px 0 0 0;
    height /**/:49px;
	background-image: url(../img/me.png);
	background-position: -7px 0;
	margin: 0;
}
#design h1 {
	padding: 49px 0 0 0;
    height /**/:49px;
	background-image: url(../img/design.png);
	background-position: -5px -5px;
	margin: 0;
}
#illustration h1 {
	padding: 49px 0 0 0;
    height /**/:49px;
	background-image: url(../img/illustration.png);
	background-position: -3px -5px;
	margin: 0;
}
ul.aboutnav {
	list-style-type: none;
	width: 500px;
	margin: 0;
	padding: 0;
}
ul.aboutnav li {
	display:inline;
	float:left;
	width: 237px;
	margin: 0;
	padding: 0;
}
p.phone {
	padding: 52px 0 0 0;
    height /**/:52px;
	background-image: url(../img/phone.png);
	margin: 0 !important;
}
a.email {
	padding: 52px 0 0 0;
    height /**/:52px;
	background-image: url(../img/email.png);
	margin: 0;
}
a.email:hover {
	background-position: 0 -52px;
}
a.cvpdf {
	padding: 30px 0 0 0;
    height /**/:30px;
	background-image: url(../img/cv_pdf.png);
	margin: 60px 0 0 0;
}
a.cvpdf:hover {
	background-position: 0 -30px;
}
a.cvdoc {
	padding: 30px 0 0 0;
    height /**/:30px;
	background-image: url(../img/cv_word.png);
	margin: 60px 0 0 0;
}
a.cvdoc:hover {
	background-position: 0 -30px;
}
a.pdf {
	padding: 38px 0 0 0;
    height /**/:38px;
	background-image: url(../img/samples.png);
	margin: 0;
}
a.pdf:hover {
	background-position: 0 -38px;
}
a.rec {
	padding: 38px 0 0 0;
    height /**/:38px;
	background-image: url(../img/recommendations.png);
	margin: 0;
}
a.rec:hover {
	background-position: 0 -38px;
}
.content h2{
	font-size: 14px;
	font-weight:bold;
	margin: 0 0 10px 0;
}
.content p{
	line-height: 20px;
	font-size: 12px;
	margin: 0 0 10px 0;
}
h4 {
	padding: 52px 0 0 0;
	background-image: url(../img/yet_another_daft_tom_idea.png);
	margin: 0 auto;
	width: 414px;
	height /**/:52px;
}
.footer p{
	font-size: 10px;
	color: #CCC;
	text-align:center;
	margin: 0;
}
.footer p a{
	font-size: 10px;
	color: #CCC;
}
/* Easy Slider */

#gallery ul, #gallery li{
	margin:0;
	padding:0;
	list-style:none;
	}
#gallery li{ 
	/* 
		define width and height of list item (slide)
		entire slider area will adjust according to the parameters provided here
	*/ 
	width:511px;
	height:413px;
	overflow:hidden; 
	}
span#prevBtn a{
	float: left;
	padding: 40px 0 0 0;
    height /**/:40px;
	width:52px;
	background-image: url(../img/left_arrow.png);
	margin: 0;
}
span#prevBtn a:hover {
	background-position: 0 -40px;
}
span#nextBtn a{
	float:right;
	padding: 40px 0 0 0;
    height /**/:40px;
	width:52px;
	background-image: url(../img/right_arrow.png);
	margin: 0;
}
span#nextBtn a:hover {
	background-position: 0 -40px;
}

/* // Easy Slider */