46 lines
1.2 KiB
CSS
46 lines
1.2 KiB
CSS
.our-collections {
|
|
@apply pb-32 relative;
|
|
|
|
* {
|
|
@apply relative;
|
|
z-index: 3;
|
|
}
|
|
&__selected-image {
|
|
@apply block;
|
|
|
|
z-index: 3;
|
|
aspect-ratio: 16/9;
|
|
@apply mx-auto block bg-white w-full max-w-2xl h-auto object-cover border border-primary p-4;
|
|
|
|
transform: translateY(-200px);
|
|
margin-bottom: -200px;
|
|
}
|
|
.background-shape {
|
|
@apply block w-full h-full absolute top-0 left-0 bg-no-repeat;
|
|
background-size: 100% 100%;
|
|
|
|
background-image: url('../resources/img/shapes/background-shape-A_purple.svg');
|
|
z-index: 0;
|
|
}
|
|
.redirection-grid {
|
|
@apply grid grid-cols-1 md:grid-cols-2 gap-4 max-w-2xl mx-auto;
|
|
.redirection-grid__item {
|
|
@apply bg-white border border-primary p-4 relative flex items-center justify-between;
|
|
@apply text-primary text-center font-light text-xl fjalla uppercase;
|
|
@apply relative;
|
|
&::after {
|
|
@apply content-[''] block w-16 h-16 bg-no-repeat;
|
|
|
|
background-image: url('../resources/img/carhop-fleche-full-green.svg');
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.see-all {
|
|
@apply w-fit internal-link-with-icon mx-auto block text-center mt-12;
|
|
}
|
|
|
|
.block-front-header:has(+ .our-collections) {
|
|
padding-bottom: 240px !important;
|
|
}
|