#navbar.transparent {
    background-color: transparent;
}

#navbar.scrolled {
    background-color: #333333;
}

.event-header h1 {
    font-size: 9vw; /* Adjusts size based on the width of the viewport */
    font-weight: 700;
    line-height: 0.9;
    text-align: center; /* Centers the heading */
}

.event-description {
    text-align: center; /* Centers the text in the description */
    padding: 0 20px; /* Adds padding on smaller screens */
}

.carousel-item {
    position: relative;
    width: 100%;
    height: 500px; /* Adjust this value based on your design needs */
    overflow: hidden;
}

.carousel-item img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* This will cover the area of the div without distorting the aspect ratio */
    object-position: center; /* Center the image within the element */
}

@media (max-width: 768px) {
    .event-header h1 {
        font-size: 15vw; /* Smaller font size for tablets and mobile devices */
    }

    .event-description {
        max-width: 100%;
    }
}