.Elemento{border: 1px solid;}
table{width: 100%; height: 100vh ;}
td{text-align: center; width: 5%; height: 8vh;}
.Metais_alcalinos{
    background-color: rgb(255, 193, 78);
}
.Metais_alcalinoterrosos{
    background-color:  rgb(255, 255, 104);

}
.Metais_de_transição {
    background-color: pink;

}

.Ametais_reativos
{
    background-color:  rgb(178, 216, 103);

}

.Halogênios
{
    background-color:  rgb(169, 222, 243);

}

.Gases_nobres
{
    background-color:  rgb(102, 173, 219);

}

.Outros_matriais
{
    background-color:  rgb(157, 198, 208);

}

.Semimetais
{
    background-color:  rgb(103, 195, 185);

}

.Lantanídeos
{
    background-color:  rgb(148, 218, 222);

}

.Actinídeos
{
    background-color:  rgb(227, 188, 213);

}

.legenda{
    
    width: 3px;
    height: 3px;
}
.legenda_Nao_metais{

    background-color:  rgb(184, 215, 112);
    margin-left: 60%;
    width: 40%;
    height: 40%;

}

.Metais_alcalinos_Legenda{

    background-color:  rgb(250, 201, 99);
    margin-left: 60%;
    width: 40%;
    height: 40%;

}

.Semimetais_Legenda{

    background-color:  rgb(99, 197, 186);
    margin-left: 60%;
    width: 40%;
    height: 40%;

}

.Outros_metais_legenda{

    background-color:  rgb(164, 195, 209);
    margin-left: 60%;
    width: 40%;
    height: 40%;

}

.Lantanídeos_Legenda{

    background-color:  rgb(153, 218, 224);
    margin-left: 60%;
    width: 40%;
    height: 40%;

}

.Metais_alcalino_terrosos_legenda{

    background-color:  rgb(235, 232, 96);
    margin-left: 60%;
    width: 40%;
    height: 40%;

}

.Halogênios_legenda{

    background-color:  rgb(167, 224, 235);
    margin-left: 60%;
    width: 40%;
    height: 40%;

}

.Metais_de_transição_Legenda{
    background-color:  rgb(243, 175, 185);
    margin-left: 60%;
    width: 40%;
    height: 40%;

}

.Actinídios_Legenda{
    background-color:  rgb(226, 191, 215);
    margin-left: 60%;
    width: 40%;
    height: 40%;


}
.div{text-align:left;}
