@media screen and (max-width: 1023px) {
    
    h1 {
        margin: 1rem 0;
    }

    .cor-calculadora {
        width: 40%;
        padding: 5%;
    }

    .resultado {
        width: 40%;
        padding: 2% 5%;
        margin: 3% 0;
    }

    table {
        width: 50%;
    }

    thead {
        padding: 0.5rem 0;
    }

    tbody {
        padding: 0;
    }
}

@media screen and (max-width: 627px) {
    .cor-calculadora, .resultado {
        width: 80%;
    }

    table {
        width: 90%;
    }
}