.theater {
    width:100%;
    display: grid;
    place-items:center;
    grid-template-areas: "inner-div";
}

.theater.h-100 {
    height:100%;
}

.theater.h-50v {
    height:50vh;
}

.theater-bg {
    
    height: inherit;
    width:100%;
    background-size: cover;
    background-image: url('../../img/background.webp');
    filter: blur(2px);
    -webkit-filter: blur(2px);
    z-index:0;
    grid-area: inner-div;
}

.theater.peak .theater-bg {
    height: 85vh;
}

.theater-content {
    display:flex;
    flex-direction: column;
    text-shadow: 0px 0px 2px black;
    text-align: center;
    z-index:1;
    color: #FAFCF0;
    grid-area: inner-div;
    font-weight:bolder;
    max-width: 100%;
    width:100%;
    background: rgba(76, 76, 80, 0.75);
    align-items: center;
}

.theater-content .description, .theater-content h1 {
    width: 50vw;
}
.theater-content .description {
    padding: 10px;
}

.theater-content a {
    color: #CFCFBA !important;
}

.theater-content h1 {
    width:100%;
    text-align:center;
}

@media only screen and (max-width: 600px) {
    .theater-content .description {
        width: 80vw;
    }
}