    var isCSS, isW3C, isIE4, isNN4, isIE6CSS;
    function initDHTMLAPI()
     {
      if (document.images)
       {
        isCSS = (document.body && document.body.style) ? true : false;
        isW3C = (isCSS && document.getElementById) ? true : false;
        isIE4 = (isCSS && document.all) ? true : false;
        isNN4 = (document.layers) ? true : false;
        isIE6CSS = (document.compatMode && document.compatMode.indexOf("CSS1") >= 0) ? true : false;
       }
     }
    window.onload = initDHTMLAPI;
    function seekLayer(doc, name)
     {
      var theObj;
      for (var i = 0; i < doc.layers.length; i++)
        {
         if (doc.layers[i].name == name)
          {
           theObj = doc.layers[i];
           break;
          }
         if (doc.layers[i].document.layers.length > 0)
          {
           theObj = seekLayer(document.layers[i].document, name);
          }
        }
      return theObj;
     }
    function getRawObject(obj)
     {
      var theObj;
      if (typeof obj == "string")
       {
        if (isW3C)
         {
          theObj = document.getElementById(obj);
         }
        else if (isIE4)
         {
          theObj = document.all(obj);
         }
        else if (isNN4)
         {
          theObj = seekLayer(document, obj);
         }
       }
      else
       {
        theObj = obj;
       }
      return theObj;
     }
    function getObject(obj)
     {
      var theObj = getRawObject(obj);
      if (theObj && isCSS)
       {
        theObj = theObj.style;
       }
      return theObj;
     }
    function shiftTo(obj, x, y)
     {
      var theObj = getObject(obj);
      if (theObj)
       {
        if (isCSS)
         {
          var units = (typeof theObj.left == "string") ? "px" : 0
          theObj.left = x + units;
          theObj.top = y + units;
         }
        else if (isNN4)
         {
           theObj.moveTo(x,y)
         }
       }
     }
    function shiftBy(obj, deltaX, deltaY)
     {
      var theObj = getObject(obj);
      if (theObj)
       {
        if (isCSS)
         {
          var units = (typeof theObj.left == "string") ? "px" : 0
          theObj.left = getObjectLeft(obj) + deltaX + units;
          theObj.top = getObjectTop(obj) + deltaY + units;
         }
        else if (isNN4)
         {
           theObj.moveBy(deltaX, deltaY);
         }
       }
     }
    function setZIndex(obj, zOrder)
     {
      var theObj = getObject(obj);
      if (theObj)
       {
        theObj.zIndex = zOrder;
       }
     }
    function setBGColor(obj, color)
     {
      var theObj = getObject(obj);
      if (theObj)
       {
        if (isNN4)
         {
          theObj.bgColor = color;
         }
        else if (isCSS)
         {
          theObj.backgroundColor = color;
         }
       }
     }
    function show(obj)
     {
      var theObj = getObject(obj);
      if (theObj)
       {
        theObj.visibility = "visible";
       }
     }
    function hide(obj)
     {
      var theObj = getObject(obj);
      if (theObj)
       {
        theObj.visibility = "hidden";
       }
     }
    function getObjectLeft(obj)
     {
      var elem = getRawObject(obj);
      var result = 0;
      if (document.defaultView)
       {
        var style = document.defaultView;
        var cssDecl = style.getComputedStyle(elem, "");
        result = cssDecl.getPropertyValue("left");
       }
      else if (elem.currentStyle)
            {
             result = elem.currentStyle.left;
            }
          else if (elem.style)
                {
                 result = elem.style.left;
                }
               else if (isNN4)
                {
                 result = elem.left;
     }
      return parseInt(result);
        }
    function getObjectTop(obj)
     {
      var elem = getRawObject(obj);
      var result = 0;
      if (document.defaultView)
       {
        var style = document.defaultView;
        var cssDecl = style.getComputedStyle(elem, "");
        result = cssDecl.getPropertyValue("top");
       }
      else if (elem.currentStyle)
            {
              result = elem.currentStyle.top;
            }
           else if (elem.style)
                 {
                  result = elem.style.top;
                 }
                else if (isNN4)
                 {
                  result = elem.top;
                 }
      return parseInt(result);
     }
    function getObjectWidth(obj)
     {
      var elem = getRawObject(obj);
      var result = 0;
      if (elem.offsetWidth)
       {
         result = elem.offsetWidth;
       }
      else if (elem.clip && elem.clip.width)
            {
             result = elem.clip.width;
            }
           else if (elem.style && elem.style.pixelWidth)
            {
             result = elem.style.pixelWidth;
            }
      return parseInt(result);
     }
    function getObjectHeight(obj)
     {
      var elem = getRawObject(obj);
      var result = 0;
      if (elem.offsetHeight)
       {
        result = elem.offsetHeight;
       }
      else if (elem.clip && elem.clip.height)
            {
             result = elem.clip.height;
            }
           else if (elem.style && elem.style.pixelHeight)
                 {
                  result = elem.style.pixelHeight;
                 }
      return parseInt(result);
     }
    function getInsideWindowWidth()
     {
      if (window.innerWidth)
       {
        return window.innerWidth;
       }
      else if (isIE6CSS)
            {
             return document.body.parentElement.clientWidth
            }
           else if (document.body && document.body.clientWidth)
                 {
                  return document.body.clientWidth;
                 }
      return 0;
     }
    function getInsideWindowHeight()
     {
      if (window.innerHeight)
       {
        return window.innerHeight;
       }
      else if (isIE6CSS)
            {
             return document.body.parentElement.clientHeight
            }
           else if (document.body && document.body.clientHeight)
                 {
                  return document.body.clientHeight;
                 }
      return 0;
     }
      var scrollEngaged = false;
      var scrollInterval;
      var scrollBars = new Array();
      function getElementStyle(elemID, IEStyleAttr, CSSStyleAttr)
       {
        var elem = document.getElementById(elemID);
        if (elem.currentStyle)
         {
          return elem.currentStyle[IEStyleAttr];
         }
        else if (window.getComputedStyle)
              {
               var compStyle = window.getComputedStyle(elem, "");
               return compStyle.getPropertyValue(CSSStyleAttr);
              }
        return "";
       }
      function scrollBar(rootID, ownerID, ownerContentID)
       {
        this.rootID = rootID;
        this.ownerID = ownerID;
        this.ownerContentID = ownerContentID;
        this.index = scrollBars.length;
        this.rootElem = document.getElementById(rootID);
        this.ownerElem = document.getElementById(ownerID);
        this.contentElem = document.getElementById(ownerContentID);
        this.ownerHeight = parseInt(getElementStyle(ownerID, "height", "height"));
        this.ownerWidth = parseInt(getElementStyle(ownerID, "width", "width"));
        this.ownerBorder = parseInt(getElementStyle(ownerID, "borderTopWidth", "border-top-width")) * 2;
        this.contentHeight = Math.abs(parseInt(this.contentElem.offsetHeight));
        this.contentWidth = this.contentElem.offsetWidth;
        this.contentFontSize = parseInt(getElementStyle(this.ownerContentID, "fontSize", "font-size"));
        this.contentScrollHeight = this.contentElem.scrollHeight;
        this.quirks = {on:false, ownerBorder:0, scrollBorder:0, contentPadding:0};
        if (navigator.appName == "Microsoft Internet Explorer" && navigator.userAgent.indexOf("Win") != -1 && (typeof document.compatMode == "undefined" || document.compatMode == "BackCompat"))
         {
          this.quirks.on = true;
          this.quirks.ownerBorder = this.ownerBorder;
          this.quirks.contentPadding = parseInt(getElementStyle(ownerContentID, "padding", "padding"));
         }
        this.scrollWrapper = null;
        this.upButton = null;
        this.dnButton = null;
        this.thumb = null;
        this.buttonLength = 0;
        this.thumbLength = 0;
        this.scrollWrapperLength = 0
        this.dragZone = {left:0, top:0, right:0, bottom:0}
        this.appendScroll = appendScrollBar;
       }
      function appendScrollBar(imgLineup,imgLinedn,imgThumb,bgScroll,prefix)
       {
        var imgH = 16;
        var imgW = 17;
        var thumbH = 44;
        var lineup = document.createElement("img");
        lineup.id = prefix + "lineup" + (scrollBars.length - 1);
        lineup.className = "lineup";
        lineup.index = this.index;
        lineup.src = imgLineup;
        lineup.height = imgH;
        lineup.width = imgW;
        lineup.alt = "Scroll Up";
        lineup.style.position = "absolute";
        lineup.style.top = "0px";
        lineup.style.left = "0px";
        var wrapper = document.createElement("div");
        wrapper.id = prefix + "scrollWrapper" + (scrollBars.length - 1);
        wrapper.className = "scrollWrapper";
        wrapper.index = this.index;
        wrapper.style.position = "absolute";
        wrapper.style.visibility = "hidden";
        wrapper.style.top = "0px";
        wrapper.style.left = this.ownerWidth + this.ownerBorder - this.quirks.ownerBorder + "px";
        wrapper.style.borderTop = "0px solid #edaee8";
        wrapper.style.borderLeft = "0px solid #edaee8";
        wrapper.style.borderRight= "0px solid #edaee8";
        wrapper.style.borderBottom= "0px solid #edaee8";
        wrapper.style.backgroundColor = bgScroll;
        if (this.quirks.on)
         {
          this.quirks.scrollBorder = 2;
         }
        wrapper.style.width = lineup.width + (this.quirks.scrollBorder * 2) + "px";
        wrapper.style.height = this.ownerHeight + (this.ownerBorder - 0) - (this.quirks.scrollBorder * 2) + "px";
        var linedn = document.createElement("img");
        linedn.id = prefix + "linedown" + (scrollBars.length - 1);
        linedn.className = "linedown";
        linedn.index = this.index;
        linedn.src = imgLinedn;
        linedn.height = imgH;
        linedn.width = imgW;
        linedn.alt = "Scroll Down";
        linedn.style.position = "absolute";
        linedn.style.top = parseInt(this.ownerHeight) + (this.ownerBorder - 0) - (this.quirks.ownerBorder) - linedn.height + "px";
        linedn.style.left = "0px";
        var thumb = document.createElement("img");
        thumb.id = prefix + "thumb" + (scrollBars.length - 1);
        thumb.index = this.index;
        thumb.src = imgThumb;
        thumb.height = thumbH;
        thumb.width = imgW;
        thumb.alt = "Scroll Dragger";
        thumb.style.position = "absolute";
        thumb.style.top = lineup.height + "px";
        thumb.style.width = imgW + "px";
        thumb.style.height = thumbH + "px";
        thumb.style.left = "0px";
        this.upButton = wrapper.appendChild(lineup);
        this.thumb = wrapper.appendChild(thumb);
        this.dnButton = wrapper.appendChild(linedn);
        this.scrollWrapper = this.rootElem.appendChild(wrapper);
        this.buttonLength = imgW;
        this.thumbLength = thumbH;
        this.scrollWrapperLength = parseInt(getElementStyle(this.scrollWrapper.id, "height", "height"));
        this.dragZone.left = 0;
        this.dragZone.top = imgH;
        this.dragZone.right = imgW;
        this.dragZone.bottom = this.scrollWrapperLength - this.buttonLength - (this.quirks.scrollBorder * 2)
        this.scrollWrapper.onmousedown = handleScrollClick;
        this.scrollWrapper.onmouseup = handleScrollStop;
        this.scrollWrapper.oncontextmenu = blockEvent;
        this.scrollWrapper.ondrag = blockEvent;
        this.scrollWrapper.style.visibility = "visible";
       }
      function handleScrollStop()
       {
        scrollEngaged = false;
       }
      function blockEvent(evt)
       {
        evt = (evt) ? evt : event;
        evt.cancelBubble = true;
        return false;
       }
      function handleScrollClick(evt)
       {
        var fontSize, contentHeight;
        evt = (evt) ? evt : event;
        var target = (evt.target) ? evt.target : evt.srcElement;
        target = (target.nodeType == 3) ? target.parentNode : target;
        var index = target.index;
        fontSize = scrollBars[index].contentFontSize;
        if (scrollBars[index].ownerHeight < scrollBars[index].contentHeight)
        {
        switch (target.className)
         {
          case "lineup" :
                    scrollEngaged = true;
                    scrollBy(index, parseInt(fontSize));
                    scrollInterval = setInterval("scrollBy(" + index + ", " + parseInt(fontSize) + ")", 100);
                    evt.cancelBubble = true;
                    return false;
                    break;
          case "linedown" :
                    scrollEngaged = true;
                    scrollBy(index, -(parseInt(fontSize)));
                    scrollInterval = setInterval("scrollBy(" + index + ", -" + parseInt(fontSize) + ")", 100);
                    evt.cancelBubble = true;
                    return false;
                    break;
          case "scrollWrapper" :
                    scrollEngaged = true;
                    var evtY = (evt.offsetY) ? evt.offsetY : ((evt.layerY) ? evt.layerY : -1);
                    if (evtY >= 0)
                     {
                      var pageSize = scrollBars[index].ownerHeight - fontSize;
                      var thumbElemStyle = scrollBars[index].thumb.style;
                      if (evtY > (parseInt(thumbElemStyle.top) + scrollBars[index].thumbLength))
                       {
                        pageSize = -pageSize;
                       }
                      scrollBy(index, pageSize);
                      scrollInterval = setInterval("scrollBy(" + index + ", " + pageSize + ")", 100);
                      evt.cancelBubble = true;
                      return false;
                     }
         }
         }
        return false;
       }
      function scrollBy(index, px)
       {
        var scroller = scrollBars[index];
        var elem = document.getElementById(scroller.ownerContentID);
        var top = parseInt(elem.style.top);
        var scrollHeight = parseInt(elem.scrollHeight);
        var height = scroller.ownerHeight;
        if (scrollEngaged && top + px >= -scrollHeight + height && top + px <= 0)
         {
          shiftBy(elem, 0, px);
          updateThumb(index);
         }
        else if (top + px < -scrollHeight + height)
              {
               shiftTo(elem, 0, -scrollHeight + height - scroller.quirks.contentPadding);
               updateThumb(index);
               clearInterval(scrollInterval);
              }
             else if (top + px > 0)
                   {
                    shiftTo(elem, 0, 0);
                    updateThumb(index);
                    clearInterval(scrollInterval);
                   }
                  else
                   {
                    clearInterval(scrollInterval);
                   }
       }
      function updateThumb(index)
       {
        var scroll = scrollBars[index];
        var barLength = scroll.scrollWrapperLength - (scroll.quirks.scrollBorder * 2);
        var buttonLength = scroll.buttonLength;
        barLength -= buttonLength * 2;
        var docElem = scroll.contentElem;
        var docTop = Math.abs(parseInt(docElem.style.top));
        var scrollFactor = docTop/(scroll.contentScrollHeight - scroll.ownerHeight);
        shiftTo(scroll.thumb, 0, Math.round((barLength - scroll.thumbLength) * scrollFactor) + buttonLength);
       }
      function updateScroll()
       {
        var index = selectedObj.index;
        var scroller = scrollBars[index];
        var barLength = scroller.scrollWrapperLength - (scroller.quirks.scrollBorder * 2);
        var buttonLength = scroller.buttonLength;
        var thumbLength = scroller.thumbLength;
        var wellTop = buttonLength;
        var wellBottom = barLength - buttonLength - thumbLength;
        var wellSize = wellBottom - wellTop;
        var thumbTop = parseInt(getElementStyle(scroller.thumb.id, "top", "top"));
        var scrollFactor = (thumbTop - buttonLength)/wellSize;
        var docElem = scroller.contentElem;
        var docTop = Math.abs(parseInt(docElem.style.top));
        var scrollHeight = scroller.contentScrollHeight;
        var height = scroller.ownerHeight;
        shiftTo(scroller.ownerContentID, 0, -(Math.round((scrollHeight - height) * scrollFactor)));
       }
      var selectedObj;
      var offsetX, offsetY;
      var zone = {left:0, top:16, right:16, bottom:88};
      function setSelectedElem(evt)
       {
        var target = (evt.target) ? evt.target : evt.srcElement;
        target = (target.nodeType && target.nodeType == 3) ? target.parentNode : target;
        var divID = (target.id.indexOf("thumb") != -1) ? target.id : "";
        if (divID)
         {
          if (document.layers)
           {
            selectedObj = document.layers[divID];
           }
          else if (document.all)
                {
                 selectedObj = document.all(divID);
                }
               else if (document.getElementById)
                     {
                      selectedObj = document.getElementById(divID);
                     }
          setZIndex(selectedObj, 100);
          return;
         }
        selectedObj = null;
        return;
       }
      function dragIt(evt)
       {
        evt = (evt) ? evt : event;
        var x, y, width, height;
        if (selectedObj)
         {
          if (evt.pageX)
           {
            x = evt.pageX - offsetX;
            y = evt.pageY - offsetY;
           }
          else if (evt.clientX || evt.clientY)
                {
                 x = evt.clientX - offsetX;
                 y = evt.clientY - offsetY;
                }
          var index = selectedObj.index;
          var scroller = scrollBars[index];
          var zone = scroller.dragZone;
          width = scroller.thumb.width;
          height = scroller.thumb.height;
          x = (x < zone.left) ? zone.left : ((x + width > zone.right) ? zone.right - width : x);
          y = (y < zone.top) ? zone.top : ((y + height > zone.bottom) ? zone.bottom - height : y);
          shiftTo(selectedObj, x, y);
          updateScroll();
          evt.cancelBubble = true;
          return false;
         }
       }
      function engage(evt)
       {
        evt = (evt) ? evt : event;
        setSelectedElem(evt);
        if (selectedObj)
         {
          if (document.body && document.body.setCapture)
           {
            document.body.setCapture();
           }
          if (evt.pageX)
           {
            offsetX = evt.pageX - ((typeof selectedObj.offsetLeft != "undefined") ? selectedObj.offsetLeft : selectedObj.left);
            offsetY = evt.pageY - ((selectedObj.offsetTop) ? selectedObj.offsetTop : selectedObj.top);
           }
          else if (typeof evt.clientX != "undefined")
                {
                 offsetX = evt.clientX - ((selectedObj.offsetLeft) ? selectedObj.offsetLeft : 0);
                 offsetY = evt.clientY - ((selectedObj.offsetTop) ? selectedObj.offsetTop : 0);
                }
          return false;
         }
       }
      function release(evt)
       {
        if (selectedObj)
         {
          setZIndex(selectedObj, 0);
          if (document.body && document.body.releaseCapture)
           {
            document.body.releaseCapture();
           }
          selectedObj = null;
         }
       }
      function initDrag()
       {
        if (document.layers)
         {
          document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP);
          return;
         }
        else if (document.body & document.body.addEventListener)
              {
               document.addEventListener("mousedown", engage, true);
               document.addEventListener("mousemove", dragIt, true);
               document.addEventListener("mouseup", release, true);
               return;
              }
        document.onmousedown = engage;
        document.onmousemove = dragIt;
        document.onmouseup = release;
        return;
       }

    function initScrollbars(psWin, outWrap, inWrap, pic1, pic2, pic3, bg, item, pref)
     {
      scrollBars[item] = new scrollBar(psWin, outWrap, inWrap);
      scrollBars[item].appendScroll(pic1,pic2,pic3,bg, pref);
     }

