Files
web/components/Current/Hero/hero.module.css
Christel Westerberg 1498309f47 fix: make hero sticky
2024-03-01 10:33:06 +01:00

35 lines
530 B
CSS

.wrapper {
z-index: -1;
}
.picture {
visibility: visible;
opacity: 1;
transition: opacity 400ms ease-in-out 0s;
transform: translate(-50%, -50%) !important;
}
.heroImage {
width: 100%;
height: auto;
max-height: 600px;
min-height: 100px;
object-fit: cover;
object-position: center;
aspect-ratio: 1/1;
}
@media screen and (min-width: 740px) {
.heroImage {
aspect-ratio: auto;
}
}
@media screen and (min-width: 950px) {
.wrapper {
overflow: hidden;
position: sticky;
top: 0px;
}
}