/** * Map legend */ .map-legend { z-index: 1000; position: absolute; bottom: 55px; right: 10px; min-width: 7rem; float: right; background: white; border-radius: 4px; padding: 0.5rem 0 0.25rem; border: 1px solid #fff; box-shadow: 0px 0px 1px 1px #222222; } @media (min-width: 380px){ .map-legend { bottom: 40px; } } @media (min-width: 1020px){ .map-legend { bottom: 24px; } } .map-legend h3, .map-legend h4, .data-legend { padding: 0 0.5rem; } .data-legend { max-height: 20rem; overflow-y: auto; list-style: none; margin-bottom: 0; } .data-legend .key { display: inline-block; width: 1.75rem; height: 1.75rem; text-indent: -30px; margin: 0.125rem 0.5rem 0.125rem 0; vertical-align: middle; overflow: hidden; } .map-legend .data-intro { padding: 0 0.5rem; opacity: 0.5; }