.waitWhileLoading { font-size: 18px; text-align: center; color: white; } .inputContainer { display: flex; align-items: center; margin: 0 0.3rem 0 0.3rem; } .inputContainer button { margin: 5px; background-color: #121212; padding: 10px; border-radius: 10px; outline: none; border: none; color: white; font-family: "Lexend Deca", serif; } .inputContainer button a { text-decoration: none; color: white; } .searchContainer input { border: none; border-radius: 5px; color: white; outline: none; background: none; width: 100%; font-family: "Lexend Deca", serif; font-size: 16px; } .searchContainer { display: flex; align-items: center; justify-content: center; margin: 20px 0px 20px 0px; background-color: #121212; padding: 10px; border-radius: 10px; width: 30%; } .searchIcon { color: white; margin-right: 5px; } .animeEntry { display: flex; overflow-x: auto; margin-bottom: 1rem; margin-left: 0.5rem; } .animeEntry:hover .anime { opacity: 0.5; } .animeEntry:hover .anime:hover { opacity: 1; background-color: #292929; } .animeEntry::-webkit-scrollbar { height: 5px; } .animeEntry::-webkit-scrollbar-track { background-color: #636363; border-radius: 5px; } .animeEntry::-webkit-scrollbar-thumb { background-color: rgba(196, 196, 196, 0.692); border-radius: 5px; } .anime { display: flex; justify-content: space-between; align-items: center; padding: 5px; margin: 0 10px 0 0; border-radius: 0.5rem; transition: opacity 200ms ease-in, background-color 200ms linear; background-color: #242424d0; } .anime p { color: white; width: 20dvw; font-size: 18px; } .animeImage { border-radius: 0.5rem; } @media screen and (max-width: 768px) { .searchContainer { width: 100%; } .anime p { width: 50dvw; } }