.calcular{
    /* width: 640px; */
    margin: 0 auto;
}
h3{
    text-align: center;
    margin-bottom: 20px;
}
.notafinal{
    font-size: 20px;
    color: #1AA3A9;
    text-transform: uppercase;
    
}
table thead th{
    color: #ffffff;
}
table thead th{
    background-color: #1AA3A9;
    text-align: center;
}
table thead th.materia{
    text-align: left;
}
table tfoot td,
table tfoot th {
    border-bottom: 1px solid #dee2e6;
}
table tbody tr,
table tfoot tr{
    font-weight: bold;
}
table tbody tr th,
table tbody tr td,
table tfoot tr td{
    text-align: center;
}
table tbody tr td.left,
table tfoot tr td.left{
    text-align: left;
}

@media screen and (max-width: 768px) and (min-width: 320px) {
    .calcular{
        width: 100% !important;
        margin: 0 !important;
    }
    table thead tr th,
    table tbody tr th,
    table tbody tr td,
    table tfoot tr td{
        font-size: 0.8em !important;
        font-weight: normal !important;
    }
    table thead th {
        text-align: center !important;
    }
    table td,
    table th {
        padding: .50rem !important;
    }
    table tbody tr td input{
        width: 48px !important;
    }
    h3{
        font-size: 16px !important;
    }
    .notafinal td{
        font-size: 16px !important;
    }
}