body{
    font-family: 'Poppins', sans-serif;
    max-width: 1280px;
    margin: 0 auto;
    background-color: #5e5b5bad;
    color:#333;
}
header{
    background-color: #800000;
    display:flex;
    justify-content: space-between;
    padding:25px;
}
h1{
    color:#eee;
}
header img{
    width:30px;
}
button {
    border:none;
    background:none;
    cursor:pointer;
}
.theme:hover{
    cursor: pointer;
    transform: rotate(360deg) scale(1.2);
    transition: 0.5s;
    transform-origin: center;
}
.theme{
    transition: width 0.7s ease-in-out;
}
.logo:hover{
    cursor: pointer;
    transform: scale(1.2);
    transform-origin: center;
}
main{
    background-color:#faebdf;
    padding: 25px;
}
.list{
    display:flex;
    flex-wrap:wrap;
    gap:30px;
    justify-content: center;
}
.carta-pokemon{
    background-color: #ffc6c6;
    width:200px;
    padding:15px;
    display:flex;
    flex-direction: column;
    align-items:center;
    gap:15px;
    border-radius:15px;
    justify-content: center;
}
.carta-pokemon:hover{
    background-color: #96d9d6;
    transform: scale(1.05);
    transition: 0.2s ease-in-out;
    cursor:default;
}
.info{
    justify-content: center;
}
span{
    background-color:#fff1f1;
    padding:3px;
    border-radius:4px;
    text-transform: uppercase;
    font-size:15px;
}
span + span{
    margin-left: 5px;
}
.gif{
    width:70px;
    /*height:90px;*/
}
.types{
    display:flex;
}
li{
    list-style-type: none;
}
.normal {
    background-color: #A8A77A;
}
.fogo {
    background-color: #EE8130;
}
.agua {
    background-color: #6390F0;
}
.eletrico {
    background-color: #F7D02C;
}
.grama {
    background-color: #7AC74C;
}
.gelo {
    background-color: #96D9D6;
}
.lutador {
    background-color: #C22E28;
}
.veneno {
    background-color: #A33EA1;
}
.terrestre {
    background-color: #E2BF65;
}
.voador {
    background-color: #A98FF3;
}
.psiquico {
    background-color: #F95587;
}
.inseto {
    background-color: #A6B91A;
}
.pedra {
    background-color: #B6A136;
}
.fantasma {
    background-color: #735797;
}
.dragao {
    background-color: #6F35FC;
}
.sombrio {
    background-color: #705746;
}
.metal {
    background-color: #B7B7CE;
}
.fada {
    background-color: #D685AD;
}
.types li + li{
    margin-left:5px;
}
.types li{
    border-radius:5px;
    padding:2px;
}
.description{
    max-height: 80px;
    overflow-y:scroll;
    font-size:14px;
    padding-right:10px;
}

body.dark{
    background-color:#212121;
    color:#f5f5f5;
}
.dark .carta-pokemon{
    background-color: #a8a8a8;
}
.dark span{
    background-color:#464545;
}
.dark main{
    background-color:#faebdf38;
}
.main-pokemon{
    justify-content: center;
    padding-left:40%;
}
.pokePhoto{
    width:130px;
    margin-left:6%;
    justify-self: center;
}
.evolvesTo{
    justify-content: center;
    display: flex;
    flex-direction: column;
}
.closeButton img{
    width:40px;
}
#description{
    justify-self:center;
    text-align:center;
    margin-left: -65%;
}
#types{
    justify-self:center;
    margin-left:6%;
}
#types li +  li{
    margin-left:20px;
}
h3{
    margin-left:10.47%;
}