jQuery(document).ready(function(){        
        				
    jQuery('a.create_sub').hover(function(){
    },function(){
      //jQuery('.exploreSub_sub').fadeIn('fast');        
      //jQuery('a.explore_sub').css("background-position" , "-271px -50px");
    })  

		jQuery('.fbpPic a').addClass('thickbox');

		
		
		window.setTimeout(function(){
			jQuery('.ovalBg').fadeIn('medium');													 
		},2000)
		
		
    
    jQuery('.exploreSub_sub li a').bind('click', function(e){
      button_class = jQuery(this).parent().attr('class');
      box_class = button_class + "Box";
      jQuery(".exploreSub_sub li a").removeClass("active");
      jQuery(this).addClass("active");
//      jQuery(this).toggleClass('active');
      jQuery('.control').show();
      init_slidebox(box_class);
    })    
      
    function close_slidebox() {
      jQuery(".exploreSub_sub li a").removeClass("active");
      jQuery(".dummyBox").empty();
      jQuery(".dummyBox").hide();
      jQuery("#mainContent").css('z-index','1');
    }
      
    function init_slidebox(box_class) {
      
      jQuery(".dummyBox").empty();
      jQuery(".dummyBox").append("<div class='close'>x</div>");
      jQuery(".dummyBox .close").click(function() { close_slidebox(); });

      if (jQuery.browser.msie && jQuery.browser.version.substr(0,1)<=7) {
        jQuery('.dummyBox').show();
      }
      else {
        jQuery('.dummyBox').show('slide', {direction: 'down'}, 1000);
      }

      jQuery("."+box_class+" ul.slider-content").clone().appendTo(".dummyBox");
      jQuery(".dummyBox > ul").addClass("sliderbox");
      //alert(jQuery(box_class+" ul.slider-content").html());

      var currentPosition = 0;
      var slideWidth = 885;
			var slideHeight = 400;
      var slides = jQuery('.dummyBox').find('.slide');
      var numberOfSlides = slides.length;
      
        // Remove scrollbar in JS
        jQuery('.sliderbox').css('overflow', 'hidden');
        jQuery('.sliderbox').css('z-index', '5');
        jQuery('#mainContent').css('z-index','2');
      
        // Wrap all .slides with #slideInner div
        slides
          .wrapAll('<div id="slideInner"></div>')
          // Float left to display horizontally, readjust .slides width
        .css({
            'float' : 'left',
            'width' : slideWidth,
            'height' : slideHeight
          });
      
        // Set #slideInner width equal to total width of all slides
        jQuery('.dummyBox #slideInner').css('width', (slideWidth + 15 + 15) * numberOfSlides); // add padding
      
        // Insert controls in the DOM
        jQuery('.dummyBox .sliderbox')
          .prepend('<span class="control" id="leftControl">Previous Page</span>')
          .append('<span class="control" id="rightControl">Next Page</span>');
      
        // Hide left arrow control on first load
        manageControls(currentPosition, numberOfSlides);
      
        // Create event listeners for .controls clicks
        jQuery('.dummyBox .control')
          .bind('click', function(){
            // Determine new position
            currentPosition = (jQuery(this).attr('id')=='rightControl') ? currentPosition+1 : currentPosition-1;
            if (currentPosition > numberOfSlides) {
              currentPosition = numberOfSlides;
            }
            if (currentPosition < 0) {
              currentPosition = 0;
            }
            // Hide / show controls
            manageControls(currentPosition, numberOfSlides);
            // Move slideInner using margin-left
            if (jQuery.browser.msie && jQuery.browser.version.substr(0,1)<=7) {
              jQuery('.dummyBox #slideInner').css('margin-left', (slideWidth+30)*(-currentPosition)); //IE7, animate seems to be not working
            }
            else {
              jQuery('.dummyBox #slideInner').animate({
                'marginLeft' : ((slideWidth+30)*(-currentPosition)) // add padding
              });
            }
        });
    }

    // manageControls: Hides and Shows controls depending on currentPosition
    function manageControls(position, numberOfSlides){
          // Hide left arrow if position is first slide
        if(position <=0) { 
          jQuery('#leftControl').hide() 
        } 
        else { 
          jQuery('#leftControl').show() 
        }

        // Hide right arrow if position is last slide
        if(position >= numberOfSlides -1) { 
          jQuery('#rightControl').hide() 
        } 
        else { 
          jQuery('#rightControl').show() 
        }
    }  
		
		
          
    
    
});