$(document).ready(function(){
  $("#right").hide();
  $("#mySidenav").hide();
  $("#user-bar").hide();
  document.getElementById("right").style.width ="100%";
  document.getElementById("mySidenav").style.width = "240px";
  document.getElementById("user-bar").style.width = "220px";
});
//init all css and js


$(document).ready(function(){
  $("#right").click(function(){
    document.getElementById("main").style.marginLeft = "0px";
    $("#mySidenav").hide();
    $("#right").hide();
    // $("#off").attr('id','on');
  });
  
  $("#main").click(function(){
    document.getElementById("main").style.marginLeft = "240px";
    $("#main").show();
    $("#mySidenav").show();
    $("#right").show();
  });

  $("#user-icon").click(function(){
    // document.getElementById("user-bar").style.marginBottom = "240px";
    $("div#user-bar").toggle();
  });
});

