67 lines
1.1 KiB
CSS
67 lines
1.1 KiB
CSS
.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;
|
|
}
|
|
} |