body {
    margin: 0;
    font-family: sans-serif;
    color: white; /* Adjust text color for contrast with your background image */
    text-align: center;
}

.background-container {
    width: 100vw;
    height: 100vh;
    background-image: url('bg.jpg');
    background-size: cover;
    background-position: center;
    opacity: 0; /* Start with opacity 0 */
    transition: opacity 2s ease-in; /* Apply a 2-second fade-in transition */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

/* This class will be added by JavaScript to trigger the fade-in */
.fade-in {
    opacity: 1;
}