$(document).ready(function() {
    var up = "/images/siteImages/arrow_up.gif";
    var down = "/images/siteImages/arrow_down.gif";
    var cssObj1 = {
        'background-color': '#f0f0f0',
        'color': 'Black'
    }
    var cssObj2 = {
        'background-color': '#d0e1f1',
        'color': '#5A95CB;'
    }
    //hide the all of the element with class msg_body
    $(".faqContent").hide();

    $(".chosenFaqTitle").next(".chosenFaqContent").slideToggle(600);

    //toggle the componenet with class msg_body
    $(".faqTitle").click(function() {
        $(this).next(".faqContent").slideToggle(600);
        $(this).children('.faqArrow').children('.arrow').attr("src", $(this).children('.faqArrow').children('.arrow').attr("src") == up ? down : up);
        if ($(this).css("backgroundColor") == '#d0e1f1' || $(this).css("backgroundColor") == "rgb(208, 225, 241)") {
            $(this).css(cssObj1);
        }
        else {
            $(this).css(cssObj2);
        }
    });

    $(".chosenFaqTitle").click(function() {
        $(this).next(".chosenFaqContent").slideToggle(600);
        $(this).children('.faqArrow').children('.arrow').attr("src", $(this).children('.faqArrow').children('.arrow').attr("src") == up ? down : up);
        if ($(this).css("backgroundColor") == '#d0e1f1' || $(this).css("backgroundColor") == "rgb(208, 225, 241)") {
            $(this).css(cssObj1);
        }
        else {
            $(this).css(cssObj2);
        }
    });

    $(".tipatHalavDetail").hover(
        function() {
            $(this).css("backgroundColor", "#cee0ee");
            $(this).next(".tipatHalavDetail").css("backgroundColor", "#cee0ee");
            $(this).prev(".tipatHalavDetail").css("backgroundColor", "#cee0ee");
            $(this).next(".tipatHalavDetail").next(".tipatHalavDetail").css("backgroundColor", "#cee0ee");
            $(this).prev(".tipatHalavDetail").prev(".tipatHalavDetail").css("backgroundColor", "#cee0ee");
        },
        function() {
            $(this).css("backgroundColor", "#e2e1df");
            $(this).next(".tipatHalavDetail").css("backgroundColor", "#e2e1df");
            $(this).prev(".tipatHalavDetail").css("backgroundColor", "#e2e1df");
            $(this).next(".tipatHalavDetail").next(".tipatHalavDetail").css("backgroundColor", "#e2e1df");
            $(this).prev(".tipatHalavDetail").prev(".tipatHalavDetail").css("backgroundColor", "#e2e1df");
            
            
        }
    );
});