* {
    box-sizing: border-box;
    margin: 0;
}


table {
    width: 100%;
    height: 100vh;
}

div {
    text-align: left;
}

body {
    text-align: center;
}

td {
    border: solid 1px;
    width: 5%;
    height: 8vh;
}

.borderless {
    border: none;
}

.naometais {
    background-color: rgb(4, 248, 44);
}

.gasesnobres {
    background-color: rgb(0, 111, 185);
}

.metaisalcalinos {
    background-color: rgb(255, 166, 0);
}

.metaisalcalinoterrosos {
    background-color: rgb(255, 251, 0);
}

.semimetais {
    background-color: rgb(0, 219, 154);
}

.halogenios {
    background-color: rgb(167, 255, 255);
}

.outrosmetais {
    background-color: rgb(81, 136, 136);
}

.metaisdetransição {
    background-color: rgb(255, 78, 78);
}

.lantanideos {
    background-color: aqua;
}

.actinidios {
    background-color: rgb(250, 0, 217);
}

.item{
    display: flex;
    align-items: center;
    gap: 1vh;
   
}

.bloco{
    height: 5vh;
    width: 5vh;
    border: solid 1px black;
}

.universal{
    width: auto;
    margin: 0 10vh 10vh 10vh;
    display: flex;
    gap: 5vh;
}