61 lines
1.0 KiB
CSS
61 lines
1.0 KiB
CSS
footer {
|
|
@apply mx-auto px-12;
|
|
.branding {
|
|
@apply w-full mb-12 grid relative pt-64;
|
|
z-index: -1;
|
|
.square,
|
|
.rectangle-rotated {
|
|
z-index: -1;
|
|
}
|
|
.circle,
|
|
.rectangle-vertical {
|
|
z-index: -3;
|
|
}
|
|
|
|
.website-title {
|
|
z-index: -2;
|
|
}
|
|
|
|
&__shapes {
|
|
@apply w-full grid gap-4 grid-cols-4 h-full absolute left-0;
|
|
top: 0px;
|
|
|
|
img {
|
|
@apply h-64 shrink;
|
|
flex-shrink: 1;
|
|
}
|
|
}
|
|
|
|
.website-title {
|
|
@apply w-full;
|
|
}
|
|
}
|
|
|
|
.credits {
|
|
@apply w-full grid gap-x-24 gap-y-12;
|
|
display: grid;
|
|
column-gap: 100px;
|
|
grid-auto-flow: column; /* clé ici */
|
|
grid-template-rows: repeat(2, auto);
|
|
grid-template-columns: repeat(4, 1fr);
|
|
|
|
> :first-child {
|
|
grid-row: span 2;
|
|
}
|
|
}
|
|
.socials {
|
|
a {
|
|
@apply block;
|
|
}
|
|
}
|
|
}
|
|
|
|
@keyframes parallax {
|
|
from {
|
|
transform: translateY(-200px);
|
|
}
|
|
to {
|
|
transform: translateY(200px);
|
|
}
|
|
}
|