function ShowMenu(){
    var NavDiv = document.getElementById("NavDiv");
    NavDiv.style.WebkitTransform = "translateX(0)";
    NavDiv.style.msTransform = "translateX(0)";
    NavDiv.style.transition = "translateX(0)";
    NavDiv.style.transition= "all 0.1s linear";
    var dimmer = document.getElementById("dimmer");
    dimmer.style.visibility = "visible"
    dimmer.style.transition = "opacity 0.5s";
    dimmer.style.WebkitTransition = "opacity 0.5s";
    dimmer.style.msTransition = "opacity 0.5s";
    dimmer.style.opacity = 0.5;
}

function HideMenu(){
    var dimmer = document.getElementById("dimmer");
    dimmer.style.transition = "opacity 0.1s";
    dimmer.style.WebkitTransition = "opacity 0.1s";
    dimmer.style.msTransition = "opacity 0.1s";
    dimmer.style.opacity = 0;
    var NavDiv = document.getElementById("NavDiv");
    NavDiv.style.WebkitTransform = "translateX(-13em)";
    NavDiv.style.msTransform = "translateX(-10em)";
    NavDiv.style.transition = "translateX(-10em)";
    NavDiv.style.transition= "all 0.3s linear";
    setTimeout(function(){
        dimmer.style.visibility = "hidden";
     }, 300);
}

document.getElementById("HambugerMenu").onclick = function(){
    ShowMenu();
};
document.getElementById("dimmer").onclick = function(){
    HideMenu();
};