function showLayer(layer) {
		// Show the selected layer
        document.getElementById(layer).style.display = "block";
	}
		
	function hideLayer(layer) {
		document.getElementById(layer).style.display = "none";
	}

    var dragObj = new Object();
    dragObj.zIndex = 0;
    
    function dragStart(event, id) {
        var el, x, y;

        // If an element id was given, find it. Otherwise use the element being clicked on.
        if (id){
              dragObj.elNode = document.getElementById(id);
        }
        else {
              dragObj.elNode = window.event.srcElement;

              // If this is a text node, use its parent element.
              if (dragObj.elNode.nodeType == 3)
              dragObj.elNode = dragObj.elNode.parentNode;
        }

        if (dragObj.elNode.tagName != "INPUT" && dragObj.elNode.tagName != "TEXTAREA" && dragObj.elNode.tagName != "SELECT"){
              while(dragObj.elNode.tagName != "DIV"){
                    dragObj.elNode = dragObj.elNode.parentNode;
              }             

              // Get cursor position with respect to the page.
              x = window.event.clientX + document.documentElement.scrollLeft + document.body.scrollLeft;
              y = window.event.clientY + document.documentElement.scrollTop + document.body.scrollTop;

              // Save starting positions of cursor and element.
              dragObj.cursorStartX = x;
              dragObj.cursorStartY = y;
              dragObj.elStartLeft  = parseInt(dragObj.elNode.style.left, 10);
              dragObj.elStartTop   = parseInt(dragObj.elNode.style.top,  10);

              if (isNaN(dragObj.elStartLeft)){
                    dragObj.elStartLeft = 0;
              }

              if (isNaN(dragObj.elStartTop)){
                    dragObj.elStartTop  = 0;
              }

              // Update element's z-index.
              dragObj.elNode.style.zIndex = ++dragObj.zIndex;

              // Capture mousemove and mouseup events on the page.
              document.attachEvent("onmousemove", dragGo);
              document.attachEvent("onmouseup",   dragStop);
              window.event.cancelBubble = true;
              window.event.returnValue = false;
        }
    }

    function dragGo(event) {
        var x, y;

        // Get cursor position with respect to the page.
        x = window.event.clientX + document.documentElement.scrollLeft + document.body.scrollLeft;
        y = window.event.clientY + document.documentElement.scrollTop + document.body.scrollTop;

        // Move drag element by the same amount the cursor has moved.
        dragObj.elNode.style.left = (dragObj.elStartLeft + x - dragObj.cursorStartX) + "px";
        dragObj.elNode.style.top  = (dragObj.elStartTop  + y - dragObj.cursorStartY) + "px";
        window.event.cancelBubble = true;
        window.event.returnValue = false;                             
    }

    function dragStop(event) {
        // Stop capturing mousemove and mouseup events.
        document.detachEvent("onmousemove", dragGo);
        document.detachEvent("onmouseup",   dragStop);
    }