/* CSS imports ------------------- */ /* Forced mobile nav on all sizes ------------------- */ @import url('/lib/g/2.0/styles/responsive_topnav.css') screen and (max-width: 1023px); @import url('/lib/g/themes/aperture/2.0/styles/responsive_topnav.css') screen and (max-width: 1023px); /* Font imports ------------------- */ @import url(https://fonts.googleapis.com/css2?display=swap&family=Inter:wght@400); @import url(https://fonts.googleapis.com/css2?display=swap&family=Inter:wght@400;600); /* Background colour --------------*/ body.slide-nav-active #responsive_slide_nav_wrapper, #responsive_slide_nav_wrapper #top_nav .header_quicksearch_field { background-color: #ffffff !important; } body.responsive-nav-side-position-fullscreen.slide-nav-open #responsive_slide_nav_wrapper::before { display: none; } #header.header_transparent .dropdown-mask { background-color: transparent !important; } #header, .header-fixed-wrapper #header, body .dropdown-mask { background-color: #ffffff } #header:not(.header_transparent) .inner { border: 0; } #header #store_cart_widget a { color: #ffffff; outline-color: #000000; } /* Feature popup colours ------------------- */ .button, .full-width.store_item.store_item_dynamic_status.clearwithin>.store_item_controls>.buy_now_store_item_add_container>button.store_item_add_to_cart { background: #d8d8d8; } .form .form_row .inputField, .form .form_row select, .form .form_row textarea, .form .form_row #captcha input, .form .form_row .g-recaptcha, #mc_embed_signup input, #protected_path_login .protected_path_field_row, #sc_checkout_content #shipping_container select, #sc_checkout_content #shipping_container .inputField, input, textarea, select { border-color: #ededed; } /* Fonts----------------------------- */ /* Main body font ------------------- */ body, input, select, textarea { font-family: 'Inter', Sans-Serif; font-style: normal; font-weight: 400; } /* Heading and emphasis font ------------------- */ #logo a, #footer, #home_splash .content, .navigation ul li a, .link, .link a, .page_stats, .subheading span, .subheading, .subtitle, .poster, .date, .price, #hero_heading, #hero_header .title, #hero_header .subtitle, h1, h2, h3, h4, h5, h6, .fullscreen_slideshow .hero_splash_text, .records_list ul li .content .title, .records_list ul li .content .artist, #cover_page_slideshow_pager, #mc_embed_signup input.button, .countdown_clock, #artists-browser .artists-browser-label, .artists-browser .artists-browser-label { font-family: 'Inter', Sans-Serif; font-weight: 400; font-style: normal; } /* Navigation font ------------------- */ #top_nav.navigation ul li a, #top_nav #full_nav .dropdown-btn { font-family: 'Inter', Sans-Serif; font-style: normal; font-weight: 400; } /* User custom html-font sizing ------------------- */ html { font-size: 9.25px; } /* Title - Heading spacing and transform ------------------- */ /* Dynamically adjust font sizes so that headings and titles look larger (as lowercase appears smaller than uppercase) while the body size remains the same -------------------------- */ html { font-size: 13.41px; } body { font-size: 1.00018642804rem; line-height: 2.48rem; } h1, h2, h3, h4, h5, h6, #hero_header .title, .fullscreen_slideshow .hero_splash_text, #logo a, .navigation ul li a, #slide_nav_reveal, #header_quick_search .inputField, #header_quick_search input, #header_quick_search select, #header_quick_search textarea, #header_quick_search #header_quicksearch_btn, #footer #artlogic, #footer #copyright, #footer #copyright .copyright-text, #footer .small-links-container, .page-artists h1 #artist_years, .page-artists h1 .artist_years, .event-details-wrapper .event-details span, .subsection-press .records_list .content .link a, .section-press .records_list .content .link a, #store_cart_widget, .fullscreen_slideshow .hero_splash_text, .fullscreen_slideshow .hero_splash_text .title, .fullscreen_slideshow ul li .content h2, .fullscreen_slideshow ul li .content h2 a, .fullscreen_slideshow ul li .content h2 a:visited, .fullscreen_slideshow ul li .content h2 a .separator, .fullscreen_slideshow ul li .content h2 a .h1_subtitle, #image_gallery #content_module h3, .records_list .content h2, .records_list .content .subtitle, .records_list .content .date, .records_list .content .location , .records_list ul li .content .title, .records_list ul li .content .artist, .feature_panels .panel_image_text_adjacent .content h2, .feature_list ul li .content h2, .feature_list ul li .content .subtitle, .feature_list ul li .content .date, .feature_list ul li .content .location, .full_list ul li .content h2, .full_list ul li .content .subtitle, .full_list ul li .content .date, .records_list.detail_expand_grid .expander_detail #image_gallery #content_module .subtitle, .link, .button, .simple_list ul li, #social_links_list ul li, .page_stats .ps_item, .page_stats .ps_pages, #protected_path_login #container h1, #protected_path_login #container label, .subheading, .poster, .subtitle, .h1_subtitle, .location , .date, .price, #fancybox-title-main .artist strong, #mc_embed_signup input.button, #home_splash .content, #hero_header .subtitle, .feature_panels .panel_hero .hero_heading .subtitle, #hero_header .inner, .feature_panels .panel_hero .hero_heading > h2, .feature_panels .panel_hero .hero_heading > a > h2, #cover_page_slideshow_pager, #artists-browser, .artists-browser , .exhibition-header .h1_subtitle, #top_nav #full_nav .has_dropdown_items .dropdown-btn, #top_nav #full_nav .has_dropdown_items_mobile .dropdown-btn{ text-transform: none; letter-spacing: 0; } /* Text colours----------------------------- */ /* Heading and emphasis text colour ------------------- */ /* Colour #000000 */ h1, h1 a, h1 a:visited, h2, h2 a, h2 a:visited, h3, h3 a, h3 a:visited, h4, h4 a, h4 a:visited, h5, h5 a, h5 a:visited, h6, h6 a, h6 a:visited, .feature_panels .records_list.image_list ul li h2, .page-artists #artist_list ul li h2, .page-artists .artist_list ul li h2, .records_list .content h2, .records_list ul li h2 a, .feature_list ul li .content h2, .related_items_panel h3, .navigation ul li a:hover, .navigation ul li.active a:hover, .navigation ul li.active a, .navigation ul li.active a:visited, .records_list ul li .content .artist, .records_list ul li .content .title_and_year, .records_list ul li .content .title, #cover_page_slideshow_pager, #image_gallery #content_module h3 { color: #000000; } blockquote { border-left: 1px solid #000000; } #logo a, #logo a:visited { color: #000000; } /* Subheading and secondary emphasis text colour ------------------- */ .slideshow.splide p, input, select, textarea, .navigation ul li a, .navigation ul li a:visited, .records_list .content .description, .records_list ul li .content .description, .heading_wrapper h1 .h1_subtitle, .h1_subtitle, .subheading, .subtitle, .records_list .content .subtitle, .feature_list ul li .content .subtitle, .records_list .content .date, .records_list .content .location, .section-publications .records_list .content .description, .image_list ul li .content .title, .flow_list ul li .content .title, .page_stats .ps_pages, .page_stats .ps_item, .price, .date, .location, .poster, .subtitle, .records_list ul li a:not(.website_contact_form):not(.buy_enquire_detail_link), .records_list ul li a:not(.website_contact_form):not(.buy_enquire_detail_link):visited, #image_gallery #content_module .detail_view_module, .image_list ul li .content, .flow_list ul li .content, .tile_list ul li .content, .tile_list ul li .content .title, #shopping_cart_information td.sc_cell_item .details, #sc_total_price_container .order_total_wrapper, #footer, #footer a:not(.submit_button), #footer a:visited:not(.submit_button), .page-artworks #image_gallery .subtitle, .page-artworks .image_list ul li .content, .records_list ul li .signed_and_dated, .records_list ul li .dimensions, .records_list ul li .medium, .records_list ul li .read_more_label, .records_list ul li .series, #artists-browser, .artists-browser , .buy_now_enquire>.enquire_button_container.clearwithin > .button > a{ color: #000000; } .page_stats .disabled, .ps_item.disabled { color: #000000; opacity: 0.5; } /* Body/main text colour ------------------- */ body, a, a:visited, a:hover, #social_sharing_links.popup_vertical ul li.social_links_item a, #social_sharing_links.popup_vertical ul li.social_links_item a:visited, .social_sharing_links.popup_vertical ul li.social_links_item a, .social_sharing_links.popup_vertical ul li.social_links_item a:visited, .page-artists .subsection-works #image_gallery .subtitle, .page_stats .ps_item a, .page_stats .ps_item a:visited, .page-artworks #image_gallery .subtitle, .fancybox-skin, div.arprompt, .records_list .content, div.arprompt .arpromptmessage, .fancybox-type-image .fancybox-close::after, .fancybox-type-image .fancybox-prev span:after, .fancybox-type-image .fancybox-next span:after, .store_items_condensed .store_item_add_to_cart span, .store_items_condensed .store_item_add_to_cart.button span, .store_items_standard .store_item_remove_container .store_item_remove_from_cart:after, .subsection-store-products-record .store_item_remove_container .store_item_remove_from_cart:after, #sc_checkout_container #sc_checkout_payment_form .form_row .inputField, #sc_checkout_container #sc_checkout_payment_form .form_row input, .filters_panel .fp-module input[type=checkbox]+label, .filters_panel .fp-module .slider_label { color: #000000; } #privacy_policy_form_msg { color: #000000; opacity: 0.5; } /* Link text color ------------------- */ .link, .link:hover, .link span, .link span:hover, .link a, .link a:hover, .link a:visited, #mc_embed_signup input.button, .simple_list ul li a, a.external { color: #565656; } /* Header layout ------------------- */ /* Dynamically created grid layout css ------------------- */ /* artfairs - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_artfairs:not(.feature_list) > ul > li { width:50.0% }} .records_list.feature_list.grid_dynamic_layout_artfairs:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_artfairs:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_artfairs ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_artfairs ul li .image > span { -webkit-justify-content:flex-start; justify-content: flex-start; -webkit-align-items:flex-end; -ms-flex-align: flex-end; align-items: flex-end; } .records_list.grid_dynamic_layout_artfairs ul li .image::after { padding-top:66.6666666667%; } /* instagram - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_instagram:not(.feature_list) > ul > li { width:25.0% }} .records_list.feature_list.grid_dynamic_layout_instagram:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_instagram:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_instagram ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_instagram ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_instagram ul li .image::after { padding-top:66.6666666667%; } /* artworks - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_artworks:not(.feature_list) > ul > li { width:33.33% }} .records_list.grid_dynamic_layout_artworks ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_artworks ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_artworks ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_artworks ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_artworks ul li img:first-letter { font-family:object-fit; } /* default image grid - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_default_image_grid:not(.feature_list) > ul > li { width:25.0% }} .records_list.feature_list.grid_dynamic_layout_default_image_grid:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_default_image_grid:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_default_image_grid ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_default_image_grid ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_default_image_grid ul li .image::after { padding-top:66.6666666667%; } /* video - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_video:not(.feature_list) > ul > li { width:33.33% }} .records_list.grid_dynamic_layout_video ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_video ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_video ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_video ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_video ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_video ul li .image::after { padding-top:66.6666666667%; } /* default grid - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_default_grid:not(.feature_list) > ul > li { width:33.33% }} .records_list.feature_list.grid_dynamic_layout_default_grid:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_default_grid:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_default_grid ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_default_grid ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:flex-end; -ms-flex-align: flex-end; align-items: flex-end; } .records_list.grid_dynamic_layout_default_grid ul li .image::after {display:none;} .records_list.grid_dynamic_layout_default_grid ul li .image > span {position: static;} /* artists - tile_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.tile_list.grid_dynamic_layout_artists ul { width: calc(33.33%) }} .records_list.feature_list.grid_dynamic_layout_artists:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_artists:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_artists ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_artists ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:flex-start; -ms-flex-align: flex-start; align-items: flex-start; } .records_list.grid_dynamic_layout_artists ul li .image::after {display:none;} .records_list.grid_dynamic_layout_artists ul li .image > span {position: static;} /* video featured - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_video_featured:not(.feature_list) > ul > li { width:100.0% }} .records_list.grid_dynamic_layout_video_featured ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_video_featured ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_video_featured ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_video_featured ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_video_featured ul li img:first-letter { font-family:object-fit; } /* artist works categories - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_artist_works_categories:not(.feature_list) > ul > li { width:33.33% }} .records_list.feature_list.grid_dynamic_layout_artist_works_categories:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_artist_works_categories:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_artist_works_categories ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_artist_works_categories ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:flex-start; -ms-flex-align: flex-start; align-items: flex-start; } .records_list.grid_dynamic_layout_artist_works_categories ul li .image::after {display:none;} .records_list.grid_dynamic_layout_artist_works_categories ul li .image > span {position: static;} /* exhibitions - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_exhibitions:not(.feature_list) > ul > li { width:33.33% }} .records_list.grid_dynamic_layout_exhibitions ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_exhibitions ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_exhibitions ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_exhibitions ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_exhibitions ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_exhibitions ul li .image::after { padding-top:66.6666666667%; } /* events works - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_events:not(.feature_list) > ul > li { width:33.33% }} .records_list.feature_list.grid_dynamic_layout_events:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_events:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_events ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_events ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:flex-end; -ms-flex-align: flex-end; align-items: flex-end; } .records_list.grid_dynamic_layout_events ul li .image::after {display:none;} .records_list.grid_dynamic_layout_events ul li .image > span {position: static;} /* exhibitions installation - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_exhibitions_installation:not(.feature_list) > ul > li { width:25.0% }} .records_list.feature_list.grid_dynamic_layout_exhibitions_installation:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_exhibitions_installation:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_exhibitions_installation ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_exhibitions_installation ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_exhibitions_installation ul li .image::after { padding-top:66.6666666667%; } /* artist installation - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_artist_installation:not(.feature_list) > ul > li { width:25.0% }} .records_list.feature_list.grid_dynamic_layout_artist_installation:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_artist_installation:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_artist_installation ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_artist_installation ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:flex-start; -ms-flex-align: flex-start; align-items: flex-start; } .records_list.grid_dynamic_layout_artist_installation ul li .image::after { padding-top:66.6666666667%; } /* blog - reading_list-------------------------------------- */ .records_list.grid_dynamic_layout_blog ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_blog ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_blog ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_blog ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_blog ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_blog ul li .image::after { padding-top:66.6666666667%; } /* store featured - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_store_featured:not(.feature_list) > ul > li { width:100.0% }} .records_list.grid_dynamic_layout_store_featured ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_store_featured ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_store_featured ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_store_featured ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_store_featured ul li img:first-letter { font-family:object-fit; } /* events featured - feature_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.feature_list.grid_dynamic_layout_events_featured ul { width:100%;}} .records_list.grid_dynamic_layout_events_featured ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_events_featured ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_events_featured ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_events_featured ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_events_featured ul li img:first-letter { font-family:object-fit; } /* artwork categories landing - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_artwork_categories_landing:not(.feature_list) > ul > li { width:33.33% }} .records_list.feature_list.grid_dynamic_layout_artwork_categories_landing:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_artwork_categories_landing:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_artwork_categories_landing ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_artwork_categories_landing ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:flex-end; -ms-flex-align: flex-end; align-items: flex-end; } .records_list.grid_dynamic_layout_artwork_categories_landing ul li .image::after {display:none;} .records_list.grid_dynamic_layout_artwork_categories_landing ul li .image > span {position: static;} /* events - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_events:not(.feature_list) > ul > li { width:33.33% }} .records_list.grid_dynamic_layout_events ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_events ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_events ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_events ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_events ul li img:first-letter { font-family:object-fit; } /* store - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_store:not(.feature_list) > ul > li { width:33.33% }} .records_list.feature_list.grid_dynamic_layout_store:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_store:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_store ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_store ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:flex-end; -ms-flex-align: flex-end; align-items: flex-end; } .records_list.grid_dynamic_layout_store ul li .image::after {display:none;} .records_list.grid_dynamic_layout_store ul li .image > span {position: static;} /* default feature grid - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_default_feature_grid:not(.feature_list) > ul > li { width:100.0% }} .records_list.grid_dynamic_layout_default_feature_grid ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_default_feature_grid ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_default_feature_grid ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_default_feature_grid ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_default_feature_grid ul li img:first-letter { font-family:object-fit; } /* feature panels - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_feature_panels:not(.feature_list) > ul > li { width:33.33% }} .records_list.feature_list.grid_dynamic_layout_feature_panels:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_feature_panels:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_feature_panels ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_feature_panels ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:flex-end; -ms-flex-align: flex-end; align-items: flex-end; } .records_list.grid_dynamic_layout_feature_panels ul li .image::after {display:none;} .records_list.grid_dynamic_layout_feature_panels ul li .image > span {position: static;} /* exhibitions works - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_exhibitions_works:not(.feature_list) > ul > li { width:25.0% }} .records_list.feature_list.grid_dynamic_layout_exhibitions_works:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_exhibitions_works:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_exhibitions_works ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_exhibitions_works ul li .image > span { -webkit-justify-content:flex-start; justify-content: flex-start; -webkit-align-items:flex-end; -ms-flex-align: flex-end; align-items: flex-end; } .records_list.grid_dynamic_layout_exhibitions_works ul li .image::after { padding-top:66.6666666667%; } /* publications featured - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_publications_featured:not(.feature_list) > ul > li { width:100.0% }} .records_list.grid_dynamic_layout_publications_featured ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_publications_featured ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_publications_featured ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_publications_featured ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_publications_featured ul li img:first-letter { font-family:object-fit; } /* press featured - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_press_featured:not(.feature_list) > ul > li { width:100.0% }} .records_list.grid_dynamic_layout_press_featured ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_press_featured ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_press_featured ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_press_featured ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_press_featured ul li img:first-letter { font-family:object-fit; } /* news featured - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_news_featured:not(.feature_list) > ul > li { width:100.0% }} .records_list.grid_dynamic_layout_news_featured ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_news_featured ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_news_featured ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_news_featured ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_news_featured ul li img:first-letter { font-family:object-fit; } /* artfairs featured - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_artfairs_featured:not(.feature_list) > ul > li { width:50.0% }} .records_list.feature_list.grid_dynamic_layout_artfairs_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_artfairs_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_artfairs_featured ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_artfairs_featured ul li .image > span { -webkit-justify-content:flex-start; justify-content: flex-start; -webkit-align-items:flex-end; -ms-flex-align: flex-end; align-items: flex-end; } .records_list.grid_dynamic_layout_artfairs_featured ul li .image::after {display:none;} .records_list.grid_dynamic_layout_artfairs_featured ul li .image > span {position: static;} /* exhibitions featured - feature_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.feature_list.grid_dynamic_layout_exhibitions_featured ul { width:100%;}} .records_list.grid_dynamic_layout_exhibitions_featured ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_exhibitions_featured ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_exhibitions_featured ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_exhibitions_featured ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_exhibitions_featured ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_exhibitions_featured ul li .image::after { padding-top:66.6666666667%; } /* press - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_press:not(.feature_list) > ul > li { width:33.33% }} .records_list.feature_list.grid_dynamic_layout_press:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_press:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_press ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_press ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:flex-end; -ms-flex-align: flex-end; align-items: flex-end; } .records_list.grid_dynamic_layout_press ul li .image::after {display:none;} .records_list.grid_dynamic_layout_press ul li .image > span {position: static;} /* news - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_news:not(.feature_list) > ul > li { width:33.33% }} .records_list.grid_dynamic_layout_news ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_news ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_news ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_news ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_news ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_news ul li .image::after { padding-top:66.6666666667%; } /* viewing rooms featured forthcoming - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_viewing_rooms_featured_forthcoming:not(.feature_list) > ul > li { width:100.0% }} .records_list.grid_dynamic_layout_viewing_rooms_featured_forthcoming ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_viewing_rooms_featured_forthcoming ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_viewing_rooms_featured_forthcoming ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_viewing_rooms_featured_forthcoming ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_viewing_rooms_featured_forthcoming ul li img:first-letter { font-family:object-fit; } /* search - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_search:not(.feature_list) > ul > li { width:33.33% }} .records_list.feature_list.grid_dynamic_layout_search:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_search:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_search ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_search ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:flex-end; -ms-flex-align: flex-end; align-items: flex-end; } .records_list.grid_dynamic_layout_search ul li .image::after {display:none;} .records_list.grid_dynamic_layout_search ul li .image > span {position: static;} /* viewing rooms featured - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_viewing_rooms_featured:not(.feature_list) > ul > li { width:100.0% }} .records_list.grid_dynamic_layout_viewing_rooms_featured ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_viewing_rooms_featured ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_viewing_rooms_featured ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_viewing_rooms_featured ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_viewing_rooms_featured ul li img:first-letter { font-family:object-fit; } /* viewing rooms works - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_viewing_rooms_works:not(.feature_list) > ul > li { width:25.0% }} .records_list.feature_list.grid_dynamic_layout_viewing_rooms_works:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_viewing_rooms_works:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_viewing_rooms_works ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_viewing_rooms_works ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_viewing_rooms_works ul li .image::after { padding-top:66.6666666667%; } /* artist works - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_artist_works:not(.feature_list) > ul > li { width:25.0% }} .records_list.grid_dynamic_layout_artist_works ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_artist_works ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_artist_works ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_artist_works ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_artist_works ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_artist_works ul li .image::after { padding-top:66.6666666667%; } /* exhibitors - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_exhibitors:not(.feature_list) > ul > li { width:33.33% }} .records_list.feature_list.grid_dynamic_layout_exhibitors:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_exhibitors:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_exhibitors ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_exhibitors ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:flex-end; -ms-flex-align: flex-end; align-items: flex-end; } .records_list.grid_dynamic_layout_exhibitors ul li .image::after {display:none;} .records_list.grid_dynamic_layout_exhibitors ul li .image > span {position: static;} /* feature panels image grid - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_feature_panels_image_grid:not(.feature_list) > ul > li { width:33.33% }} .records_list.feature_list.grid_dynamic_layout_feature_panels_image_grid:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_feature_panels_image_grid:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_feature_panels_image_grid ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_feature_panels_image_grid ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_feature_panels_image_grid ul li .image::after {display:none;} .records_list.grid_dynamic_layout_feature_panels_image_grid ul li .image > span {position: static;} /* publications - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_publications:not(.feature_list) > ul > li { width:33.33% }} .records_list.feature_list.grid_dynamic_layout_publications:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_publications:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_publications ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_publications ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:flex-end; -ms-flex-align: flex-end; align-items: flex-end; } .records_list.grid_dynamic_layout_publications ul li .image::after {display:none;} .records_list.grid_dynamic_layout_publications ul li .image > span {position: static;} /* team - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_team:not(.feature_list) > ul > li { width:33.33% }} .records_list.feature_list.grid_dynamic_layout_team:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_team:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_team ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_team ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:flex-end; -ms-flex-align: flex-end; align-items: flex-end; } .records_list.grid_dynamic_layout_team ul li .image::after {display:none;} .records_list.grid_dynamic_layout_team ul li .image > span {position: static;} /* viewing rooms - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_viewing_rooms:not(.feature_list) > ul > li { width:33.33% }} .records_list.feature_list.grid_dynamic_layout_viewing_rooms:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_viewing_rooms:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_viewing_rooms ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_viewing_rooms ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:flex-end; -ms-flex-align: flex-end; align-items: flex-end; } .records_list.grid_dynamic_layout_viewing_rooms ul li .image::after {display:none;} .records_list.grid_dynamic_layout_viewing_rooms ul li .image > span {position: static;} /* Dynamically created artist list css ------------------- */ .subsection-artist-list-preview-letters .artists_list_dynamic_columns ul { width:50.0% } .subsection-artist-list-standard .artists_list_dynamic_columns ul { width:50.0% } .subsection-artist-list-preview .artists_list_dynamic_columns ul { width:50.0% } /* Light and dark logo variants css ------------------- */ /* Logo text color ------------------- */ #logo { background: none; width: 100%; min-width: 80px; max-width: 80px; } #header #logo.user-custom-logo-image::before { padding-top:64.6090534979%; } .device-highres #logo { background: none; } #logo a { background-image: url('https://static-assets.artlogic.net/w_1000,c_limit,f_auto,fl_lossy,q_auto/ws-artlogicwebsite1954/usr/images/preferences/screenshot-2025-01-17-at-1.07.08-pm.png'); background-repeat: no-repeat; background-position: center center; background-size: contain; } .browser-msie-6 #logo a, .browser-msie-7 #logo a, .browser-msie-8 #logo a, .browser-msie-9 #logo a, .browser-msie-10 #logo a { background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='https://static-assets.artlogic.net/w_1000,c_limit,f_auto,fl_lossy,q_auto/ws-artlogicwebsite1954/usr/images/preferences/screenshot-2025-01-17-at-1.07.08-pm.png', sizingMethod='scale'); -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='https://static-assets.artlogic.net/w_1000,c_limit,f_auto,fl_lossy,q_auto/ws-artlogicwebsite1954/usr/images/preferences/screenshot-2025-01-17-at-1.07.08-pm.png', sizingMethod='scale')"; } #logo a { text-indent: -9999px; padding: 0; } /* Topnav text color ------------------- */ #header #store_cart_widget::before, #header #store_cart_widget.active:not(.empty)::before, #header #store_cart_widget::after, #header #store_cart_widget.active:not(.empty)::after, #top_nav.navigation ul li a, #top_nav.navigation ul li a:visited, #header_quick_search #header_quicksearch_btn, #responsive_slide_nav_wrapper #top_nav .header_quicksearch_field, #header_quick_search.active input, #header_quick_search.active select, #header_quick_search.active textarea, #header .social_media_icon, #translations_nav.navigation ul li a, #top_nav #full_nav .dropdown-btn, #top_nav #full_nav .has_dropdown_items .dropdown-btn, #top_nav #full_nav .has_dropdown_items_mobile .dropdown-btn { color: #565656; } #slide_nav_reveal::after { color: #565656; } #top_nav.navigation ul li.active a, #top_nav.navigation ul li.active a:visited, #header #store_cart_widget:hover::before, #header #store_cart_widget:hover::after, #top_nav.navigation ul li:hover a, #translations_nav.navigation ul li.active a, #translations_nav.navigation ul li:hover a, #top_nav #full_nav .dropdown-btn:hover { color: #000000; } /* Subnav text color ------------------- */ .navigation ul li.active a, .navigation ul li.active a:hover, .navigation ul li.active a:visited, body.type-fullscreen.fullscreen-slide-light .navigation ul li.active a { color: #000000; } /* Responsive nav text color ------------------- */ .slide-nav-open #responsive_slide_nav_wrapper #top_nav ul li:not(.active) a, .slide-nav-open #header #responsive_slide_nav_wrapper .social_media_icon::after, .slide-nav-open #responsive_slide_nav_wrapper .quicksearch-icon::after, .slide-nav-open #responsive_slide_nav_wrapper #top_nav .header_quicksearch_field, .slide-nav-open #responsive_slide_nav_wrapper #top_nav #top_nav_reveal ul li a::after, .slide-nav-open #top_nav #full_nav .has_dropdown_items .dropdown-btn, .slide-nav-open #top_nav #full_nav .has_dropdown_items_mobile .dropdown-btn{ color: #000000; } /* Responsive nav active / hover text color ------------------- */ .slide-nav-open #responsive_slide_nav_wrapper #top_nav ul li.active a, .slide-nav-open #responsive_slide_nav_wrapper #top_nav ul li:hover a { color: #565656; } /* Button text color ------------------- */ .button a, .button a:visited, .button a:hover, .button span, .button input, .buy_now_store_item_add_container>button.store_item_add_to_cart>span { color: #565656; } /* quick view button */ .buy_enquire_button button, a.buy_enquire_detail_link { color: #565656; } /* Hero section image opacity ------------------- */ #mirror-slideshow.hero-parallax-element-mirror ul li .image, #mirror-slideshow.hero-parallax-element-mirror ul li .video_container .video_inner, #hero_header #slideshow ul li .image, #hero_header #hero_image_responsive, .parallax-mirror img.parallax-slider { opacity: 1 !important; } .parallax-mirror:not(#parallax-hero_header) img.parallax-slider { opacity: 1 !important; } /* don't show if opacity = 1 */ #hero_header:not(.hero_section_detect_brightness):not(.hero-mode-split)::after { display:none !important; } /* Hero section image height ------------------- */ ::root { --hero-height: 60vh } #hero_header > .inner, body.layout-hero-header:not(.type-fullscreen) #main_content::before, body.layout-hero-header.layout-hero-header-record-data #hero_header > .inner, body.layout-hero-header.layout-hero-header-record-data:not(.type-fullscreen ) #main_content::before, body.layout-hero-header #hero_header.hero-mode-split { height: var(--hero-height, 60vh); max-height: none; } .layout-hero-header-record-data #hero_header > .inner, body.layout-hero-header-record-data.layout-hero-header:not(.type-fullscreen ) #main_content::before, body.layout-hero-header-record-data.layout-hero-header.layout-hero-header-record-data #hero_header > .inner, body.layout-hero-header-record-data.layout-hero-header.layout-hero-header-record-data:not(.type-fullscreen ) #main_content::before, body.layout-hero-header.layout-hero-header-record-data #hero_header.hero-mode-split { height: var(--hero-height, 85vh); max-height: none; } /* Home page slideshow / fullscreen video ui buttons ------------------- */ /* Hero header slideshow ui buttons ------------------- */ /* Carousel feature panel ui buttons ------------------- */ @media screen and (max-width:360px) { #logo a { background-image: url('https://static-assets.artlogic.net/w_500,c_limit,f_auto,fl_lossy,q_auto/ws-artlogicwebsite1954/usr/images/preferences/screenshot-2025-01-17-at-1.07.08-pm.png'); } } /* Artlogic preferences custom CSS - entered by Artlogic in the preferences screen ------------------- */ /* Client custom user CSS - entered by the client in the preferences screen ------------------- */ /* In this document we have what is inserted into artlogics global styles - this is the only control over styles we have*/ /* Base typography */ body { font-family: "Inter", sans-serif; font-size: 1.10rem; font-weight: 400; line-height: 1.60; } h6, h4 { font-family: "Inter", sans-serif; font-weight: 400; } h1, h2, h3, h5 { font-family: "Inter", sans-serif; font-weight: 600; } /* Break container — homepage only .section-home is added to by Artlogic on the homepage. Without !important Artlogic's own specificity wins. */ .section-home #container { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; } /* Match footer gutter to homepage sections — also on .lnl-press news pages. */ .section-home #footer, body:has(.lnl-press) #footer { padding-left: clamp(28px, 4vw, 64px) !important; padding-right: clamp(28px, 4vw, 64px) !important; box-sizing: border-box !important; } .section-home #footer .inner, body:has(.lnl-press) #footer .inner { max-width: none !important; padding-left: 0 !important; padding-right: 0 !important; margin-left: 0 !important; margin-right: 0 !important; } /* Restore padding and style Artlogic's feature panel to match the designer. */ .section-home .feature_panels { padding: 0 clamp(28px, 4vw, 64px) !important; } .section-home .feature_panels .panel_header h2 { font-family: 'Bebas Neue', 'Inter', sans-serif !important; font-size: 48px; font-weight: 400; letter-spacing: 0; text-transform: none; color: #111; line-height: 1; margin: 0 0 20px; } .section-home .feature_panels h2.fp_title { font-size: 15px; font-weight: 600; color: #111; line-height: 1.25; margin: 0 0 4px; } .section-home .feature_panels .subtitle { font-size: 13px; font-weight: 400; color: #888; display: block; margin: 0 0 4px; } .section-home .feature_panels .date { font-size: 12px; color: #bbb; display: block; } /* ───────────────────────────────────────────────── HOMEPAGE v2 — Moon Jar; An Axis All classes prefixed lnl- to avoid collisions with Artlogic's own classes and the old homepage. ───────────────────────────────────────────────── */ /* HERO — full-viewport title screen header_fixed means the Artlogic nav overlays from the top without pushing content down. Artlogic JS adds body padding-top equal to nav height so we don't need explicit top padding here. min(440px, 44vh): matches the live 440px value at ≥1000px viewport height, then scales down on shorter screens so the peek stays visually proportionate. On desktop, vh = svh (no browser chrome offset), so the desktop rule uses vh throughout. On mobile the svh overrides in the ≤767px block below take over. */ .lnl-hero { height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 0 clamp(28px, 4vw, 64px) min(440px, 44vh); position: relative; background: #fff; box-sizing: border-box; } .lnl-label { font-family: 'Inter', sans-serif; font-size: 16px; font-weight: 400; letter-spacing: 0.18em; text-transform: uppercase; color: #bbb; margin: 0 0 28px; line-height: 1; } /* clamp(52px, 13vw, 139px): 139px at ≥1070px wide (matches live site desktop), ~78px at 600px (half-laptop, wraps to 2 clean lines), 52px floor at ≤400px (phone portrait). */ .lnl-title { display: block !important; font-family: 'Inter', sans-serif !important; font-size: clamp(52px, 13vw, 139px) !important; font-weight: 600 !important; line-height: 0.88 !important; letter-spacing: -0.04em !important; color: #111 !important; margin: 0 0 36px !important; } .lnl-date { font-family: 'Inter', sans-serif; font-size: 24px; font-weight: 400; color: #999; margin: 0; line-height: 1; } /* EXHIBITION — image + names max(-320px, -32vh): pulls the jar section up so the top of the jar peeks into the hero viewport. Equals exactly -320px at ≥1000px height, scales proportionally on shorter screens. overflow: hidden + translateY(-60px) crops the blank space above the rim in the source photo. */ .lnl-exh { display: flex; flex-direction: column; align-items: center; padding: 0 clamp(28px, 4vw, 64px) 100px; margin-top: max(-320px, -32vh); background: #fff; position: relative; z-index: 1; } .lnl-jar-wrap { width: 43vw; overflow: hidden; margin-bottom: 52px; } .lnl-jar-img { width: 100%; display: block; height: auto; transform: translateY(-60px); } .lnl-names { max-width: 680px; text-align: center; font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 400; line-height: 2.2; color: #999; } .lnl-names .kr { color: #444; } .lnl-names .au { color: #aaa; } .lnl-names .sep { color: #ddd; } /* ───────────────────────────────────────────────── RESPONSIVE — ≤767px (phones and small tablets) Switch all vh values to svh (small viewport height). Mobile browsers compute 100vh using the LARGE viewport (browser chrome collapsed), making the hero overflow the actual visible area. 100svh is always the stable visible height — chrome accounted for. With svh, centering stays correct and the jar's negative margin is scaled to the real visible viewport, so the peek works as intended. ───────────────────────────────────────────────── */ @media (max-width: 767px) { .lnl-hero { height: 100svh; padding-bottom: min(440px, 44svh); } .lnl-exh { margin-top: max(-320px, -32svh); } } /* ───────────────────────────────────────────────── RESPONSIVE — 540px–767px (tablet / half-laptop) Peek concept preserved; jar widened for better visual weight at narrower viewport widths. ───────────────────────────────────────────────── */ @media (min-width: 540px) and (max-width: 767px) { .lnl-jar-wrap { width: 58vw; } } /* ───────────────────────────────────────────────── RESPONSIVE — ≤539px (mobile portrait) The peek concept is dropped entirely. The hero is a straightforward text screen; the jar flows below as a full-width image uncropped. Title clamp gives ~51px at 390px — "Moon Jar; An Axis" sits on 2 clean lines without overflowing. ───────────────────────────────────────────────── */ @media (max-width: 539px) { .lnl-hero { height: 60svh; padding-top: 0; padding-bottom: 0; } .lnl-label { font-size: 12px; letter-spacing: 0.15em; margin-bottom: 20px; } .lnl-title { margin-bottom: 24px !important; } .lnl-date { font-size: 18px; } .lnl-exh { margin-top: 0; padding-top: 24px; } .lnl-jar-wrap { width: 78vw; overflow: visible; } .lnl-jar-img { transform: none; } } /* ───────────────────────────────────────────────── UPCOMING EVENTS — three equal cards Prefixed lnl-up- to avoid Artlogic collisions. ───────────────────────────────────────────────── */ .lnl-up-rule { height: 1px; background: #ebebeb; margin: 0 clamp(28px, 4vw, 64px); } .lnl-up { padding: 0 clamp(28px, 4vw, 64px) 80px; } .lnl-up-head { font-family: 'Bebas Neue', 'Inter', sans-serif !important; font-size: 20px; font-weight: 400; line-height: 1; color: #111; margin: 0 0 20px; padding-top: 26px; letter-spacing: 0; text-transform: none; padding-bottom: 10px; } .lnl-up-grid { display: flex; gap: 20px; } .lnl-up-card { flex: 1; min-width: 0; text-decoration: none; color: inherit; display: block !important; } .lnl-up-card:hover .lnl-up-img { opacity: 0.85; } .lnl-up-img { width: 100% !important; max-width: 100% !important; height: auto !important; aspect-ratio: 3 / 2; object-fit: cover; display: block !important; margin-bottom: 12px !important; transition: opacity 0.2s; } .lnl-up-type, .lnl-up-title, .lnl-up-sub, .lnl-up-date { display: block; } .lnl-up-type { font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: #aaa; margin: 0 0 5px; line-height: 1; } .lnl-up-title { font-size: 15px; font-weight: 600; color: #111; margin: 0 0 3px; line-height: 1.25; } .lnl-up-sub { font-size: 13px; font-weight: 400; color: #888; margin: 0 0 3px; } .lnl-up-date { font-size: 12px; color: #bbb; margin: 0; } @media (max-width: 767px) { .lnl-up-grid { flex-wrap: wrap; } .lnl-up-card { min-width: calc(50% - 10px); } } @media (max-width: 539px) { .lnl-up-grid { flex-direction: column; } .lnl-up-card { min-width: 0; } } .artist_above_list_content { order: 1; /* move it below */ } .subheading.beyond { padding-top: 40px; } .beyond-list, .beyond-list ul { display: block !important; width: 100% !important; column-count: 1 !important; columns: 1 !important; } .beyond-list ul { float: none !important; clear: both; margin-top: 0 !important; padding-top: 0 !important; } .beyond-list li { float: none !important; width: 100% !important; display: block !important; margin: 0 0 14px 0 !important; padding: 0 !important; line-height: 1.2 !important; } .beyond-list li h2 { margin: 0 !important; padding: 0 !important; line-height: 1.2 !important; } .artist_years { display: inline-flex; flex-direction: row-reverse; gap: 0; } .artist_years .nationality { display: inline-block; white-space: nowrap; clip-path: inset(0 0.25em 0 0); margin-right: -0.25em; } .artist_years .nationality::before { content: ", "; } .artwork_details_wrapper h1.artist #artist_years { display: none !important; } /* ───────────────────────────────────────────────── NEWS / PRESS PAGE — append to user_custom.css For custom LNL press/news articles inserted into Artlogic news records. The .lnl-press block is the custom article. Artlogic still renders its own news title, sidebar image, and date stamp around it; those are hidden only when the page contains .lnl-press. ───────────────────────────────────────────────── */ /* ───────────────────────────────────────────────── ARTLOGIC PAGE OVERRIDES — only on .lnl-press pages ───────────────────────────────────────────────── */ /* Break the page out of Artlogic's normal container. */ body:has(.lnl-press) #container { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; } /* Hide Artlogic's auto-rendered news title. */ .subsection-news-record:has(.lnl-press) > .news-header { display: none !important; } /* Hide Artlogic's auto-rendered sidebar/main image. */ .subsection-news-record:has(.lnl-press) #sidebar { display: none !important; } /* Undo Artlogic's sidebar layout so the custom article can centre again. */ .subsection-news-record:has(.lnl-press) #content { display: block !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; } /* Restore the content module to full width after sidebar removal. */ .subsection-news-record:has(.lnl-press) #content_module { float: none !important; clear: both !important; width: 100% !important; max-width: none !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; } /* Hide Artlogic's auto-rendered date stamp under the article. The custom press meta row already shows the date. */ .subsection-news-record:has(.lnl-press) #content_module > span > .date, .subsection-news-record:has(.lnl-press) #content_module > .date { display: none !important; } /* ───────────────────────────────────────────────── CUSTOM PRESS ARTICLE ───────────────────────────────────────────────── */ /* Scoped reset — descendants of .lnl-press only. */ .lnl-press *, .lnl-press *::before, .lnl-press *::after { box-sizing: border-box; margin: 0; padding: 0; } .lnl-press img { max-width: 100%; height: auto; display: block; } /* Article shell — centred, capped, with fluid gutters. */ .lnl-press-article { max-width: 1200px; margin: 0 auto; padding: clamp(40px, 6vw, 96px) clamp(20px, 4vw, 64px) clamp(60px, 8vw, 120px); } /* Top meta row. */ .lnl-press-meta { display: flex; flex-wrap: wrap; gap: 6px 24px; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: #aaa; margin-bottom: clamp(28px, 4vw, 48px); } .lnl-press-meta .lnl-issue { display: none; } /* Display title. */ .lnl-press-title { font-size: clamp(44px, 9vw, 116px); line-height: 0.95; letter-spacing: -0.04em; margin: 0 0 clamp(48px, 7vw, 96px); max-width: 14ch; } .lnl-press-title span { display: block; } .lnl-press-title .ln-1 { color: #111; } .lnl-press-title .ln-2 { font-weight: 300; color: #999; } .lnl-press-title .ln-3 { font-style: italic; color: #111; } /* Hero image and work info. */ .lnl-press-hero { margin-bottom: clamp(48px, 6vw, 80px); } .lnl-press-hero-img { width: 100%; background: #f4f4f4; margin-bottom: clamp(28px, 4vw, 48px); } .lnl-press-info { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: clamp(28px, 4vw, 56px); align-items: end; color: #555; } .lnl-press-work-title { font-size: clamp(22px, 2.4vw, 30px); font-weight: 500; color: #111; line-height: 1.2; letter-spacing: -0.01em; margin: 0 0 14px; } .lnl-press-work-spec { font-size: clamp(15px, 1.4vw, 17px); color: #333; line-height: 1.6; } /* Metadata facts row. */ .lnl-press-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px 24px; border-top: 1px solid #ebebeb; border-bottom: 1px solid #ebebeb; padding: 22px 0; } .lnl-press-fact-label { display: block; font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: #aaa; margin-bottom: 6px; } .lnl-press-fact-value { display: block; font-size: 14px; font-weight: 500; color: #111; letter-spacing: -0.005em; } .lnl-press-fact-value a { color: inherit; text-decoration: none; border-bottom: 1px solid #ddd; padding-bottom: 1px; transition: border-color 0.15s; } .lnl-press-fact-value a:hover { border-color: #111; } /* Lede. */ .lnl-press-lede { max-width: 880px; margin: 0 auto clamp(48px, 7vw, 88px); padding: 0 clamp(0px, 3vw, 32px); font-size: clamp(22px, 3vw, 36px); font-weight: 300; line-height: 1.4; letter-spacing: -0.018em; color: #222; text-align: center; } /* Pull quote. */ .lnl-press-quote { margin: 0 0 clamp(64px, 9vw, 120px); } .lnl-press-quote blockquote { border: 0 !important; margin: 0 !important; padding: 0 !important; width: 100% !important; max-width: none !important; font-size: clamp(16px, 1.5vw, 19px); line-height: 1.6; letter-spacing: -0.005em; color: #222; text-wrap: pretty; } .lnl-press-quote blockquote > span { display: block; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; } .lnl-press-quote blockquote p { margin: 0 0 1em; max-width: none !important; } .lnl-press-quote blockquote p:last-of-type { margin-bottom: 0; } .lnl-press-quote blockquote em { font-style: italic; } .lnl-press-quote-attr { margin-top: clamp(20px, 2.5vw, 32px); font-size: clamp(14px, 1.3vw, 15px); color: #888; } /* CTA. */ .lnl-press-cta { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: end; border-top: 1px solid #ebebeb; padding-top: clamp(32px, 4vw, 56px); } .lnl-press-cta-eyebrow { font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: #999; margin-bottom: 14px; } .lnl-press-cta-text p { font-size: clamp(15px, 1.4vw, 17px); line-height: 1.6; color: #333; max-width: 44ch; } .lnl-press-cta-link { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; } .lnl-press-cta-show { font-size: clamp(18px, 2vw, 24px); font-weight: 500; letter-spacing: -0.01em; color: #111; } .lnl-press-cta-link a { font-size: 13px; color: #111; text-decoration: none; border-bottom: 1px solid #111; padding-bottom: 2px; } .lnl-press-cta-link a:hover { color: #555; border-color: #555; } /* ───────────────────────────────────────────────── RESPONSIVE ───────────────────────────────────────────────── */ @media (max-width: 880px) { .lnl-press-info { grid-template-columns: 1fr; gap: clamp(20px, 4vw, 32px); align-items: start; } .lnl-press-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 720px) { .lnl-press-cta { grid-template-columns: 1fr; align-items: start; } } @media (max-width: 540px) { .lnl-press-facts { grid-template-columns: 1fr; gap: 16px; } .lnl-press-meta { gap: 4px 16px; font-size: 10px; } } /* ───────────────────────────────────────────────── About page additions Paste these into Artlogic admin → Settings → Custom CSS (append to whatever is already there — do not replace). Everything page-specific has to live here, NOT in the page HTML — Artlogic strips