jQuery(document).ready(function() {

    bindbutton();

});

function bindbutton() {

    jQuery(".map-container AREA").mouseover(function() {
        var regionMap = '.' + $(this).attr('class') + '-map';
        var regionList = '.' + $(this).attr('class') + '-list';
        jQuery(regionMap).css('display', 'inline');


    }).mouseout(function() {

        var regionMap = '.' + $(this).attr('class') + '-map';
        var regionList = '.' + $(this).attr('class') + '-list';

        // Check if a click event has occured and only change the Region hover state accodringly
        if (!jQuery(regionMap).hasClass('selected')) {
            jQuery(regionMap).css('display', 'none');

        }

        // Check if a click event has occured and only change the Region hover state accodringly
        if (!jQuery('.practice-container ul').hasClass('selected')) {

        }
    });

    jQuery(".map-container AREA").click(function() {

    $('img.region').removeClass('selected').css('display', 'none');

        var content = $('.' + $(this).attr('class') + '-list').html();
        var className = $(this).attr('class') + '-list';

        $('.displaybubble').fadeOut("slow", function() {
            $('.displaybubble').html(content)
            $('.displaybubble').fadeIn("slow");
            $('.displaybubble').css('display', 'inline');
        });

        var regionMap = '.' + $(this).attr('class') + '-map';
        $(regionMap).addClass('selected').css('display', 'inline');



    });

}