/* Set body background to white */
body {
    font-family: 'Benne', serif;
    margin: 0;
    padding: 0;
    background-color: #fff; /* White background */
    display: flex;
    justify-content: center;  /* Centers the content horizontally */
    align-items: center;      /* Centers the content vertically (if desired) */
    min-height: 100vh;        /* Ensures full-height centering */
}

/* Main content area styling */
#content {
    max-width: 800px;       /* Adjust max width as needed */
    width: 100%;
    padding: 40px 20px;
}

/* Bio container styling */
.bio-container {
    gap: 20px;
    font-size: 18px;
    font-family: 'Benne', serif;
    line-height: 1.6;
}

/* Profile image styling */
.profile-image {
    width: 200px;           /* Adjust as needed */
    height: 200px;          /* Adjust as needed */
    border-radius: 50%;     /* Makes it circular */
    object-fit: cover;
    display: block;         /* Makes margin auto work */
    margin: 0 auto;         /* Centers the image horizontally */
}

/* Heading styling */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Benne', serif;
    color: #333;
}

h1 {
    text-align: center;
}

/* Paragraph styling */
p {
    text-align: justify;
    text-justify: inter-word;
}

/* General link styling */
a {
    color: #5a5a5a;
    color: #007BFF;
    text-decoration: none;  /* Removes default underline */
    font-weight: 500;       /* Makes the text slightly bolder */
    transition: color 0.3s, border-bottom 0.3s; /* Smooth transition */
    border-bottom: 2px solid transparent; /* Adds an underline effect */
}

/* Hover effect for links */
a:hover {
    color: #0056b3;         /* Darker blue on hover */
    border-bottom: 2px solid #0056b3; /* Adds underline on hover */
}


.centered-links {
    text-align: center;
    margin-top: 20px;
    color: #D3D3D3;
}
.centered-links a {
    text-decoration: none;
    margin: 0 5px;
}