body{max-width:1440px;height:100vh;margin:0 auto;padding:20px;text-align:center;position:relative;-ms-overflow-style:none;scrollbar-width:none}body::-webkit-scrollbar{display:none}.main-header{margin-bottom:20px;display:flex;justify-content:space-between;align-items:center;border:1px solid #aaa;border-radius:4px;box-shadow:0 0 4px #0003;background:linear-gradient(#67bed8,#9dd2e2)}.main-header>*{flex:1}.main-header h1{margin-bottom:0;text-align:center;color:#324272}.main-header nav ul{display:flex;justify-content:space-evenly;list-style-type:none}.main-header nav ul li a{font-size:1.1rem;font-weight:700}.main-header nav ul li a.active{padding:6px;border-radius:4px;background-color:#324272;color:#eee}figure.logo{width:200px;position:absolute;left:50%;top:35%;transform:translate(-50%)}figure.logo:after{content:"";position:absolute;bottom:-10px;left:50%;transform:translate(-50%);width:70%;height:10px;border-radius:50%;background-color:#00000026;box-shadow:0 0 4px #0003}section.filters{margin-bottom:20px;padding:30px 0;display:flex;justify-content:space-evenly;align-items:center;flex-wrap:wrap;border:1px solid #aaa;border-radius:4px;box-shadow:0 0 4px #0003;background:linear-gradient(#67bed8,#9dd2e2);font-size:1.1rem}section.filters .filterBtns{flex:.5;display:flex;justify-content:space-evenly}section.filters .filterBtns button{width:100%}section.filters .books-total p{font-size:1.15rem;font-weight:700}section.filters input[type=search]{padding:4px;font-size:1rem}article.card{padding:20px 0;border:1px solid #aaa;border-radius:4px;box-shadow:0 0 4px #0003;background:linear-gradient(#67bed8,#9dd2e2)}article.card button{margin:0 8px;padding:6px 8px;font-family:inherit;font-size:1rem}article.card button img{width:24px;height:24px}article.card>img{box-shadow:0 0 4px #0006}section.book-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}section.book-details{max-width:50vw;min-height:60vh;margin:0 auto;padding:20px;display:flex;flex-direction:column;justify-content:space-between;border:1px solid #9c9c9c;border-radius:4px;box-shadow:0 0 4px #0003}section.book-details figure{max-width:400px;margin:0 auto}section.book-details figure img{margin-bottom:10px;border:1px solid #9c9c9c;border-radius:4px;box-shadow:0 0 4px #0003}section.book-details button{margin:0 auto}section.add-edit-book{margin-bottom:20px;padding:20px;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:hidden;border:1px solid #aaa;border-radius:4px;box-shadow:0 0 4px #0003;background:linear-gradient(#9dd2e2,#67bed8);font-size:1.1rem;transition:height .35s ease-out}section.add-edit-book div{padding:.5rem}section.add-edit-book div.alreadyReadChk{width:25rem;display:flex;align-items:center;justify-content:center}section.add-edit-book input,section.add-edit-book label{width:20rem;text-align:left;display:block;padding:.3rem}section.add-edit-book input[type=text]{padding:4px;font-size:1rem}section.add-edit-book textarea{width:100%;font-family:inherit;font-size:1rem}:root{margin:0;padding:0;border:none;box-sizing:border-box;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:#324272;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}h1,h2,h3,h4{margin-top:0}a{color:#142861}a.active{text-decoration:none}img{max-width:100%;height:auto}button.btn{margin:0 8px;padding:6px 8px;font-family:inherit;font-size:1rem;border:none;border-radius:4px;background-color:#2848a8;color:#eee;box-shadow:0 0 4px #0006;transition:background-color .35s ease-in-out}button.btn:hover{background-color:#324272;color:#eee}button.btn:active{box-shadow:none;background-color:#324272;color:#eee}
