jQuery(document).ready(function() {
  var signup_form = jQuery('#signup_form');
  signup_form.hide();

  jQuery('.button a').click(function(event){
    jQuery('#price_notes').hide();
    selected = jQuery(event.target).closest('li.price');
    others = selected.siblings();

    // set the nr of the selected plan in the form
    var selectedPlan = selected.prevAll().size() + 1;
    jQuery('#account_plan').attr('value', selectedPlan);


    // perform animations
    selected.addClass('selected');
    form = jQuery('#signup_wrapper');
    jQuery('.button a').hide();
    others
      .css("overflow", "hidden")
      .animate( { width:  0 }, { queue: true, duration: 450, easing: 'linear'}, 
                function() {
                  selected.removeClass('last').removeClass('first');
                  others.removeClass('last').removeClass('first');
                  others.css("border-right", "0 none !important");
                } 
       )
      .animate( { border: 0 }, 0, true , function() { 
        
        selected.removeClass('last').removeClass('first');
        selected.css("border-right", "0 none");
        form.fadeIn();        
        }      
      );

  });
});