function overTab(tabID){
    var images = document.getElementById(tabID).getElementsByTagName("img");
    var imageWidth = images[0].offsetWidth / 3;
    var top = 0;
    var right = images[0].offsetWidth;
    var bottom = 24;
    var left = imageWidth * 2;
    var leftMargin = ((imageWidth % 2) == 0 ? (imageWidth / 2) : ((imageWidth + 1) / 2)) + left;
    
    document.getElementById(images[0].id).style.clip = "rect(" + top + "px " + right + "px " + bottom + "px " + left + "px)";
    document.getElementById(images[0].id).style.marginLeft = -leftMargin + "px";
}
function outTab(tabID){
    var images = document.getElementById(tabID).getElementsByTagName("img");
    var imageWidth = images[0].offsetWidth / 3;
    var top = 0;
    var right = imageWidth * 2;
    var bottom = 24;
    var left = imageWidth;
    var leftMargin = ((imageWidth % 2) == 0 ? (imageWidth / 2) : ((imageWidth + 1) / 2)) + left;
    
    document.getElementById(images[0].id).style.clip = "rect(" + top + "px " + right + "px " + bottom + "px " + left + "px)";
    document.getElementById(images[0].id).style.marginLeft = -leftMargin + "px";
}
function clickTab(tabID)
{
    var images = document.getElementById(tabID).getElementsByTagName("img");
    var imageWidth = images[0].offsetWidth / 3;
    var top = 0;
    var right = imageWidth;
    var bottom = 24;
    var left = 0;
    var leftMargin = ((imageWidth % 2) == 0 ? (imageWidth / 2) : ((imageWidth + 1) / 2));
    
    document.getElementById(images[0].id).style.clip = "rect(" + top + "px " + right + "px " + bottom + "px " + left + "px)";
    document.getElementById(images[0].id).style.marginLeft = -leftMargin + "px";
    document.getElementById(tabID).onmouseover = "";
    document.getElementById(tabID).onmouseout = "";
    document.getElementById(tabID).onclick = "";
    
    var parentDiv = document.getElementById(tabID).parentNode;
    
    for(var at = 0; at < parentDiv.childNodes.length; at++){
        if(parentDiv.childNodes[at].id != tabID){
            if(parentDiv.childNodes[at].childNodes.length > 0){
                //HTMLPageGenerator.cs enables IE8 to emulate IE7 using a meta tag, the following needs to take place.
                var CNBrowserValue = ((navigator.userAgent.toLowerCase().indexOf("msie 8") != -1) ? 0 : ((navigator.userAgent.toLowerCase().indexOf("msie 7") != -1) ? 0 : ((navigator.userAgent.toLowerCase().indexOf("msie 6") != -1) ? 0 : 1)))
                var image = parentDiv.childNodes[at].childNodes[CNBrowserValue].getElementsByTagName("img")[0];
                //var image = parentDiv.childNodes[at].childNodes[1].getElementsByTagName("img")[0];
                
                imageWidth = image.offsetWidth / 3
                top = 0;
                right = imageWidth * 2;
                bottom = 24;
                left = imageWidth;
                leftMargin = ((imageWidth % 2) == 0 ? (imageWidth / 2) : ((imageWidth + 1) / 2)) + left;
                
                document.getElementById(image.id).style.clip = "rect(" + top + "px " + right + "px " + bottom + "px " + left + "px)";
                document.getElementById(image.id).style.marginLeft = -leftMargin + "px";
                
                document.getElementById(parentDiv.childNodes[at].id).onmouseover = new Function("overTab(this.id);");
                document.getElementById(parentDiv.childNodes[at].id).onmouseout = new Function("outTab(this.id);");
                document.getElementById(parentDiv.childNodes[at].id).onclick = new Function("clickTab(this.id); swapContent(this.id);");
            }
        }
    }
}
function swapContent(tabID)
{
    var tabNumber = tabID.split('-')[1];
    var numberOfTabContentContainers = document.getElementById("tabContentContainer").childNodes.length;
    
    for(var n = 0; n < numberOfTabContentContainers; n++){
        if(document.getElementById("tabContentContainer").childNodes[n].id != null){
            if(tabNumber == document.getElementById("tabContentContainer").childNodes[n].id.split('-')[1]){
                document.getElementById("tabContentContainer").childNodes[n].style.zIndex = 1;
            }else{
                document.getElementById("tabContentContainer").childNodes[n].style.zIndex = 0;
            }
        }
    }
}