body { background: #000; margin: 0; padding: 5px; font-family: Lucida Sans, Arial; font-size: 12px; }
.container { height: 615px; width: 974px; margin: 0 auto; position: relative; background-image: url(bg.png); }
* html .container { background-image: url(bg.gif); }


/* Inner container definitions */
div.gallery div.left { background-image: url(left.png); width: 185px; height: 565px; position: absolute; top: 25px; left: 25px; overflow-y: auto; overflow-x: hidden; }
* html div.gallery div.left { background-image: url(left.gif); }
div.gallery div.bottom { height: 50px; left: 220px; width: 729px; position: absolute; bottom: 25px;}
div.gallery div.right { position: absolute; top: 25px; left: 220px; width: 729px; height: 490px; padding-bottom: 20px; overflow: auto; }

div.gallery div.overlay { display: none; background: #000; position: absolute; top: 25px; left: 220px; width: 729px; height: 545px; padding-bottom: 20px; overflow: auto; z-index: 20; text-align: center; }
* html div.gallery div.overlay { height: 565px; }
div.gallery div.overlay img { cursor: pointer; cursor: hand; border: 1px solid #fff; padding: 5px; background-color: #666; position: absolute; }
div.gallery div.overlay img:hover { border: 1px solid #fff; background-color: #fff; }
div.gallery div.overlay div.head { position: absolute; z-index: 20; background: #333; top: 0px; right: 0px; padding: 5px; color: #ddd; cursor: hand; cursor: pointer; }

/* Styling the left hand navigation */

div.gallery ul.items { list-style-type: none; margin: 0; padding: 10px; }
div.gallery ul.items a { text-decoration: none; display: block; position: relative; color: #333; height: 80px; margin-bottom: 10px; }
div.gallery ul.items a:hover { background: #ccc; }
div.gallery ul.items a:focus { background: #ccc; }
div.gallery ul.items a.over { background: #ccc; }
div.gallery ul.items a span { position: absolute; top: 35px; left: 95px; display: block; width: 90px; }
div.gallery ul.items li div.thumb { border: 1px solid #333; width: 80px; height: 60px; position: absolute; top: 10px; left: 5px; }
div.gallery ul.tree { list-style-type: none; margin: 0; padding-left: 10px; }

/* The slider control at bottom */
div.gallery div.bottom div.slider { height: 22px; width: 200px; position: absolute; top: 15px; right: 60px; background-image: url(slider_bg.png); background-position: 0px 1px; }
* html div.gallery div.bottom div.slider { background-image: url(slider_bg.gif); }
div.gallery div.bottom div.slider div.handle { position: absolute; top: 2px; left: 0px; height: 22px; width: 23px; background-image: url(slider.png); }

#heading { color: #ff9900; position: absolute; top: 10px; left: 10px; font-size: 22px; letter-spacing:1px; font-family: Verdana; }
#logo { position: absolute; top: 10px; right: 0px; border: 0; opacity: 0.8; }
#logo:hover { opacity: 1; }

/* The main thumbnails */
div.gallery div.right img.thumb { border: 1px solid #333; width: 100px; height: 75px; float: left; position: relative; margin-left: 10px; margin-top: 10px; cursor: pointer; cursor: hand; }
div.gallery div.right img.hover { border: 1px solid #fff; z-index: 5;}


/* Drag & Drop */
div.draggable img { width: 100px; border: 1px solid #AED5EA; }