.oxygen-light {
    font-family: "Oxygen", sans-serif;
    font-weight: 300;
    font-style: normal;
   }
   
.oxygen-regular {
    font-family: "Oxygen", sans-serif;
    font-weight: 400;
    font-style: normal;
   }
   
.oxygen-bold {
    font-family: "Oxygen", sans-serif;
    font-weight: 700;
    font-style: normal;
      
  }




body{
    background-color: rgba(18, 17, 25, 0.945);
    color: rgb(241, 121, 121);
    top: 50px;
    }

.content{
    width: auto;
    margin: auto;
    display: flex;
    
    max-width: 750px;
    padding: 20px;
    background-color: rgb(8, 4, 28);
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    width:auto;

}

#content{

    border-left: solid 0.5px rgb(255, 208, 208);
    padding-left: 10px;
    
}

nav a { 
    margin-right: 10px; 
    padding: 10px 15px; 
    text-decoration: none; /* Remove underline */
    color: rgb(255, 150, 150); /* Link color */
    border: 1px solid transparent; /* Give it a transparent border */
    border-radius: 5px;
    transition: background-color 0.3s ease; /* Smooth hover effect */
}
nav a:hover {
    background-color: #f0f0f0;
    border-color: #ccc;
}


#main-nav{

    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 20px;
    width: auto;
   
}

.item {
    padding: 10px;
    color: white;
    text-align: center;
    border-radius: 5px;
}