*{margin:0;padding:0;box-sizing:border-box;font-family:"Roboto",sans-serif}a{text-decoration:none}.layout__container{background-color:#759b97;min-height:100vh;display:grid;grid-template:auto 1fr/1fr;grid-template-areas:"header""content"}.header__container{background-image:url(/static/media/hero-bg.e7c14892.jpg);background-position:50%;background-repeat:no-repeat;background-size:cover;height:150px;width:100%}.header__container,.header__image{display:flex;justify-content:center;align-items:center}.header__image{height:inherit}.header__image img{height:90%}.header__container:focus,.header__image:focus{outline:none}@media screen and (max-width:480px){.header__image img{height:75%;margin-left:5px}}.home__container{display:grid;grid-template:auto 1fr auto/1fr}.home__searchbar{position:-webkit-sticky;position:sticky;top:1.2rem}.home__button{margin-bottom:15px;display:flex;justify-content:center;align-items:center}@media screen and (max-width:480px){.home__searchbar{top:.5rem;left:0}}.searchbar{margin-top:1rem;display:flex;justify-content:center;align-items:center}.input{background-color:#d3eceb;border:1px solid #d7df62;border-radius:20px 0 0 20px;height:3rem;width:450px;padding-left:30px;font-size:18px;box-shadow:0 0 10px 0 #d7df62}.input:focus{outline:none}.input::-webkit-input-placeholder{font-size:18px}.input:-ms-input-placeholder{font-size:18px}.input::-ms-input-placeholder{font-size:18px}.input::placeholder{font-size:18px}.button{background-color:#3a484b;border:none;border-radius:0 20px 20px 0;color:#d3eceb;font-size:18px;height:3rem;width:95px;box-shadow:0 0 10px 0 #d7df62}.button:focus{outline:none}.button:hover{cursor:pointer;border:1px solid #d7df62;box-shadow:0 0 20px 0 #d7df62}@media screen and (max-width:480px){.searchbar{margin-left:15px;justify-content:flex-start}.input{width:260px}.button{width:80px}}.results__container{margin-top:15px;margin-bottom:25px;display:grid;grid-template-columns:repeat(3,1fr);grid-row-gap:25px}@media screen and (max-width:1150px){.results__container{grid-template-columns:repeat(2,1fr)}}@media screen and (max-width:768px){.results__container{grid-template-columns:1fr}}.card__container{background-color:#3a484b;border-radius:15px;height:450px;width:360px;padding:36px 38px;margin:0 auto;box-shadow:2px 5px 15px 0 #d7df62;display:grid}.card__container:hover{cursor:pointer;box-shadow:2px 5px 35px 0 #d7df62}.card__container p{color:#d3eceb}.char-name{font-size:22px}.char-origin{font-size:18px}.char-status{font-size:16px}.card__image img{border-radius:15px;width:284px}@media screen and (max-width:480px){.card__container{height:420px;width:340px;margin:initial;margin-left:15px;padding:25px}}.error__container{text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center}.error__container .first{color:#3a484b;font-size:2.5rem;margin-bottom:1rem}.error__container .second{color:#d3eceb;font-size:2.2rem;margin-bottom:1rem}.error__container .third{color:#d3eceb;font-size:1.8rem;margin-bottom:2rem}.button__container{background-color:#3a484b;border-radius:20px;color:#d3eceb;font-size:20px;height:3rem;width:290px;box-shadow:0 0 10px 0 #d7df62;display:flex;justify-content:center;align-items:center}.button__container:hover{cursor:pointer;box-shadow:0 0 20px 0 #d7df62}.loader__container{display:flex;justify-content:center;align-items:center}.character__container{color:#d3eceb;margin-top:2.5rem;display:grid;grid-template:auto auto 1fr/repeat(2,1fr);grid-template-areas:"photo data" "photo similars" "button button"}.character__image{grid-area:photo;display:flex;justify-content:center;align-items:flex-start}.character__image img{border:1px solid #d7df62;border-radius:15px;width:55%;box-shadow:0 0 15px 0 #d7df62}.character__data{grid-area:data}.char__name{font-size:2.5rem;margin-bottom:2rem}.char__species{font-size:2.2rem;margin-bottom:2rem}.char__status{font-size:1.8rem}.similars{grid-area:similars}.character__button{grid-area:button}.character__button,.container{justify-self:center;align-self:center}.container{text-align:center;width:80%;display:grid;grid-template:repeat(3,80px)/1fr;justify-content:center;align-items:center}.title{font-size:2.8rem}.container p{font-size:1.8rem}.container__button{display:flex;justify-content:center;align-items:center}
/*# sourceMappingURL=main.98d6a215.chunk.css.map */