.z { font-size: 14px; } .z a { color: inherit; } .z ul { margin: 0; padding: 0; list-style-type: none; } .z .hbox { display: flex; } .z .hbox > * { margin-right: 15px; } .z .separators > *:empty { display: none; } .z .separators > *:not(:first-child):before { content: '|'; font-weight: bold; margin: 0 5px; } .z header { padding: 20px; } .z .contact { font-family: monospace; } .z .dp { --shadow-color: #aaa; --size: 64px; align-items: center; background: #ccc; box-shadow: 0 0 20px var(--shadow-color); border-radius: 50%; display: flex; justify-content: center; font-size: 18px; height: var(--size); width: var(--size); } .z .dp.medicare-valid { --shadow-color: limegreen; } .z .dp.medicare-invalid { --shadow-color: red; } .z .name { font-family: georgia; font-size: 20px; font-weight: bold; }