#box { 
text-align:center; 
font-size: 13px; 
} 

/* The containing box for the gallery. */ 
#container { 
position:relative; 
width:700px; 
height:410px; 
margin:20px auto 0 auto; 
border:1px solid #555; 
} 

/* Removing the list bullets and indentation */ 
#container ul { 
padding:0; 
margin:0; 
list-style-type:none; 
} 

/* Remove the images and text from sight */ 
#container a.gallery span { 
position:absolute; 
width:1px; 
height:1px; 
top:-1px; 
left:-1px; 
overflow:hidden; 
background:#fff; 
} 

/* Adding the thumbnail images */ 
#container a.gallery, #container a.gallery:visited { 
display:block; 
color:#000; 
text-decoration:none; 
border:1px solid #000; 
margin:1px 2px 1px 2px; 
text-align:left; 
cursor:default; 
} 
#container a.slidea { 
background:url(images/gallery1_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.slideb { 
background:url(images/gallery2_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.slidec { 
background:url(images/gallery3_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.slided { 
background:url(images/gallery4_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.slidee { 
background:url(images/gallery5_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.slidef { 
background:url(images/gallery6_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.slideg { 
background:url(images/gallery7_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.slideh { 
background:url(images/gallery8_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.slidei { 
background:url(images/gallery9_t.jpg); 
width:80px; 
height:53px; 
} #container a.slidej { 
background:url(images/gallery10_t.jpg); 
width:80px; 
height:53px; 
} #container a.slidek { 
background:url(images/gallery11_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.slidel { 
background:url(images/gallery12_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.slidem { 
background:url(images/gallery13_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.sliden { 
background:url(images/gallery14_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.slideo { 
background:url(images/gallery15_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.slidep { 
background:url(images/gallery16_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.slideq { 
background:url(images/gallery17_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.slider { 
background:url(images/gallery18_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.slides { 
background:url(images/gallery19_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.slidet { 
background:url(images/gallery20_t.jpg); 
width:80px; 
height:53px; 
} 
#container a.slideu { 
background:url(images/gallery21_t.jpg); 
width:80px; 
height:53px; 
} 

/* set the size of the unordered list to neatly house the thumbnails */ 
#container ul { 
width:260px; 

} 
#container li { 
float:left; 
} 

/* move the thumbnails into the correct position */ 
#container ul { 
margin:5px; 
float:right; 
} 

/* change the thumbnail border color */ 
#container a.gallery:hover { 
border:1px solid #fff; 
} 

/* styling the :hover span */ 
#container a.gallery:hover span { 
position:absolute; 
width:320px; 
height:376px; 
top:10px; 
left:20px; 
color:#000; 
background:#fff; 
} 

#container { 
background:#fff url(images/galleryimage.jpg) 20px 10px no-repeat; 
} 

