@element-width-spaced: 62px;
@element-height-spaced: 62px;
@element-width-compact: 42px;
@element-height-compact: 42px;
@element-width-small: 25px;
@element-height-small: 25px;
@element-width-map: 18px;
@element-height-map: 18px;
@spacer-map: 1px;
@spacer-small: 1px;
@spacer-compact: 2px;
@spacer-spaced: 5px;
@grid-gap-map: 2px;
@grid-gap-small: 2px;
@grid-gap-compact: 4px;
@grid-gap-spaced: 6px;

@table-background: #e4e6e8;
//metal
@metal: lighten(#939393, 20%);
@alkali-metal: lighten(#98ad2c, 20%);
@alkali-earth-metal: lighten(#44b981, 20%);
@transition-metal: lighten(#4bb0fd, 20%);
@lanthoid: lighten(#d3c100, 20%);
@actinoid: lighten(#e09d00, 20%);
@metalloid: lighten(#d33636, 20%);

//non-metals
@non-metal: lighten(#6d828a, 20%);
@halogen: lighten(#a1823b, 20%);
@noble-gas: lighten(#6767ba, 20%);