//That function switches active\nonactive state
		//It takes index of li element and changes link and UL className and style
		function toggle(i) {
			var current_li = document.getElementById('nav').getElementsByTagName('li')[i];
			var x = current_li.getElementsByTagName('ul')[0];
			
			if (x.style.display == 'block') {
				x.style.display = 'none';
				current_li.getElementsByTagName('a')[0].className = 'can-open';
			} else {
				x.style.display = 'block';
				current_li.getElementsByTagName('a')[0].className = 'current';
			}
		}
	
		//Everything will work when document finish loading
		window.onload = function() {
			var all_li = document.getElementById('nav').getElementsByTagName('li'); //get number of all 'LI'
			var count_ul = 0; //see below
			x = []; //see below
			
			for (var i=0; i < all_li.length; i++) {
				if (all_li[i].getElementsByTagName('ul')[0]) { //look if element have subnav (i.e. 'UL')
					all_li[i].getElementsByTagName('ul')[0].style.display = 'none'; //if yes force hidden
					all_li[i].getElementsByTagName('a')[0].className = 'can-open'; //if yes set effect to link
					all_li[i].innerHTML = '<span><!-- --></span>'+all_li[i].innerHTML;
					count_ul++; //counting how many 'UL' we have
					x.push(i); //adding index of 'LI' that have
				} else { //in other way continue searching
					continue;
				}
			};
			
			//apply onclick for needed elements and call toggle function
			for (var i=0; i < count_ul; i++) {
				var temp = x[i];
				eval("\
					document.getElementById('nav').getElementsByTagName('li')["+temp+"].getElementsByTagName('span')[0].onclick = function() {\
				    	toggle("+temp+");\
				    	return false;\
			    	};\
		    	");
			};
		}
