body, html {
    height: 100%;
    margin: 0;
    font-family: 'Helvetica', sans-serif;
    font-size: 18px;
}

p {    
    line-height: 27px;
}

li {
    margin-bottom: 12px; /* Adds space between items */
}

#pfp {
    width: 150px;
    height: 150px;
    border-radius: 50%; /* Makes it circular */
    object-fit: cover; /* Ensures the image fills the circle */
}

#chinese-name {
    font-size: 0.75em;
}

#wrapper {
    display: grid;
    grid-template-columns: 20px minmax(auto, 600px) 15px;

    @media (min-width: 830px) {
        grid-template-columns: 180px 600px auto;
    }
}
#sidebar {
    grid-column: 1;
}
#content {
    grid-column: 2;
}
#sidespace {
    grid-column: 3;
}

/* h1 {
    font-size: 2em;
    color: #333;
} */