window.onresize = delayResizeWindow;
//  window.onscroll = delayResizeWindow;


    // Major elements of the page
    var elem0       = "content";                // The 'content' object ID of the page -- a subset of the dAbout-text object
    var elem1       = "dHeadr";                 // The 'dHeadr'          object ID of the page
    var elem2       = "dSvc";                   // The 'dSvc'            object ID of the page
    var elem3       = "id_dTopImg";             // The 'dTopImg'         object ID of the page
    var elem4       = "id_dAbout_examples";     // The 'dAbout-examples' object ID of the page
    var elem5       = "id_dAbout_text";         // The 'dAbout-text'     object ID of the page

    // Minor elements of the page
    var elem6       = "content";            // The 'content' object ID of the page -- a subset of the dAbout-text object
    var elem7       = "svcTxt";             // The 'svcTxt'  object ID of the page -- a subset of the dSvc object

    var viewImg_className = "dImgBody";

    var dBody_ID    = 'dBodyContent';       // ?? This id text string DNE
    var oBottomL    = 'bottomSidesL';       // The object ID of the service bar -- bottom left side
    var oBottomR    = 'bottomSidesR';       // The object ID of the service bar -- bottom rightt side

    var viewportwidth;
    var viewportheight;
    var viewportScrollWidth;
    var viewportScrollHeight;


    var browser=navigator.appName;
    var b_version=navigator.appVersion;
    var version=parseFloat(b_version);

    var BodyWidth_CSS       = 0;
    var scrHt = 0;
    var scrWi = 0;

    var scrollBars          =  [];
    var Ht_index            =   0;
    var Wi_index            =   1;

    var vOffset             =   0;      // top offset of paintings page
    var scrollbarWidth      =   0;

    // ************
    // "Constants"
    // ************
    var scrollbarWidth_WIN_FF   =  20;     // Firefox (which actually presents itself as Netscape)
    var scrollbarWidth_WIN_NS   =  20;     // Netscape

    var scrollbarWidth_MAC_FF   =  14;     // Firefox
    var scrollbarWidth_WIN_IE   =  14;     // Microsoft Internet Explorer
    var scrollbarWidth_MAC_SF   =  14;     // Safari (which actually presents itself as Netscape

    var img_Hoffset             =   3;     // left offset of imgFrameObj (div containing the image)
    var img_Voffset             =  15;     // top offset of imgFrameObj (div containing the image)
    var tblImgFrame_corrF       =  98;     // percentage of table column

    var tableWidth              = 100      // percentage of viewport width
    var imgFrameWidth           =  66      // percentage of table width

    var noOf_bTys               =   4      // Number of body Types (bTyn) for the background color

    var tmr_delayResize         = 500;     // time delay (mS) before adjusting for scroll value
    var saturVal                = 300;     // number of pixels to position element outside of viewport area

    var oBody_top_addit_offset  = 1;
    var oSvc_top_addit_offset   = -2;
    var bodyLeft_margin         = 5;


    // ************
    // Variables
    // ************
    var delayResizeTimer;
    var tmrSvcBar;

    var viewportwidth;
    var viewportheight;
    var updateWindow;
    var imgWi_orig;
    var imgHt_orig;
    var imgAspRat;

    var svcBarHt;
    var svcBarWi;

    var oSvcBar_borderTopWidth;
    var oSvcBar_borderBottomWidth;

    var oBody;                          // object-pointer to dBody
    var oContent;                       // object-pointer to the dContent element -- a subset of the dBody element
    var oSvcBar;                        // object-pointer to dSvcBar




    var OS_type;
    var browser=navigator.appName;
    var b_version=navigator.appVersion;
    var version=parseFloat(b_version);

    OS_pos = b_version.indexOf('(');
    OS_end = b_version.indexOf(';');

    if (b_version.substring((OS_pos+1), OS_end) != 'compatible') {
        OS_type = b_version.substring((OS_pos+1), OS_end);

    } else {
        if (b_version.indexOf("Windows" >= 0)) {
            OS_type = 'Windows';
        }
    }

    switch (OS_type) {
        case "Windows"   : 
            switch (browser) {
                case "Netscape" :
                    scrollbarWidth = scrollbarWidth_WIN_FF;
                    break;

                case "Microsoft Internet Explorer" :
                default         :
                    scrollbarWidth = scrollbarWidth_WIN_IE;
                    break;
            }
            break;
                
        case "Macintosh" :
            switch (browser) {
                case "Microsoft Internet Explorer" :
                    scrollbarWidth = scrollbarWidth_MAC_IE;
                    break;

                case "Safari"   :
                case "Firefox"  :
                case "Netscape" :

                default         :
                    scrollbarWidth = scrollbarWidth_MAC_FF;
                    dBody_ID       = 'dBody_NS';
                    break;
            }
            break;

       default:
            scrollbarWidth = 0;
            break;
    }


    // *********************************************
    // *********************************************
    function getInnerSize() {
   
        // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
 
        if (typeof window.innerWidth != 'undefined') {
            viewportwidth = window.innerWidth;
            viewportheight = window.innerHeight
        }
 
        // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
        else if (typeof document.documentElement != 'undefined'  && typeof document.documentElement.clientWidth != 'undefined' && document.documentElement.clientWidth != 0)
        {
            viewportwidth        = document.documentElement.clientWidth;
            viewportheight       = document.documentElement.clientHeight

        // older versions of IE
        } else {
            viewportwidth        = document.getElementsByTagName('body')[0].clientWidth;
            viewportheight       = document.getElementsByTagName('body')[0].clientHeight
        }

        // * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
        // from: http://www.jr.pl/www.quirksmode.org/viewport/compatibility.html
        // * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
        var test1 = document.body.scrollHeight;
        var test2 = document.body.offsetHeight;

        if (test1 > test2) { // all but Explorer Mac
            viewportScrollHeight = document.body.scrollHeight;
        } else {  // Explorer Mac;
            //would also work in Explorer 6 Strict, Mozilla and Safari
            viewportScrollHeight = document.body.offsetHeight;
        }


        if (test1 > test2) { // all but Explorer Mac
            viewportScrollWidth  = document.body.scrollWidth;
        } else {  // Explorer Mac;
            //would also work in Explorer 6 Strict, Mozilla and Safari
            viewportScrollWidth  = document.body.offsetWidth;
        }

//      return [viewportwidth, viewportheight];

        return;
    }

    // ********************************************************************
    // From:
    //     http://www.howtocreate.co.uk/tutorials/javascript/browserwindow
    // ********************************************************************
    function getScrollXY() {
        var scrOfX = 0
        var scrOfY = 0;

        if( typeof( window.pageYOffset ) == 'number' ) {
            //Netscape compliant
            scrOfY = window.pageYOffset;
            scrOfX = window.pageXOffset;

        } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
            //DOM compliant
            scrOfY = document.body.scrollTop;
            scrOfX = document.body.scrollLeft;

        } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
            //IE6 standards compliant mode
            scrOfY = document.documentElement.scrollTop;
            scrOfX = document.documentElement.scrollLeft;
        }

      return [ scrOfX, scrOfY ];
    }


    // *********************************************
    // *********************************************
    function scrollAndResizeWindow() {
        scrollWindow();

        // * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
        // There appears to be a 'settling time' for IE (5.5) after setting the placement of the various page objects and,
        //  since the measured page height has probably changed since placing the service bar (ie, the horiz scroll bar is gone, 
        //  need to go again and (re)caculate and position the page objects.  The timer value is based on only a little empirical data.
        // * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

        tmr_scrollWindow = window.setTimeout("scrollWindow()", 100)
    }


    // **************************************************
    // Algorithm: 
    //         Determine the header height (ie. nav bar)
    //         Determine the service bar height at bottom
    //             (incl end caps & img gradients)
    //         Calculate body height 
    //               (viewport height-headerHt-SvcBarHt)
    //            set body height
    //         Calculate content height (bodyHt * calib valu)
    // **************************************************
    function scrollWindow() {

        // Retreive scroll offset
        scroll_Offset     = getScrollXY();
        scroll_X_Offset   = scroll_Offset[0];
        scroll_Y_Offset   = scroll_Offset[1];

        // * * * * * * * * * * * * * * * * * * * * * * * * *
        // Get height of elem1 for positioning body element
        // * * * * * * * * * * * * * * * * * * * * * * * * *
        if (document.getElementById(elem1)) {
            oHeadr                       = document.getElementById(elem1);        // the header element (incl navigation bar) at top

            // Retrieve the border property of elem1
            try {
                oHeadr_borderTopWidth    = parseInt( getComputedStyle(oHeadr, '').borderTopWidth );
                oHeadr_borderBottomWidth = parseInt( getComputedStyle(oHeadr, '').borderBottomWidth );

            } catch(e) {
                oHeadr_borderTopWidth    = parseInt( oHeadr.currentStyle.borderTopWidth );
                oHeadr_borderBottomWidth = parseInt( oHeadr.currentStyle.borderTopWidth );
            }        

            // * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
            // Determine if top/bottom border are undefined. If so, set running vars for each equal to 0
            // * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

            if (oHeadr_borderTopWidth == 'undefined' ) {
                oHeadr_borderTopWidth    = 0;            
            }

            if (oHeadr_borderBottomWidth == 'undefined' ) {
                oHeadr_borderBottomWidth = 0;            
            }

            oHeadrHt          = ( parseInt(oHeadr.offsetHeight) + parseInt(oHeadr_borderTopWidth) + parseInt(oHeadr_borderBottomWidth) );
            oHeadr_offsetTop  = oHeadr.offsetTop;

//          oElem1.style.top  = scroll_Y_Offset + vOffset + "px";   //  Not used since fixing the nav bar (ie allowing body content to overflow 'auto')

        } else {   // header / nav bar is not included
            oHeadrHt          = 0;
            oHeadr_offsetTop  = 0;
        }            

        // * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
        // Size the service bar end cap height in case center text has changed
        // * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

        oSvcTxt            = document.getElementById(elem7);      // svcTxt is the text in the center of the service bar
        oBotSd_L           = document.getElementById(oBottomL);
        oBotSd_R           = document.getElementById(oBottomR);

        if (oSvcTxt) {
//          svcTxt_Ht          = oSvcTxt.scrollHeight;
            svcTxt_Ht          = oSvcTxt.offsetHeight;

            // * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
            //  Set height of side gradient imgs of svc bar if svc text line-wraps
            // * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
            oBotSd_L.height    = svcTxt_Ht + 4;
            oBotSd_R.height    = svcTxt_Ht + 4;
        }

        oSvcBar           = document.getElementById(elem2);

        if (oSvcBar) {
            // Retrieve the border property of elem2
            try {
                var oSvcBar_borderTopWidth    = parseInt( getComputedStyle(oSvcBar, '').borderTopWidth );
                var oSvcBar_borderBottomWidth = parseInt( getComputedStyle(oSvcBar, '').borderBottomWidth );

            } catch(e) {
                var oSvcBar_borderTopWidth    = parseInt( oSvcBar.currentStyle.borderTopWidth );
                var oSvcBar_borderBottomWidth = parseInt( oSvcBar.currentStyle.borderBottomWidth );
            }        

            if (oSvcBar_borderTopWidth == 'undefined' ) {
                oSvcBar_borderTopWidth    = 0;            
            }
        
            if (oSvcBar_borderBottomWidth == 'undefined' ) {
                oSvcBar_borderBottomWidth = 0;            
            }

            svcBarHt           = ( parseInt(oSvcBar.offsetHeight) + parseInt(oSvcBar_borderTopWidth) + parseInt(oSvcBar_borderBottomWidth) );
            svcBarWi           = oSvcBar.offsetWidth;

        } else {  // svcBar does not exist (e.g. viewImg.php)
            svcBarHt           = 0;
            svcBarWi           = 0;
        }

        getInnerSize();

        // Determine the id of the dBody element ('bTy' + n) & get a pointer to it.
        dBody_bTy_found = false;
        oBody = null;
        x = 1;
        while ( (!dBody_bTy_found) && (x <= noOf_bTys) ) {
            elt = 'bTy' + x;
            if (document.getElementById(elt) != null) {
                oBody           = document.getElementById(elt);
                dBody_bTy_found = true;

            } else { 
//              alert (elt + ' is not available');
                x++;
            }
        }

//      if (oBody == null) {
//          alert('oBody not found');
//      }
        
        // * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
        // Calculate body height = f(oHeadr_offsetTop, oHeadrHt, oBody_top_addit_offset)
        // * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
        if ( (oBody) && (oBody.className != viewImg_className) ) {

            oBody.style.top    = oHeadr_offsetTop + oHeadrHt + oBody_top_addit_offset - 1 + "px";               //  0px
            oBody.style.left   = bodyLeft_margin + 'px';
            calcBodyHt         = (viewportheight - oHeadrHt - svcBarHt + oSvc_top_addit_offset);
            oBody.style.height = ( (calcBodyHt >= 0) ? calcBodyHt : 0 ) + "px";                                 // -1px

            if ( elt != 'bTy2' ) {  // ie. if NOT slide show, set width accordingly
                oBody.style.width  = viewportwidth - scrollbarWidth - 0 + "px";                                // -5px

            } else { // this IS slide show
////            oBody.style.width  = viewportwidth - 01 + "px";
            }
        }

        o_tblAbout = '';
        tableWidth_calc = 0;
        o_tblAbout_Wi   = 0;


        // Assign pointer to elem0 ('content' element), and set the width
        if (document.getElementById(elem0)) {

            o_dContent       = document.getElementById(elem0);
//          o_dContent_width = o_dContent.offsetWidth;

            o_dContent.style.width = oBody.offsetWidth - (scrollbarWidth * ContentWidth_Factor) - ContentWidth_Constant + "px";
        }


        // Assign pointer to elem4 ('about_examples' element), if it exists, and get the width
        if (document.getElementById(elem4)) {
            o_dAbout_examples       = document.getElementById(elem4);
        }




        if (oSvcBar) {
            // * * * * * * * * * * * * * * * * * * * * * * * * *
            // Position elem2 vertically (at the bottom)
            // * * * * * * * * * * * * * * * * * * * * * * * * *
            oSvcBar.style.top  = (viewportheight + scroll_Y_Offset - svcBarHt + oSvc_top_addit_offset) + "px";     // FF does not adj viewport size for (horiz) scrollbar
            oSvcBar.style.left = 0 + "px";

//          tmrReposSvcBar = window.setTimeout("scrollWindow()", 500)

        }  // end if(oSvcBar)

        return false;
    }


    // *********************************************
    // *********************************************
    function delayResizeWindow() {
        window.clearTimeout(delayResizeTimer);
        delayResizeTimer = window.setTimeout("scrollAndResizeWindow()", tmr_delayResize);      // set timer to delay repositioning element while scrolling or resizing
    }