.infos{
    width: 100%;
    height: 75vh;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 3rem;
    padding: 0 20px;
    font-family: "Kaisei Decol", serif;
   
}

.sobretexto{
    line-height: 1.5;
    letter-spacing: .5px;
}

.sobretexto h3{
    color: var(--color-aqua-green);
    font-size: 4rem;
    padding-bottom: 1.5rem;
}

.sobretexto p{
    color: var(--color-light);
    font-size: 2rem;
}

.sobreimagem img{
    height: 70vh;
    border-radius: 5rem;
}



.box{
    position: relative;
}


.box .cards{
    width: 70vw;
    height: 80vh;
    margin: 8rem auto;
    overflow: hidden;
}

.box .cardlist{
    display: grid;
    grid-template-columns: repeat(4, 100%);
    height: 100vh;
    width: 100%;
}

.box .cardlist.active{
    animation: carditem 30s ease-in-out infinite;
}

.box .buttonpass .button{
    background-color: rgba(255, 255, 255, 0.61);
    width: 1rem;
    height: 1rem;
    border-radius: 1.5rem;
    display: inline-block;
    margin: .3rem;
    transition: .5s;
    cursor: pointer;
}

.box .buttonpass{
    position: absolute;
    left: 45%;
    bottom: 0%;
}

.box .buttonpass .button.active{
    width: 1.5rem;
    height: 1.5rem;
    background-color: var(--color-light);
}

.box .buttonpass .button:hover{
    width: 1.5rem;
    height: 1.5rem;
    background-color: var(--color-light);
}