body {
--artist-count: 4;
--100vh: 100vh;
--font-size--small: 18px;
--line-height--small: 1.026;
--font-size--regular: 18px;
--line-height--regular: 1.026; --font-size--huge: calc( ( ( var( --100vh ) - var( --header-height, 0px ) - var( --one-line--regular ) * var( --artist-count ) ) / var( --artist-count ) ) * 1.395 ); --line-height--huge: 0.98;
--font-size: var( --font-size--regular );
--line-height: var( --line-height--regular );
--text-color: var( --black );
--font-color: var( --text-color );
--text-color--invert: var( --white );
--font-color--invert: var( --text-color--invert );
--link-transition-duration: 0.45s;
--link-transition-easing: cubic-bezier( 0.87, 0, 0.13, 1 );
}
@media ( orientation: portrait ) {
body {
--100vh: 60vh;
}
}
body,
input,
textarea,
button,
select {
font-family: 'Juliet Grotesk', sans-serif;
font-size: var( --font-size );
line-height: var( --line-height );
font-weight: 500;
color: var( --text-color );
letter-spacing: -0.01em; }
.fs--small,
small {
--font-size: var( --font-size--small );
--line-height: var( --line-height--small );
font-size: var( --font-size );
line-height: var( --line-height );
font-weight: 500;
}
.fs--regular {
--font-size: var( --font-size--regular );
--line-height: var( --line-height--regular );
font-size: var( --font-size );
line-height: var( --line-height );
font-weight: 500;
}
.fs--huge {
--font-size: var( --font-size--huge );
--line-height: var( --line-height--huge );
font-family: 'Juliet Grotesk Display', sans-serif;
font-size: var( --font-size );
line-height: var( --line-height );
font-weight: 400;
letter-spacing: -0.025em;
margin-bottom: -0.225em;
}
.tt--uppercase {
text-transform: uppercase;
}
p {
margin: 0;
padding: 0;
} h1,
h2,
h3,
h4,
h5,
h6 {
font-size: inherit;
line-height: inherit;
font-weight: 500;
}
a,
a:link,
a:visited,
a:hover,
a:active {
color: inherit;
text-decoration: none;
display: inline-block;
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
} p a::after,
.current-menu-item > a::after,
a.has-underline::after,
.single-artist .menu-item-object-artist > a::after {
content: '';
height: var( --border-width ); background: currentColor;
width: 100%;
display: block;
position: absolute;
bottom: 0.05em;
left: 0;
transition: opacity 0.1s linear var( --link-transition-duration );
}
body.home:not( .intro-done ) .current-menu-item > a::after {
opacity: 0;
}
a.is-wrapped {}
a.is-wrapped .link__wrap {
display: inline-block;
position: relative;
overflow: hidden;
height: 0.95em;
}
a.is-wrapped .link__content {
display: inline-block;
position: relative;
transition: all var( --link-transition-duration ) var( --link-transition-easing );
}
a.is-wrapped .link__content::after {
content: attr( data-content );
position: absolute;
top: 100%;
left: 0;
}
.menu-item.menu-item-has-children > a .link__content::after {
display: none;
}
a.is-wrapped:hover .link__content,
a.is-wrapped:active .link__content,
.menu-item.menu-item-has-children:hover > a .link__content,
.menu-item.menu-item-has-children:active > a .link__content,
.menu-item.current-menu-item > a .link__content,
.menu-item.current-menu-ancestor > a .link__content,
.single-artist .menu-item.catalog-item > a .link__content {
-webkit-transform: translateY( -100% );
-moz-transform: translateY( -100% );
transform: translateY( -100% );
} @media ( min-width: 700px ) {
body {
--font-size--small: 17px;
--line-height--small: 1.05;
--font-size--regular: 19px;
--line-height--regular: 1.05; }
} @media ( min-width: 1100px ) {
body {
--font-size--small: 16px;
--line-height--small: 1.1;
--font-size--regular: 23px;
--line-height--regular: 1.08;
}
}