$(document).ready(
	function()
	{
		$("#theme_boks").hover(
		 function()
		 {
			 window.clearInterval(si);
		 },
		 function()
		 {
		 	si=setInterval( "slideSwitch()", 4000 );						 
		 }
		);
		$("#theme_box_nav li").click(function(){	
			if(si!=""){
				  window.clearInterval(si)
			}		   
			var $activeMenu = $('#theme_box_nav li.activ');
			$activeMenu.removeClass("activ"); 
			$(this).addClass("activ");
			this.current=$(this).attr('id').substring(3);			
			
			 var $active = $('#slideshow DIV.activ');			
		
			var $next =  $('#slideshow #ph_'+this.current);
			
			$active.addClass('last-activ');
		
			$next.css({opacity: 0.0})
				.addClass('activ')
				.animate({opacity: 1.0}, 500, function() {
					$active.removeClass('activ last-activ');
			});
			$nextMenu.addClass('activ'); 			
		});
	})

function slideSwitch() {
     var $active = $('#slideshow DIV.activ');
     var $activeMenu = $('#theme_box_nav li.activ');

    var $next =  $active.next().length ? $active.next()
        : $('#slideshow DIV:first');
	var $nextMenu =  $activeMenu.next().length ? $activeMenu.next()
        : $('#theme_box_nav li:first');
	
    $active.addClass('last-activ');
	$activeMenu.addClass('last-activ');

    $next.css({opacity: 0.0})
        .addClass('activ')
        .animate({opacity: 1.0}, 500, function() {
            $active.removeClass('activ last-activ');
	    });
	$activeMenu.removeClass('activ last-activ');
	$nextMenu.addClass('activ');        
}

$(function() {
    si=setInterval( "slideSwitch()", 4000 );
});