body{margin:0;background:linear-gradient(180deg, #f0ecee 120px, #ddd5d9 0);height:100vh;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:start}body header{width:750px;max-width:750px;background-color:#036;height:100px;min-height:100px;max-height:100px;display:flex;flex-direction:column;align-items:center;justify-content:center}body header h1{font-family:Arial,sans-serif;font-size:22px;font-weight:600;color:#fff;margin:0}body header a{font-family:Arial,sans-serif;color:#fff;text-decoration:underline;font-size:16px;font-weight:400;margin:10px 0 0 0}body header a:visited{color:#fff}body main{width:750px;max-width:750px;background-color:#036;overflow-y:auto}body main #image-gallery{margin:0 10px 50px 10px;display:grid;grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));gap:10px}body main .image-container{overflow:hidden;max-width:750px}body main .image-container img{width:100%;height:auto;cursor:pointer}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.8);opacity:0;visibility:hidden;display:flex;justify-content:center;align-items:center;cursor:pointer}.modal.open{opacity:1;visibility:visible}.modal img{max-width:95%;max-height:85%}