function DropMenu1(id) {

    /* Type of the menu: "horizontal" or "vertical" */
    this.type = "horizontal";

    /* Delay (in miliseconds >= 0): show-hide menu */
    this.delay = {
        "show": 0,
        "hide": 300
    }
    /* Change the default position of sub-menu by Y pixels from top and X pixels from left
     * Negative values are allowed */
    this.position = {
        "top": 0,
        "left": 0
    }
    /* Z-index property for .section */
    this.zIndex = {
        "visible": 1,
        "hidden": -1
    };

    // Browser detection
    this.browser = {
        "ie": Boolean(document.body.currentStyle),
        "ie5": (navigator.appVersion.indexOf("MSIE 5.5") != -1 || navigator.appVersion.indexOf("MSIE 5.0") != -1)
    };
    if (!this.browser.ie) { this.browser.ie5 = false; }

    /* Initialize the menu */
    this.init = function() {
        if (!document.getElementById(this.id)) { return alert("DropMenu1.init() failed. Element '"+ this.id +"' does not exist."); }
        if (this.type != "horizontal" && this.type != "vertical") { return alert("DropMenu1.init() failed. Unknown menu type: '"+this.type+"'"); }
        if (this.browser.ie && this.browser.ie5) { fixWrap(); }
        fixSections();
        parse(document.getElementById(this.id).childNodes, this.tree, this.id);
    }

    /* Search for .section elements and set width for them */
    function fixSections() {
        var arr = document.getElementById(self.id).getElementsByTagName("div");
        var sections = new Array();
        var widths = new Array();

        for (var i = 0; i < arr.length; i++) {
            if (arr[i].className == "section") {
                sections.push(arr[i]);
            }
        }
        for (var i = 0; i < sections.length; i++) {
            widths.push(getMaxWidth(sections[i].childNodes));
        }
        for (var i = 0; i < sections.length; i++) {
            sections[i].style.width = (widths[i]) + "px";
        }
        if (self.browser.ie) {
            for (var i = 0; i < sections.length; i++) {
                setMaxWidth(sections[i].childNodes, widths[i]);
            }
        }
    }

    function fixWrap() {
        var elements = document.getElementById(self.id).getElementsByTagName("a");
        for (var i = 0; i < elements.length; i++) {
            if (/item2/.test(elements[i].className)) {
                elements[i].innerHTML = '<div nowrap="nowrap">'+elements[i].innerHTML+'</div>';
            }
        }
    }

    /* Search for an element with highest width among given nodes, return that width */
    function getMaxWidth(nodes) {
        var maxWidth = 0;
        for (var i = 0; i < nodes.length; i++) {
            if (nodes[i].nodeType != 1) { continue; }
            if (nodes[i].offsetWidth > maxWidth) { maxWidth = nodes[i].offsetWidth; }
        }
        return maxWidth;
    }

    /* Set width for item2 elements */
    function setMaxWidth(nodes, maxWidth) {
        for (var i = 0; i < nodes.length; i++) {
            if (nodes[i].nodeType == 1 && /item2/.test(nodes[i].className) && nodes[i].currentStyle) {
                if (self.browser.ie5) {
                    nodes[i].style.width = (maxWidth) + "px";
                } else {
                    nodes[i].style.width = (maxWidth - parseInt(nodes[i].currentStyle.paddingLeft) - parseInt(nodes[i].currentStyle.paddingRight)) + "px";
                }
            }
        }
    }

    /* Parse nodes, create events, position elements */
    function parse(nodes, tree, id) {
        for (var i = 0; i < nodes.length; i++) {
            if (1 != nodes[i].nodeType) {
                continue;
            }
            switch (true) {
                // .item1
                case /\bitem7\b/.test(nodes[i].className):
                    nodes[i].id = id + "-" + tree.length;
                    tree.push(new Array());
                    nodes[i].onmouseover = item7over;
                    nodes[i].onmouseout = item7out;
                    break;
                // .item2
                case /\bitem2\b/.test(nodes[i].className):
                    nodes[i].id = id + "-" + tree.length;
                    tree.push(new Array());
                    break;
                // .section
                case /\bsection\b/.test(nodes[i].className):
                    // id, events
                    nodes[i].id = id + "-" + (tree.length - 1) + "-section";
                    nodes[i].onmouseover = sectionOver;
                    nodes[i].onmouseout = sectionOut;
                    // position
                    var box1 = document.getElementById(id + "-" + (tree.length - 1));
                    var box2 = document.getElementById(nodes[i].id);
                    if ("horizontal" == self.type) {
                        box2.style.top = box1.offsetTop + box1.offsetHeight + self.position.top + "px";
                        if (self.browser.ie5) {
                           // box2.style.left = self.position.left + "px";
                        } else {
                          //  box2.style.left = box1.offsetLeft + self.position.left + "px";
                        }
                    } else if ("vertical" == self.type) {
                        box2.style.top = box1.offsetTop + self.position.top + "px";
                        if (self.browser.ie5) {
                           // box2.style.left = box1.offsetWidth + self.position.left + "px";
                        } else {
                           // box2.style.left = box1.offsetLeft + box1.offsetWidth + self.position.left + "px";
                        }
                    }
                    // sections, sectionsShowCnt, sectionsHideCnt
                    self.sections.push(nodes[i].id);
                    self.sectionsShowCnt.push(0);
                    self.sectionsHideCnt.push(0);
                    break;
            }
            if (nodes[i].childNodes) {
                if (/\bsection\b/.test(nodes[i].className)) {
                    parse(nodes[i].childNodes, tree[tree.length - 1], id + "-" + (tree.length - 1));
                } else {
                    parse(nodes[i].childNodes, tree, id);
                }
            }
        }
    }

    /* event, item7:onmouseover */
    function item7over() {
        var id_section = this.id + "-section";
        if (self.visible) {
            var el = new Element(self.visible);
            el = document.getElementById(el.getParent().id);
            if (/item7-active/.test(el.className)) {
                el.className = el.className.replace(/item7-active/, "item7");
            }
        }
        if (self.sections.contains(id_section)) {
            self.sectionsHideCnt[self.sections.indexOf(id_section)]++;
            var cnt = self.sectionsShowCnt[self.sections.indexOf(id_section)];
            setTimeout(function(a, b) { return function() { self.showSection(a, b); } } (id_section, cnt), self.delay.show);
        } else {
            if (self.visible) {
                var cnt = self.sectionsHideCnt[self.sections.indexOf(self.visible)];
                setTimeout(function(a, b) { return function() { self.hideSection(a, b); } } (self.visible, cnt), self.delay.show);
            }
        }
    }

    /* event, item7:onmouseout */
    function item7out() {
        var id_section = this.id + "-section";
        if (self.sections.contains(id_section)) {
            self.sectionsShowCnt[self.sections.indexOf(id_section)]++;
            if (id_section == self.visible) {
                var cnt = self.sectionsHideCnt[self.sections.indexOf(id_section)];
                setTimeout(function(a, b) { return function() { self.hideSection(a, b); } }(id_section, cnt), self.delay.hide);
            }
        }
    }

    /* event, section:onmouseover */
    function sectionOver() {
        self.sectionsHideCnt[self.sections.indexOf(this.id)]++;
        var el = new Element(this.id);
        el = document.getElementById(el.getParent().id);
        if (!/item7-active/.test(el.className)) {
            el.className = el.className.replace(/item7/, "item7-active");
        }
    }

    /* event, section:onmouseout */
    function sectionOut() {
        self.sectionsShowCnt[self.sections.indexOf(this.id)]++;
        var cnt = self.sectionsHideCnt[self.sections.indexOf(this.id)];
        setTimeout(function(a, b) { return function() { self.hideSection(a, b); } }(this.id, cnt), self.delay.hide);
    }

    /* Show section (1 argument passed)
     * Try to show section (2 arguments passed) - check cnt with sectionShowCnt */
    this.showSection = function(id, cnt) {
        if (typeof cnt != "undefined") {
            if (cnt != this.sectionsShowCnt[this.sections.indexOf(id)]) { return; }
        }
        this.sectionsShowCnt[this.sections.indexOf(id)]++;
        var el = new Element(id);
        var parent = document.getElementById(el.getParent().id);
        if (!/item7-active/.test(parent.className)) {
            parent.className = parent.className.replace(/item7/, "item7-active");
        }
        if (this.visible) {
            if (id == this.visible) { return; }
            this.hideSection(this.visible);
        }
        //document.getElementById(id).style.display = "block";
        document.getElementById(id).style.visibility = "visible";
        document.getElementById(id).style.zIndex = this.zIndex.visible;
        this.visible = id;
    }

    /* Hide section (1 argument passed)
     * Try to hide section (2 arguments passed) - check cnt with sectionHideCnt */
    this.hideSection = function(id, cnt) {
        if (typeof cnt != "undefined") {
            if (cnt != this.sectionsHideCnt[this.sections.indexOf(id)]) { return; }
        }
        var el = new Element(id);
        var parent = document.getElementById(el.getParent().id);
        parent.className = parent.className.replace(/item7-active/, "item7");
        document.getElementById(id).style.zIndex = this.zIndex.hidden;
        document.getElementById(id).style.visibility = "hidden";
        //document.getElementById(id).style.display = "none";
        if (id == this.visible) { this.visible = ""; }
        else {
            //throw "DropMenu1.hideSection('"+id+"', "+cnt+") failed, cannot hide element that is not visible";
            return;
        }
        this.sectionsHideCnt[this.sections.indexOf(id)]++;
    }

    /* Necessary when showing section that doesn't exist - hide currently visible section. See: item7over() */
    this.hideSelf = function(cnt) {
        if (this.visible && cnt == this.sectionsHideCnt[this.sections.indexOf(this.visible)]) {
            this.hideSection(this.visible);
        }
    }

    /* Element (.section, .item2 etc) */
    function Element(id) {
        /* Get parent element */
        this.getParent = function() {
            var s = this.id.substr(this.menu.id.length);
            var a = s.split("-");
            a.pop();
            return new Element(this.menu.id + a.join("-"));
        }
        this.menu = self;
        this.id = id;
    }

    var self = this;
    this.id = id; /* menu id */
    this.tree = []; /* tree structure of menu */
    this.sections = []; /* all sections, required for timeout */
    this.sectionsShowCnt = [];
    this.sectionsHideCnt = [];
    this.visible = ""; /* visible section, ex. menu-0-section */
}

function DropMenu2(id) {

    /* Type of the menu: "horizontal" or "vertical" */
    this.type = "horizontal";

    /* Delay (in miliseconds >= 0): show-hide menu */
    this.delay = {
        "show": 0,
        "hide": 300
    }
    /* Change the default position of sub-menu by Y pixels from top and X pixels from left
     * Negative values are allowed */
    this.position = {
        "top": 0,
        "left": 0
    }
    /* Z-index property for .section1 */
    this.zIndex = {
        "visible": 1,
        "hidden": -1
    };

    // Browser detection
    this.browser = {
        "ie": Boolean(document.body.currentStyle),
        "ie5": (navigator.appVersion.indexOf("MSIE 5.5") != -1 || navigator.appVersion.indexOf("MSIE 5.0") != -1)
    };
    if (!this.browser.ie) { this.browser.ie5 = false; }

    /* Initialize the menu */
    this.init = function() {
        if (!document.getElementById(this.id)) { return alert("DropMenu2.init() failed. Element '"+ this.id +"' does not exist."); }
        if (this.type != "horizontal" && this.type != "vertical") { return alert("DropMenu2.init() failed. Unknown menu type: '"+this.type+"'"); }
        if (this.browser.ie && this.browser.ie5) { fixWrap(); }
        fixsection1s();
        parse(document.getElementById(this.id).childNodes, this.tree, this.id);
    }

    /* Search for .section1 elements and set width for them */
    function fixsection1s() {
        var arr = document.getElementById(self.id).getElementsByTagName("div");
        var section1s = new Array();
        var widths = new Array();

        for (var i = 0; i < arr.length; i++) {
            if (arr[i].className == "section1") {
                section1s.push(arr[i]);
            }
        }
        for (var i = 0; i < section1s.length; i++) {
            widths.push(getMaxWidth(section1s[i].childNodes));
        }
        for (var i = 0; i < section1s.length; i++) {
            section1s[i].style.width = (widths[i]) + "px";
        }
        if (self.browser.ie) {
            for (var i = 0; i < section1s.length; i++) {
                setMaxWidth(section1s[i].childNodes, widths[i]);
            }
        }
    }

    function fixWrap() {
        var elements = document.getElementById(self.id).getElementsByTagName("a");
        for (var i = 0; i < elements.length; i++) {
            if (/item9/.test(elements[i].className)) {
                elements[i].innerHTML = '<div nowrap="nowrap">'+elements[i].innerHTML+'</div>';
            }
        }
    }

    /* Search for an element with highest width among given nodes, return that width */
    function getMaxWidth(nodes) {
        var maxWidth = 0;
        for (var i = 0; i < nodes.length; i++) {
            if (nodes[i].nodeType != 1) { continue; }
            if (nodes[i].offsetWidth > maxWidth) { maxWidth = nodes[i].offsetWidth; }
        }
        return maxWidth;
    }

    /* Set width for item9 elements */
    function setMaxWidth(nodes, maxWidth) {
        for (var i = 0; i < nodes.length; i++) {
            if (nodes[i].nodeType == 1 && /item9/.test(nodes[i].className) && nodes[i].currentStyle) {
                if (self.browser.ie5) {
                    nodes[i].style.width = (maxWidth) + "px";
                } else {
                    nodes[i].style.width = (maxWidth - parseInt(nodes[i].currentStyle.paddingLeft) - parseInt(nodes[i].currentStyle.paddingRight)) + "px";
                }
            }
        }
    }

    /* Parse nodes, create events, position elements */
    function parse(nodes, tree, id) {
        for (var i = 0; i < nodes.length; i++) {
            if (1 != nodes[i].nodeType) {
                continue;
            }
            switch (true) {
                // .item1
                case /\bitem3\b/.test(nodes[i].className):
                    nodes[i].id = id + "-" + tree.length;
                    tree.push(new Array());
                    nodes[i].onmouseover = item3over;
                    nodes[i].onmouseout = item3out;
                    break;
                // .item9
                case /\bitem9\b/.test(nodes[i].className):
                    nodes[i].id = id + "-" + tree.length;
                    tree.push(new Array());
                    break;
                // .section1
                case /\bsection1\b/.test(nodes[i].className):
                    // id, events
                    nodes[i].id = id + "-" + (tree.length - 1) + "-section1";
                    nodes[i].onmouseover = section1Over;
                    nodes[i].onmouseout = section1Out;
                    // position
                    var box1 = document.getElementById(id + "-" + (tree.length - 1));
                    var box2 = document.getElementById(nodes[i].id);
                    if ("horizontal" == self.type) {
                        box2.style.top = box1.offsetTop + box1.offsetHeight + self.position.top + "px";
                        if (self.browser.ie5) {
                           // box2.style.left = self.position.left + "px";
                        } else {
                          //  box2.style.left = box1.offsetLeft + self.position.left + "px";
                        }
                    } else if ("vertical" == self.type) {
                        box2.style.top = box1.offsetTop + self.position.top + "px";
                        if (self.browser.ie5) {
                           // box2.style.left = box1.offsetWidth + self.position.left + "px";
                        } else {
                           // box2.style.left = box1.offsetLeft + box1.offsetWidth + self.position.left + "px";
                        }
                    }
                    // section1s, section1sShowCnt, section1sHideCnt
                    self.section1s.push(nodes[i].id);
                    self.section1sShowCnt.push(0);
                    self.section1sHideCnt.push(0);
                    break;
            }
            if (nodes[i].childNodes) {
                if (/\bsection1\b/.test(nodes[i].className)) {
                    parse(nodes[i].childNodes, tree[tree.length - 1], id + "-" + (tree.length - 1));
                } else {
                    parse(nodes[i].childNodes, tree, id);
                }
            }
        }
    }

    /* event, item3:onmouseover */
    function item3over() {
        var id_section1 = this.id + "-section1";
        if (self.visible) {
            var el = new Element(self.visible);
            el = document.getElementById(el.getParent().id);
            if (/item3-active/.test(el.className)) {
                el.className = el.className.replace(/item3-active/, "item3");
            }
        }
        if (self.section1s.contains(id_section1)) {
            self.section1sHideCnt[self.section1s.indexOf(id_section1)]++;
            var cnt = self.section1sShowCnt[self.section1s.indexOf(id_section1)];
            setTimeout(function(a, b) { return function() { self.showsection1(a, b); } } (id_section1, cnt), self.delay.show);
        } else {
            if (self.visible) {
                var cnt = self.section1sHideCnt[self.section1s.indexOf(self.visible)];
                setTimeout(function(a, b) { return function() { self.hidesection1(a, b); } } (self.visible, cnt), self.delay.show);
            }
        }
    }

    /* event, item3:onmouseout */
    function item3out() {
        var id_section1 = this.id + "-section1";
        if (self.section1s.contains(id_section1)) {
            self.section1sShowCnt[self.section1s.indexOf(id_section1)]++;
            if (id_section1 == self.visible) {
                var cnt = self.section1sHideCnt[self.section1s.indexOf(id_section1)];
                setTimeout(function(a, b) { return function() { self.hidesection1(a, b); } }(id_section1, cnt), self.delay.hide);
            }
        }
    }

    /* event, section1:onmouseover */
    function section1Over() {
        self.section1sHideCnt[self.section1s.indexOf(this.id)]++;
        var el = new Element(this.id);
        el = document.getElementById(el.getParent().id);
        if (!/item3-active/.test(el.className)) {
            el.className = el.className.replace(/item3/, "item3-active");
        }
    }

    /* event, section1:onmouseout */
    function section1Out() {
        self.section1sShowCnt[self.section1s.indexOf(this.id)]++;
        var cnt = self.section1sHideCnt[self.section1s.indexOf(this.id)];
        setTimeout(function(a, b) { return function() { self.hidesection1(a, b); } }(this.id, cnt), self.delay.hide);
    }

    /* Show section1 (1 argument passed)
     * Try to show section1 (2 arguments passed) - check cnt with section1ShowCnt */
    this.showsection1 = function(id, cnt) {
        if (typeof cnt != "undefined") {
            if (cnt != this.section1sShowCnt[this.section1s.indexOf(id)]) { return; }
        }
        this.section1sShowCnt[this.section1s.indexOf(id)]++;
        var el = new Element(id);
        var parent = document.getElementById(el.getParent().id);
        if (!/item3-active/.test(parent.className)) {
            parent.className = parent.className.replace(/item3/, "item3-active");
        }
        if (this.visible) {
            if (id == this.visible) { return; }
            this.hidesection1(this.visible);
        }
        //document.getElementById(id).style.display = "block";
        document.getElementById(id).style.visibility = "visible";
        document.getElementById(id).style.zIndex = this.zIndex.visible;
        this.visible = id;
    }

    /* Hide section1 (1 argument passed)
     * Try to hide section1 (2 arguments passed) - check cnt with section1HideCnt */
    this.hidesection1 = function(id, cnt) {
        if (typeof cnt != "undefined") {
            if (cnt != this.section1sHideCnt[this.section1s.indexOf(id)]) { return; }
        }
        var el = new Element(id);
        var parent = document.getElementById(el.getParent().id);
        parent.className = parent.className.replace(/item3-active/, "item3");
        document.getElementById(id).style.zIndex = this.zIndex.hidden;
        document.getElementById(id).style.visibility = "hidden";
        //document.getElementById(id).style.display = "none";
        if (id == this.visible) { this.visible = ""; }
        else {
            //throw "DropMenu2.hidesection1('"+id+"', "+cnt+") failed, cannot hide element that is not visible";
            return;
        }
        this.section1sHideCnt[this.section1s.indexOf(id)]++;
    }

    /* Necessary when showing section1 that doesn't exist - hide currently visible section1. See: item3over() */
    this.hideSelf = function(cnt) {
        if (this.visible && cnt == this.section1sHideCnt[this.section1s.indexOf(this.visible)]) {
            this.hidesection1(this.visible);
        }
    }

    /* Element (.section1, .item9 etc) */
    function Element(id) {
        /* Get parent element */
        this.getParent = function() {
            var s = this.id.substr(this.menu.id.length);
            var a = s.split("-");
            a.pop();
            return new Element(this.menu.id + a.join("-"));
        }
        this.menu = self;
        this.id = id;
    }

    var self = this;
    this.id = id; /* menu id */
    this.tree = []; /* tree structure of menu */
    this.section1s = []; /* all section1s, required for timeout */
    this.section1sShowCnt = [];
    this.section1sHideCnt = [];
    this.visible = ""; /* visible section1, ex. menu-0-section1 */
}


function DropMenu3(id) {

    /* Type of the menu: "horizontal" or "vertical" */
    this.type = "horizontal";

    /* Delay (in miliseconds >= 0): show-hide menu */
    this.delay = {
        "show": 0,
        "hide": 300
    }
    /* Change the default position of sub-menu by Y pixels from top and X pixels from left
     * Negative values are allowed */
    this.position = {
        "top": 0,
        "left": 0
    }
    /* Z-index property for .videosection */
    this.zIndex = {
        "visible": 1,
        "hidden": -1
    };

    // Browser detection
    this.browser = {
        "ie": Boolean(document.body.currentStyle),
        "ie5": (navigator.appVersion.indexOf("MSIE 5.5") != -1 || navigator.appVersion.indexOf("MSIE 5.0") != -1)
    };
    if (!this.browser.ie) { this.browser.ie5 = false; }

    /* Initialize the menu */
    this.init = function() {
        if (!document.getElementById(this.id)) { return alert("DropMenu1.init() failed. Element '"+ this.id +"' does not exist."); }
        if (this.type != "horizontal" && this.type != "vertical") { return alert("DropMenu1.init() failed. Unknown menu type: '"+this.type+"'"); }
        if (this.browser.ie && this.browser.ie5) { fixWrap(); }
        fixSections();
        parse(document.getElementById(this.id).childNodes, this.tree, this.id);
    }

    /* Search for .videosection elements and set width for them */
    function fixSections() {
        var arr = document.getElementById(self.id).getElementsByTagName("div");
        var videosections = new Array();
        var widths = new Array();

        for (var i = 0; i < arr.length; i++) {
            if (arr[i].className == "videosection") {
                videosections.push(arr[i]);
            }
        }
        for (var i = 0; i < videosections.length; i++) {
            widths.push(getMaxWidth(videosections[i].childNodes));
        }
        for (var i = 0; i < videosections.length; i++) {
            videosections[i].style.width = (widths[i]) + "px";
        }
        if (self.browser.ie) {
            for (var i = 0; i < videosections.length; i++) {
                setMaxWidth(videosections[i].childNodes, widths[i]);
            }
        }
    }

    function fixWrap() {
        var elements = document.getElementById(self.id).getElementsByTagName("a");
        for (var i = 0; i < elements.length; i++) {
            if (/item20/.test(elements[i].className)) {
                elements[i].innerHTML = '<div nowrap="nowrap">'+elements[i].innerHTML+'</div>';
            }
        }
    }

    /* Search for an element with highest width among given nodes, return that width */
    function getMaxWidth(nodes) {
        var maxWidth = 0;
        for (var i = 0; i < nodes.length; i++) {
            if (nodes[i].nodeType != 1) { continue; }
            if (nodes[i].offsetWidth > maxWidth) { maxWidth = nodes[i].offsetWidth; }
        }
        return maxWidth;
    }

    /* Set width for item20 elements */
    function setMaxWidth(nodes, maxWidth) {
        for (var i = 0; i < nodes.length; i++) {
            if (nodes[i].nodeType == 1 && /item20/.test(nodes[i].className) && nodes[i].currentStyle) {
                if (self.browser.ie5) {
                    nodes[i].style.width = (maxWidth) + "px";
                } else {
                    nodes[i].style.width = (maxWidth - parseInt(nodes[i].currentStyle.paddingLeft) - parseInt(nodes[i].currentStyle.paddingRight)) + "px";
                }
            }
        }
    }

    /* Parse nodes, create events, position elements */
    function parse(nodes, tree, id) {
        for (var i = 0; i < nodes.length; i++) {
            if (1 != nodes[i].nodeType) {
                continue;
            }
            switch (true) {
                // .item1
                case /\bitem4\b/.test(nodes[i].className):
                    nodes[i].id = id + "-" + tree.length;
                    tree.push(new Array());
                    nodes[i].onmouseover = item4over;
                    nodes[i].onmouseout = item4out;
                    break;
                // .item20
                case /\bitem20\b/.test(nodes[i].className):
                    nodes[i].id = id + "-" + tree.length;
                    tree.push(new Array());
                    break;
                // .videosection
                case /\bvideosection\b/.test(nodes[i].className):
                    // id, events
                    nodes[i].id = id + "-" + (tree.length - 1) + "-videosection";
                    nodes[i].onmouseover = videosectionOver;
                    nodes[i].onmouseout = videosectionOut;
                    // position
                    var box1 = document.getElementById(id + "-" + (tree.length - 1));
                    var box2 = document.getElementById(nodes[i].id);
                    if ("horizontal" == self.type) {
                        box2.style.top = box1.offsetTop + box1.offsetHeight + self.position.top + "px";
                        if (self.browser.ie5) {
                           // box2.style.left = self.position.left + "px";
                        } else {
                          //  box2.style.left = box1.offsetLeft + self.position.left + "px";
                        }
                    } else if ("vertical" == self.type) {
                        box2.style.top = box1.offsetTop + self.position.top + "px";
                        if (self.browser.ie5) {
                           // box2.style.left = box1.offsetWidth + self.position.left + "px";
                        } else {
                           // box2.style.left = box1.offsetLeft + box1.offsetWidth + self.position.left + "px";
                        }
                    }
                    // videosections, videosectionsShowCnt, videosectionsHideCnt
                    self.videosections.push(nodes[i].id);
                    self.videosectionsShowCnt.push(0);
                    self.videosectionsHideCnt.push(0);
                    break;
            }
            if (nodes[i].childNodes) {
                if (/\bvideosection\b/.test(nodes[i].className)) {
                    parse(nodes[i].childNodes, tree[tree.length - 1], id + "-" + (tree.length - 1));
                } else {
                    parse(nodes[i].childNodes, tree, id);
                }
            }
        }
    }

    /* event, item4:onmouseover */
    function item4over() {
        var id_videosection = this.id + "-videosection";
        if (self.visible) {
            var el = new Element(self.visible);
            el = document.getElementById(el.getParent().id);
            if (/item4-active/.test(el.className)) {
                el.className = el.className.replace(/item4-active/, "item4");
            }
        }
        if (self.videosections.contains(id_videosection)) {
            self.videosectionsHideCnt[self.videosections.indexOf(id_videosection)]++;
            var cnt = self.videosectionsShowCnt[self.videosections.indexOf(id_videosection)];
            setTimeout(function(a, b) { return function() { self.showSection(a, b); } } (id_videosection, cnt), self.delay.show);
        } else {
            if (self.visible) {
                var cnt = self.videosectionsHideCnt[self.videosections.indexOf(self.visible)];
                setTimeout(function(a, b) { return function() { self.hideSection(a, b); } } (self.visible, cnt), self.delay.show);
            }
        }
    }

    /* event, item4:onmouseout */
    function item4out() {
        var id_videosection = this.id + "-videosection";
        if (self.videosections.contains(id_videosection)) {
            self.videosectionsShowCnt[self.videosections.indexOf(id_videosection)]++;
            if (id_videosection == self.visible) {
                var cnt = self.videosectionsHideCnt[self.videosections.indexOf(id_videosection)];
                setTimeout(function(a, b) { return function() { self.hideSection(a, b); } }(id_videosection, cnt), self.delay.hide);
            }
        }
    }


    /* event, videosection:onmouseover */
    function videosectionOver() {
        self.videosectionsHideCnt[self.videosections.indexOf(this.id)]++;
        var el = new Element(this.id);
        el = document.getElementById(el.getParent().id);
        if (!/item4-active/.test(el.className)) {
            el.className = el.className.replace(/item4/, "item4-active");
        }
    }

    /* event, videosection:onmouseout */
    function videosectionOut() {
        self.videosectionsShowCnt[self.videosections.indexOf(this.id)]++;
        var cnt = self.videosectionsHideCnt[self.videosections.indexOf(this.id)];
        setTimeout(function(a, b) { return function() { self.hideSection(a, b); } }(this.id, cnt), self.delay.hide);
    }

    /* Show videosection (1 argument passed)
     * Try to show videosection (2 arguments passed) - check cnt with videosectionShowCnt */
    this.showSection = function(id, cnt) {
        if (typeof cnt != "undefined") {
            if (cnt != this.videosectionsShowCnt[this.videosections.indexOf(id)]) { return; }
        }
        this.videosectionsShowCnt[this.videosections.indexOf(id)]++;
        var el = new Element(id);
        var parent = document.getElementById(el.getParent().id);
        if (!/item4-active/.test(parent.className)) {
            parent.className = parent.className.replace(/item4/, "item4-active");
        }
        if (this.visible) {
            if (id == this.visible) { return; }
            this.hideSection(this.visible);
        }
        //document.getElementById(id).style.display = "block";
        document.getElementById(id).style.visibility = "visible";
        document.getElementById(id).style.zIndex = this.zIndex.visible;
        this.visible = id;
    }

    /* Hide videosection (1 argument passed)
     * Try to hide videosection (2 arguments passed) - check cnt with videosectionHideCnt */
    this.hideSection = function(id, cnt) {
        if (typeof cnt != "undefined") {
            if (cnt != this.videosectionsHideCnt[this.videosections.indexOf(id)]) { return; }
        }
        var el = new Element(id);
        var parent = document.getElementById(el.getParent().id);
        parent.className = parent.className.replace(/item4-active/, "item4");
        document.getElementById(id).style.zIndex = this.zIndex.hidden;
        document.getElementById(id).style.visibility = "hidden";
        //document.getElementById(id).style.display = "none";
        if (id == this.visible) { this.visible = ""; }
        else {
            //throw "DropMenu1.hideSection('"+id+"', "+cnt+") failed, cannot hide element that is not visible";
            return;
        }
        this.videosectionsHideCnt[this.videosections.indexOf(id)]++;
    }

    /* Necessary when showing videosection that doesn't exist - hide currently visible videosection. See: item4over() */
    this.hideSelf = function(cnt) {
        if (this.visible && cnt == this.videosectionsHideCnt[this.videosections.indexOf(this.visible)]) {
            this.hideSection(this.visible);
        }
    }

    /* Element (.videosection, .item20 etc) */
    function Element(id) {
        /* Get parent element */
        this.getParent = function() {
            var s = this.id.substr(this.menu.id.length);
            var a = s.split("-");
            a.pop();
            return new Element(this.menu.id + a.join("-"));
        }
        this.menu = self;
        this.id = id;
    }

    var self = this;
    this.id = id; /* menu id */
    this.tree = []; /* tree structure of menu */
    this.videosections = []; /* all videosections, required for timeout */
    this.videosectionsShowCnt = [];
    this.videosectionsHideCnt = [];
    this.visible = ""; /* visible videosection, ex. menu-0-videosection */
}


function DropMenu4(id) {

    /* Type of the menu: "horizontal" or "vertical" */
    this.type = "horizontal";

    /* Delay (in miliseconds >= 0): show-hide menu */
    this.delay = {
        "show": 0,
        "hide": 300
    }
    /* Change the default position of sub-menu by Y pixels from top and X pixels from left
     * Negative values are allowed */
    this.position = {
        "top": 0,
        "left": 0
    }
    /* Z-index property for .comparesection */
    this.zIndex = {
        "visible": 1,
        "hidden": -1
    };

    // Browser detection
    this.browser = {
        "ie": Boolean(document.body.currentStyle),
        "ie5": (navigator.appVersion.indexOf("MSIE 5.5") != -1 || navigator.appVersion.indexOf("MSIE 5.0") != -1)
    };
    if (!this.browser.ie) { this.browser.ie5 = false; }

    /* Initialize the menu */
    this.init = function() {
        if (!document.getElementById(this.id)) { return alert("DropMenu1.init() failed. Element '"+ this.id +"' does not exist."); }
        if (this.type != "horizontal" && this.type != "vertical") { return alert("DropMenu1.init() failed. Unknown menu type: '"+this.type+"'"); }
        if (this.browser.ie && this.browser.ie5) { fixWrap(); }
        fixSections();
        parse(document.getElementById(this.id).childNodes, this.tree, this.id);
    }

    /* Search for .comparesection elements and set width for them */
    function fixSections() {
        var arr = document.getElementById(self.id).getElementsByTagName("div");
        var comparesections = new Array();
        var widths = new Array();

        for (var i = 0; i < arr.length; i++) {
            if (arr[i].className == "comparesection") {
                comparesections.push(arr[i]);
            }
        }
        for (var i = 0; i < comparesections.length; i++) {
            widths.push(getMaxWidth(comparesections[i].childNodes));
        }
        for (var i = 0; i < comparesections.length; i++) {
            comparesections[i].style.width = (widths[i]) + "px";
        }
        if (self.browser.ie) {
            for (var i = 0; i < comparesections.length; i++) {
                setMaxWidth(comparesections[i].childNodes, widths[i]);
            }
        }
    }

    function fixWrap() {
        var elements = document.getElementById(self.id).getElementsByTagName("a");
        for (var i = 0; i < elements.length; i++) {
            if (/item21/.test(elements[i].className)) {
                elements[i].innerHTML = '<div nowrap="nowrap">'+elements[i].innerHTML+'</div>';
            }
        }
    }

    /* Search for an element with highest width among given nodes, return that width */
    function getMaxWidth(nodes) {
        var maxWidth = 0;
        for (var i = 0; i < nodes.length; i++) {
            if (nodes[i].nodeType != 1) { continue; }
            if (nodes[i].offsetWidth > maxWidth) { maxWidth = nodes[i].offsetWidth; }
        }
        return maxWidth;
    }

    /* Set width for item21 elements */
    function setMaxWidth(nodes, maxWidth) {
        for (var i = 0; i < nodes.length; i++) {
            if (nodes[i].nodeType == 1 && /item21/.test(nodes[i].className) && nodes[i].currentStyle) {
                if (self.browser.ie5) {
                    nodes[i].style.width = (maxWidth) + "px";
                } else {
                    nodes[i].style.width = (maxWidth - parseInt(nodes[i].currentStyle.paddingLeft) - parseInt(nodes[i].currentStyle.paddingRight)) + "px";
                }
            }
        }
    }

    /* Parse nodes, create events, position elements */
    function parse(nodes, tree, id) {
        for (var i = 0; i < nodes.length; i++) {
            if (1 != nodes[i].nodeType) {
                continue;
            }
            switch (true) {
                // .item1
                case /\bitem3\b/.test(nodes[i].className):
                    nodes[i].id = id + "-" + tree.length;
                    tree.push(new Array());
                    nodes[i].onmouseover = item3over;
                    nodes[i].onmouseout = item3out;
                    break;
                // .item21
                case /\bitem21\b/.test(nodes[i].className):
                    nodes[i].id = id + "-" + tree.length;
                    tree.push(new Array());
                    break;
                // .comparesection
                case /\bcomparesection\b/.test(nodes[i].className):
                    // id, events
                    nodes[i].id = id + "-" + (tree.length - 1) + "-comparesection";
                    nodes[i].onmouseover = comparesectionOver;
                    nodes[i].onmouseout = comparesectionOut;
                    // position
                    var box1 = document.getElementById(id + "-" + (tree.length - 1));
                    var box2 = document.getElementById(nodes[i].id);
                    if ("horizontal" == self.type) {
                        box2.style.top = box1.offsetTop + box1.offsetHeight + self.position.top + "px";
                        if (self.browser.ie5) {
                           // box2.style.left = self.position.left + "px";
                        } else {
                          //  box2.style.left = box1.offsetLeft + self.position.left + "px";
                        }
                    } else if ("vertical" == self.type) {
                        box2.style.top = box1.offsetTop + self.position.top + "px";
                        if (self.browser.ie5) {
                           // box2.style.left = box1.offsetWidth + self.position.left + "px";
                        } else {
                           // box2.style.left = box1.offsetLeft + box1.offsetWidth + self.position.left + "px";
                        }
                    }
                    // comparesections, comparesectionsShowCnt, comparesectionsHideCnt
                    self.comparesections.push(nodes[i].id);
                    self.comparesectionsShowCnt.push(0);
                    self.comparesectionsHideCnt.push(0);
                    break;
            }
            if (nodes[i].childNodes) {
                if (/\bcomparesection\b/.test(nodes[i].className)) {
                    parse(nodes[i].childNodes, tree[tree.length - 1], id + "-" + (tree.length - 1));
                } else {
                    parse(nodes[i].childNodes, tree, id);
                }
            }
        }
    }

    /* event, item3:onmouseover */
    function item3over() {
        var id_comparesection = this.id + "-comparesection";
        if (self.visible) {
            var el = new Element(self.visible);
            el = document.getElementById(el.getParent().id);
            if (/item3-active/.test(el.className)) {
                el.className = el.className.replace(/item3-active/, "item3");
            }
        }
        if (self.comparesections.contains(id_comparesection)) {
            self.comparesectionsHideCnt[self.comparesections.indexOf(id_comparesection)]++;
            var cnt = self.comparesectionsShowCnt[self.comparesections.indexOf(id_comparesection)];
            setTimeout(function(a, b) { return function() { self.showSection(a, b); } } (id_comparesection, cnt), self.delay.show);
        } else {
            if (self.visible) {
                var cnt = self.comparesectionsHideCnt[self.comparesections.indexOf(self.visible)];
                setTimeout(function(a, b) { return function() { self.hideSection(a, b); } } (self.visible, cnt), self.delay.show);
            }
        }
    }

    /* event, item3:onmouseout */
    function item3out() {
        var id_comparesection = this.id + "-comparesection";
        if (self.comparesections.contains(id_comparesection)) {
            self.comparesectionsShowCnt[self.comparesections.indexOf(id_comparesection)]++;
            if (id_comparesection == self.visible) {
                var cnt = self.comparesectionsHideCnt[self.comparesections.indexOf(id_comparesection)];
                setTimeout(function(a, b) { return function() { self.hideSection(a, b); } }(id_comparesection, cnt), self.delay.hide);
            }
        }
    }




    /* event, comparesection:onmouseover */
    function comparesectionOver() {
        self.comparesectionsHideCnt[self.comparesections.indexOf(this.id)]++;
        var el = new Element(this.id);
        el = document.getElementById(el.getParent().id);
        if (!/item3-active/.test(el.className)) {
            el.className = el.className.replace(/item3/, "item3-active");
        }
    }

    /* event, comparesection:onmouseout */
    function comparesectionOut() {
        self.comparesectionsShowCnt[self.comparesections.indexOf(this.id)]++;
        var cnt = self.comparesectionsHideCnt[self.comparesections.indexOf(this.id)];
        setTimeout(function(a, b) { return function() { self.hideSection(a, b); } }(this.id, cnt), self.delay.hide);
    }

    /* Show comparesection (1 argument passed)
     * Try to show comparesection (2 arguments passed) - check cnt with comparesectionShowCnt */
    this.showSection = function(id, cnt) {
        if (typeof cnt != "undefined") {
            if (cnt != this.comparesectionsShowCnt[this.comparesections.indexOf(id)]) { return; }
        }
        this.comparesectionsShowCnt[this.comparesections.indexOf(id)]++;
        var el = new Element(id);
        var parent = document.getElementById(el.getParent().id);
        if (!/item3-active/.test(parent.className)) {
            parent.className = parent.className.replace(/item3/, "item3-active");
        }
        if (this.visible) {
            if (id == this.visible) { return; }
            this.hideSection(this.visible);
        }
        //document.getElementById(id).style.display = "block";
        document.getElementById(id).style.visibility = "visible";
        document.getElementById(id).style.zIndex = this.zIndex.visible;
        this.visible = id;
    }

    /* Hide comparesection (1 argument passed)
     * Try to hide comparesection (2 arguments passed) - check cnt with comparesectionHideCnt */
    this.hideSection = function(id, cnt) {
        if (typeof cnt != "undefined") {
            if (cnt != this.comparesectionsHideCnt[this.comparesections.indexOf(id)]) { return; }
        }
        var el = new Element(id);
        var parent = document.getElementById(el.getParent().id);
        parent.className = parent.className.replace(/item3-active/, "item3");
        document.getElementById(id).style.zIndex = this.zIndex.hidden;
        document.getElementById(id).style.visibility = "hidden";
        //document.getElementById(id).style.display = "none";
        if (id == this.visible) { this.visible = ""; }
        else {
            //throw "DropMenu1.hideSection('"+id+"', "+cnt+") failed, cannot hide element that is not visible";
            return;
        }
        this.comparesectionsHideCnt[this.comparesections.indexOf(id)]++;
    }

    /* Necessary when showing comparesection that doesn't exist - hide currently visible comparesection. See: item3over() */
    this.hideSelf = function(cnt) {
        if (this.visible && cnt == this.comparesectionsHideCnt[this.comparesections.indexOf(this.visible)]) {
            this.hideSection(this.visible);
        }
    }

    /* Element (.comparesection, .item21 etc) */
    function Element(id) {
        /* Get parent element */
        this.getParent = function() {
            var s = this.id.substr(this.menu.id.length);
            var a = s.split("-");
            a.pop();
            return new Element(this.menu.id + a.join("-"));
        }
        this.menu = self;
        this.id = id;
    }

    var self = this;
    this.id = id; /* menu id */
    this.tree = []; /* tree structure of menu */
    this.comparesections = []; /* all comparesections, required for timeout */
    this.comparesectionsShowCnt = [];
    this.comparesectionsHideCnt = [];
    this.visible = ""; /* visible comparesection, ex. menu-0-comparesection */
}

/* Finds the index of the first occurence of item in the array, or -1 if not found */
if (typeof Array.prototype.indexOf == "undefined") {
    Array.prototype.indexOf = function(item) {
        for (var i = 0; i < this.length; i++) {
            if ((typeof this[i] == typeof item) && (this[i] == item)) {
                return i;
            }
        }
        return -1;
    }
}

/* Check whether array contains given string */
if (typeof Array.prototype.contains == "undefined") {
    Array.prototype.contains = function(s) {
        for (var i = 0; i < this.length; i++) {
            if (this[i] === s) {
                return true;
            }
        }
        return false;
    }
}
