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

div.container {
	position: absolute;
	width: 506px;
	height: 506px;
	left: 50%;
	top: 50%;
	margin: -253px 0 0 -253px;
}

div.aboutframe {
	position: absolute;
	width: 510px;
	height: 510px;
	left: 50%;
	top: 50%;
	margin: -255px 0 0 -255px;
	overflow: hidden;
}

div.contactframe {
	position: absolute;
	width: 510px;
	height: 510px;
	left: 50%;
	top: 50%;
	margin: -255px 0 0 -255px;
	overflow: hidden;
}

div.resumeframe {
	position: absolute;
	width: 510px;
	height: 510px;
	left: 50%;
	top: 50%;
	margin: -255px 0 0 -255px;
	line-height: 18px;
	overflow: hidden;
}

div.lookslike {
	position: absolute;
	width: 413px;
	height: 228px;
	top: 252px;
	left: 41px;	
	background-image: url(images/layout/lookslike.png);
}

div.email {
	position: absolute;
	width: 369px;
	height: 28px;
	top: 241px;
	left: 72px;	
	background-image: url(images/layout/email.png);
}


div.abouttext{
	position: absolute;
	width: 470px;
	height: 225px;
	top: 18px;
	left: 50%;
	margin-left: -235px; 
}

div.contacttext{
	position: absolute;
	width: 470px;
	height: 100px;
	top: 221px;
	left: 50%;
	margin-left: -235px; 
}

div.resumetext{
	position: absolute;
	width: 500px;
	height: 500px;
	top: 5px;
	left: 5px;
}

div.centerbox {
	position: absolute;
	background-image: url(images/layout/greenBorder.png);
	width: 300px;
	height: 300px;
	top: 103px;
	left: 103px;
}

div.textblock {
	position: absolute;
	width: 300px;
	height: 300px;
	background-image: url(images/layout/textBlock.png);
	top: 0px;
	left: 0px;
}

div.signature {
	position: absolute;
	width: 300px;
	height: 300px;
	background-image: url(images/layout/signature.png);
	top: 0px;
	left: 0px;
}

div.links {
	position: absolute;
	width: 203px;
	height: 103px;
	background-image: url(images/layout/linksborder.png);
	top: 403px;
	left: 303px;
}

div.yt {
	position: absolute;
	width: 32px;
	height: 32px;
	background-image: url(images/layout/icons/yt.png);
	top: 57px;
	left: 14px;
}

div.tw {
	position: absolute;
	width: 32px;
	height: 32px;
	background-image: url(images/layout/icons/tw.png);
	top: 57px;
	left: 61px;
}

div.tu {
	position: absolute;
	width: 32px;
	height: 32px;
	background-image: url(images/layout/icons/tu.png);
	top: 57px;
	left: 109px;
}

div.li {
	position: absolute;
	width: 32px;
	height: 32px;
	background-image: url(images/layout/icons/li.png);
	top: 57px;
	left: 156px;
}

div.yt:hover {
	background-image: url(images/layout/icons/yt_on.png);
}

div.tw:hover {
	background-image: url(images/layout/icons/tw_on.png);
}

div.tu:hover{
	background-image: url(images/layout/icons/tu_on.png);
}

div.li:hover {
	background-image: url(images/layout/icons/li_on.png);
}

div.demo {
	position: absolute;
	width: 93px;
	height: 13px;
	top: 12px;
	left: 14px;
	background-image: url(images/layout/links/demo.png);
}

div.resume {
	position: absolute;
	width: 67px;
	height: 13px;
	top: 12px;
	left: 123px;
	background-image: url(images/layout/links/resume.png);
}

div.about {
	position: absolute;
	width: 84px;
	height: 13px;
	top: 35px;
	left: 13px;
	background-image: url(images/layout/links/about.png);
}

div.contact {
	position: absolute;
	width: 78px;
	height: 13px;
	top: 35px;
	left: 111px;
	background-image: url(images/layout/links/contact.png);
}

div.demo:hover {
	background-image: url(images/layout/links/demo_on.png);
}

div.resume:hover {
	background-image: url(images/layout/links/resume_on.png);
}

div.about:hover {
	background-image: url(images/layout/links/about_on.png);
}

div.contact:hover {
	background-image: url(images/layout/links/contact_on.png);
}

.thumb1 {
	position: absolute;
	width: 103px;
	height: 103px;
	top: 0px;
	left: 0px;
	background-image: url(images/thumbs/d-ep5-off.jpg);
	overflow: hidden;
}

.thumb1:hover {
	background-image: url(images/thumbs/d-ep5-on.jpg);
	overflow: visible;
}

.thumb1:hover > .label1 {
	top: -31px;
	left: 0px;
	overflow: visible;
}

.label1 {
	position: absolute;
	width: 92px;
	height: 30px;
	top: 10000px;
	right:104px;
	background-image: url(images/labels/l_ep5.png);
}

.thumb2 {
	position: absolute;
	width: 100px;
	height: 103px;
	top: 0px;
	left:103px;
	background-image: url(images/thumbs/d-ep4-off.jpg);
	overflow: hidden;
}

.thumb2:hover {
	background-image: url(images/thumbs/d-ep4-on.jpg);
	overflow: visible;
}

.thumb2:hover > .label2 {
	top: -31px;
	left: 0px;
	overflow: visible;
}

.label2 {
	position: absolute;
	width: 92px;
	height: 30px;
	top: 10000px;
	right:104px;
	background-image: url(images/labels/l-ep4.png);
}

.thumb3 {
	position: absolute;
	width: 100px;
	height: 103px;
	top: 0px;
	left: 203px;
	background-image: url(images/thumbs/d-ep3-off.jpg);
	overflow: hidden;
}

.thumb3:hover {
	background-image: url(images/thumbs/d-ep3-on.jpg);
	overflow: visible;
}

.thumb3:hover > .label3 {
	top: -31px;
	left: 0px;
	overflow: visible;
}

.label3 {
	position: absolute;
	width: 92px;
	height: 30px;
	top: 10000px;
	right:104px;
	background-image: url(images/labels/l-ep3.png);
}

.thumb4 {
	position: absolute;
	width: 100px;
	height: 103px;
	top: 0px;
	left: 303px;
	background-image: url(images/thumbs/d-ep2-off.jpg);
	overflow: hidden;
}

.thumb4:hover {
	background-image: url(images/thumbs/d-ep2-on.jpg);
	overflow: visible;
}

.thumb4:hover > .label4 {
	top: -31px;
	left: 0px;
	overflow: visible;
}

.label4 {
	position: absolute;
	width: 92px;
	height: 30px;
	top: 10000px;
	right:104px;
	background-image: url(images/labels/l-ep2.png);
}

.thumb5 {
	position: absolute;
	width: 103px;
	height: 103px;
	top: 0px;
	left: 403px;
	background-image: url(images/thumbs/arrows-off.jpg);
	overflow: hidden;
}

.thumb5:hover {
	background-image: url(images/thumbs/arrows-on.jpg);
	overflow: visible;
}

.thumb5:hover > .label5 {
	top: -38px;
	left: 11px;
	overflow: visible;
}

.label5 {
	position: absolute;
	width: 187px;
	height: 64px;
	top: 10000px;
	right:104px;
	background-image: url(images/labels/l-arrows.png);
}

.thumb6 {
	position: absolute;
	width: 103px;
	height: 100px;
	top: 103px;
	left: 403px;
	background-image: url(images/thumbs/arrowbts-off.jpg);
	overflow: hidden;
}

.thumb6:hover {
	background-image: url(images/thumbs/arrowbts-on.jpg);
	overflow: visible;
}

.thumb6:hover > .label6 {
	top: 0px;
	left: 103px;
	overflow: visible;
}

.label6 {
	position: absolute;
	width: 94px;
	height: 66px;
	top: 10000px;
	right:104px;
	background-image: url(images/labels/l-arrowbts.png);
}

.thumb7 {
	position: absolute;
	width: 103px;
	height: 100px;
	top: 203px;
	left: 403px;
	background-image: url(images/thumbs/pl-off.jpg);
	overflow: hidden;
}

.thumb7:hover {
	background-image: url(images/thumbs/pl-on.jpg);
	overflow: visible;
}

.thumb7:hover > .label7 {
	top: 0px;
	left: 104px;
	overflow: visible;
}

.label7 {
	position: absolute;
	width: 96px;
	height: 25px;
	top: 10000px;
	right:104px;
	background-image: url(images/labels/l-pl.png);
}

.thumb8 {
	position: absolute;
	width: 103px;
	height: 100px;
	top: 303px;
	left: 403px;
	background-image: url(images/thumbs/plvfx-off.jpg);
	overflow: hidden;
}

.thumb8:hover {
	background-image: url(images/thumbs/plvfx-on.jpg);
	overflow: visible;
}

.thumb8:hover > .label8 {
	top: 0px;
	left: 104px;
	overflow: visible;
}

.label8 {
	position: absolute;
	width: 94px;
	height: 47px;
	top: 10000px;
	right:104px;
	background-image: url(images/labels/l-plvfx.png);
}

.thumb9 {
	position: absolute;
	width: 100px;
	height: 103px;
	top: 403px;
	left: 203px;
	background-image: url(images/thumbs/empy-off.jpg);
	overflow: hidden;
}

.thumb9:hover {
	background-image: url(images/thumbs/empy-on.jpg);
	overflow: visible;
}

.thumb9:hover > .label9 {
	top: 104px;
	left: 0px;
	overflow: visible;
}

.label9 {
	position: absolute;
	width: 116px;
	height: 33px;
	top: 10000px;
	right:104px;
	background-image: url(images/labels/l-empy.png);
}

.thumb10 {
	position: absolute;
	width: 100px;
	height: 103px;
	top: 403px;
	left: 103px;
	background-image: url(images/thumbs/illum-off.jpg);
	overflow: hidden;
}

.thumb10:hover {
	background-image: url(images/thumbs/illum-on.jpg);
	overflow: visible;
}

.thumb10:hover > .label10 {
	top: 104px;
	left: 0px;
	overflow: visible;
}

.label10 {
	position: absolute;
	width: 110px;
	height: 33px;
	top: 10000px;
	right:104px;
	background-image: url(images/labels/l-illum.png);
}

.thumb11 {
	position: absolute;
	width: 103px;
	height: 103px;
	top: 403px;
	left: 0px;
	background-image: url(images/thumbs/monde-off.jpg);
	overflow: hidden;
}

.thumb11:hover {
	background-image: url(images/thumbs/monde-on.jpg);
	overflow: visible;
}

.thumb11:hover > .label11 {
	top: 104px;
	left: 0px;
	overflow: visible;
}

.label11 {
	position: absolute;
	width: 144px;
	height: 33px;
	top: 10000px;
	right:104px;
	background-image: url(images/labels/l-monde.png);
}


.thumb12 {
	position: absolute;
	width: 103px;
	height: 100px;
	top: 303px;
	left: 0px;
	background-image: url(images/thumbs/pjo-off.jpg);
	overflow: hidden;
}

.thumb12:hover {
	background-image: url(images/thumbs/pjo-on.jpg);
	overflow: visible;
}

.thumb12:hover > .label12 {
	top: 0px;
	right: 104px;
	overflow: visible;
}

.label12 {
	position: absolute;
	width: 91px;
	height: 92px;
	top: 10000px;
	right:104px;
	background-image: url(images/labels/l-pjo.png);
}

.thumb13 {
	position: absolute;
	width: 103px;
	height: 100px;
	top: 203px;
	left: 0px;
	background-image: url(images/thumbs/mock-off.jpg);
	overflow: hidden;
}

.thumb13:hover {
	background-image: url(images/thumbs/mock-on.jpg);
	overflow: visible;
}

.thumb13:hover > .label13 {
	top: 0px;
	right: 103px;
	overflow: visible;
}

.label13 {
	position: absolute;
	width: 93px;
	height: 86px;
	top: 10000px;
	right:104px;
	background-image: url(images/labels/l-mock.png);
}

.thumb14 {
	position: absolute;
	width: 103px;
	height: 100px;
	top: 103px;
	left: 0px;
	background-image: url(images/thumbs/viva-off.jpg);
	overflow: hidden;
}

.thumb14:hover {
	background-image: url(images/thumbs/viva-on.jpg);
	overflow: visible;
}

.thumb14:hover > .label14 {
	top: 0px;
	right: 104px;
	overflow: visible;
}

.label14 {
	position: absolute;
	width: 92px;
	height: 88px;
	top: 10000px;
	right:104px;
	background-image: url(images/labels/l-viva.png);
}



.preload {
	display:none!important;
}