#footer {
    border-top: 1px solid white;
    text-align: center;
    margin: 10px auto 0 auto;
    padding: 5px;
    opacity: 0.3;
    font-size: 1vw;
}
#header {
    display: flex;
    justify-content: space-between;
    height: auto;
    margin: 10px 0 10px 0;
    width: 100%;
}
#name {
    margin-left: 0px;
}
#sitenav {
    height: 1.2em;
    border-bottom: 1px solid white;
}
#wrapper {
    min-height: 80vh;
}
    * { box-sizing: border-box; }

a {
    text-decoration: none;
    color: inherit;
    transition: opacity 0.2s;
}
a:hover {
    opacity: 0.8;
}
body { 
    background-color: black;
    font-family: Pathway Gothic One; 
    font-size: 28px;
    color: white;
    padding: 0 100px;
    min-height: 100vh !important;
}
@media (max-width: 600px) {
    body {
        padding: 0;
        min-height: 100vh;
    }
    #header {
        font-size: 15px;
    }
    #name-links {
        font-size: 69%;
    }
    #footer {
        font-size: 2vw;
    }
}
.image-container {
            column-count: 4; /* Number of columns */
            column-gap: 4px; /* Gap between columns */
            min-height: 75vh;
}
.image-container img {
            width: 100%; /* Ensure images fill the column width */
            margin-bottom: 0px; /* Spacing between images */
            padding: 0 1px 0 1px;
}
.album-desc {
    border-top: 1px solid dimgray; 
    border-bottom: 1px solid dimgray; 
    padding: 15px 0; 
    margin-bottom: 20px;
    font-size: 60%;
}
.column {
    float: left;
    width: 25%; /* Set the width to 25% to have four columns side by side */
}
.column img {
    display: block;
    width: 100%;
    padding: 2px;
}
/* Clear floats after the columns */
.row:after {
    content: "";
    display: table;
    clear: both;
}