/* Control de la altura de contenedores */

body{
    height: 100vh;
}


/* 1° PANTALLA */

.cards-container{
    grid-template-columns: repeat(3, 1fr);
    /*column-gap: 15px;*/
    row-gap: 25px;
}

.card-mokepon div:nth-child(2){
    row-gap: 5px;
}

main{
    width: 90%;
    padding: 20px 15px 20px 15px;
}
#seleccionar-mascota{
    height: 100vh;
    padding: 30px 30px 40px 30px;
}

.btn-style3{
    padding: 25px 5px;

}

.text-button{
    font-size: 15px;
}

/* 2° PANTALLA */

#seleccionar-ataque{
    width: 95%;
    height: 100vh;
    padding: 12px 15px 118px 15px;
    row-gap: 50px;
}

#seleccionar-ataque > .btn-screen1{
    top: 20%;
    left: calc(50% - 72.23px);
}

#seleccionar-ataque > .btn-screen2{
    top: 20%;
    left: calc(50% - 72.23px);
}

#seleccionar-ataque > div:nth-child(2){
    padding: 0px 0px;
}

.card-mokepon-juego > div:nth-child(2) > div > div{
    width: 150px;
    height: 150px;
}

.card-mokepon-juego > div:nth-child(3){
    width: 80%;
}

.card-mokepon-juego{
    padding: 20px 0px 20px 0px;
    border-bottom-left-radius: 60px;
}

.text-mokepon-subtitles{
    display: none;
}

.card-mokepon-juego > div:nth-child(3) > div:nth-child(3){

    justify-content: center; 
}

#mostrar-mensajes{
    top: 590px;
    width: 100%;
    padding: 15px 45px;
}

#mostrar-mensajes > div > div > div {
    row-gap: 0;
    padding: 25px 15px 5px 15px;
}

.boton-flotante-r10-t20 {
    right: 5%;
}