$(document).ready (function() {
  var $panels = $('#slider .scrollContainer > div');
  var $container = $('#slider .scrollContainer');

  $container.css('width', $panels[0].offsetWidth * $panels.length);

  var $scroll = $('#slider .scroll').css('overflow', 'hidden');
  $scroll
   .before('<div class="scrollButtons left">〈&nbsp;&nbsp;</div>')
   .after('<div class="scrollButtons right">&nbsp;&nbsp;〉</div>');
 
  function selectNav() {
    $(this)
      .parents('div#tabs')
        .find('a')
          .removeClass('youarehere')
        .end()
      .end()
      .addClass('youarehere');
  }

  $('#slider .navigation').find('a').click(selectNav);
  if (location.hash) {
    selectNav.call($('a[href$="' + location.hash.substr(0) + '"]').get(0));
  } else {
    selectNav.call($('a[href$="about"]').get(0));
  }
    
  $('.left').click(function() {$('a.youarehere').prev().click(); });
  $('.right').click(function() {$('a.youarehere').next().click(); });

  var offset = parseInt($container.css('paddingTop') || 0) * -1;

  var scrollOptions = {
    target: $scroll,
    items: $panels,
    navigation: '.navigation a',
    axis: 'xy',
    offset: offset,
    duration: 500,
    easing: 'swing',
    hash: true
  };

  $.localScroll(scrollOptions);
  $.localScroll.hash(scrollOptions);
  scrollOptions.duration = 1;

  $('span.info').mouseenter(function() {
    $('div.info').animate({'bottom': '+=25px', 'opacity': 'show'}, 'fast');
  });
  $('div.info').mouseleave(function() {
    $('div.info').animate({'bottom': '-=25px', 'opacity': 'hide'}, 'fast');
  });
});