body,html{padding:0;margin:0;background-image:linear-gradient(to right,#C9BAA5,#795833);color:#d3d3d3;font-family:Playfair Display,serif}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scroll-in-right{0%{transform:translate(100%)}to{transform:translate(0)}}.front-img-container{background-image:url(/assets/front-img-5e67244e.jpg);height:100vh;width:100vw;background-size:cover;background-repeat:no-repeat;background-position:center;overflow:hidden;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;animation:fadeIn 1.5s ease-in}.front-img{background-size:100%}.front-content{display:flex;flex-direction:column;text-align:center;padding-top:350px;transition:1s ease}.fade{opacity:0;transition:opacity 1s ease;animation:fadeIn 3s ease forwards}.test{margin-top:0;text-shadow:2px 2px 2px black;transition:1s ease;animation:scroll-in-right 1s ease forwards}.text.scrolling{height:100%}.header{background-image:url(/assets/books-d3eee232.jpg);height:400px;background-position:center;background-repeat:no-repeat;background-size:cover;animation:fadeIn 2s ease-in}.header-img{height:450px;width:100%;background-position:center}.header-text{text-align:center;margin-top:7rem;padding-top:0}.discover-text{margin-bottom:-15px;margin-top:125px;color:#b9b9b9}.no-books-container{display:flex;flex-direction:column;align-items:center;margin-top:100px;animation:fadeIn 3s ease-in}.no-results-container{text-align:center}.main-content{animation:fadeIn 2s ease-in}.selector-container{display:flex;justify-content:center;margin-top:10px;margin-bottom:-10px;animation:fadeIn 2.5s ease-in}.selector{text-align:center;background-color:transparent;color:#d3d3d3;font-size:1.1rem}ul{display:flex;flex-wrap:wrap;justify-content:center;padding:0;animation:fadeIn 3s ease-in}li{display:flex;align-items:center;justify-content:center;width:20%;height:350px;border:6px solid #452600;border-radius:20px;box-shadow:5px 5px 10px #000;margin-bottom:20px;overflow:hidden;margin-left:1rem;margin-right:1rem;margin:0 1rem 1.2rem;animation:fadeIn 1s ease-in}.search-container{text-align:center;margin:1em 0;animation:fadeIn 2.5s ease-in}.search-box{width:75%;padding:.5rem}.book-img-container{width:50%;height:100%;background-color:#c9baa5;box-shadow:-5px 0 10px #0000001a;border-right:1px solid #333;display:flex;justify-content:center;align-items:center;padding:0 5px}.book-img{max-width:100%;max-height:100%;height:200px}.book-img:hover{transform:scale(1.1)}.book-right{width:50%;height:100%;background-color:transparent;box-shadow:5px 0 10px #0000001a}.book-info{display:flex;flex-direction:column;align-items:center;padding:2px;text-shadow:1px 1px 2px rgba(255,255,255,.5)}.title{font-size:18px;font-weight:700;text-align:center}.title-link{text-decoration:none}.title:hover{transform:scale(1.1);cursor:pointer}.title-link,.author,.rating,.description{color:#d3d3d3;font-family:Arial,Helvetica,sans-serif}.description{font-size:.8rem;margin:2px}.rating-container{padding-right:1rem;text-align:right}.rating{margin:0 0 6px}.author{font-size:14px;font-style:italic}.author-id{font-weight:bolder;font-style:normal}input{background-color:#795833;border-radius:8px;border:1px solid #C9BAA5}input:hover,input:focus{background-color:#c9baa5;outline:none}input::placeholder{color:#d3d3d3}input[type=radio]:checked{-webkit-appearance:none;width:16px;height:16px;border:2px solid gray;background-color:#000}button{cursor:pointer}.header-btns{display:flex;justify-content:end;align-self:flex-end;margin-right:1rem}.header-btn{border:none;background-color:transparent;font-size:x-large}.header-btn,.header-text{color:#c5c2c2;text-shadow:3px 1px rgb(0,0,0)}.header-btn:hover{transform:scale(1.1)}.readlist-btn{background-color:#333;color:#d3d3d3;border:none;border-radius:5px;padding:10px 20px;font-size:14px;cursor:pointer;margin-top:20px}.readlist-btn:hover{background-color:#4d4c4c}@media (max-width: 613px){.front-content{margin-top:-150px}.header-text{margin-top:-4.5rem}.title{font-size:.8rem}.rating,.description,.author{font-size:.7rem}.no-books-container{margin-top:2rem}.header{height:250px}}@media (max-width: 1660px){li{width:60%}}@media (min-width: 1660px){.search-container{width:70%;margin:1rem auto}}
