<div class="gallery">
    	<h3><span>Gallery</span></h3>
    	<div id="gallery" class="content">
            <div id="controls" class="controls"></div>
            <div class="slideshow-container">
                <div id="loading" class="loader"></div>
                <div id="slideshow" class="slideshow"></div>
            </div>
        </div>
        <div id="thumbs" class="navigation">
            <ul class="thumbs noscript">
            	 <?php $hot_news = new WP_query(); $hot_news->query('showposts=6&cat='.$mytheme['gal_cat']); ?>
				<?php while ($hot_news->have_posts()) : $hot_news->the_post(); ?>
                    <li>
                        <a class="thumb" href="<?php img_gallery(297,190) ?>" title="<?php the_title() ?>">
                            <?php img(90,70) ?>
                        </a>

                    </li>
                <?php endwhile; ?>
            </ul>
        </div>
    	<script type="text/javascript">
			jQuery(document).ready(function($) {
				// We only want these styles applied when javascript is enabled
				$('div.navigation').css({'width' : '320px', 'float' : 'right'});
				$('div.content').css('display', 'block');

				// Initially set opacity on thumbs and add
				// additional styling for hover effect on thumbs
				var onMouseOutOpacity = 0.67;
				$('#thumbs ul.thumbs li').opacityrollover({
					mouseOutOpacity:   onMouseOutOpacity,
					mouseOverOpacity:  1.0,
					fadeSpeed:         'fast',
					exemptionSelector: '.selected'
				});

				// Initialize Advanced Galleriffic Gallery
				var gallery = $('#thumbs').galleriffic({
					delay:                     2500,
					numThumbs:                 15,
					preloadAhead:              10,
					enableTopPager:            false,
					enableBottomPager:         false,
					maxPagesToShow:            1,
					imageContainerSel:         '#slideshow',
					renderSSControls:          false,
					renderNavControls:         false,
					enableHistory:             false,
					autoStart:                 false,
					syncTransitions:           true,
					defaultTransitionDuration: 900,
					onSlideChange:             function(prevIndex, nextIndex) {
						// 'this' refers to the gallery, which is an extension of $('#thumbs')
						this.find('ul.thumbs').children()
							.eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
							.eq(nextIndex).fadeTo('fast', 1.0);
					},
					onPageTransitionOut:       function(callback) {
						this.fadeTo('fast', 0.0, callback);
					},
					onPageTransitionIn:        function() {
						this.fadeTo('fast', 1.0);
					}
				});
			});
		</script>
    </div>