.gsl-banner {
container-type: inline-size;
container-name: gsl-banner;
}
@container gsl-banner (max-width: 600px) {
.gsl-banner__inner,
.gsl-banner--media-right .gsl-banner__inner {
flex-direction: column;
align-items: stretch;
}
.gsl-banner__media {
width: 100%;
flex: 0 0 auto;
aspect-ratio: auto;
height: 220px;
}
.gsl-banner--overflow-fill .gsl-banner__media,
.gsl-banner--overflow-fill.gsl-banner--media-right .gsl-banner__media {
margin: 0;
}
body .gsl-banner__button.gsl-button {
width: 100%;
justify-content: center;
}
.gsl-banner__title {
font-size: 24px;
text-align: center;
}
.gsl-banner--overflow-fill .gsl-banner__img {
object-fit: contain;
}
.gsl-banner__subtitle p {
text-align: center;
}
}