jQuery( document ).ready(function( $ ) {
	//LANDING PAGE
	//Create porportionate header image size
	var percent = 100,
		ratio   = 2.25;
	$(window).bind('resize', function () {
		var $this  = $(this),
			width  = $this.width(),
			height = Math.floor(width / ratio);	
	   
		$('#landing-header-image').css({
			width      : Math.floor(width * (percent / 100)),
			height     : Math.floor(height * (percent / 100))
		});
		
	}).trigger('resize');
	
	//TALL HEADER
	$(document).ready(function () {
		//Create porportionate header image size
		var percent = 100,
			ratio   = 2.9;
		$(window).bind('resize', function () {
			var $this  = $(this),
				width  = $this.width(),
				height = Math.floor(width / ratio);
	
			$('#tall-header-image').css({
				width      : Math.floor(width * (percent / 100)),
				height     : Math.floor(height * (percent / 100))
			});
		}).trigger('resize');
	});

	//SHORT header
	$(document).ready(function () {
		//Create porportionate header image size
		var percent = 100,
			ratio   = 4;
		$(window).bind('resize', function () {
			var $this  = $(this),
				width  = $this.width(),
				height = Math.floor(width / ratio);
	
			$('#short-header-image').css({
				width      : Math.floor(width * (percent / 100)),
				height     : Math.floor(height * (percent / 100))
			});
		}).trigger('resize');
	});	

	// Search
	$( "#search-button" ).click(function() {
	  $( ".search-bar" ).slideToggle( 400 );
	});


	// DD Tab
	$("#tabs li").click(function() {
		//	First remove class "active" from currently active tab
		$("#tabs li").removeClass('active');

		//	Now add class "active" to the selected/clicked tab
		$(this).addClass("active");

		//	Hide all tab content
		$(".tab_content").hide();

		//	Here we get the href value of the selected tab
		var selected_tab = $(this).find("a").attr("href");

		//	Show the selected tab content
		$(selected_tab).fadeIn();

		//	At the end, we add return false so that the click on the link is not executed
		return false;
	});	
	
});