body,html{background:#000;color:#fff;margin:0;padding:0}*{box-sizing:border-box}.logo{color:#fff;font-size:20px;left:100px;position:fixed;text-decoration:none;top:50px}.logo:hover{opacity:.8}.nav{left:100px;position:fixed;top:50vh;transform:translateY(-50%)}.nav ul{display:flex;flex-direction:column;gap:10px;list-style:none}.nav li,.nav ul{margin:0;padding:0}.nav li a{color:#fff;text-decoration:none}.nav li a:hover{opacity:.8}.nav .active{opacity:.6!important}.container{margin:120px auto;max-width:800px;padding:25px}@media (max-width:800px){.logo{display:block;margin:20px 0;text-align:center}.logo,.nav{left:auto;position:relative;top:auto}.nav{transform:none}.nav ul{align-items:center;flex-direction:column;gap:8px;justify-content:center}.container{margin:50px auto}}