$(document).ready(function()
{
	var missionbtn 		= $('#our-mission');
	var uniquenessbtn	= $('#our-uniqueness');
	var conditionsbtn	= $('#conditions');
	var activeFeature	= $('#main-feature');
	var nextFeature;
	
	missionbtn.click(function(){onClick($(this))});
	uniquenessbtn.click(function(){onClick($(this))});
	conditionsbtn.click(function(){onClick($(this))});
	
	
	function onClick(btn)
	{
		missionbtn.css({color:'#565f3c'});
		uniquenessbtn.css({color:'#565f3c'});
		conditionsbtn.css({color:'#565f3c'});
		$('#' + btn.attr('id')).css({color:'#8b9863'});
		nextFeature = $('#' + btn.attr('id') + '-feature');
		activeFeature.animate({opacity: 0},1000, onComplete);
	}
	
	function onComplete()
	{
		activeFeature.css({display: 'none'});
		activeFeature = nextFeature;
		activeFeature.css({display: 'block', opacity: 0});
		activeFeature.animate({opacity: 1},1000);
	}

});