function autoSwitch() {
  var active = $('#servicesContainer div.info p.active');

  var next = active.next().length ? active.next() : active.siblings(':first-child').next();

  active.removeClass('active').slideUp('fast', function(){
  	next.slideDown('fast').addClass('active');
	});

}

$(document).ready(function(){
/* var:
initialWidth - each block has its own, pre-defined in css
expandedWidth - same for all blocks, pre-defined in js
collapsedWidth - same for all blocks, pre-defined in js

initialHeight - each block has its own, pre-calculated
expandedHeight - each block has its own, pre-defined in js
collapsedHeight - each block has its own, calculated on the fly

initialMarginTop - each block has its own, pre-defined in css
displayMarginTop - each block has its own, pre-defined in js

*/

  var expandedWidth = 820; /**** need to set ****/
  var collapsedWidth = 53; /**** need to set ****/
  var displayMarginTopOffset_about = 50;
  var displayMarginTopOffset_services = 0;
  var displayMarginTopOffset_portals = 80;

  function block(blockName, expandedHeight, displayMarginTop) {
    this.blockName = blockName;
    this.jqueryObject = $('#' + this.blockName);
    this.initialMarginTop =  parseInt(this.jqueryObject.css('marginTop'));
    this.initialWidth = this.jqueryObject.width();
    this.initialHeight = $('#content').height() - this.initialMarginTop - 18;
    this.expandedHeight = expandedHeight;
    this.displayMarginTop = displayMarginTop;

    this.jqueryObject.height(this.initialHeight);

    this.resetPosition = function(){
      this.jqueryObject.animate({width: this.initialWidth, height: this.initialHeight, marginTop: this.initialMarginTop}, 200, function(){
        if(!$('#background img.base').hasClass('active'))
          backgroundSwitch('base');
      }).removeClass('expanded').removeClass('collapsed').children('.sectionContent').hide().siblings('.sectionOverview').show();
    }
  }

  function expand (block, expandedHeight, displayMarginTop) {
    block.
      removeClass('collapsed').
      addClass('expanded').
      children('.sectionOverview').
        hide().
        siblings('.sectionContent').
          show().
        end().
      end().
      animate({width: expandedWidth, height: expandedHeight, marginTop: displayMarginTop}, 400).
      siblings(':not(.clear)').
        /**/
        each(function(){
          var marginTop = 0;
          var height = 0;

          if ($(this).hasClass('expanded')) {
            $(this).children(':not(.sectionHeader)').hide();

            height = expandedHeight + displayMarginTop - parseInt($(this).css('marginTop'));
            $(this).animate({width: collapsedWidth, height: height}, 400);
            $(this).removeClass('expanded').addClass('collapsed');

          } else if ($(this).hasClass('collapsed')) {
            height = expandedHeight + displayMarginTop - parseInt($(this).css('marginTop'));
            $(this).animate({height: height}, 400);

          } else {
            // initial state, no expanded nor collapsed

            $(this).children(':not(.sectionHeader)').hide();

            if ($(this).attr('id') == 'about')
              marginTop = displayMarginTopOffset_about;
            else if ($(this).attr('id') == 'services')
              marginTop = displayMarginTopOffset_services;
            else
              marginTop = displayMarginTopOffset_portals;

             // alert(marginTop);

            height = expandedHeight + displayMarginTop - marginTop;
            $(this).animate({width: collapsedWidth, height: height, marginTop: marginTop}, 400);
            $(this).addClass('collapsed');
          }

        });
  }

  function backgroundSwitch(activeBlockName) {
    $('#background img.active').animate({opacity: 0}, 400, function(){
      $(this).removeClass('active');
    });
    $('#background img.' + activeBlockName).css({zIndex: 2, opacity: 0, display: 'block'}).animate({opacity: 1}, 400, function(){
      $(this).addClass('active').css({zIndex: '', opacity: '', display: ''});
    });
  }

  function resetSlider(element) {
    $(element).scrollTo(0, 400).siblings('.subNav').children('li:first-child').addClass('selected').siblings().removeClass('selected');
    return ;
  }

  var about = new block('about', 527, displayMarginTopOffset_about); /**** need to set expandedHeight ****/
  var services = new block('services', 610, displayMarginTopOffset_services); /**** need to set expandedHeight ****/
  var portals = new block('portals', 568, displayMarginTopOffset_portals); /**** need to set expandedHeight ****/

  $('#header a.home').click(function(){
    about.resetPosition();
    services.resetPosition();
    portals.resetPosition();
    return false;
  });

  about.jqueryObject.children('.sectionHeader').click(function(){
    if (!about.jqueryObject.hasClass('expanded')) {
      backgroundSwitch(about.blockName);
      expand(about.jqueryObject, about.expandedHeight, about.displayMarginTop);
      resetSlider('#aboutContainerWindows');
			
			/* add class 'right' to #services to switch its speakingNav mode to right */
			$('#services').addClass('right');
    } else {
      resetSlider('#aboutContainerWindows');
    }
  });

  services.jqueryObject.children('.sectionHeader').click(function(){
    if (!services.jqueryObject.hasClass('expanded')) {
      backgroundSwitch(services.blockName);
      expand(services.jqueryObject, services.expandedHeight, services.displayMarginTop);
      resetSlider('#servicesContainerWindows');
    } else {
      resetSlider('#servicesContainerWindows');
    }
  });

  $('#services .sectionOverview li').click(function(){
    expand(services.jqueryObject, services.expandedHeight, services.displayMarginTop);
    var name = $(this).attr('class');
    $('#servicesContainerWindows').scrollTo('#' + name, 400).siblings('.subNav').children('li.' + name).addClass('selected').siblings().removeClass('selected');
    resetServices = false;
  });

  portals.jqueryObject.children('.sectionHeader').click(function(){
    if (!portals.jqueryObject.hasClass('expanded')) {
      backgroundSwitch(portals.blockName);
      expand(portals.jqueryObject, portals.expandedHeight, portals.displayMarginTop);
			
			/* remove the 'right' class from #services to reset the position of its speakingNav */
			$('#services').removeClass('right');
    }
  });

  /* local scroll for About portion */
  $.localScroll({
    target: '#aboutContainerWindows',
    items: '#aboutContainer > .pane',
    navigation: '.subNav a',
    axis: 'xy',
    queue:false,
    duration: 400,
    hash:false
  });

  /* local scroll for Services portion */
  $.localScroll({
    target: '#servicesContainerWindows',
    items: '#servicesContainer > .pane',
    navigation: '.subNav a',
    axis: 'xy',
    queue:false,
    duration: 400,
    hash:false,
		onAfter: function() {

		}
  });

  /* subNav - add and remove selected class */
  $('.subNav a').click(function(){
    $(this).parent().addClass('selected').siblings().removeClass('selected');
  });

  /* colorbox for lightbox effect for contact */
  $('#header .contact').colorbox({width: 900, inline: true, href: '#contact'});

  /* testimonial */
	//  $('#servicesContainer div.info p').hide(); 
	//  $('#servicesContainer div.info > h4 + p').show().addClass('active'); 
	//  setInterval("autoSwitch()", 5000);
	$('#servicesContainer div.infoContainer > div.info').cycle({
      fx: 'fade',
      timeout: 3000,
      speed: 3000
    }); 
	
	/* Event Management - photos */
	$('#eventManagement div.photoGallery').cycle({
      fx: 'fade',
      timeout: 3000,
      speed: 2000
    }); 


  /* BOD */
   $('#directors .content div').click(function(){ var director = 
  $(this).attr('class'); $(director).show('fast').siblings().hide('fast'); }); 
  });