body{color:#000}h1,p{display:inline-block}ul.photo-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}ul.photo-grid li{position:relative;border:1px solid #ddd;overflow:hidden;border-radius:5px;height:100px}.resident{background-color:#20b2aa}.staff{background-color:#1e90ff}.maintenance{background-color:#ff4500}.prev-maintenance{background-color:gold}ul.photo-grid li img{width:100%;height:auto;display:block}ul.photo-grid li .overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#0003;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:1;transition:opacity .3s ease}ul.photo-grid li .overlay a{color:#fff;text-decoration:none;font-weight:700;width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}h1.date-header{font-size:14px;font-weight:500}p.date-num{font-size:12px;font-weight:400;color:#736c64}.info-container{display:flex}.child{background-color:#fff;width:200px;height:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:5px;padding:20px;text-align:center;border:2px solid #CCCCCC;border-radius:10px}.title{margin-bottom:10px}.numbers{display:flex;align-items:baseline;gap:5px}.large-text{font-size:36px;font-weight:700}.small-text{font-size:18px}