jQuery(document).ready(function($) {
	
	if ($('#main-image img')) {
		var origImg = $('#main-image img').attr('src')
	}
	
    $('td.bio').hover(
     function(index, value) {
         $(this).find('.hover').show().end().find('.normal').hide()             
         $('#default-text').hide()
         var id = '#bio-' + ($(this).index())
         $(id).show()
     },
     function() {
         $(this).find('.normal').show().end().find('.hover').hide()
         $('#default-text').show()
         var id = '#bio-' + ($(this).index())
         $(id).hide()
     }
    )
	
	$('#other-images img').hover(
		function() {
			var imgSrc = $(this).attr('src')
			$('#main-image')
			    .find('.back').hide().end()
                .find('.front').hide()
		        .find('img').attr('src', imgSrc)
		        .parent().fadeIn(500)
		},
		function() {
			$('#main-image')
                .find('.front').hide().end()
                .find('.back').show()
    		}
	)
	
	// Project details link highlights category title in orange (overall projects)
	$('#sub-nav li.depth-2 a').hover(
	    function() {
            topLink = $(this).parents('li.depth-1').children('a')
            topLink.css('color', '#f7941d')
	    },
	    function() {
            topLink = $(this).parents('li.depth-1').children('a')
            topLink.css('color', '#54575f')
	    }
	)

	// Project details link highlights category title in orange (project categories)
    // This could be integrated into the above.
	$('#sub-nav.sub-level li.depth-1 a').hover(
	    function() {
            topLink = $(this).parents('.sub-level').children('h3')
            topLink.css('color', '#f7941d')
	    },
	    function() {
            topLink = $(this).parents('.sub-level').children('h3')
            topLink.css('color', '#54575f')
	    }
	)
})