$(document).ready( function(){
    
    function showLink(){
        
        var elm = $('#welcome_nav > a').get(counter);
        
        changeColours(elm);
        
        counter == 3? counter = 0 : counter++; 
    }
    
    function changeColours(element){
        $('#welcome_image').css({
            'background-image'  : 'url(' + $(element).attr('img') + ')'
        });
        
        $(element).animate({
            'color' : '#870809'
        }, 500);
        $(element).find('span').animate({
            'color' : '#870809'
        }, 500);
        
        $('#welcome_nav > a').not($(element)).animate({
            'color' : '#602F17'
        }, 500);
        $('#welcome_nav > a > span').not($(element).find('span')).animate({
            'color' : '#602F17'
        }, 500);
    }
       
    var timer = setInterval(showLink, 3000);
    
    var counter = 0;
    
    $('#welcome_nav > a').hover( function(){

        clearTimeout(timer);

        changeColours($(this));

    }, function(){
        counter = $('#welcome_nav > a').index($(this)) + 1;
        
        timer = setInterval(showLink, 3000);
    });
    
});