@import"https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap";.App{min-height:100vh;position:relative;padding-bottom:110px}.pokedex{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100vh;padding:20px}.pokedex-header{padding-bottom:15px}.pokedex-img{margin-bottom:20px;max-width:450px}.pokedex-subtitle{text-align:center;color:var(--color-red);font-size:2rem;margin-bottom:20px}.pokedex-text{text-align:center}.pokedex-form{display:flex;align-items:center;flex-wrap:wrap;justify-content:center}.form-arrow-init{position:absolute;width:fit-content;height:0;left:48%;margin-top:-50px;max-height:600px;display:flex}.form-balloon-init{transform:translate(-50%);position:absolute;width:300px;height:25px;top:-10px;border-radius:2em;font-family:sans-serif;z-index:1;background-color:#fff;filter:drop-shadow(0px 0px 1px black);font-family:Gill Sans,Gill Sans MT,Calibri,Trebuchet MS,sans-serif;text-align:center;font-size:20px;color:#443a3a}.form-balloon-init:before{content:"";position:absolute;z-index:-1;width:15px;height:15px;top:15px;left:150px;background-color:#fff;transform:skew(45deg);rotate:60deg}.pokedex-input{padding:5px 12px;box-shadow:-1px 2px 7px #004;height:30px}.pokedex-btn{padding:5px 20px;color:var(--color-white);background-color:var(--color-red);box-shadow:0 2px 7px #004;height:30px}.pokedex-btn:hover{filter:brightness(1.1);cursor:pointer}.pokeid-body{display:flex;justify-content:center;margin-bottom:30px}.pokeid-topline{height:25px;width:100%;background-color:#222;border-top:12px solid var(--color-red);position:absolute}.pokeid-buttons{background-color:#ebdcdc;height:50px;width:100%;z-index:1;position:absolute;display:flex;justify-content:space-between;margin-top:25px;padding:5px 5px 0}.pokeid-button-back,.pokeid-button-next,.pokeid-button-home{width:20%;height:40px;max-width:175px;background-color:var(--color-red);color:#fff;font-weight:600;font-size:large;position:absolute;top:18px}.pokeid-button-back{box-shadow:-3px 5px 5px #0008}.pokeid-button-next{box-shadow:3px 5px 5px #0008}.pokeid-button-home{box-shadow:0 5px 15px #0008}.pokeid-button-home{height:fit-content;top:18px;min-width:80px;font-size:17px;padding-top:5px}.pokeid-button-back{left:3%;border-radius:15px 3px 3px 15px}.pokeid-button-next{right:3%;border-radius:3px 15px 15px 3px}.pokeid-button-home{background-color:green;left:50%;transform:translate(-50%);border-radius:3px}.pokeid-button-back:hover,.pokeid-button-next:hover,.pokeid-button-home:hover{cursor:pointer}.pokeid-container{width:80%;justify-self:center;border:5px solid var(--color-red);border-radius:20px;margin-top:110px;padding:5px}.pokeid-header{display:flex;flex-direction:column;align-items:center;position:relative}.pokeid-background{height:200px;width:100%;position:absolute;z-index:-1;border-top-left-radius:10px;border-top-right-radius:10px}.pokeid-image{width:150px;position:absolute;transform:translateY(80px)}.pokeid-id{box-shadow:1px 2px 8px #222;border-radius:10px;margin-top:240px;padding-left:3px;padding-right:5px;width:fit-content;color:#303530;font-size:22px}.pokeid-qualities{font-size:13px;display:flex;flex-direction:column;align-items:center;margin-top:15px;text-align:center;border-radius:20px}.pokeid-name{text-transform:uppercase;letter-spacing:5px;color:#fff;text-shadow:2px 0 red,-2px 0 red,0 2px red,0 -2px red,1px 1px red,-1px -1px red,1px -1px red,-1px 1px red;font-size:32px;margin-bottom:8px}.pokeid-qualities-name{display:flex;flex-direction:row;justify-content:center;gap:30px;margin-bottom:20px;background-color:#f1bf1971;padding:5px}.pokeid-type-abilities{display:flex;flex-direction:column;align-items:center;width:100%;text-align:center}.pokeid-type{width:95%;margin-bottom:10px;border-radius:5px;color:#fff;padding:10px}.pokeid-type-name{font-size:22px;text-transform:uppercase}.pokeid-type-types{font-size:20px}.pokeid-abilities-container{background-color:#ce33338f;width:95%;border-radius:5px;padding-bottom:8px;padding-top:8px;margin-bottom:20px}.pokeid-abilities-title{text-transform:uppercase;margin-bottom:5px}.pokeid-abilities{display:flex;justify-content:center;width:100%;text-transform:capitalize;gap:5%}.pokeid-abilities-name{margin-left:8px;margin-right:8px;font-size:18px;width:fit-content}.pokeid-stats-title{font-size:30px;border-top:5px solid red;margin-left:10px;margin-right:10px}.progress-name{text-transform:capitalize;align-self:flex-start;padding-left:10%}.progress-container{display:flex;flex-direction:column;align-items:center;margin-bottom:10px}.progress-bar{width:80%;position:relative;border-radius:10px;border:3px solid rgb(255,2,2);display:flex;justify-content:space-between}.progress{border-bottom-left-radius:8px;border-top-left-radius:8px;background-image:linear-gradient(270deg,#ff7d9c 0,#ff818a 6.25%,#ff8779 12.5%,#ff8e68 18.75%,#ff9659 25%,#ff9d4a 31.25%,#ffa53c 37.5%,#ffad2f 43.75%,#fab423 50%,#ebbb1a 56.25%,#dac117 62.5%,#c9c71c 68.75%,#b6cc27 75%,#a2d034 81.25%,#8dd442 87.5%,#74d752 93.75%,#56da63 100%)}.error-id{height:80vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}.error-not-found{font-size:30px;width:80%;margin-bottom:50px}.error-return{background-color:#ff00006b;padding:10px;border-radius:5px}.error-return-pokedex:hover,.error-return-home:hover{cursor:pointer;color:#fff;transform:scale(1.05)}@media (min-width: 440px){.pokeid-button-back,.pokeid-button-next{font-size:25px}.pokeid-button-home{font-size:20px}.pokeid-image{width:170px}.pokeid-id{margin-top:260px}}@media (min-width: 640px){.pokeid-button-home{font-size:25px;padding:0;top:8px}.pokeid-type-name{font-size:25px}.pokeid-abilities-title{font-size:23px}.pokeid-abilities{gap:20%}.pokeid-abilities-name{font-size:22px}.pokeid-image{width:230px;transform:translateY(40px)}.pokeid-id{margin-top:280px}.pokeid-name{font-size:50px;margin-top:10px;margin-bottom:15px}}.card-container{display:flex;flex-wrap:wrap;justify-content:center}.card-poke,.loader{max-width:100%;max-width:400px;border-radius:30px;border:10px solid rgb(255,46,46);background-color:#d2eafa;margin:20px}.img-loader{border-radius:20px}.card-poke:hover{cursor:pointer}.card-poke-header{height:200px;position:relative;margin-bottom:50px;border-top-right-radius:17px;border-top-left-radius:17px}.card-poke-sprite{width:50%;position:absolute;top:60px;left:50%;transform:translate(-50%)}.card-poke-body{margin-bottom:30px}.card-poke-name{text-transform:capitalize;text-align:center;font-size:2rem;font-family:Franklin Gothic Medium,Arial Narrow,Arial,sans-serif;font-weight:500;font-size:30px;line-height:29px}.card-poke-types-container{display:flex;justify-content:center;gap:15px}.card-poke-type{font-size:17px;text-transform:capitalize;position:relative;font-weight:600}.card-poke-type:nth-child(2):before{content:"/";position:absolute;left:-10px;font-weight:900}.card-poke-type-label{text-align:center;font-size:14px;color:#999;margin-bottom:30px;font-weight:800}.card-poke-stats-container{display:grid;grid-template-columns:repeat(3,1fr);gap:20px 5px;justify-content:center;padding:0 5px 35px;align-items:center;text-align:center}.card-poke-stat{display:flex;gap:5px;flex-direction:column;align-items:center}.card-poke-stat-label{color:#999;text-transform:uppercase;font-size:12px;font-weight:600;text-decoration:underline}.card-poke-stat-number{font-size:18px;font-weight:500}.border-grass{border-color:#58cc77}.bg-grass{background:linear-gradient(178.92deg,#7EC6C5 .92%,#2b7252 57.96%,#338561 99.08%)}.letter-grass{color:#416460}.border-fire{border-color:#e75c35}.bg-fire{background:linear-gradient(176.37deg,#e5ff86 -32.26%,#E35825 57.55%,#e9a71a 125.72%)}.letter-fire{color:#e75c35}.border-water{border-color:#4187e4}.bg-water{background:linear-gradient(179.57deg,#133258 -10.14%,#1479FB 50.16%,#0f1d30 130.85%)}.letter-water{color:#1479fb}.border-bug{border-color:#4ab648}.bg-bug{background:linear-gradient(177.56deg,#a5fd00 -58.92%,#60961b 37.57%,#AAFFA8 130.53%)}.letter-bug{color:#4ab648}.border-normal{border-color:#573c42}.bg-normal{background:linear-gradient(181.51deg,#4b2730 -11.44%,#c4929d 53.95%,#4b2029 170.11%)}.letter-normal{color:#735259}.border-fighting{border-color:#96402a}.bg-fighting{background:linear-gradient(176.83deg,#a01414 -8.78%,#fc4727 55.09%,#070201 130.33%)}.letter-fighting{color:#96402a}.border-ground{border-color:#654008}.bg-ground{background:linear-gradient(179.75deg,#422b07 -11.96%,#e99f29 52.67%,#0c0801 138.4%)}.letter-ground{color:#654008}.border-rock{border-color:#6e6c6c}.bg-rock{background:linear-gradient(177.03deg,#524b4b -11.97%,#b7b7c9 45.49%,#332a2a 135.64%)}.letter-rock{color:#6e6c6c}.border-ghost{border-color:#323569}.bg-ghost{background:linear-gradient(177.03deg,#323569 30.97%,#b6b8d6 55.49%,#787DDA 135.64%)}.letter-ghost{color:#323569}.border-electric{border-color:#0c1395}.bg-electric{background:linear-gradient(179.75deg,#c41aca -19.96%,#b29ac5 43.67%,#12132c 138.4%)}.letter-electric{color:#0c1395}.border-psychic{border-color:#7c227c}.bg-psychic{background:linear-gradient(179.75deg,#540a57 10.96%,#f132d2 55.67%,#5a0d4d 138.4%)}.letter-psychic{color:#7c227c}.border-ice{border-color:#6fbedf}.bg-ice{background:linear-gradient(177.03deg,#6FBEDF -11.97%,#64CBF5 47.77%,#BDEBFE 136.72%)}.letter-ice{color:#5494af}.border-dark{border-color:#030706}.bg-dark{background:linear-gradient(177.03deg,#030706 -11.97%,#0D1211 57.49%,#5A5E5D 135.64%)}.letter-dark{color:#030706}.border-poison{border-color:#030706}.bg-poison{background:linear-gradient(177.03deg,#3cff46 -11.97%,#f11860 50.49%,#000000 80.64%)}.letter-poison{color:#030706}.border-dragon{border-color:#ad8120}.bg-dragon{background:linear-gradient(177.03deg,#3a2817 -11.97%,#945a20 57.49%,#f5dc01 135.64%)}.letter-dragon{color:#8b691d}.border-fairy{border-color:#971b45}.bg-fairy{background:linear-gradient(179.75deg,#f0a0ba -11.96%,#c0197a 57.67%,#290b14 138.4%)}.letter-fairy{color:#971b45}@media (max-width: 2000px){.card-poke,.loader{width:300px;height:450px}.card-poke-header{height:120px;margin-bottom:50px}.card-poke-sprite{width:110px}.card-poke-name{font-size:28px}.card-poke-type{font-size:16px}.card-poke-type-label{font-size:15px;margin-bottom:20px}.card-poke-stat-label{font-size:15px}.card-poke-stat-number{font-size:15px;font-weight:600}}@media (max-width: 1025px){.card-poke,.loader{width:230px;height:350px}.card-poke-header{height:120px;margin-bottom:10px}.card-poke-sprite{width:80px}.card-poke-name{font-size:20px}.card-poke-type{font-size:13px}.card-poke-type-label{font-size:12px;margin-bottom:10px}.card-poke-stat-label{font-size:12px}.card-poke-stat-number{font-size:15px}}.pagination{margin-left:auto;margin-right:auto;display:flex;gap:10px;justify-content:center;width:100%}.pagination-container{display:flex;flex-wrap:wrap;justify-content:center;gap:5px}.pagination-prev,.pagination-next,.pagination-page{width:40px;display:flex;justify-content:center;align-items:center;aspect-ratio:1}.pagination-active{background-color:red;color:#fff;border-radius:5px}.pagination-inactive{background-color:#d8c6c6;color:#fff;border-radius:5px}.pagination-page,.pagination-active:hover{cursor:pointer}@media (max-width: 530px){.pagination-container{gap:2px}.pagination-prev,.pagination-next{max-height:40px}.pagination-page{max-height:25px}}.poke-header{height:200px;display:flex;flex-direction:column;justify-content:center;align-items:center;background-image:url(https://images.wikidexcdn.net/mwuploads/wikidex/e/e6/latest/20171001182738/EP946_Bosque_de_Melemele.png);border-top:8px solid #f04848;border-bottom:8px solid #f04848;background-size:100%}.pokedex-title{color:#fff;font-size:60px;text-shadow:5px 1px #be0e0e}.pokedex-welcome{font-weight:bolder;font-size:20px;color:#e4d3d3;text-align:center}.welcome-span{font-family:Cambria,Cochin,Georgia,Times,Times New Roman,serif;font-size:27px;color:#fff;font-weight:bolder}.pokeform-container{position:relative;width:100%}.pokemon-form{display:flex;width:100%;height:50px;justify-content:center;align-items:center;background-color:red;border-left:4px solid white;border-right:4px solid white;border-bottom:4px solid red}.pokemon-input-form{height:25px;border-top-left-radius:10px;border-bottom-left-radius:10px}.pokemon-input-form::placeholder{padding-left:10px}.pokemon-button-form{height:25px;border-top-right-radius:10px;border-bottom-right-radius:10px;color:red;background-color:#fff;font-weight:900;font-family:Franklin Gothic Medium,Arial Narrow,Arial,sans-serif;font-size:18px;border-left:5px solid red}.pokemon-button-form:hover{cursor:pointer}.form-arrow{position:absolute;width:fit-content;height:0;left:50%;max-height:600px;display:flex}.form-arrow-hide{display:none;transform:translateY(10px)}.form-arrow-show{display:flex;transform:translateY(-10px);transition-duration:.2s}.form-balloon{transform:translate(-50%);position:absolute;width:250px;height:25px;top:-10px;border-radius:2em;font-family:sans-serif;z-index:1;background-color:#fff;filter:drop-shadow(0px 0px 1px black);font-family:Gill Sans,Gill Sans MT,Calibri,Trebuchet MS,sans-serif;text-align:center;font-size:20px;color:#443a3a}.form-balloon:before{content:"";position:absolute;z-index:-1;width:15px;height:15px;top:15px;left:150px;background-color:#fff;transform:skew(45deg);rotate:60deg}.pokemon-selection{display:flex;justify-content:center;height:35px;margin-top:8px;margin-bottom:20px}.pokemon-list{border-style:none;background-color:red;color:#fff;font-family:Lucida Sans,Lucida Sans Regular,Lucida Grande,Lucida Sans Unicode,Geneva,Verdana,sans-serif;font-size:18px;font-weight:500;border-radius:8px;text-align:center;text-transform:capitalize;width:180px}.pokemon-list:hover{cursor:pointer}.pokemon-type{background-color:#fff;color:red;font-weight:900}.footer-red{background-color:var(--color-red);width:100%;height:100px;position:absolute;bottom:0;left:0}.footer-black{background-color:#222;width:100%;height:40px;position:absolute;bottom:0;left:0}.footer-circle{width:70px;aspect-ratio:1;position:absolute;background-color:#222;border-radius:50%;bottom:0;left:50%;transform:translate(-50%)}.footer-circle-int{width:50px;aspect-ratio:1;position:absolute;background-color:#222;border-radius:50%;left:50%;transform:translate(-50%,40px);border:10px solid white}:root{--color-red:#D93F3F;--color-white: white}*{box-sizing:border-box}body{margin:0;font-family:Inter,sans-serif}h1,h2,h3,h4,p,ul{margin-top:0;margin-bottom:0}ul{padding-left:0;list-style:none}img{display:block;width:100%}input{outline:none}a{font-family:inherit;text-decoration:none}input{outline:none;border:none}button{border:none}