jQuery.noConflict();
var $j = jQuery;

var $global = {

    documentReady: function() {

        $global.howUsed();
        $global.howUsedRollover();

    },

    howUsed: function() {


        $j('.how-used #ContentPrimary ul li').css({
            'margin-bottom': '2px',
            'display': 'none'
        });
				if($j.browser.msie) {
				  $j('.how-used #ContentPrimary ul li').css({
	            'margin-bottom': '0px'	        });
				}
				
        $j('.how-used #ContentPrimary ul li p').css({
            'position': 'absolute',
            'top': '0px',
            'width': '100%',
            'height': '70px',
            'z-index': '2',
            'display': 'none',
            'padding': '60px 0 0'
        });

				$j('.how-used #ContentPrimary ul li').each(function() {	$j(this).animate({opacity: 'show'}, 'slow');})

    },

    howUsedRollover: function() {

        $j('.how-used #ContentPrimary ul li img').mouseover(function() {
            $j(this).next('p').animate({
                opacity: 'show'
            },
            'slow');
        })
        $j('.how-used #ContentPrimary ul li p').mouseout(function() {
            $j(this).animate({
                opacity: 'hide'
            },
            'slow');
        });

    },

		checkStates: function () {
				imageInterval = window.setInterval("changeImage();", 5000);
				changeImage = function() { $j('.how-used #ContentPrimary ul li p').animate({opacity: 'hide' }, 'slow'); }
		}

};

$j(document).ready(function() {
    $global.documentReady();
});