$(document).ready(function(){
	var $mainNav = $('#top-nav'),
	navWidth = $mainNav.width();
	
	$mainNav.children('.top-nav-item').hover(function(ev) {
		var $this = $(this),
		$dd = $this.find('.top-nav-dd');
		
		// get the left position of this tab
		var leftPos = $this.find('.top-nav-tab').position().left;
		
		// get the width of the dropdown
		var ddWidth = $dd.width(),
		leftMax = navWidth - ddWidth;
		
		// position the dropdown
		$dd.css('left', Math.min(leftPos, leftMax) );
		
		// show the dropdown
		$this.addClass('top-nav-item-active');
	}, function(ev) {

		// hide the dropdown
		$(this).removeClass('top-nav-item-active');
	});
});

