table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 50px;
    table-layout: fixed;
}

div {
    margin: 0;
    font-size: 18px;
    text-align: initial;
}

.Nd {
    border: none;
}

td 
{
    border:  1px solid black;
    height: 8vh;
    width: 5%;
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    overflow: hidden;
    font-size: 12px;
}

td:not(.Nd):hover {

    transform: scale(1.1);
    cursor: pointer;
    box-shadow: 1px 1px 1px rgba(0,0,0,0.4);
    transition: 0.2s;
}

.legenda {

    border: none;
    height: 10px;
    text-align: start;
}

.legendaI {
    
    height: 20px;
    border: none;
}

.metais {
    background-color: #B3D76A;
}

.azul {

    background-color: #67AFDE;
}
.laranja {

    background-color: #F5C95E;
}

.Amarelo {

    background-color: #EFE55B;
}

.AzulM {

    background-color: #66C4BC;
}

.VerdeM {

    background-color: #B3D76A;
}

.AzulC {

    background-color: #A7DFF3;
}

.AzulD {

    background-color: #A2C6D2;
}

.Rosa {

    background-color: #F2B0B0;
}

.lantan {

    background-color: #97D7E1;
}

.Actin {

    background-color: #E2BDD8;
}

.QuadradinhoM {
    
    width: 20px;
    height: 20px;
    background-color: #B3D76A;
    margin-left: auto;
    
}

.QuadradinhoG {

    width: 20px;
    height: 20px;
    background-color: #67AFDE;
    margin-left: auto;
    vertical-align: middle;

}

.QuadradinhoMa {

    margin-left: auto;
    width: 20px;
    height: 20px;
    background-color: #F5C95E;
}

.QuadradinhoA {

    margin-left: auto;
    width: 20px;
    height: 20px;
    background-color: #EFE55B;
}

.QuadradinhoS {

    margin-left: auto;
    width: 20px;
    height: 20px;
    background-color: #66C4BC;
}

.QuadradinhoH {

    margin-left: auto;
    width: 20px;
    height: 20px;
    background-color: #A7DFF3;
}

.QuadradinhoO {

    margin-left: auto;
    width: 20px;
    height: 20px;
    background-color: #A2C6D2;
}

.QuadradinhoMT {

    margin-left: auto;
    width: 20px;
    height: 20px;
    background-color: #F2B0B0;
}

.QuadradinhoL {

    margin-left: auto;
    width: 20px;
    height: 20px;
    background-color: #97D7E1;
}

.QuadradinhoAc {

    margin-left: auto;
    width: 20px;
    height: 20px;
    background-color: #E2BDD8;
}
