body {
    overflow: hidden;
}

.Corpo {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-content: center;
}

.Capitulos_1 {
    width: 100vw;
    height: 20vh;
    margin-bottom: 2vh;
    background-color: var(--fundo_2);

    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    align-content: center;
    justify-content: center;

    animation: painelPrincipal 1s ease;

}

.Capitulos_1 a {
    text-decoration: none;

}


@keyframes painelPrincipal {
    to {
        opacity: 1;
        transform: translateY(0);
    }

    from {
        opacity: 0;
        transform: translateY(-20vh);
    }

}

div.ativo {

    background-color: var(--fudno_3);
    color: var(--fundo_2);
    margin-bottom: 2vh;
    box-shadow: var(--fudno_3) 0px 0px 5px;
    transition: 1s ease;
}


.reação a {
    text-decoration: none;

}

.reação {
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;

    width: 8vw;
    height: 6vh;
    font-family: var(--font_titulo);
    font-size: 1.2vw;
    color: var(--variante_font_1);
    border: solid 3px var(--fudno_3);

    cursor: pointer;

    margin-left: 1vw;
    margin-top: 1vh;
    transition: 1s ease;


}

.Capitulos_2 {

    width: 100%;
    height: 77.8vh;
    animation: conteudoPrincipal 1s ease;

}

.Capitulos_2 iframe {

    width: 100%;
    height: 100%;



}

@keyframes conteudoPrincipal {
    to {
        opacity: 1;
        transform: translateY(0vh);

    }

    from {
        opacity: 0;
        transform: translateY(20vh);

    }

}