body{margin:0;padding:0;font-family:Arial,sans-serif}.navbar{position:fixed;display:flex;justify-content:space-between;align-items:center;padding:10px 20px}.logo{font-size:1.5rem}ul{display:flex;list-style:none;padding:0;margin:0}ul li{margin-right:25px}ul li a{color:#fff;text-decoration:none;transition:color .3s}ul li a:hover{color:#90ee90}.checkbtn{font-size:30px;cursor:pointer;display:none}#check{display:none}@media (max-width: 768px){.checkbtn{display:block;order:1}ul{position:fixed;top:80px;right:-100%;background-color:#40e0d0;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;transition:all .3s;overflow-x:auto;height:524px}ul li{margin:20px 0}ul li a{font-size:20px}#check:checked~ul{right:0}}