header {
    background-image: url("../img/cinema.png");
    background-size: cover;
    background-position: center;
    min-height: 90vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
header h1 {
    color: black;
    text-shadow: 2px 2px 4px rgba(255, 255, 255, 0.7);
}
.opaque-box {
    background: rgba(255, 255, 255, 0.62); /* Black background with 50% opacity */
    padding: 20px;
    border-radius: 10px;
}
@media (max-width: 768px) {
    .opaque-box {
        display: inline-block;
        box-shadow:2px 2px 2px 2px rgba(0, 0, 0, 0.65);

    }
}
@media (min-width: 769px) {
    .opaque-box {
        background: none; /* Remove background on larger screens */
        padding: 0;
        border-radius: 0;
    }
}
.card {
    width: 100%; /* Set the card to take the full width of its parent column */
}