@font-face {
    font-family: 'DejaVu';
    src: url('../fonts/DejaVuSansMono.ttf') format('truetype'),
         url('../fonts/DejaVuSansMono-Bold.ttf') format('truetype'),
         url('../fonts/DejaVuSansMono-BoldOblique.ttf') format('truetype'),
         url('../fonts/DejaVuSansMono-Oblique.ttf') format('truetype');
}

h1, h2, h3, h4, h5, h6 {
    color: #8353a6; /* Set text color */
}

/* Set background color */
body {
    background-color: #0b070e;
    color: #ece3f5; /* Set text color */
    margin-left: 290px; /* Adjust margin to accommodate sidebar width */
}

/* The sidebar menu */
.navbar {
    position: fixed; /* or absolute, depending on your layout */
    top: 0;
    left: 0;
    width: 256px; /* Adjust width as needed */
    height: 100vh; /* Full height */
    z-index: 1; /* Ensure it's behind other content */
    overflow-y: auto; /* Optional: Add scroll if content overflows */
}

/* The navigation menu links */
.navbar a {
    padding: 6px 8px 6px 16px;
    text-decoration: none;
    font-size: 25px;
    color: #8353a6;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* When you mouse over the navigation links, change their color */
.navbar a:hover {
    color: #ece3f5;
}

/* Style page content */
.main {
    margin-left: 160px; /* Same as the width of the sidebar */
    padding: 0px 10px;
    position: relative;
    z-index: 0; /* Ensure main content is below the sidebar */
}

/* On smaller screens, where height is less than 450px, change the style of the sidebar (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
    .navbar {padding-top: 15px;}
    .navbar a {font-size: 18px;}
}
.profile-container {
    text-align: center;
}
.profile-container h1 {
    margin: 0;
}

.profile-container h1 + h1 {
    margin-top: -5px; /* Adjust this value to move closer or further away */
}
.profile-picture {
    display: block;
    margin: 0 auto;
}
aside {
    display: flex;
    justify-content: center;
}

.navbar {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.profile-container {
    text-align: center;
}

.profile-container h1 a {
    color: #4a2f5e;
}
.content {
    width: 80%; /* Adjust the percentage as needed */
    max-width: 1024px; /* Ensure it doesn't get too wide on large screens */
}
.navbar {
    padding-top: 70px
}
.profile-picture {
    width: 100px;
    height: 100px;
}
@font-face {
    font-family: 'DejaVu';
    src: url('../../fonts/DejaVuSansMono.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DejaVu';
    src: url('../../fonts/DejaVuSansMono-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'DejaVu';
    src: url('../../fonts/DejaVuSansMono-Oblique.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'DejaVu';
    src: url('../../fonts/DejaVuSansMono-BoldOblique.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}
body {
    font-family: 'DejaVu', sans-serif;
}

hr{
    border:0;
    margin:0;
    width:100%;
    height:2px;
    background:#8353a6;
}
.current-page {
    pointer-events: none;
    color: gray;
    text-decoration: none;
}
/* Style for all links */
a {
    color: #007bff; /* Replace this with the color used for @y3flamex */
    text-decoration: none; /* Optional: Removes underline */
}

/* Optional: Add hover effect for links */
a:hover {
    text-decoration: underline;
}