/* Moving underline under menu */

$(function() {
   
      var $el, leftPos, newWidth,
          $mainNav = $("#menuitem");
   


      $mainNav.append("<li id='underline'></li>");
      var $magicLine = $("#underline");

      if ($(".current_page_item a").position() != null) {
        $magicLine
            .width($(".current_page_item").width())
            .css("left", $(".current_page_item a").position().left)
            .data("origLeft", $magicLine.position().left)
            .data("origWidth", $magicLine.width());
      } else {
        $magicLine
            .css("left", 0)
            .data("origLeft", 0)
            .data("origWidth", 0);
        $magicLine.stop().animate({
            left: $magicLine.data("origLeft"),
            width: $magicLine.data("origWidth")
        });
      }

      $("#menuitem li a").hover(function() {
          $el = $(this);
          leftPos = $el.position().left;
          newWidth = $el.parent().width();
          $magicLine.stop().animate({
              left: leftPos,
              width: newWidth
          });
      }, function() {
          $magicLine.stop().animate({
              left: $magicLine.data("origLeft"),
              width: $magicLine.data("origWidth")
          });
      });

  });

