$(document).ready(function() {
	$.fn.search = function() {
		return this.focus(function() {
		if( this.value == this.defaultValue ) {
			this.value = "";
		}
		}).blur(function() {
		if( !this.value.length ) {
			this.value = this.defaultValue;
		}
		});
	};
	$("#search_programs").search();
	$("#zipcode").search();
	
	//course catalog page
	$('.coursecatalog:nth-child(3n+1)').css('clear','left'); //rids float issue
	//design issue with form alignment
	var height_array = []; //create an array
	var left_array = []; //create an array for IE
	//find all forms, find there top positions and add to an array
	$('.coursecatalog form').each(function(i){
		var offset = $(this).offset();
		var top = offset.top;
		var left = offset.left;
		height_array.push(top);
		left_array.push(left);
	});
	var firstCol = left_array[0];
	var secondCol = left_array[1];
	var thirdCol = left_array[2];
	//separate the array into thirds
	var firstThree = height_array.slice(0,3);
	var secondThree = height_array.slice(3,6);
	var thirdThree = height_array.slice(6,9);
	//find the biggest # of each array
	var firstAlign = Math.max.apply( null, firstThree );
	var secondAlign = Math.max.apply( null, secondThree );
	var thirdAlign = Math.max.apply( null, thirdThree );
	//align each form to the bottom :: IE made me do each individually
	$('.coursecatalog form').eq(0).offset({ top: firstAlign, left: firstCol });
	$('.coursecatalog form').eq(1).offset({ top: firstAlign, left: secondCol  });
	$('.coursecatalog form').eq(2).offset({ top: firstAlign, left: thirdCol });
	$('.coursecatalog form').eq(3).offset({ top: secondAlign, left: firstCol });
	$('.coursecatalog form').eq(4).offset({ top: secondAlign, left: secondCol });
	$('.coursecatalog form').eq(5).offset({ top: secondAlign, left: thirdCol });
	$('.coursecatalog form').eq(6).offset({ top: thirdAlign, left: firstCol });
	$('.coursecatalog form').eq(7).offset({ top: thirdAlign, left: secondCol });
	$('.coursecatalog form').eq(8).offset({ top: thirdAlign, left: thirdCol });
	
	
});
