/*-----------------------------------------------------
	html body
-----------------------------------------------------*/

body {
	text-align: center;
	padding-top: 15px;
	padding-bottom: 15px;
	background-color: #fff;
}

/*-----------------------------------------------------
	conteiner
-----------------------------------------------------*/

div#container {
	text-align: left;
	margin-left:-330px;
	margin-top:-300px;
	width: 808px;
	height: 546px;
	background-image: url(../img/background.jpg);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	position: absolute;
	top:50%;
	left:50%;
} 

/*-----------------------------------------------------
	header
-----------------------------------------------------*/

a#homeLink {
	display: block;
	position: absolute;
	top: 30px;
	left: 20px;
	width: 228px;
	height: 154px;
	z-index: 100;
	background-image: url(../img/card.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
} 

a#aboutMeLink {
	display: block;
	position: absolute;
	top: 1px;
	left: 303px;
	width: 93px;
	height: 89px;
	background-image: url(../img/menu_aboutme.jpg);
	background-repeat: no-repeat;
	background-position: 0px -89px;
} 

a#contactLink {
	display: block;
	position: absolute;
	top: 1px;
	left: 409px;
	width: 93px;
	height: 89px;
	background-image: url(../img/menu_contact.jpg);
	background-repeat: no-repeat;
	background-position: 0px -89px;
} 

a#aboutMeLink:hover,
a#aboutMeLink.selected,
a#contactLink:hover,
a#contactLink.selected {
	background-position: 0px 0px;
} 

/*-----------------------------------------------------
	freebies
-----------------------------------------------------*/

#freebiesLink {
	display: block;
	position: absolute;
	top: 433px;
	left: 651px;
	width: 94px;
	height: 91px;	
	background-image: url(../img/freebies_selected.jpg);
	background-repeat: no-repeat;
	background-position: 0px -91px;
}

#freebiesLink:hover,
#freebiesLink.selected {
	background-position: 0px 0px;
}


/*-----------------------------------------------------
	Page image
-----------------------------------------------------*/

div#pageImage {
	display: block;
	position: absolute;
	top: 90px;
	left: 132px;
	width: 416px;
	height: 343px;
	z-index: 1;
	background-repeat: no-repeat;
	background-position: 0px 0px;
}

div.pageImageAboutMe {
	background-image: url(../img/aboutme.jpg);
}

div.pageImageHome {
	background-image: url(../img/home.jpg);
}

div#pageImage.pageImageHome_aboutMe {
	background-image: url(../img/home_aboutme.jpg);
	display: none;
}

div#pageImage.pageImageHome_contact {
	background-image: url(../img/home_contact.jpg);
	display: none;
}

div#pageImage.pageImageHome_comicbooks {
	background-image: url(../img/home_comicbooks.jpg);
	display: none;
}

div#pageImage.pageImageHome_charadesign {
	background-image: url(../img/home_charadesign.jpg);
	display: none;
}

div#pageImage.pageImageHome_illustration {
	background-image: url(../img/home_illustration.jpg);
	display: none;
}

div#pageImage.pageImageHome_design {
	background-image: url(../img/home_design.jpg);
	display: none;
}


/*-----------------------------------------------------
	text box
-----------------------------------------------------*/

#textBox {
	display: block;
	position: absolute;
	top: 454px;
	left: 180px;
	width: 290px;
	height: 55px;
	overflow: hidden;
} 

#textBoxRight {
	display: block;
	position: absolute;
	top: 150px;
	left: 580px;
	width: 180px;
	height: 210px;
	overflow: hidden;
}

/*-----------------------------------------------------
	image right
-----------------------------------------------------*/ 

#imageRight {
	position: absolute;
	top: 143px;
	left: 579px;
	width: 178px;
	height: 236px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
}

.image_comicbooks {
	background-image: url(../img/comicbooks_selected2.jpg);
}

.image_charadesign {
	background-image: url(../img/charadesign_selected2.jpg);
}

.image_illustration {
	background-image: url(../img/illustration_selected2.jpg);
}

.image_design {
	background-image: url(../img/design_selected2.jpg);
}

.image_freebies {
	background-image: url(../img/freebies_selected2.jpg);
}



/*-----------------------------------------------------
	portfolio menu
-----------------------------------------------------*/ 

#portfolioMenu {
	position: absolute;
	top: 226px;
	left: 19px;
	width: 113px;
}

#portfolioMenu li {
}

#portfolioMenu li a {
	display: block;
	background-repeat: no-repeat;
	background-position: -113px 0px;
}

#portfolioMenu li a:hover,
#portfolioMenu li a.selected {
	background-position: 0px 0px;
}

#comicbooksLink {
	height: 62px;
	background-image: url(../img/comicbooks_selected.jpg);
}

#charadesignLink {
	height: 58px;
	background-image: url(../img/charadesign_selected.jpg);
}

#illustrationLink {
	background-image: url(../img/illustration_selected.jpg);
	height: 51px;
}

#designLink {
	background-image: url(../img/design_selected.jpg);
	height: 52px;
}

/*-----------------------------------------------------
	works
-----------------------------------------------------*/ 

#portfolio_info {
	position: absolute;
	top: 111px;
	left: 325px;
	width: 112px;
	height: 54px;
	background-image: url(../img/portfolio_info.jpg);
	background-repeat: no-repeat;
	background-position: 0px 0px;	
}

#arrows {
	position: absolute;
	top: 119px;
	left: 449px;
	width: 100px;
}

#arrows a {
	display: block;
	float: left;
	width: 32px;
	height: 50px;
	margin-right: 10px;
	background-repeat: no-repeat;
	background-position: 0px 0px;	
}

#arrows a:hover {
	background-position: -32px 0px;	
}

#arrows #arrowUp {
	background-image: url(../img/up.jpg);
}

#arrows #arrowDown {
	background-image: url(../img/down.jpg);
}

/*-----------------------------------------------------
	works - thumbs
-----------------------------------------------------*/ 

#thumbs {
	position: absolute;
	top: 172px;
	left: 155px;
	width: 370px;
	height: 220px;
}

.thumb {
	width: 63px;
	height: 74px;
	float: left;
	margin-bottom: 10px;
	background-repeat: no-repeat;
	background-position: 0px 0px;	
}

#thumb0 {
	background-image: url(../img/row1_1.jpg);
}

#thumb1 {
	background-image: url(../img/row1_2.jpg);
}

#thumb2 {
	background-image: url(../img/row1_3.jpg);
}

#thumb3 {
	background-image: url(../img/row1_4.jpg);
}

#thumb4 {
	background-image: url(../img/row1_5.jpg);
}

#thumb5 {
	background-image: url(../img/row1_6.jpg);
}

#thumb6 {
	background-image: url(../img/row2_1.jpg);
}

#thumb7 {
	background-image: url(../img/row2_2.jpg);
}

#thumb8 {
	background-image: url(../img/row2_3.jpg);
}

#thumb9 {
	background-image: url(../img/row2_4.jpg);
}

#thumb10 {
	background-image: url(../img/row2_5.jpg);
}

#thumb11 {
	background-image: url(../img/row2_6.jpg);
}

#thumb12 {
	background-image: url(../img/row3_1.jpg);
}

#thumb13 {
	background-image: url(../img/row3_2.jpg);
}
#thumb14 {
	background-image: url(../img/row3_3.jpg);
}
#thumb15 {
	background-image: url(../img/row3_4.jpg);
}
#thumb16 {
	background-image: url(../img/row3_5.jpg);
}
#thumb17 {
	background-image: url(../img/row3_6.jpg);
}

.thumb img {
	margin-top: 12px;
	margin-left: 12px;
	display: block;
	}

/*-----------------------------------------------------
	links
-----------------------------------------------------*/ 

#description a,
#textBox a,
#textBoxRight a {
	color: #8C0800;
	text-decoration: none;
	background-image: url(../img/link_selected_linked.gif);
	background-position: 20% 7px;
	background-repeat: no-repeat;
}

#description a:hover,
#textBox a:hover,
#textBoxRight a:hover {
	background-position: 20% -389px;
}