@import url("https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap");
body {
    font-family:'Roboto Mono', monospace;
    margin: 0;
    padding: 0;
    background: #ffffff;
}
@import url("https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap");
.P-1 { text-align:justify; line-height:1px; font-family:"Roboto Mono",monospace; font-style:normal; font-weight:50; color:#000000; background-color:transparent; font-variant:normal; font-size:11.0px; vertical-align:0; }
.C-1 { line-height:13.00px; font-family:"Roboto Mono", monospace; font-style:normal; font-weight:50; color:#000000; background-color:transparent; text-decoration:none; font-variant:normal; font-size:30px; vertical-align:0; }
.P-2 { text-align:justify; line-height:1px; font-family:"Roboto Mono", monospace; font-style:normal; font-weight:normal; color:#000000; background-color:transparent; font-variant:normal; font-size:11.0px; vertical-align:0; }
.C-2 { line-height:14.00px; font-family:"Roboto Mono", monospace; font-style:normal; font-weight:normal; color:#000000; background-color:transparent; text-decoration:none; font-variant:normal; font-size:12px; vertical-align:0; }
.C-3 { line-height:14.00px; font-family:"Roboto Mono", monospace; font-style:normal; font-weight:normal; color:#000000; background-color:transparent; text-decoration:none; font-variant:normal; font-size:10.7px; vertical-align:0; }
.C-4 { line-height:16.00px; font-family:"Roboto Mono", monospace; font-style:normal; font-weight:normal; color:#000000; background-color:transparent; text-decoration:none; font-variant:normal; font-size:13.3px; vertical-align:0; }

.gallery {
    top:100px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 8px;
    padding: 8px;
}

.gallery img {
    width: 100%;
    cursor: pointer;
    transition: transform 0.2s ease;
}

.gallery img:hover {
    transform: scale(1.05);
}

.modal {
    display: none;
    position: fixed;
    z-index: 1000;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0,0.9);
}

.modal-content {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 1080px;
}

.close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
}

.close:hover,
.close:focus {
    color: #ffffff;
    text-decoration: none;
    cursor: pointer;
}

#caption {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ffffff;
    padding: 10px 0;
    height: 150px;
}