$(document).ready(function () {
	
	// hide then show "hello" contact
	$("#hello_contact").css('margin-top','-100px').delay(2000).animate({marginTop: "0"}, 1000 );
	
	
	//spacing assist for top nav
	$("#top_nav ol > li:nth-child(2)").css({
		//"margin-right":"-10px",
		"min-width": "100px"
		});
	$("#top_nav ol > li:nth-child(3)").css({
		"margin-right":"-10px"
		});	
	
	// animated nav dropdowns
	//We initially hide the all dropdown menus
	$('#top_nav ol > li').find('.submenu').hide();

	//When hovering over the main nav link we find the dropdown menu to the corresponding link.
	$('#top_nav ol > li').hover(function() {
		//Find a child of 'this' with a class of .sub_nav and make the beauty fadeIn.
		$(this).find('.submenu').stop(true,true).slideDown(150);
	}, function() {
		//Do the same again, only fadeOut this time.
		$(this).find('.submenu').stop(true,true).hide();
	});
	
	
	//SERVICES BLOCKS NAV HOVER SLIDER ANIMATION
	$('#services_blocks li').hover(function(){
			// get html
			var activeLink = $(this).html();
			// prepend content
			$(this).prepend(activeLink);
			// add class to newly prepended link and animate the effect
			$(this).find(':first-child').addClass('active');

			$(this).children('a.active').stop(true,true).animate({
		    	left: '0px'
		  	}, 300);
		 
		 
		}, function(){
			$(this).children('a.active').stop(true,true).animate({
		    	left: '-400px'
		  	}, 200, function(){
		  	// remove the prepended animated link
		  	$(this).remove();
		  });
		  
		  
	});
	
	//RECENT WORK
	// hide brand name on scroler items
	$('#slider_recent_work .items a span').hide();
	// hover over scroller item and brand name fades in
	$('#slider_recent_work .items a').hover(function() {
		//Find a child of 'this' with a class of .sub_nav and make the beauty fadeIn.
		$(this).find('span').stop(true,true).slideDown(150);
	}, function() {
		//Do the same again, only fadeOut this time.
		$(this).find('span').stop(true,true).slideUp(150);
	});
	
	
	//WORK ITEMS
	// hide brand name on scroler items
	$('.work-item span').hide();
	// hover over scroller item and brand name fades in
	$('a.work-item').hover(function() {
		//Find a child of 'this' with a class of .sub_nav and make the beauty fadeIn.
		$(this).find('span').stop(true,true).slideDown(150);
	}, function() {
		//Do the same again, only fadeOut this time.
		$(this).find('span').stop(true,true).slideUp(150);
	});
	
	
	
	// initialize scrollable with mousewheel support
	$("#slider_recent_work .scrollable").scrollable({ mousewheel: true });
	$("#slider_whats_new .scrollable").scrollable({ vertical: true, mousewheel: true });
	
	
	// services tabs
	$(".service-tabs").tabs("#flowpanes > div.panes", { history: true });
		
	$("#browsable").scrollable({speed:250}).navigator(".navi");
	
 });