// ==============================================
function on(el, eventName, handler) { if (el.addEventListener) { el.addEventListener(eventName, handler, {passive: false}); } else { el.attachEvent('on' + eventName, handler); }; }
function off(el, eventName, handler) { if (el.removeEventListener) { el.removeEventListener(eventName, handler); } else { el.detachEvent('on' + eventName, handler); }; }
function forEachEl(s, fn) { var els = document.querySelectorAll(s); for (var i = 0; i < els.length; i++) { fn(els[i], i); }; }
function removeClassByClass(cls, clsremove) { forEachEl(cls, function(el, i){ if (el.classList) { el.classList.remove(clsremove); } else { el.className = el.className.replace(new RegExp('(^|\\b)' + clsremove.split(' ').join('|') + '(\\b|$)', 'gi'), ' '); }; }); }
function removeClassById(el, clsremove) { if (el.classList) { el.classList.remove(clsremove); } else { el.className = el.className.replace(new RegExp('(^|\\b)' + clsremove.split(' ').join('|') + '(\\b|$)', 'gi'), ' '); }; }
function addClassByClass(cls, clsadd) { forEachEl(cls, function(el, i){ if (el.classList) { el.classList.remove(clsadd); } else { el.className = el.className.replace(new RegExp('(^|\\b)' + clsadd.split(' ').join('|') + '(\\b|$)', 'gi'), ' '); }; }); forEachEl(cls, function(el, i){ if (el.classList){ el.classList.add(clsadd); } else { el.className += ' ' + clsadd; }; });	}
function addClassById(el, clsadd) { if (el.classList){ el.classList.add(clsadd); } else { el.className += ' ' + clsadd; }; }
function toggleClassById(el, clstoggle) { if (el.classList) { el.classList.toggle(clstoggle); } else { var classes = el.className.split(' '); var existingIndex = -1; for (var i = classes.length; i--;) { if (classes[i] === clstoggle) { existingIndex = i; }; }; if (existingIndex >= 0) { classes.splice(existingIndex, 1); } else { classes.push(clstoggle); }; el.className = classes.join(' '); }; }
function hasClass(element, cls) { return (' ' + element.className + ' ').indexOf(' ' + cls + ' ') > -1; }
// ==============================================
function cancelBubble(e) { var evt = e ? e:window.event; evt.preventDefault(); if (evt.stopPropagation) evt.stopPropagation(); if (evt.cancelBubble!=null) evt.cancelBubble = true; }
// ==============================================
function ready(fn) {if(document.attachEvent ? document.readyState==="complete" : document.readyState!=="loading"){fn();} else{document.addEventListener('DOMContentLoaded', fn);};}
// ==============================================
//function scrollTo(element, to, duration) { if (duration < 0) return; var difference = to - element.scrollTop; var perTick = difference / duration * 2;
//	setTimeout(function() { element.scrollTop = element.scrollTop + perTick; scrollTo(element, to, duration - 2); }, 10); }	
// ==============================================
function getBrowserH() { var myHeight = 0; if( typeof( window.innerWidth ) == 'number' ) { myHeight = window.innerHeight; } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) { myHeight = document.documentElement.clientHeight; } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) { myHeight = document.body.clientHeight; }; return myHeight; }
function getBrowserW() { var myWidth = 0; if( typeof( window.innerWidth ) == 'number' ) { myWidth = window.innerWidth; } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientWidth ) ) { myWidth = document.documentElement.clientWidth; } else if( document.body && ( document.body.clientWidth || document.body.clientWidth ) ) { myWidth = document.body.clientWidth; }; return myWidth; }
// ==============================================
//function heroHeight() { var hg = getBrowserH(); var el = document.getElementById("header"); el.style.height = hg + 'px'; }
// ==============================================
// ==============================================
function equalHeight(cls) { 
	var elts = document.getElementsByClassName(cls), max_height = 0, len = 0, i; 
	if ( (elts) && (elts.length > 0) ) { 
		len = elts.length; for (i = 0; i < len; i++) { elts[i].style.height = 'auto'; if (elts[i].clientHeight > max_height) { max_height = elts[i].clientHeight; }; }; 
		for (i = 0; i < len; i++) { elts[i].style.height = max_height + 'px'; }; }; }
// ==============================================
function noEqualHeight(cls) { 
	var elts = document.getElementsByClassName(cls), len = 0, i; 
	if ( (elts) && (elts.length > 0) ) { len = elts.length; for (i = 0; i < len; i++) { elts[i].style.height = 'auto'; }; }; }
// ==============================================

// ########################################################################################################
// scrollTo functions 
// ########################################################################################################
function scrollTo(element, duration) {// Element to move, time in ms to animate
	var e = document.getElementById("workspace");
    if(e.scrollTop===0){ var t = e.scrollTop; ++e.scrollTop; e = t+1===e.scrollTop--?e:document.body; }; 
	scrollToC(e, e.scrollTop, element, duration); }
function scrollToC(element, from, to, duration) {// Element to move, element or px from, element or px to, time in ms to animate
    if (duration <= 0) return;
    if(typeof from === "object")from=from.offsetTop;
    if(typeof to === "object")to=to.offsetTop;
    scrollToX(element, from, to, 0, 1/duration, 20, easeOutCuaic); }
function scrollToX(element, xFrom, xTo, t01, speed, step, motion) {
    if (t01 < 0 || t01 > 1 || speed<= 0) { element.scrollTop = xTo; return; };
    element.scrollTop = xFrom - (xFrom - xTo) * motion(t01);
    t01 += speed * step;
    setTimeout(function() { scrollToX(element, xFrom, xTo, t01, speed, step, motion); }, step); }
function easeOutCuaic(t){ t--; return t*t*t+1; }	
// ########################################################################################################
// ########################################################################################################


// ########################################################################################################
// get element top and left
// ########################################################################################################
function getOffset(el) {
    var _x = 0; var _y = 0; while( el && !isNaN( el.offsetLeft ) && !isNaN( el.offsetTop ) ) { _x += el.offsetLeft - el.scrollLeft; _y += el.offsetTop - el.scrollTop; el = el.offsetParent; }; return { top: _y, left: _x }; }
// ########################################################################################################
	



	var main_mnu = document.getElementById("main_mnu");
	var main_mnu_back = document.getElementById("main_mnu_back");
	
	var x_back = "-100px", y_back = "-100px", w_back = "0px", h_back = "0px"; 
	var sx_back = "-100px", sy_back = "-100px", sw_back = "0px", sh_back = "0px"; 
	
	forEachEl('.li_main_mnu', function(el, i){ if(hasClass(el, "active")){ x_back = el.offsetLeft+"px"; y_back = "0px"; w_back = el.offsetWidth+"px"; h_back = el.offsetHeight+"px"; }; });	
	main_mnu_back.style.left=x_back; main_mnu_back.style.top=y_back; main_mnu_back.style.width=w_back; main_mnu_back.style.height=h_back;
	
	
	
	on( main_mnu, "mouseleave", function(){
		x_back = "-100px"; 
		w_back = "0px";
		y_back = "0px";
		h_back = main_mnu.offsetHeight+"px";
		forEachEl('.li_main_mnu', function(el, i){ if(hasClass(el, "active")){ x_back = el.offsetLeft+"px"; w_back = el.offsetWidth+"px"; }; });	
		main_mnu_back.style.left=x_back; main_mnu_back.style.top=y_back; main_mnu_back.style.width=w_back; main_mnu_back.style.height=h_back; });

	forEachEl('.li_main_mnu', function(el, i){ on( el, "mouseover", function(){
		x_back = el.offsetLeft+"px";
		y_back = "0px";
		w_back = el.offsetWidth+"px";
		h_back = el.offsetHeight+"px"; 
		main_mnu_back.style.left=x_back; main_mnu_back.style.top=y_back; main_mnu_back.style.width=w_back; main_mnu_back.style.height=h_back; }); });	

/*	forEachEl('.sub_mnu', function(el, i){ on( el, "mouseover", function(){
		var y = el.offsetTop+"px", w = el.offsetWidth+"px", h = el.offsetHeight+"px"; main_mnu_back.style.top=y; main_mnu_back.style.width=w; main_mnu_back.style.height=h; }); });	
*/		
		
	forEachEl('.li_sub_main_mnu', function(el, i){
		var elm = el.parentNode.parentNode.parentNode.querySelector(".main_sub_mnu_back");
		on( el, "mouseover", function(){
			y_back = main_mnu.offsetHeight+"px";
			main_mnu_back.style.top=y_back;
			
			sx_back = "0px";
			sy_back = el.offsetTop+"px";
			sw_back = el.offsetWidth+"px";
			sh_back = el.offsetHeight+"px"; 
			elm.style.left=sx_back; elm.style.top=sy_back; elm.style.width=sw_back; elm.style.height=sh_back; }); 
		on( el, "mouseleave", function(){
			sx_back = "0px"; 
			sy_back = "-100px";
			sw_back = el.offsetWidth+"px";
			sh_back = el.offsetHeight+"px";
			forEachEl('.li_sub_main_mnu', function(el, i){ if(hasClass(el, "active")){ sy_back = el.offsetTop+"px"; }; }); 
			elm.style.left=sx_back; elm.style.top=sy_back; elm.style.width=sw_back; elm.style.height=sh_back; });		
	});
		
		
		
		
// ======= DOCUMENT READY =========================
function documentReady() {
	equalHeight("fcapt");

}
		
		
ready(documentReady);