/* css for photo gallery */
/* based on stu nicholls tutorial */

#photos {
position:relative;
width:530px;
height:585px;
background:#eeeeee;
border:none;
margin:0 auto;
}

/*
#photos b {
font-weight:normal;
width:600px;
text-align:center;
position:absolute;
bottom:250px;
left:0;
color:#eeeeee;
font-family:tahoma,geneva,"lucinda sans unicode","lucida grande",verdana,sans-serif;
letter-spacing:1px;
line-height:1.7em;
z-index:1;
}
*/

a.gallery, a.gallery:visited {
display:inline;
color:#000000;
text-decoration:none;
border:1px solid #ff5522;
width:75px;
height:75px;
float:left;
margin:5px 5px;
position:relative;
cursor:default;
}

a.slidea {background:url(photos/1_jpg.jpg);}
a.slideb {background:url(photos/2_jpg.jpg);}
a.slidec {background:url(photos/3_jpg.jpg);}
a.slided {background:url(photos/4_jpg.jpg);}
a.slidee {background:url(photos/5_jpg.jpg);}
a.slidef {background:url(photos/6_jpg.jpg);}
a.slideg {background:url(photos/7_jpg.jpg);}
a.slideh {background:url(photos/8_jpg.jpg);}
a.slidei {background:url(photos/9_jpg.jpg);}
a.slidej {background:url(photos/10_jpg.jpg);}
a.slidek {background:url(photos/11_jpg.jpg);}
a.slidel {background:url(photos/12_jpg.jpg);}
a.slidem {background:url(photos/13_jpg.jpg);}
a.sliden {background:url(photos/14_jpg.jpg);}
a.slideo {background:url(photos/15_jpg.jpg);}
a.slidep {background:url(photos/16_jpg.jpg);}
a.slideq {background:url(photos/17_jpg.jpg);}
a.slider {background:url(photos/18_jpg.jpg);}



a.gallery span {
visibility:hidden; 
display:block; 
position:absolute; 
width:500px; 
height:465px; 
top:10px; 
left:5px; 
color:#000; 
background:#cccccc; 
text-align:center; 
font-family:tahoma,geneva,"lucida sans unicode","lucida grande",verdana,sans-serif; 
letter-spacing:1px; 
cursor:default;
}

a.slidea span {left:-5px; top:80px;}
a.slideb span {left:-92px; top:80px;}
a.slidec span {left:-179px; top:80px;}
a.slided span {left:-266px; top:80px;}
a.slidee span {left:-353px; top:80px;}
a.slidef span {left:-353px; top:80px;}
a.slideg span {left:-353px; top:80px;}
a.slideh span {left:-353px; top:80px;}
a.slidei span {left:-353px; top:80px;}
a.slidej span {left:-353px; top:80px;}
a.slidek span {left:-353px; top:80px;}
a.slidel span {left:-353px; top:80px;}
a.slidem span {left:-353px; top:80px;}
a.sliden span {left:-353px; top:80px;}
a.slideo span {left:-353px; top:80px;}
a.slidep span {left:-353px; top:80px;}
a.slideq span {left:-353px; top:80px;}
a.slider span {left:-353px; top:80px;}



a.gallery:hover {
white-space:normal; 
border:1px solid #990000; 
z-index:100;
}

a.gallery:hover span {
visibility:visible; 
z-index:100;
}

a.gallery:hover span img {
margin:10px; 
border:1px solid #ff5522; 
position:relative; 
z-index:100;
}

a.gallery:active, a.gallery:focus {
border:1px solid #ff5522; 
z-index:10;
}

a.gallery:active span, a.gallery:focus span {
visibility:visible; 
z-index:10;
}

a.gallery:active span img, a.gallery:focus span img {
border:1px solid #ff5522; 
position:relative; 
margin:10px; 
z-index:10;
}
