.cards{
    display:flex;
    justify-content: space-around;
    padding-top: 20px;
} 

.cards img{
    margin-top: 30px;
}
.cards p{
    font-size: 23px;
}

.card2, .card5, .card8, .card3, .card6, .card9{
    margin-top: 35px;
}

.pags{
    padding-top: 80px;
    font-size: 23px;
    display: flex;
    justify-content: center;
    list-style: none;
}

.pags ul {
    list-style: none;
    display: flex;
    padding: 0;
    margin: 0;
    justify-content: center;
    border-bottom: var(--line);
    padding-top: 10px;
    padding-bottom: 30px;
}

.pags li {
    text-align: center;
    margin-right: 15px;
    margin-top: 10px;
    padding: 10px;
    width: fit-content;
    border-radius: 10px;
}

.pags li:hover {
    background-color: var(--inputclr);
}

.pags a {
    color: var(--black);
    text-decoration: none;
}

.topimg {
    width:100%;
}

.topimg img{
    width:100%;
}

@media (min-width: 768px) and (max-width: 1199px) {
    .cards {
        display:flex;
        justify-content: center;
        align-items: center;
    }

    .cards img {
        width: 70%;
        height: auto;
        display:flex;
        justify-content: center;
        align-items: center;
    }

    .cards p,
    .cards h3 {
        font-size:15px;
        width: 70%;
    }

    .card1, .card2, .card3, .card4, .card5, .card6, .card7, .card8, .card9 {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        text-align: center;
    }
}   
/* Celular */
@media (max-width: 768px) {
    .cards {
        flex-wrap: wrap;
        gap: 20px;
        justify-content: center;
    }

    .cards p, .cards h3 {
        font-size: 18px;
        text-align: center;
    }

    .pags {
        font-size: 18px;
        padding-top:50px;
    }

    .topimg img{
        height:200px;
        object-fit: cover;
    }
}