.banner {
display: flex;
padding: calc(var(--spacer) * 2) 0;
}
.banner.full-w {
width: 100%;
justify-content: center;
}
.banner.full-w > * + * {
margin-left: var(--spacer);
}
.audio-wrapper {
display: flex;
align-items: center;
}
@media (max-width: 63rem) {
.audio-wrapper {
flex-direction: column;
align-items: center;
}
}
.audio-wrapper a.btn-icon {
flex-shrink: 0;
}
.audio-wrapper ul.language-tiles {
height: 40px;
width: auto;
overflow: hidden;
transform-style: preserve-3d;
display: flex;
flex: 1;
}
@media (max-width: 63rem) {
.audio-wrapper ul.language-tiles {
flex: 1 0 auto;
width: 100%;
display: flex;
justify-content: center;
}
}
.audio-wrapper ul.language-tiles .language-tile {
display: flex;
align-items: center;
justify-content: center;
font-size: 1.25rem;
line-height: 1;
backface-visibility: hidden;
height: 2.5rem;
position: absolute;
transition: transform 0.5s ease-out;
transform: rotateX(180deg);
}
.audio-wrapper ul.language-tiles .language-tile.active {
transform: rotateX(0deg);
}
.audio-wrapper ul.language-tiles .language-tile.prev {
transform: rotateX(-180deg);
}