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

* {
	margin: 0;
	padding: 0;
}

img{
border: none;
}

#photo{
width: 644px;
height: 644px;
}

#thumbs{
width: 644px;
height: 125px;
margin-top: 4px;
margin-bottom: 4px;
text-align: center;
}

#t1{
height: 125px;
width: 125px;
float: left;
margin-right: 4px;
margin-left: 2px;
}

#t2{
height: 125px;
width: 125px;
float: left;
margin-right: 4px;
}

#t3{
height: 125px;
width: 125px;
float: left;
margin-right: 4px;
}

#t4{
height: 125px;
width: 125px;
float: left;
margin-right: 4px;
}

#t5{
height: 125px;
width: 125px;
background-color: #66FF99;
float: left;
}

.p1{
background-image: url(1.jpg);
}

.p2{
background-image: url(2.jpg);
}

.p3{
background-image: url(3.jpg);
}

.p4{
background-image: url(4.jpg);
}

.p5{
background-image: url(5.jpg);
}


clearer{
clear: all;
}

a.role1{
background-image: url(s1.jpg);
width: 125px;
height: 125px;
display: block;
}

a.role1:hover{
background-position: -125px 0;
}

a.role2{
background-image: url(s2.jpg);
width: 125px;
height: 125px;
display: block;
}

a.role2:hover{
background-position: -125px 0;
}

a.role3{
background-image: url(s3.jpg);
width: 125px;
height: 125px;
display: block;
}

a.role3:hover{
background-position: -125px 0;
}

a.role4{
background-image: url(s4.jpg);
width: 125px;
height: 125px;
display: block;
}

a.role4:hover{
background-position: -125px 0;
}

a.role5{
background-image: url(s5.jpg);
width: 125px;
height: 125px;
display: block;
}

a.role5:hover{
background-position: -125px 0;
}