///////////////////////////////////////////////////////
// The dynamic box effect using javacript and jQuery //
//    All rights (c) 2008 Sword Group IPR            //
//       joao.parreira@sword-soft.com				         //
///////////////////////////////////////////////////////
function iniOBA() {
  // Add the selected LI style to the first li on startup
  $("#obaNavigation li:first-child").addClass("obaLiSelected");

  // Removes the border-bottom from the last LI
  $("#obaNavigation li:last-child").css("border-bottom", "0");

  // Add and remove the class when hover a li 
  $("#obaNavigation li").hover(function() {
    $(this).addClass("obaLiHover");
  }, function() {
    $(this).removeClass("obaLiHover");
  });

  // Gets the id of the nav that was selected then removes the NAV from it hides all the visible divs and then displays the
  // selected one also deals with the selected LI and unselected LI
  $("#obaNavigation li").click(function() {

    //Remove all the classes that may exist on the li
    $("#obaNavigation li").removeClass("obaLiSelected");

    //Change the class to the selected one
    $("#" + this.id).addClass("obaLiSelected");

    // Hide the previous text and show the selected text
    var idToFadeIn = this.id.replace(/Nav/, "");
    $("#obaContainerRight > div:visible").fadeOut("slow", function() {
      $("#" + idToFadeIn).fadeIn("slow");
    });
  });


  $("#alwaysvisible").css("display", "block");
  
}