/* CSS Image Viewer from CSSplay (www.cssplay.co.uk) */

#gallery {width:680px; height:420px; padding:10px; border:1px #333 solid; background: #000000; position:relative; }
#gallery b.default {position:absolute; width:480px; height:420px; text-align:center; border-left:1px #333 solid; border-right:1px #333 solid;}
#gallery b.default img {display:block; margin:0 auto 10px auto; width:auto; height:auto;}
#gallery b.default span {display:block; color:#fff; font-family:verdana, arial, sans-serif; font-weight:normal; font-size:11px; width:400px; margin:0 auto;}

#gallery ul {list-style:none; padding:0; margin:0; width:180px; position:relative; float:right;}
#gallery ul li {display:inline; width:50px; height:50px; float:left; margin:1px 0px 3px 8px;}
#gallery ul li a {display:block; width:50px; height:50px; text-decoration:none;}
#gallery ul li a span {display:none;}
#gallery ul li a img {display:block; width:50px; height:50px; border:0;}

#gallery ul li a:focus {background:#000000; border: thin gray solid;}
#gallery ul li a:active {background:#000000;}
#gallery ul li a:focus b {position:absolute; left:-500px; top:0; width:480px; height:420px; text-align:center; background:#000000; z-index:10; border-left:1px #333 solid;  border-right:1px #333 solid}
#gallery ul li a:active b {position:absolute; left:-500px; top:0; width:480px; height:420px; text-align:center; background:#000000; z-index:10; border-left:1px #333 solid; border-right:1px #333 solid}
#gallery ul li a:focus span {display:block; color:#fff; font-family:verdana, arial, sans-serif; font-weight:normal; font-size:11px; width:420px; margin:0 auto;}
#gallery ul li a:active span {display:block; color:#fff; font-family:verdana, arial, sans-serif; font-weight:normal; font-size:11px; width:420px; margin:0 auto;}
#gallery ul li a:focus img{display:block;  margin:0 auto 10px auto; width:auto; height:auto; }
#gallery ul li a:active img{display:block; margin:0 auto 10px auto; width:auto; height:auto;  }