/* @override http://beehiveweb:10088/css/project.css */

div.list { height: 53em; }

#project .header {}
#project .header h1 { float: left; display: inline; margin-right: 0.5em; }
#project .header h2 { float: left; display: inline; width: 100%; margin-top: 0.2em; color: #999; clear: both; }
#project .header h2 a { float: left; display: inline; width: 100%; margin-top: 0; font-size:1em; padding:0; color: #999; clear: both; }
#project .header a { float: right; display: inline; font-size: 1.25em; }

#project .gallery { position: relative; width: 693px; height: 462px; overflow: hidden; }
#project .gallery a { float: left; display: inline; text-decoration: none; cursor: pointer; }
#project .gallery a img { position: absolute; }

#project .gallery div.loading { display: none; position: absolute; width: 40px; height: 40px; top: 0; right: 0; background: url(/images/common/loading-small.gif) no-repeat; overflow: hidden; z-index: 500; }

#project .gallery div.scrollable { float: left; display: inline; position: absolute; width: 100%; height: 52px; bottom: -52px; overflow: hidden; }
#project .gallery div.scrollable div.items { position: absolute; width: 300%; margin: 1px 0 0 0; clear: both; z-index: 200; }
#project .gallery div.scrollable div.items div { float: left; display: inline; margin: 0 0 0 1px; padding: 1px; }
#project .gallery div.scrollable div.items div a { width: 71px; height: 48px; overflow: hidden; background-color: #666; }
#project .gallery div.scrollable div.items div.active { background-color: #FFF; }
#project .gallery div.scrollable div.items div.active a { background-color: #1a1a1a; margin: 0; }
#project .gallery div.scrollable div.items div a img { width: 69px; height: 46px; margin: 1px; border: none; }

#project .gallery div.scrollable div.background { height: 100%; background: #000; opacity: 0.33; z-index: 100; }

#project .gallery span.arrow-left, #project .gallery span.arrow-right { width: 16px; height: 46px; background-position: center; }