<div id="hero" class="c-hero c-hero--base pt-8 lg:pt-15 bgi-gradient-lilac">
<div class="md:wrapper relative z-10">
<div class="flex flex-col items-center justify-center w-full md:w-10/12 m-auto pt-16 lg:pt-18">
<h1 data-animate class="text-xl lg:text-2xl leading-2xl text-black-50 text-center font-thin mb-16 lg:mb-18">
Asta Valentaite is a public figure, international model, stylist and model scout.
</h1>
<div class="relative z-10 lg:m-auto w-full">
<div class="relative w-full" style="padding-top: 62.5%">
<noscript>
<img class="object-fit shadow-card lazyload absolute pin"
src="/dist/images/asta-valentaite-5885cab3a8aa3.jpg"
width=""
height=""
alt=""
/>
</noscript>
<img class="object-fit shadow-card lazyload lazyload absolute pin" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="/dist/images/asta-valentaite-5885cab3a8aa3.jpg" width="" height="" alt="" />
</div>
</div>
</div>
</div>
</div>
{% import '@helpers' as h %}
<div id="hero" class="c-hero c-hero--base pt-8 lg:pt-15 bgi-gradient-lilac">
<div class="md:wrapper relative z-10">
<div class="flex flex-col items-center justify-center w-full md:w-10/12 m-auto pt-16 lg:pt-18">
<h1 data-animate class="text-xl lg:text-2xl leading-2xl text-black-50 text-center font-thin mb-16 lg:mb-18">
{{ heading }}
</h1>
<div class="relative z-10 lg:m-auto w-full">
{{ h.image(image, '8:5', 'object-fit shadow-card lazyload') }}
</div>
</div>
</div>
</div>
{
"siteTitle": "Asta Valentaite",
"copyright": "© 2017 Asta Valentaite. All rights reserved.",
"craft": {
"app": {
"config": {
"general": {
"custom": {
"objects": "/02-objects/",
"global": "../03-global/",
"components": "/04-components/",
"pages": "/05-pages/",
"macros": "/macros/",
"wrapper": "/wrapper/"
}
}
}
}
},
"sitemenu": [
{
"title": "About",
"slug": "/components/preview/about"
},
{
"title": "Fashion",
"slug": "/components/preview/press"
},
{
"title": "Beauty",
"slug": "/components/preview/post"
},
{
"title": "Lifestyle",
"slug": "/components/preview/vertical"
},
{
"title": "Collaborations",
"slug": "/components/preview/collaborations"
},
{
"title": "Press",
"slug": "/components/preview/press"
}
],
"target": "#page",
"image": {
"url": "/dist/images/asta-valentaite-5885cab3a8aa3.jpg",
"alt": null,
"width": null,
"height": null
},
"heading": "Asta Valentaite is a public figure, international model, stylist and model scout."
}
.c-hero__icon {
.o-icon {
transform: translate3d(0, 50%, 0);
}
}
.c-hero--home {
@include mq($from: breakpoint('lg')) {
margin-bottom: rem(200px);
}
}
.c-hero__img {
transform: translate3d(0, rem(60px), 0);
@include mq($from: breakpoint('lg')) {
transform: translate3d(0, rem(120px), 0);
}
}
.c-hero {
//aspect-ratio: '1:1';
@include mq($from: breakpoint('md')) {
&::before {
display: none;
}
& > div {
position: relative;
}
}
}
.c-hero__inner {
@include mq($from: breakpoint('md')) {
padding-top: rem(100px);
padding-bottom: rem(100px);
}
}
.c-hero--tags {
min-height: rem(300px);
[data-accordion-btn].is-active {
@apply .text-white;
}
}
[id='tags'] {
li {
opacity: 0;
transform: translate3d(0, rem(10px), 0);
transition: opacity 300ms 100ms ease, transform 300ms 100ms ease;
@include mq($from: breakpoint('lg')) {
opacity: 1;
transform: none;
}
}
&.is-expanded {
li {
opacity: 1;
transform: translate3d(0, 0, 0);
transition-delay: 0ms;
}
}
}
There are no notes for this item.