.navbar{width:100%;box-shadow:0 1px 4px rgb(146 161 176/15%)}.nav-container{display:flex;justify-content:space-between;align-items:center;height:62px}.navbar .menu-items{display:flex}.navbar .nav-container li{list-style:none}.navbar .nav-container a{text-decoration:none;color:#fff;font-weight:500;font-size:1.2rem;padding:.7rem}.navbar .nav-container a:hover{font-weight:bolder}.nav-container{display:block;position:relative;height:60px}.nav-container .checkbox{position:absolute;display:block;height:32px;width:32px;top:20px;right:-138px;z-index:5;opacity:0;cursor:pointer}.nav-container .hamburger-lines{display:block;height:26px;width:32px;position:absolute;top:17px;right:-138px;z-index:2;display:flex;flex-direction:column;justify-content:space-between}.nav-container .hamburger-lines .line{display:block;height:4px;width:100%;border-radius:10px;background:#fff}.nav-container .hamburger-lines .line1{transform-origin:0% 0%;transition:transform .4s ease-in-out}.nav-container .hamburger-lines .line2{transition:transform .2s ease-in-out}
.nav-container .hamburger-lines .line3{transform-origin:0% 100%;transition:transform .4s ease-in-out}.navbar .menu-items{padding-top:120px;box-shadow:inset 0 0 2000px #212529;height:102vh;width:23%;transform:translate(437%);display:flex;flex-direction:column;    right: 0;padding-left:50px;transition:transform .5s ease-in-out;text-align:center;position:fixed;top:1px}.navbar .menu-items li{margin-bottom:1.2rem;font-size:1.5rem;font-weight:500}.logo{position:absolute;top:5px;left:-141px;font-size:1.2rem;color:#fff}.nav-container input[type=checkbox]:checked~.menu-items{transform:translateX(0)}.nav-container input[type=checkbox]:checked~.hamburger-lines .line1{transform:rotate(45deg)}.nav-container input[type=checkbox]:checked~.hamburger-lines .line2{transform:scaleY(0)}.nav-container input[type=checkbox]:checked~.hamburger-lines .line3{transform:rotate(-45deg)}