@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&family=Manrope:wght@200;300;400;500;600;700;800&family=Oswald:wght@300;500&family=Roboto:wght@100;300;400;500;700;900&display=swap";.title{background:-webkit-linear-gradient(0deg,#d5c1b4 1%,#242424 99%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-size:3rem;font-weight:900;user-select:none}.title-container{display:flex;justify-content:center;align-items:center;height:20vh}.search-container{position:relative;display:flex;justify-content:center;align-items:center;height:10vh;width:100%;color:#d5c1b4;font-size:24px}.search-container input:focus{width:50vw;border-radius:0;border-bottom:1px solid #d5c1b4;background:#222;color:#d5c1b4;font-weight:600;padding:0 1rem;outline:none}input:focus~.search-icon{position:absolute;right:26%}.search-container input{width:15vw;height:5vh;background:#222;outline:none;border:none;color:#999;font-weight:600;border-radius:15px;padding:0 1rem;transition:all .5s ease-in-out}.search-icon{position:absolute;right:43%;transition:all .5s ease-in-out}.search-icon:hover{cursor:pointer;transform:scale(1.3)}.movie-container{display:grid;grid-template-columns:repeat(4,300px);grid-gap:50px;align-items:center;justify-content:center;margin-top:30px;margin-bottom:100px}.movie-error{color:#d5c1b4;font-size:32px;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}@media screen and (max-width: 1400px){.movie-container{grid-template-columns:repeat(3,300px)}}@media screen and (max-width: 1200px){.movie-container{grid-template-columns:repeat(2,300px)}}@media screen and (max-width: 700px){.movie-container{grid-template-columns:repeat(1,300px)}}.movie-loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:#d5c1b4;font-size:32px;opacity:.7}.movie-loading svg{animation:rotate 2s linear infinite}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.image{width:300px;height:300px;margin-bottom:-5px}.container{display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:10px;width:300px;overflow:hidden;box-shadow:#00000059 0 5px 25px;transition:all .3s ease-in-out}.container:hover{transform:translateY(-5px);cursor:pointer}.details{background:#333;width:100%;padding:10px;line-height:25px}.category{color:#aaa;font-size:12px;letter-spacing:1px;text-transform:uppercase}.movie-title{color:#d5c1b4;font-weight:700}.year{color:#aaa;font-size:12px;letter-spacing:1px;text-transform:uppercase}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Roboto,sans-serif;background-color:#242424}