nav>div>div>ul>li{padding-left:50px}.div-nb{align-items:center;background-color:#2b3035;display:flex;height:50px;justify-content:space-around;position:fixed;width:100vw;z-index:1}.div-nb>ul,.li-nb{margin:0 auto}.li-nb:hover{background-color:#fff}.li-nb>a:hover{background-color:#000;border-radius:10px;color:gray;transition:.5s}.div-nb .welcome{color:#fff;display:flex;gap:30px;padding-left:30px;width:350px}.div-nb span{color:#fff;font-size:20px}.div-nb ul{justify-content:space-between;padding-right:50px;width:70%}.div-nb ul,.li-nb{color:#fff;display:flex}.li-nb{cursor:pointer;font-size:20px}.li-nb1{color:#fff}.menu-toggle{display:none;flex-direction:column;height:20px;justify-content:space-between;position:relative;z-index:6}.menu-toggle input{cursor:pointer;height:28px;opacity:0;position:absolute;width:28px;z-index:10}.menu-toggle span{background-color:#fff;border-radius:2px;display:block;height:3px;transition:1s;width:28px}.menu-toggle span:nth-child(2){transform-origin:0 0}.menu-toggle input:checked~span:nth-child(2){transform:rotate(45deg) translate(-1px,-1px)}.menu-toggle input:checked~span:nth-child(3){transform:scale(0)}.menu-toggle span:nth-child(4){transform-origin:0 100%}.menu-toggle input:checked~span:nth-child(4){transform:rotate(-45deg) translate(-1px)}@media screen and (max-width:1150px){.div-nb ul{align-items:center;background-color:#000;flex-direction:column;height:70vh;justify-content:space-evenly;opacity:0;padding-top:30px;position:absolute;right:0;top:0;transform:translateX(100%);transition:all 1s;z-index:-1}.div-nb .welcome{left:0;position:absolute}.div-nb ul.slide{opacity:.7;transform:translateX(0)}.menu-toggle{display:flex;position:absolute;right:20px}}.tambah-button{background-color:#2b3035;border-radius:5px;bottom:30px;box-shadow:0 0 5px .5px #000;height:55px;position:fixed;right:30px;width:55px}.icon-tambah{color:#fff;margin:0 auto}main{align-items:center;display:flex;justify-content:center;padding-top:50px;width:100vw}.card-books-container,.card-read-container,.card-unread-container{overflow-y:auto;width:100%}.card{background-color:#2b3035;display:flex;flex-direction:column;font-size:15px;margin:10px;padding:15px;width:250px}.title-book{font-size:20px;width:220px}.p-author,.p-isCompleted,.p-year{width:60px}.container-form{align-items:center;display:flex;height:calc(100vh - 60px);justify-content:center}.edit_section,.input_section{border:1px solid #000;border-radius:10px;display:flex;flex-direction:column;justify-content:center;margin:0 auto;padding:16px;width:80vw}.edit_section>h2,.input_section>h2{color:#2b3035;text-align:center}.edit_section>form>.input,.input_section>form>.input{margin:8px 0}.edit_section>form>button,.input_section>form>button{background-color:#2b3035;border:0;border-radius:5px;color:#fff;cursor:pointer;display:block;padding:8px;width:100%}.edit_section>form>button>span,.input_section>form>button>span{font-weight:700}.edit_section>form>.input>input,.input_section>form>.input>input{border-radius:5px;display:block;padding:8px;width:100%}.edit_section>form>.input>label,.input_section>form>.input>label{color:#2b3035;font-weight:700}.edit_section>form>.input_inline,.input_section>form>.input_inline{align-items:center;display:flex;margin:12px 0}.edit_section>form>.input_inline>label,.input_section>form>.input_inline>label{color:#2b3035;font-weight:700}#bookEdit,#bookSubmit{margin:0 auto;width:150px}.check-button,.delete-button,.edit-button,.undo-button{color:#000;height:30px;width:80px}