.molecule-table-legend { padding-top: 20px; }
.molecule-table-legend ul { padding: 10px; border: 1px solid var( --color-clearest-gray ); border-radius: 5px; text-align: center; background: var( --color-clearest-gray );}
.molecule-table-legend ul li { display: inline-block; padding: 3px; }

@media only screen and ( min-width: 48em ) {
    .molecule-table-legend { padding-top: 30px; }
    .molecule-table-legend ul { padding: 10px 15px; text-align: left; }
    .molecule-table-legend ul li { padding: 3px 5px; }
}

@media only screen and ( min-width: 62em ) {
    .molecule-table-legend { padding-top: 45px; }
    .molecule-table-legend ul { padding: 15px 20px; }
    .molecule-table-legend ul li { padding: 5px; }    
}