function show(id){//display an html element
	element = document.getElementById(id);
	if(element!=null) element.style.display = 'block';
}

function hide(id){//hide an html element
	element = document.getElementById(id);
	if(element!=null) element.style.display = 'none';
}

function getElementsByClassDustin(searchClass,node,tag) { //by http://www.dustindiaz.com/getelementsbyclass/
    var classElements = new Array();
    if ( node == null )
            node = document;
    if ( tag == null )
            tag = '*';
    var els = node.getElementsByTagName(tag);
    var elsLen = els.length;
    var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");
    for (i = 0, j = 0; i < elsLen; i++) {
            if ( pattern.test(els[i].className) ) {
                    classElements[j] = els[i];
                    j++;
            }
    }
    return classElements;
}

function getElementsByClass(searchClass,node,tag) { 
	//if is Netscape we use the native procedure
	if (navigator.appName=="Netscape") return document.getElementsByClassName(searchClass);
	else return getElementsByClassDustin(searchClass,node,tag);
}


function ShowTab(id){
	//hidding the boxes
	var eBox = getElementsByClass("box",document.getElementById('box_container'),"div");//all the boxes
	for (i in eBox) hide(eBox[i].id);
	//show the box
	show('box'+id);

	//change tab class
	var eTab = getElementsByClass("tab_selected",document.getElementById('tab_container'),"span");//all the tabs
	for (i in eTab) eTab[i].className ='tab';
	//set on the tab
	document.getElementById('tab'+id).className ='tab_selected';
}