$(document).ready(function() {
	$('.toggler').click(function() {
		if ($(this).hasClass('toggler-closed')) {
			$(this)
				.removeClass('toggler-closed')
				.addClass('toggler-opened')
				.siblings('div.toggler-1')
				.slideToggle('slow');
		} else {
			$(this)
				.removeClass('toggler-opened')
				.addClass('toggler-closed')
				.siblings('div.toggler-1')
				.slideToggle('slow');
		}
	});
	
	$('ul.submenu .expand').click(function() {
			$('.subTopicList')														/*All sub topic lists*/
			.not('#' + $(this).parent('a').siblings('ul').attr('id'))				/*Except the current one*/
			.slideUp()																	/*Hide them all*/
			.removeClass('active')
			.parent('li')																	/*The parents of the lists*/
			.removeClass('active');												/* "deactivate" them */

			$(this)															/*The expand button*/
				.parent()													/*The anchor*/
				.siblings('ul')												/*The following sub topic ul*/
				.filter('.active')												//If the nav item is currently active, use a callback upon completion of the animation to toggle the active classes instead of straight away in order to prevent the gradient appearing too early
					.slideToggle(												/*Show it*/
						function() {
							$(this)
								.removeClass('active')
								.parent('li')													/*The parent li*/
								.removeClass('active');									/*Activate it*/
						}
					)
				.end()
				.not('.active')
					.slideToggle()
					.addClass('active')
					.parent('li')
					.addClass('active');
				return false;												/*Cancel the click event*/
		});
});