*{
    margin :0;
    box-sizing: border-box;
}
table{
    width: 90%;
    height: 100vh;
    margin: auto;
}

td{
    width: 5%;
    height: 8vh;
}
.border{
    text-align: center;
}
.hidrogenio {
    background-color: lightgreen;
}
.metaisa{
    background-color: coral ;
}
.metaisat{
    background-color: yellow;
}
.metaistr{
    background-color: indianred;
}
.semimetais{
    background-color: aquamarine;
}
.ometais{
    background-color: rgb(106, 214, 218);
}
.ametais{
    background-color: olivedrab;
}
.halogenio{
    background-color: aqua;
}
.gasesnobres{
    background-color: cornflowerblue;
}
.lantanideos{
    background-color: teal;
}
.actanidios{
    background-color: peru;
}
#qgasesnobres{
    height: 15px;
    width: 15px;
    background-color: cornflowerblue;
}

#qmetaisalcalinos{
    height: 15px;
    width: 15px;
    background-color: coral;
}
#qmetaisalcalinost{
    height: 15px;
    width: 15px;
    background-color: yellow;

}
 #qsemimetais{
    height: 15px;
    width: 15px;
    background-color: aquamarine;
 }

 #qhalogenios{
    height: 15px;
    width: 15px;
    background-color: aqua;
 }

 #qoutrosmetais{
    height: 15px;
    width: 15px;
    background-color: rgb(106, 214, 218);
 }

 #qmetaistransicao{
    height: 15px;
    width: 15px;
    background-color: indianred;


 }

 #qlatanideos{
    height: 15px;
    width: 15px;
    background-color: teal;
 }

 #qactinidios{
    height: 15px;
    width: 15px;
    background-color: peru;
 }
 #qnaometais{
    height: 15px;
    width: 15px;
    background-color: olivedrab;
}
.tdformat{
 display: inline-block;
}