//jQuery effects for SR Loyalty
var txtHoverColour = "#3F3F3F";

$(function() {

    //display hover div
    $("div.fadingBtn").show("fast", function() {
        //append the background div
        $(this).append("<div></div>");
        //on link hover
        $(this).children("a").hover(function() {
            //store initial link colour
            if ($(this).attr("rel") == "") {
                $(this).attr("rel", $(this).css("color"));
            }
            //fade in the background
            $(this).parent().children("div")
				.stop()
				.css({ "display": "none", "opacity": "1" })
				.fadeIn(250);
            //fade the colour
            $(this).stop()
				.css({ "color": $(this).attr("rel") })
				.animate({ "color": txtHoverColour }, 250);
        }, function() {
            //fade out the background
            $(this).parent().children("div")
				.stop()
				.fadeOut(550);
            //fade the colour
            $(this).stop()
				.animate({ "color": $(this).attr("rel") }, 550);
        });

    });


    //rollover functionality for class optBox 
    $(".optBox").mouseover(function() {
        $(this).animate({ borderWidth: "3px" }, 100);
    });
    $(".optBox").mouseout(function() {
        $(this).animate({ borderWidth: "1px" }, 100);
    });
});