@import url(https://fonts.googleapis.com/css2?family=Karla:wght@700&family=Roboto:wght@400;500;700&display=swap);#root,body,html{box-sizing:border-box;min-height:100%;width:100%}*,:after,:before{box-sizing:inherit}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Roboto,sans-serif;font-size:16px;font-weight:400;margin:0}h1,h2,h3,p,ul{margin:0;padding:0}ul{list-style-type:none}a{text-decoration:none}.app{min-height:100%;padding:2rem;width:100%}@media(max-width:767px){.app{padding:1.5rem}}.home-page{align-items:center;gap:2rem;margin:0 auto;max-width:1060px}.header,.home-page{display:flex;flex-direction:column}.header{gap:1rem;width:100%}.header__nav{align-self:flex-end;display:flex;gap:2rem}.header__logout-btn{background-color:transparent;border:1px solid #dadce0;border-radius:5px;color:#3c4043;cursor:pointer;font-size:11px;font-weight:700;height:20px;letter-spacing:.3px;padding:0 8px}.header__logout-btn:hover{background-color:#00b0c8;color:#fff}.header__text span{color:#00b0c8}.header__logo{align-self:center;max-height:200px;width:59%}@media(max-width:767px){.header .header__logo{width:100%}}.scroll-top__btn{align-self:flex-end;background-color:#9afd85;border:1px solid #dadce0;border-radius:5px;color:#fff;cursor:pointer;font-size:1rem;font-weight:700;letter-spacing:.3px;padding:.3rem .5rem;text-transform:uppercase}.scroll-top__btn:hover{background-color:#00b0c8;color:#000;transition:all .5s ease-in-out}.chars__wrap{display:flex;flex-direction:column;margin-top:2rem;width:100%}.chars__wrap .chars__list{grid-gap:1.5rem 1.25rem;display:grid;gap:1.5rem 1.25rem;grid-auto-rows:244px;grid-template-columns:repeat(auto-fill,240px);justify-content:space-evenly}.chars__wrap .btn{align-self:center;background-color:#00b0c8;border:none;border-radius:.3rem;box-shadow:0 1px 5px rgba(0,0,0,.1),0 3px 4px rgba(0,0,0,.12),0 2px 4px rgba(0,0,0,.14);color:#fff;cursor:pointer;font-size:.875rem;margin-top:1.25rem;min-width:101px;padding:.5rem 1.125rem;text-align:center;text-transform:uppercase}.chars__wrap .btn:hover{box-shadow:0 1px 5px #9afd85,0 3px 4px rgba(0,0,0,.12),0 2px 4px rgba(0,0,0,.14);-webkit-transform:scale(1.1);transform:scale(1.1);transition:all .3s}@media(max-width:767px){.chars__wrap .chars__list{grid-auto-rows:308px;grid-template-columns:312px}}.char-item{background:#fff;border-radius:4px;box-shadow:0 1px 5px rgba(0,0,0,.2),0 3px 4px rgba(0,0,0,.12),0 2px 4px rgba(0,0,0,.14);display:flex;flex-direction:column}.char-item__img{height:100%;max-height:168px;max-width:240px;object-fit:cover}.char-item__text-wrap{padding:12px 16px}.char-item__name{color:rgba(0,0,0,.87);font-size:20px;font-style:normal;font-weight:500;letter-spacing:.15px;line-height:30px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.char-item__species{color:rgba(0,0,0,.6);font-size:14px;font-style:normal;font-weight:400;letter-spacing:.25px;line-height:21px}.char-item:hover{box-shadow:0 5px 5px #9afd85,0 3px 4px #9afd85,0 2px 4px #9afd85;-webkit-transform:scale(1.05);transform:scale(1.05);transition:all .5s ease-in-out}@media(max-width:767px){.char-item .char-item__img{max-height:232px;max-width:312px}}.error{display:block;margin:0 auto;max-height:400px;object-fit:contain;width:400px}.search-bar{margin-top:1rem;position:relative;width:100%}.search-bar__icon{background:no-repeat 50% url(/static/media/search-icon.77cfd6eef4ae63307cd8.svg);display:inline-block;height:1.5rem;left:1rem;position:absolute;top:1rem;width:1.5rem}.search-bar__input{border:1px solid rgba(0,0,0,.5);border-radius:.5rem;color:rgba(0,0,0,.5);font-size:1rem;font-style:normal;font-weight:400;height:56px;line-height:150%;padding:1rem 1rem 1rem 3rem;width:100%}.single-char__page{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:1rem}.single-char__page .single-char__back{align-self:start;color:#000;display:flex;font-family:Karla;font-size:1.125rem;font-style:normal;font-weight:700;gap:.5rem;line-height:1.33;min-height:1.5rem;min-width:6.75rem;text-transform:uppercase}.single-char__page .single-char__back:hover{background-color:#00b0c8;border-radius:.3rem;box-shadow:0 1px 5px rgba(0,0,0,.1),0 3px 4px rgba(0,0,0,.12),0 2px 4px rgba(0,0,0,.14);transition:all .4s ease-in-out}.single-char__page .single-char__back .single-char__arrow{background:no-repeat url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABUSURBVHgB7dTLCcAgEIThPyEFpaOkE7dEO9KLoIIHEZ+wHwx4mvG0oE5jQoaVu5CXztLyn860fG15SzJ3YeBiAiH+6GMQ0ZGtR6qP3UM9Sd4WdQwPaAYzw0FN7VMAAAAASUVORK5CYII=);height:1.5rem;width:1.5rem}.single-char__page .single-char{display:flex;flex-direction:column;margin-top:3.125rem}.single-char__page .single-char__img{align-self:center;border-radius:50%;max-height:300px;max-width:300px}.single-char__page .single-char__name{color:#081f32;font-size:3rem;line-height:1.17;margin-top:1rem;text-align:center}.single-char__page .single-char__info{display:flex;flex-direction:column;gap:2rem;margin-top:28px}.single-char__page .single-char__info .single-char__back{align-self:center;font-size:1rem}.single-char__page .single-char__info-title{align-self:center;color:#8e8e93;font-size:1.25rem;font-weight:500;letter-spacing:.15px;line-height:1.2}.single-char__page .single-char__descr,.single-char__page .single-char__item{display:flex;flex-direction:column}.single-char__page .single-char__item{border-bottom:1px solid rgba(33,33,33,.08);color:#6e798c;font-size:1.14rem;font-weight:400;height:64px;justify-content:center;letter-spacing:.25px;line-height:1.25}.single-char__page .single-char__item_bold{color:#081f32;font-size:1rem;font-weight:700;letter-spacing:.15px;line-height:1.5}@media(max-width:767px){.single-char__page .single-char__img{max-width:150px}.single-char__page .single-char__name{font-size:1.5rem}.single-char__page .single-char{margin:0}.single-char__page .single-char__back_hide{display:none}}
/*# sourceMappingURL=main.fa53ce41.css.map*/