.clock-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:15px}
.clock-card{background:#fff;border:1px solid #e8e8e8;border-radius:3px;padding:20px;text-align:center}
.clock-card .city{font-size:14px;font-weight:700;color:#333;margin-bottom:5px}
.clock-card .time{font-size:28px;font-weight:700;color:#3592e2;margin-bottom:5px;font-variant-numeric:tabular-nums}
.clock-card .date{font-size:12px;color:#888}
.clock-card .offset{font-size:11px;color:#aaa;margin-top:3px}
.clock-card.now{border-color:#3592e2;background:#f0f8ff}
@media(max-width:480px){.clock-grid{grid-template-columns:1fr 1fr}.clock-card .time{font-size:22px}}