function slideToggle(el, bShow)
{
	var $el = $(el), height = $el.data("originalHeight"), visible = $el.is(":visible");
	
	// if the bShow isn't present, get the current visibility and reverse it
	if( arguments.length == 1 ) bShow = !visible;
	
	// if the current visiblilty is the same as the requested state, cancel
	if( bShow == visible ) return false;
	
	// get the original height
	if( !height ){
		// get original height
		height = $el.show().height();
		// update the height
		$el.data("originalHeight", height);
		// if the element was hidden, hide it again
		if( !visible ) $el.hide().css({height: 46});
	}
	
	// expand the knowledge (instead of slideDown/Up, use custom animation which applies fix)
	if( bShow ){
		$el.stop().show().animate({width: 210, opacity:1}, {duration: 150})
						 .animate({height: height}, {duration: 300});
		$("a.toggle-content").stop().animate({color: "#fff"}, {duration: 150});
	} else {
		$el.stop().animate({height: 46}, {duration: 300})
				  .animate({width: 0, opacity:0}, {duration: 150, complete:function (){ $el.hide() }});
		$("a.toggle-content").stop().animate({color: "#fff"}, {duration: 300})
									.animate({color: "#d42b2c"}, {duration: 150});
	}
}

function initAnimation(el)
{
	var $el = $(el), height = $el.data("originalHeight"), visible = $el.is(":visible");
	
	// get the original height
	if( !height ){
		// get original height
		height = $el.show().height();
		// update the height
		$el.data("originalHeight", height);
		// if the element was hidden, hide it again
		if( !visible ) $el.hide().css({height: 46});
	}
	
	// expand the knowledge (instead of slideDown/Up, use custom animation which applies fix)
	$el.show().animate({opacity: 0}, {duration: 0})
			  .animate({width: 0}, {duration: 1000})
			  .animate({width: 210, opacity:1}, {duration: 150})
			  .animate({height: height}, {duration: 300})
			  .animate({height: height}, {duration: 3000})
			  .animate({height: 46}, {duration: 300})
			  .animate({width: 0, opacity:0}, {duration: 150, complete:function (){ $el.hide() }});
	$("a.auto-toggle").animate({color: "#d42b2c"}, {duration: 1000})
					  .animate({color: "#fff"}, {duration: 150})
					  .animate({color: "#fff"}, {duration: 3600})
					  .animate({color: "#d42b2c"}, {duration: 150});
}

function initToggle(el)
{
	var $el = $(el), height = $el.data("originalHeight"), visible = $el.is(":visible");
	
	// get the original height
	if( !height ){
		// get original height
		height = $el.show().height();
		// update the height
		$el.data("originalHeight", height);
		// if the element was hidden, hide it again
		if( !visible ) $el.hide().css({height: 46});
	}
	
	// expand the knowledge (instead of slideDown/Up, use custom animation which applies fix)
	$el.show().animate({opacity: 0, width: 0}, {duration: 0})
			  .animate({width: 210}, {duration: 1})
			  .animate({height: height}, {duration: 1})
			  .animate({height: 46}, {duration: 1})
			  .animate({width: 0}, {duration: 1, complete:function (){ $el.hide() }});
}
