*{margin:0;padding:0;box-sizing:border-box;font-family:'Poppins', sans-serif}body{background:black}#toggle{position:absolute;top:20px;left:20px;padding:10px;transition:.5s;cursor:pointer;display:block;width:60px;height:60px;z-index:2}#toggle span{position:absolute;transform:translate(-50%, -50%);top:50%;left:50%;width:40px;height:4px;background:white;border-radius:4px;display:block;transition:.5s}#toggle span:nth-child(1){transform:translate(-50%, -50%) translateY(-14px);transition:.8s}#toggle span:nth-child(4){transform:translate(-50%, -50%) translateY(14px);transition:.8s}#toggle.active{width:55px;transition:.5s}#toggle.active span:nth-child(1){transform:translate(-50%, -50%) translateY(-35px);opacity:0}#toggle.active span:nth-child(4){transform:translate(-50%, -50%) translateY(35px);opacity:0}#toggle.active span:nth-child(2){transform:translate(-50%, -50%) rotate(45deg)}#toggle.active span:nth-child(3){transform:translate(-50%, -50%) rotate(-45deg)}#menu.active{left:0}#menu{background:tomato;position:absolute;left:-100%;height:100vh;width:300px;display:flex;justify-content:center;align-items:center;flex-direction:column;margin:0;transition:.4s;z-index:1}#menu li{list-style:none;font-size:2rem;line-height:2}#menu li a{text-decoration:none;font-weight:bold;color:white}
/*# sourceMappingURL=style.css.map */