/* CSS imports ------------------- */ /* Forced mobile nav on all sizes ------------------- */ @import url('/lib/g/2.0/styles/responsive_topnav.css'); @import url('/lib/g/themes/aperture/2.0/styles/responsive_topnav.css'); /* Font imports ------------------- */ @font-face { font-family: "Diatype Medium"; src: url('/usr/documents/fonts/bold_font_woff/2/abcdiatype-medium-trial.woff') format('woff'), url('/usr/documents/fonts/bold_font_woff2/2/abcdiatype-medium-trial.woff2') format('woff2'), url('/usr/documents/fonts/bold_font_ttf/2/abcdiatype-medium-trial.ttf') format('truetype'); font-style: normal; font-weight: bold; } @font-face { font-family: "Diatype Medium"; src: url('/usr/documents/fonts/regular_font_woff/2/abcdiatype-medium-trial.woff') format('woff'), url('/usr/documents/fonts/regular_font_woff2/2/abcdiatype-medium-trial.woff2') format('woff2'), url('/usr/documents/fonts/regular_font_ttf/2/abcdiatype-medium-trial.ttf') format('truetype'); font-style: normal; font-weight: normal; } /* Background colour --------------*/ #header.header_transparent .dropdown-mask { background-color: transparent !important; } /* Feature popup colours ------------------- */ h1, .heading_wrapper h1, #header .inner, #footer, .countdown_container, .feature_list ul li .content .subtitle, #sidebar .feature_panels .records_list ul li, .sidebar .feature_panels .records_list ul li, .related_items_panel h3, .formats_list, .formats_list .formats_item, .subheading::after, .subheading::before, .related_items_panel > h3:after, .related_items_panel h3.related_items_panel_heading:after, .related_items_panel h2.related_items_panel_heading:after .share_link:not(.subnav_share_link), #social_sharing_links.popup_vertical, .social_sharing_links.popup_vertical, .store_item_group .store_items_standard, .store_items_standard .store_item, .page_stats, hr, #scw_popup_inner h3, #shopping_cart_information td, #wishlist_information td, #shopping_cart_information th, #wishlist_information th, #sc_additional_fields, #sc_checkout_content #sc_subtotal, #sc_checkout_content #sc_discount, #sc_checkout_content #sc_vat_total, #sc_checkout_content #sc_shipping_total, #sc_checkout_content #sc_order_total, div.arprompt .arpromptbuttons, div.arprompt button, #protected_path_login .protected_path_form_status_inner, #privacy_policy_form_msg{ border-color: #c1c1c1; } .buy_enquire_quick_view .quick-view-information { border-color: #c1c1c1; } .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: #ffffff; } /* Fonts----------------------------- */ /* Main body font ------------------- */ body, input, select, textarea { font-family: "Diatype Medium", Sans-serif; font-style:normal; font-weight:normal; } /* 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: "Diatype Medium", Sans-serif; font-style:normal; font-weight:normal; } /* Navigation font ------------------- */ #top_nav.navigation ul li a, #top_nav #full_nav .dropdown-btn { font-family: "Diatype Medium", Sans-serif; font-style:normal; font-weight:normal; } /* User custom html-font sizing ------------------- */ html { font-size: 9.5px; } /* 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.78px; } body { font-size: 0.999637155298rem; 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; } /* 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: #c1c1c1; } /* Header layout ------------------- */ /* Dynamically created grid layout css ------------------- */ /* artfairs - tile_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.tile_list.grid_dynamic_layout_artfairs ul { width: calc(25.0% - 20px) }} .records_list.grid_dynamic_layout_artfairs ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_artfairs ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_artfairs ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_artfairs ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_artfairs ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_artfairs ul li .image::after {display:block;} .records_list.grid_dynamic_layout_artfairs ul li .image > span {position: absolute;} .records_list.grid_dynamic_layout_artfairs ul li .image::after { padding-top:66.6666666667%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_artfairs .tile_list_formatted { margin-right: -20px; } .records_list.grid_dynamic_layout_artfairs .tile_list_formatted ul { padding-right: 20px; } } /* 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%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_instagram > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_instagram > ul > li { padding-right: 20px; } } /* artworks - tile_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.tile_list.grid_dynamic_layout_artworks ul { width: calc(25.0% - 20px) }} .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; } .records_list.grid_dynamic_layout_artworks ul li .image::after {display:block;} .records_list.grid_dynamic_layout_artworks ul li .image > span {position: absolute;} .records_list.grid_dynamic_layout_artworks ul li .image::after { padding-top:150.0%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_artworks .tile_list_formatted { margin-right: -20px; } .records_list.grid_dynamic_layout_artworks .tile_list_formatted ul { padding-right: 20px; } } /* default image grid - tile_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.tile_list.grid_dynamic_layout_default_image_grid ul { width: calc(25.0% - 20px) }} .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%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_default_image_grid .tile_list_formatted { margin-right: -20px; } .records_list.grid_dynamic_layout_default_image_grid .tile_list_formatted ul { padding-right: 20px; } } /* video - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_video:not(.feature_list) > ul > li { width:25.0% }} .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%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_video > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_video > ul > li { padding-right: 20px; } } /* default grid - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_default_grid:not(.feature_list) > ul > li { width:25.0% }} .records_list.grid_dynamic_layout_default_grid ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_default_grid ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_default_grid ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_default_grid ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_default_grid ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_default_grid ul li .image::after { padding-top:66.6666666667%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_default_grid > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_default_grid > ul > li { padding-right: 20px; } } /* artists - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_artists:not(.feature_list) > ul > li { width:25.0% }} .records_list.grid_dynamic_layout_artists ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_artists ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_artists ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_artists ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_artists ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_artists ul li .image::after { padding-top:150.0%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_artists > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_artists > ul > li { padding-right: 20px; } } /* video featured - feature_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.feature_list.grid_dynamic_layout_video_featured ul { width:100%;}} .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; } .records_list.grid_dynamic_layout_video_featured ul li .image::after { padding-top:66.6666666667%; } /* 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.grid_dynamic_layout_artist_works_categories ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_artist_works_categories ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_artist_works_categories ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_artist_works_categories ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_artist_works_categories ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_artist_works_categories ul li .image::after { padding-top:66.6666666667%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_artist_works_categories > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_artist_works_categories > ul > li { padding-right: 20px; } } /* exhibitions - tile_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.tile_list.grid_dynamic_layout_exhibitions ul { width: calc(25.0% - 20px) }} .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 {display:block;} .records_list.grid_dynamic_layout_exhibitions ul li .image > span {position: absolute;} .records_list.grid_dynamic_layout_exhibitions ul li .image::after { padding-top:66.6666666667%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_exhibitions .tile_list_formatted { margin-right: -20px; } .records_list.grid_dynamic_layout_exhibitions .tile_list_formatted ul { padding-right: 20px; } } /* events works - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_events:not(.feature_list) > ul > li { width:25.0% }} .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; } .records_list.grid_dynamic_layout_events ul li .image::after { padding-top:66.6666666667%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_events > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_events > ul > li { padding-right: 20px; } } /* exhibitions installation - slideshow-------------------------------------- */ @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%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_exhibitions_installation > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_exhibitions_installation > ul > li { padding-right: 20px; } } /* artist installation - slider-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_artist_installation:not(.feature_list) > ul > li { width:33.33% }} .records_list.grid_dynamic_layout_artist_installation ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_artist_installation ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_artist_installation ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_artist_installation ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_artist_installation ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_artist_installation ul li .image::after { padding-top:150.0%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_artist_installation > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_artist_installation > ul > li { padding-right: 20px; } } /* 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 - feature_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.feature_list.grid_dynamic_layout_store_featured ul { width:100%;}} .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; } .records_list.grid_dynamic_layout_store_featured ul li .image::after { padding-top:66.6666666667%; } /* 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; } .records_list.grid_dynamic_layout_events_featured ul li .image::after { padding-top:66.6666666667%; } /* 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:25.0% }} .records_list.grid_dynamic_layout_artwork_categories_landing ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_artwork_categories_landing ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_artwork_categories_landing ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_artwork_categories_landing ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_artwork_categories_landing ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_artwork_categories_landing ul li .image::after { padding-top:150.0%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_artwork_categories_landing > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_artwork_categories_landing > ul > li { padding-right: 20px; } } /* events - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_events:not(.feature_list) > ul > li { width:25.0% }} .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; } .records_list.grid_dynamic_layout_events ul li .image::after { padding-top:66.6666666667%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_events > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_events > ul > li { padding-right: 20px; } } /* store - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_store:not(.feature_list) > ul > li { width:25.0% }} .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:flex-start; justify-content: flex-start; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_store ul li .image::after { padding-top:66.6666666667%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_store > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_store > ul > li { padding-right: 20px; } } /* default feature grid - feature_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.feature_list.grid_dynamic_layout_default_feature_grid ul { width:100%;}} .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; } .records_list.grid_dynamic_layout_default_feature_grid ul li .image::after { padding-top:66.6666666667%; } /* feature panels - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_feature_panels:not(.feature_list) > ul > li { width:25.0% }} .records_list.grid_dynamic_layout_feature_panels ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_feature_panels ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_feature_panels ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_feature_panels ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_feature_panels ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_feature_panels ul li .image::after { padding-top:66.6666666667%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_feature_panels > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_feature_panels > ul > li { padding-right: 20px; } } /* exhibitions works - slideshow-------------------------------------- */ @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:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_exhibitions_works ul li .image::after { padding-top:66.6666666667%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_exhibitions_works > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_exhibitions_works > ul > li { padding-right: 20px; } } /* publications featured - feature_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.feature_list.grid_dynamic_layout_publications_featured ul { width:100%;}} .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; } .records_list.grid_dynamic_layout_publications_featured ul li .image::after { padding-top:66.6666666667%; } /* press featured - feature_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.feature_list.grid_dynamic_layout_press_featured ul { width:100%;}} .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; } .records_list.grid_dynamic_layout_press_featured ul li .image::after { padding-top:66.6666666667%; } /* news featured - feature_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.feature_list.grid_dynamic_layout_news_featured ul { width:100%;}} .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; } .records_list.grid_dynamic_layout_news_featured ul li .image::after { padding-top:66.6666666667%; } /* artfairs featured - feature_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.feature_list.grid_dynamic_layout_artfairs_featured ul { width:100%;}} .records_list.grid_dynamic_layout_artfairs_featured ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_artfairs_featured ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_artfairs_featured ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_artfairs_featured ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_artfairs_featured ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_artfairs_featured ul li .image::after { padding-top:66.6666666667%; } /* 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:25.0% }} .records_list.grid_dynamic_layout_press ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_press ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_press ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_press ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_press ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_press ul li .image::after { padding-top:66.6666666667%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_press > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_press > ul > li { padding-right: 20px; } } /* news - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_news:not(.feature_list) > ul > li { width:25.0% }} .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%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_news > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_news > ul > li { padding-right: 20px; } } /* viewing rooms featured forthcoming - feature_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.feature_list.grid_dynamic_layout_viewing_rooms_featured_forthcoming ul { width:100%;}} .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; } .records_list.grid_dynamic_layout_viewing_rooms_featured_forthcoming ul li .image::after { padding-top:66.6666666667%; } /* search - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_search:not(.feature_list) > ul > li { width:25.0% }} .records_list.grid_dynamic_layout_search ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_search ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_search ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_search ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_search ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_search ul li .image::after { padding-top:66.6666666667%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_search > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_search > ul > li { padding-right: 20px; } } /* viewing rooms featured - feature_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.feature_list.grid_dynamic_layout_viewing_rooms_featured ul { width:100%;}} .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; } .records_list.grid_dynamic_layout_viewing_rooms_featured ul li .image::after { padding-top:66.6666666667%; } /* viewing rooms works - tile_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.tile_list.grid_dynamic_layout_viewing_rooms_works ul { width: calc(25.0% - 20px) }} .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%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_viewing_rooms_works .tile_list_formatted { margin-right: -20px; } .records_list.grid_dynamic_layout_viewing_rooms_works .tile_list_formatted ul { padding-right: 20px; } } /* 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:150.0%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_artist_works > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_artist_works > ul > li { padding-right: 20px; } } /* exhibitors - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_exhibitors:not(.feature_list) > ul > li { width:25.0% }} .records_list.grid_dynamic_layout_exhibitors ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_exhibitors ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_exhibitors ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_exhibitors ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_exhibitors ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_exhibitors ul li .image::after { padding-top:66.6666666667%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_exhibitors > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_exhibitors > ul > li { padding-right: 20px; } } /* feature panels image grid - tile_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.tile_list.grid_dynamic_layout_feature_panels_image_grid ul { width: calc(25.0% - 20px) }} .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 { padding-top:66.6666666667%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_feature_panels_image_grid .tile_list_formatted { margin-right: -20px; } .records_list.grid_dynamic_layout_feature_panels_image_grid .tile_list_formatted ul { padding-right: 20px; } } /* publications - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_publications:not(.feature_list) > ul > li { width:25.0% }} .records_list.grid_dynamic_layout_publications ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_publications ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_publications ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_publications ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_publications ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_publications ul li .image::after { padding-top:66.6666666667%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_publications > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_publications > ul > li { padding-right: 20px; } } /* team - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_team:not(.feature_list) > ul > li { width:25.0% }} .records_list.grid_dynamic_layout_team ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_team ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_team ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_team ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_team ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_team ul li .image::after { padding-top:66.6666666667%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_team > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_team > ul > li { padding-right: 20px; } } /* viewing rooms - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_viewing_rooms:not(.feature_list) > ul > li { width:25.0% }} .records_list.grid_dynamic_layout_viewing_rooms ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_viewing_rooms ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_viewing_rooms ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_viewing_rooms ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_viewing_rooms ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_viewing_rooms ul li .image::after { padding-top:66.6666666667%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_viewing_rooms > ul { margin-right: -20px; } .records_list.grid_dynamic_layout_viewing_rooms > ul > li { padding-right: 20px; } } /* Dynamically created artist list css ------------------- */ .subsection-artist-list-preview-letters .artists_list_dynamic_columns ul { width:33.33% } .subsection-artist-list-standard .artists_list_dynamic_columns ul { width:33.33% } .subsection-artist-list-preview .artists_list_dynamic_columns ul { width:33.33% } /* Light and dark logo variants css ------------------- */ #logo .logo-variant-light { content:''; background-image:url(/usr/images/preferences/smg_logo_website-02.png)} #logo .logo-variant-dark { content:''; background-image:url(/usr/images/preferences/smg_logo_website-01.png)} /* Logo text color ------------------- */ #logo { background: none; width: 100%; min-width: 280px; max-width: 360px; } #header #logo.user-custom-logo-image::before { padding-top:4.79418886199%; } .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-smg/usr/images/preferences/smg_logo_website-01.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-smg/usr/images/preferences/smg_logo_website-01.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-smg/usr/images/preferences/smg_logo_website-01.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: #000000; } #slide_nav_reveal::after { color: #000000; } #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 ------------------- */ /* Responsive nav active / hover text color ------------------- */ /* 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: #c1c1c1; } /* quick view button */ .buy_enquire_button button, a.buy_enquire_detail_link { color: #c1c1c1; } /* Hero section image opacity ------------------- */ .fullscreen-slide-dark .fullscreen_slideshow.hero_header_layout_center:not(.override-slide-brightness) ul li::before, .fullscreen_slideshow.hero_header_layout_center:not(.detect-slide-brightness):not(.override-slide-brightness) ul li::before, .fullscreen-slide-dark .fullscreen_slideshow.hero_header_layout_left-center:not(.override-slide-brightness) ul li::before, .fullscreen_slideshow.hero_header_layout_left-center:not(.detect-slide-brightness):not(.override-slide-brightness) ul li::before { background: rgba(0,0,0,0.1999999999999999555910790150) !important; } .fullscreen-slide-light .fullscreen_slideshow.hero_header_layout_center:not(.override-slide-brightness) ul li::before, .fullscreen-slide-light .fullscreen_slideshow.hero_header_layout_left-center:not(.override-slide-brightness) ul li::before { background: rgba(255,255,255,0.1999999999999999555910790150) !important; } /* don't show if opacity = 1 */ /* Hero section image height ------------------- */ ::root { --hero-height: 0vh } /* Home page slideshow / fullscreen video ui buttons ------------------- */ /* Hero header slideshow ui buttons ------------------- */ /* Carousel feature panel ui buttons ------------------- */ .slick-prev:before, .slick-next:before { background: #ffffff !important; } .slick-prev:before, .slick-next:before { color: #000000 !important; } @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-smg/usr/images/preferences/smg_logo_website-01.png'); } } /* Artlogic preferences custom CSS - entered by Artlogic in the preferences screen ------------------- */ /* Remove artwork dimensions from embedded PV grid captions */ div.pv-dimensions { display: none !important; } /* Handle 'interests' checkboxes floating over labels on desktop */ @media screen and (min-width: 1388px) { #artlogic_mailinglist_signup_form div.multi-field input[type=checkbox] { position: absolute; /* left: 0; */ /* top: 5px; */ left: 3rem; top: 0px } } /* Client custom user CSS - entered by the client in the preferences screen ------------------- */ /* ============================================= FONT FACE DECLARATIONS ============================================= */ @font-face { font-family: 'Romie'; src: url('https://www.sarahmyerscough.com/usr/documents/fonts/regular_font_woff2/3/romie-regular-1-.woff2') format('woff2'), url('https://www.sarahmyerscough.com/usr/documents/fonts/regular_font_woff/3/romie-regular-1-.woff') format('woff'); font-weight: 400; font-style: normal; } @font-face { font-family: 'Romie Italic'; src: url('https://www.sarahmyerscough.com/usr/documents/fonts/regular_font_woff2/4/romie-regular-italic-1-.woff2') format('woff2'), url('https://www.sarahmyerscough.com/usr/documents/fonts/regular_font_woff/4/romie-regular-italic-1-.woff') format('woff'); font-weight: 400; font-style: italic; } /* RomieBrand: italic variant for G/g, roman for everything else */ @font-face { font-family: 'RomieBrand'; src: url('https://www.sarahmyerscough.com/usr/documents/fonts/regular_font_woff2/4/romie-regular-italic-1-.woff2') format('woff2'), url('https://www.sarahmyerscough.com/usr/documents/fonts/regular_font_woff/4/romie-regular-italic-1-.woff') format('woff'); font-weight: 400; font-style: normal; unicode-range: U+0047, U+0067; } @font-face { font-family: 'RomieBrand'; src: url('https://www.sarahmyerscough.com/usr/documents/fonts/regular_font_woff2/3/romie-regular-1-.woff2') format('woff2'), url('https://www.sarahmyerscough.com/usr/documents/fonts/regular_font_woff/3/romie-regular-1-.woff') format('woff'); font-weight: 400; font-style: normal; unicode-range: U+0000-0046, U+0048-0066, U+0068-FFFF; } /* ============================================= GENERAL TYPOGRAPHY ============================================= */ * { letter-spacing: 0.5px !important; line-height: 120% !important; } h1, .h1_heading { font-size: 2.2rem !important; } h2, .subheading { font-size: 1.0rem !important; } h3, h4, h5, h6 { font-size: 1.0rem !important; } .pull_quote_content blockquote, .pull_quote_content blockquote.prose, .pull_quote_content p { font-size: 0.9rem !important; } /* ============================================= GLOBAL PAGE PADDING REDUCTION ============================================= */ #content { min-height: 0 !important; } .heading_wrapper, .cascading-page-header, .artworks-header, .artists-header { margin-bottom: 15px !important; margin-top: 0 !important; padding-bottom: 0 !important; } .subheading, #subheading_galleryartists, .panel_header { margin-bottom: 15px !important; margin-top: 15px !important; padding-top: 1px !important; padding-bottom: 1px !important; } .panel_header { padding-bottom: 0 !important; margin-bottom: 0 !important; } .panel_header h2 { font-size: 1.2rem !important; } .subheading { flex-direction: column-reverse !important; align-items: flex-start !important; } .subheading span { font-size: 1.2rem !important; margin-top: 10px !important; display: inline-block !important; } .subheading::after { width: 100% !important; } .records_list { margin-top: 0 !important; padding-top: 0 !important; } .feature_panels { margin-top: 40px !important; padding-top: 0 !important; } .records_list ul li, .image_list ul li, .artist_list ul li { margin-bottom: 15px !important; padding-bottom: 0 !important; } .records_list ul li .image { margin-bottom: 10px !important; } .records_list li .content, li.panel_type_8 .content { padding-top: 0 !important; padding-bottom: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } .records_list.feature_list ul li .content { padding-left: 24px !important; } .feature_panels_inner.clearwithin { margin-bottom: 15px !important; } .feature_panels_inner.clearwithin ul li.panel_type_8 { padding-left: 0 !important; padding-right: 0 !important; } .feature_panels_inner.clearwithin ul li.panel_type_8 { margin-bottom: 15px !important; padding-bottom: 0 !important; } .feature_panels .panel_hero { margin-bottom: 45px !important; } .feature_panels_inner.clearwithin ul li.panel_type_11 { margin-bottom: 45px !important; } .feature_panels_inner.clearwithin > ul > li.panel:not(:first-child) { border-top: 1px solid #ddd !important; padding-top: 30px !important; } .feature_panels_inner.clearwithin > ul > li.panel.panel_content_autofill_type_exhibitions { border-top: none !important; } #content > .divider, .feature_panels + .divider { display: none !important; } .records_list .content, li.panel_type_8 .content { display: flex; flex-direction: column; gap: 1px; } .records_list .content h2, li.panel_type_8 .content h2 { font-family: 'RomieBrand', 'Romie', serif !important; font-size: 1.4rem !important; text-transform: uppercase !important; font-weight: 400 !important; font-feature-settings: 'ss01' on, 'ss14' on, 'case' on, 'liga' on !important; padding-top: 2px !important; padding-bottom: 5px !important; margin-bottom: 0 !important; } .records_list .content span.subtitle, li.panel_type_8 .content span.subtitle { font-family: 'Diatype Medium', sans-serif !important; font-size: 1.0rem !important; font-feature-settings: normal !important; display: block !important; margin: 0 !important; padding: 0 !important; } .records_list .content span.date, li.panel_type_8 .content span.date { font-family: 'Diatype Medium', sans-serif !important; font-size: 1.0rem !important; font-feature-settings: normal !important; display: block !important; } .records_list .content .title_and_year, .records_list .content .medium, .records_list .content .artist { font-size: 1rem !important; font-weight: 400 !important; margin: 0 !important; padding: 0 !important; } .records_list .enquire_button_container { margin-top: 8px !important; } #slideshow.fullscreen_slideshow h2 { margin-bottom: 2px !important; margin-top: 0 !important; } #slideshow.fullscreen_slideshow h2 a { font-family: 'RomieBrand', 'Romie', serif !important; font-size: 51px !important; text-transform: uppercase !important; font-weight: 400 !important; letter-spacing: 0.02em !important; font-feature-settings: 'ss01' on, 'ss14' on, 'case' on, 'liga' on !important; display: block !important; } #slideshow.fullscreen_slideshow h2 .separator { display: none !important; } #slideshow.fullscreen_slideshow h2 .h1_subtitle { font-family: 'Diatype Medium', sans-serif !important; font-size: 1.3rem !important; text-transform: none !important; font-weight: 400 !important; letter-spacing: 0.5px !important; font-feature-settings: normal !important; display: block !important; margin-top: 4px !important; } #slideshow.fullscreen_slideshow span.date { font-family: 'Diatype Medium', sans-serif !important; font-size: 1.3rem !important; font-feature-settings: normal !important; display: block !important; margin-top: 0 !important; } /* ============================================= BUTTONS ============================================= */ .button, .button_compact, .enquiry-button, input[type="submit"], button.submit_button { background-color: white !important; border: 1px solid black !important; color: black !important; text-transform: uppercase; letter-spacing: 0.5px !important; padding: 8px 16px; font-size: 0.9rem; cursor: pointer; transition: all 0.3s ease; } a.button { display: inline-block !important; text-decoration: none !important; } .button a, .button_compact a, .enquiry-button a { color: black !important; text-decoration: none; } .button:hover, .button_compact:hover, .enquiry-button:hover, input[type="submit"]:hover, button.submit_button:hover { background-color: black !important; color: white !important; } .button a:hover, .enquiry-button a:hover { color: white !important; } /* ============================================= FOOTER ============================================= */ #footer { border-top: none; } #footer .inner { display: block !important; } #footer .advanced_footer_item { display: inline-block !important; vertical-align: top !important; width: calc(25% - 20px) !important; padding: 0 !important; margin: 0 10px 0 0 !important; } #footer .advanced_footer_item p { margin: 0 0 4px !important; font-size: 0.9rem !important; } @media screen and (max-width: 768px) { #footer .advanced_footer_item { width: calc(50% - 20px) !important; margin-bottom: 24px !important; } } @media screen and (max-width: 480px) { #footer .advanced_footer_item { width: 100% !important; margin: 0 0 24px !important; } } /* ============================================= MAILING LIST — FOOTER FORM (EDITORIAL STYLE) ============================================= */ #mailinglist_form { padding: 40px 0 !important; border-top: 1px solid black !important; margin-bottom: 40px !important; } #mailinglist_form h2 { font-size: 1.0rem !important; font-weight: 400 !important; margin-bottom: 24px !important; margin-top: 0 !important; text-transform: uppercase !important; letter-spacing: 0.5px !important; } #mailinglist_form #artlogic_mailinglist_signup_form { display: flex !important; flex-wrap: wrap !important; align-items: flex-end !important; gap: 0 32px !important; } #mailinglist_form .form_row { display: flex !important; flex-direction: column !important; flex: 1 1 160px !important; min-width: 120px !important; margin-bottom: 0 !important; padding-bottom: 0 !important; } #mailinglist_form .form_row label { font-size: 0.7rem !important; text-transform: uppercase !important; letter-spacing: 0.5px !important; margin-bottom: 6px !important; color: black !important; font-weight: 400 !important; } #mailinglist_form .form_row input { border: none !important; border-bottom: 1px solid black !important; border-radius: 0 !important; background: transparent !important; padding: 4px 0 8px !important; font-size: 0.9rem !important; outline: none !important; width: 100% !important; letter-spacing: 0.5px !important; box-shadow: none !important; } #mailinglist_form .form_row input:focus { border-bottom: 1px solid black !important; outline: none !important; box-shadow: none !important; } #mailinglist_form #mailing_submit_button { flex: 0 0 auto !important; margin-bottom: 0 !important; padding-bottom: 0 !important; display: flex !important; align-items: flex-end !important; } #mailinglist_form #email_warning, #mailinglist_form .error { width: 100% !important; flex-basis: 100% !important; } #mailinglist_form #privacy_policy_form_msg { flex-basis: 100% !important; margin-top: 16px !important; } #mailinglist_form #privacy_policy_form_msg p, #mailinglist_form #privacy_policy_form_msg .asterisk p { font-size: 0.7rem !important; color: #666 !important; margin: 0 0 4px !important; } @media screen and (max-width: 900px) { #mailinglist_form .form_row { flex: 1 1 calc(50% - 32px) !important; } #mailinglist_form #mailing_submit_button { flex: 1 1 100% !important; margin-top: 24px !important; } } @media screen and (max-width: 560px) { #mailinglist_form #artlogic_mailinglist_signup_form { flex-direction: column !important; gap: 20px !important; } #mailinglist_form .form_row { flex: 1 1 100% !important; min-width: 100% !important; } #mailinglist_form #mailing_submit_button { flex: 1 1 100% !important; margin-top: 8px !important; } } /* ============================================= MAILING LIST POPUP ============================================= */ #mailing_list_popup_container { z-index: 9000 !important; } #mailing_list_popup_overlay { background: rgba(0, 0, 0, 0.4) !important; } #mailing_list_popup_box { background: white !important; border-radius: 0 !important; padding: 48px !important; max-width: 480px !important; width: 90vw !important; box-shadow: none !important; border: 1px solid black !important; overflow-y: auto !important; max-height: 90vh !important; } #mailing_list_popup_box h2 { font-size: 1.0rem !important; font-weight: 400 !important; text-transform: uppercase !important; letter-spacing: 0.5px !important; margin-bottom: 32px !important; margin-top: 0 !important; } #mailinglist_signup_close_popup_link a { font-size: 0.75rem !important; text-transform: uppercase !important; letter-spacing: 0.5px !important; color: black !important; text-decoration: none !important; } #mailing_list_popup_box .form_row { display: flex !important; flex-direction: column !important; margin-bottom: 20px !important; } #mailing_list_popup_box .form_row label { font-size: 0.7rem !important; text-transform: uppercase !important; letter-spacing: 0.5px !important; margin-bottom: 6px !important; color: black !important; } #mailing_list_popup_box .form_row input { border: none !important; border-bottom: 1px solid black !important; border-radius: 0 !important; background: transparent !important; padding: 4px 0 8px !important; font-size: 0.9rem !important; outline: none !important; box-shadow: none !important; letter-spacing: 0.5px !important; } #mailing_list_popup_box #mailing_submit_button { margin-top: 8px !important; } #mailing_list_popup_box #privacy_policy_form_msg p, #mailing_list_popup_box #privacy_policy_form_msg .asterisk p { font-size: 0.7rem !important; color: #666 !important; margin: 0 0 4px !important; } /* ============================================= COOKIE NOTIFICATION BAR ============================================= */ #cookie_notification { background: white !important; border-top: 1px solid black !important; padding: 16px 24px !important; font-size: 0.8rem !important; letter-spacing: 0.5px !important; } #cookie_notification .inner { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 12px 24px !important; } #cookie_notification_message { flex: 1 1 300px !important; } #cookie_notification_message p { font-size: 0.8rem !important; margin: 0 !important; line-height: 140% !important; } #cookie_notification_message strong { font-weight: 400 !important; text-transform: uppercase !important; } #cookie_notification_preferences, #cookie_notification_reject, #cookie_notification_accept { flex: 0 0 auto !important; } #cookie_notification_preferences a { font-size: 0.8rem !important; text-transform: none !important; letter-spacing: 0.5px !important; color: black !important; text-decoration: underline !important; } #cookie_notification_reject .button a, #cookie_notification_accept .button a, #cookie_notification_reject, #cookie_notification_accept { font-size: 0.75rem !important; text-transform: none !important; padding: 5px 12px !important; letter-spacing: 0.5px !important; } @media screen and (max-width: 560px) { #cookie_notification .inner { flex-direction: column !important; align-items: flex-start !important; } #mailing_submit_button { flex: 1 1 100% !important; margin-top: 8px !important; } } /* ============================================= IMAGE/TEXT ADJACENT PANELS — HEADING STYLE ============================================= */ .slider-content h2.fp_title { font-family: 'RomieBrand', 'Romie', serif !important; font-size: 1.7rem !important; text-transform: uppercase !important; font-weight: 400 !important; font-feature-settings: 'ss01' on, 'ss14' on, 'case' on, 'liga' on !important; margin-top: 0 !important; margin-bottom: 8px !important; } /* ============================================= IMAGE CAROUSELS — REDUCED SLIDE PADDING ============================================= */ .slick-list { margin-left: -15px !important; margin-right: -15px !important; } .slick-slide, .ig_slider .slick-slide, .item.slick-slide { padding-left: 15px !important; padding-right: 15px !important; } /* ============================================= EXHIBITION PAGE — PRIVATE VIEW ============================================= */ div.pv_content_above { display: none !important; } /* =============================================================== TEXT PANEL TYPOGRAPHY (panel_type_11) =============================================================== */ li.panel_type_11 h2.fp_title { font-family: 'RomieBrand', 'Romie', serif !important; font-size: 2.2rem !important; text-transform: uppercase !important; font-weight: 400 !important; font-feature-settings: 'ss01' on, 'ss14' on, 'case' on, 'liga' on !important; margin-bottom: 12px !important; } .panel_image_text_columns .content .content_full.prose p, .panel_image_text_columns .content .content_columns.prose p { font-size: 1rem !important; line-height: 132% !important; margin-bottom: 10px !important; letter-spacing: 0.5px !important; } .panel_image_text_columns .content .read_more_link.link a { display: inline-block !important; background-color: white !important; border: 1px solid black !important; color: black !important; letter-spacing: 0.5px !important; padding: 8px 16px !important; font-family: 'Diatype Medium', sans-serif !important; font-size: 0.9rem !important; text-decoration: none !important; cursor: pointer !important; transition: all 0.3s ease !important; } .panel_image_text_columns .content .read_more_link.link a:hover { background-color: black !important; color: white !important; } @media screen and (min-width: 769px) { .panel_image_text_columns .content { width: 58% !important; max-width: 820px !important; } body.page-exhibitions .panel_number_1.panel_image_text_columns .content { margin-top: -125px !important; } body.page-exhibitions .panel_number_1.panel_image_text_columns .pull_quote_content { margin-top: -20px !important; } body.page-artists .panel_number_1.panel_image_text_columns .content { margin-top: -91px !important; } /* ============================================= "TEXT COLUMNS WITH QUOTE" PANEL — HEADING/CONTENT ALIGNMENT (panel_type_11.feature_variant_1.no_image) Different problem to the panel_number_1 rules above. Those pull .content up to align with the PAGE's own h1 (the panel itself has no title, so the offset depends on that page's specific header height). This variant is structurally self-contained: .panel_heading (the field seen as "THE SCHOOLHOUSE" on the homepage) and .content are siblings inside the SAME li — confirmed via inspector, homepage "Beneath The Skin" hero, panel_id_1748. Since .panel_heading always uses the same fixed h2.fp_title typography (li.panel_type_11 h2.fp_title above — 2.2rem, 12px margin-bottom), its rendered height is constant wherever this panel variant is used — so ONE offset here, scoped to the panel's own structure rather than to a page or panel_number, should hold on every page, not just this one instance. -50px is a first-pass estimate — NOT yet confirmed against a live measurement of .panel_heading's actual rendered height. Check against the homepage first; if the heading ever wraps to two lines (a longer title than "The Schoolhouse"), this fixed value will undershoot and need a max-height/truncation conversation instead of a bigger offset. Uses position:relative/top rather than margin-top — same technique already confirmed working on the Artworks landing page intro text elsewhere in this file. .content is floated (float:right, confirmed via inspector), so margin-top should theoretically also work here since floats establish their own block formatting context — but switching technique is a useful test in itself: if this ALSO fails to render live, that's a strong signal the problem sits outside the CSS (publish/caching), not inside the rule. ============================================= */ li.panel_type_11.feature_variant_1.no_image.panel_image_text_columns > .panel_heading + .content { position: relative !important; top: -50px !important; } } /* ============================================= SUB-NAV BAR — hidden site-wide ============================================= */ #sub_nav { display: none !important; } /* ============================================= PULL QUOTE FIELD ============================================= */ .pull_quote_content blockquote.prose { font-style: normal !important; border-left: none !important; quotes: none !important; } .pull_quote_content blockquote.prose p { line-height: 130% !important; } .pull_quote_content blockquote.prose p:empty { font-size: 0 !important; line-height: 0 !important; margin: 0 !important; } /* ============================================= EXHIBITION HEADER — title / artist name / date ============================================= */ .exhibition-header h1.has_subtitle .h1_heading, .event-header h1.has_subtitle .h1_heading { font-family: 'RomieBrand', 'Romie', serif !important; font-size: 2.2rem !important; text-transform: uppercase !important; font-weight: 400 !important; font-feature-settings: 'ss01' on, 'ss14' on, 'case' on, 'liga' on !important; margin-bottom: 4px !important; } .exhibition-header h1.has_subtitle .h1_subtitle, .event-header h1.has_subtitle .h1_subtitle { font-family: 'Diatype Medium', sans-serif !important; font-size: 1.1rem !important; text-transform: none !important; font-weight: 400 !important; letter-spacing: 0.5px !important; font-feature-settings: normal !important; margin-top: 2px !important; } .exhibition-header .subtitle.has_subnav, .event-header .subtitle.has_subnav, .event-header .width-subtitle.has_subnav { display: block !important; float: none !important; clear: both !important; } .exhibition-header .subtitle_date, .event-header .subtitle_date { font-family: 'Diatype Medium', sans-serif !important; font-size: 1.1rem !important; font-feature-settings: normal !important; display: block !important; float: none !important; margin-top: 16px !important; } .event-header .subtitle_date { margin-top: 0 !important; } /* ============================================= HEADER — HAMBURGER MENU ICON ALIGNMENT Confirmed via inspector: #slide_nav_reveal (30x30, role=button) sits inside .header-icons-wrapper, a flex row alongside header_quick_search and store_cart_widget. Uses position:relative/top rather than margin-top — margin on a flex child here would risk shifting the other icons in the row too; this only moves it visually. ============================================= */ #slide_nav_reveal { position: relative !important; top: -10px !important; } /* ============================================= ARTIST HEADER — title ============================================= */ .artist-header .h1_wrapper h1.has_subnav { font-family: 'RomieBrand', 'Romie', serif !important; font-size: 3.0rem !important; text-transform: uppercase !important; font-weight: 400 !important; font-feature-settings: 'ss01' on, 'ss14' on, 'case' on, 'liga' on !important; padding-top: 5px !important; } /* ============================================= .cms_button ============================================= */ .cms_button, .cms_button:visited { background-color: white !important; border: 1px solid black !important; border-radius: 0 !important; color: black !important; text-transform: uppercase !important; letter-spacing: 0.5px !important; padding: 8px 16px !important; font-size: 0.9rem !important; text-decoration: none !important; cursor: pointer !important; transition: all 0.3s ease !important; display: inline-block !important; line-height: normal !important; } .cms_button:hover { background-color: black !important; color: white !important; } .cms_button a, .cms_button a:visited { color: black !important; text-decoration: none !important; } .cms_button:hover a { color: white !important; } /* ============================================= ARTIST NAME UNDER WORKS — hidden on artist pages only ============================================= */ body.page-artists .records_list .content .artist { display: none !important; } /* ============================================= BUTTONS — never uppercase, always as typed ============================================= */ .button, .button_compact, .enquiry-button, input[type="submit"], button.submit_button, .cms_button, .panel_image_text_columns .content .read_more_link.link a { text-transform: none !important; padding: 5px 9px !important; font-size: 0.95rem !important; } /* ============================================= BUTTON ARROW ICON ============================================= */ .button::before, .cms_button::before, a.button::before, .panel_image_text_columns .content .read_more_link.link a::before { content: "→" !important; margin-right: 6px !important; display: inline-block !important; } .cms_button, .panel_image_text_columns .content .read_more_link.link a { margin-top: 7px !important; padding: 7px 15px !important; font-size: 0.85rem !important; } /* ============================================= GALLERY ARTIST HERO OVERLAY ============================================= */ body:has(.hero_heading:not(:empty)) .artist-header.heading_wrapper { display: none !important; } body.page-artists:has(.hero_heading:not(:empty)) .feature_panels { margin-top: 0 !important; } body:has(.hero_heading:not(:empty)) .hero_heading { align-items: flex-start !important; justify-content: flex-start !important; padding-top: 40px !important; padding-left: 80px !important; } .hero_heading .fp_title { font-family: 'RomieBrand', 'Romie', serif !important; font-size: 3.5rem !important; text-transform: uppercase !important; font-weight: 400 !important; color: white !important; text-align: left !important; margin: 0 !important; } /* ============================================= GLOBAL FULL-WIDTH IMAGE PANEL — TEXT OVERLAY ============================================= */ li.panel.panel_type_8.feature_variant_1 { position: relative !important; cursor: pointer !important; overflow: hidden !important; } li.panel.panel_type_8.feature_variant_1 > .image { position: relative !important; display: block !important; width: 100% !important; height: auto !important; padding-bottom: 0 !important; aspect-ratio: 21 / 2 !important; overflow: hidden !important; } li.panel.panel_type_8.feature_variant_1 > .image > span, li.panel.panel_type_8.feature_variant_1 > .image .object-fit-container { display: block !important; width: 100% !important; height: 100% !important; } li.panel.panel_type_8.feature_variant_1 > .image img.object-fit-contain { width: 100% !important; height: 100% !important; object-fit: cover !important; } li.panel.panel_type_8.feature_variant_1 .image a { position: absolute !important; inset: 0 !important; z-index: 1 !important; } li.panel.panel_type_8.feature_variant_1 > .content { position: absolute !important; left: 0 !important; top: 50% !important; transform: translateY(-50%) !important; z-index: 2 !important; width: 100% !important; padding: 0 40px 0 40px !important; pointer-events: none !important; text-align: left !important; } li.panel.panel_type_8.feature_variant_1 > .content span.subtitle, li.panel.panel_type_8.feature_variant_1 > .content span.date { margin: 0 !important; position: relative !important; top: -6px !important; } li.panel.panel_type_8.feature_variant_1 > .content h2.fp_title, li.panel.panel_type_8.feature_variant_1 > .content h2.fp_title[data-fieldname="title"] { font-size: 1.4rem !important; line-height: 120% !important; min-height: 34px; margin-bottom: 0 !important; padding-bottom: 0 !important; } li.panel.panel_type_8.feature_variant_1 > .content .description.prose { padding-top: 0 !important; } li.panel.panel_type_8.feature_variant_1 > .content, li.panel.panel_type_8.feature_variant_1 > .content * { color: #fff !important; } li.panel.panel_type_8.feature_variant_1 > .content .description.prose p { margin: 0 !important; } /* ============================================= ARTWORKS LANDING PAGE — INTRO TEXT ============================================= */ @media screen and (min-width: 769px) { #content_module.content_below.prose.clearwithin.full_width { width: 50% !important; max-width: none !important; margin-left: 50% !important; margin-right: 0 !important; margin-bottom: 0 !important; padding-bottom: 15px !important; float: none !important; position: relative !important; top: -35px !important; } #content_module.content_below.prose.clearwithin.full_width p:last-of-type { margin-bottom: 0 !important; } #content_module.content_below.prose.clearwithin.full_width .divider { width: 200% !important; margin-left: -100% !important; margin-top: 30px !important; height: 0 !important; border-top: 1px solid #ddd !important; } } /* ============================================= CATEGORY / SUBCATEGORY PAGES WITH FILTERS PANEL ============================================= */ @media screen and (min-width: 768px) { .artworks_filters_container_type_above_list #content_module.content_below.prose.clearwithin.full_width { top: -130px !important; } .artworks_filters_container_type_above_list #content { position: relative !important; top: -50px !important; } .artworks_filters_container_type_above_list .subsection-artworks-categories-grid { position: relative !important; top: -20px !important; } .filters_panel .navigation_inner { max-width: 300px !important; margin-right: 40px !important; position: relative !important; top: 20px !important; } .filters_panel.filters_layout_above_list { margin-bottom: 0 !important; padding-bottom: 0 !important; padding-top: 10px !important; } .filters_panel .fp-modules { padding-bottom: 15px !important; } .filters_panel .fp-module { padding-top: 15px !important; padding-bottom: 25px !important; } .filters_panel .navigation_item { padding-top: 15px !important; } } /* ============================================= TABLET RANGE — WIDEN navigation_inner Confirmed via inspector: removing max-width on .navigation_inner alone didn't fully fix the "Recently added" wrap at iPad width — the checkbox item itself (li inside ul.group-items) carries its own Artlogic-native width constraint, independent of its ancestor's width. Both need unlocking together. ============================================= */ @media screen and (min-width: 768px) and (max-width: 1024px) { .filters_panel .navigation_inner { max-width: none !important; } .filters_panel ul.group-items li, .filters_panel .fp-checkbox-item, .filters_panel .fp-checkbox-item label { width: auto !important; white-space: nowrap !important; } } /* ============================================= MOBILE RANGE — FILTERS PANEL SPACING The desktop block above (padding on .fp-modules, .fp-module, .navigation_item) only fires at min-width:769px, so mobile was inheriting Artlogic's own native spacing untouched — the large blue/green/ orange padding blocks seen in DevTools. Same wrap risk as tablet applies here too, so the width fix is repeated at this breakpoint. ============================================= */ @media screen and (max-width: 767px) { .filters_panel.filters_layout_above_list { padding-bottom: 10px !important; margin-bottom: 0 !important; } .filters_panel .fp-modules { padding-bottom: 4px !important; } .filters_panel .fp-module { padding-top: 6px !important; padding-bottom: 6px !important; } .filters_panel .navigation_item { padding-top: 6px !important; } .filters_panel .navigation_inner { max-width: none !important; } .filters_panel ul.group-items li, .filters_panel .fp-checkbox-item, .filters_panel .fp-checkbox-item label { width: auto !important; white-space: nowrap !important; } } /* ============================================= MOBILE — CATEGORY PAGE INTRO TEXT ("If you are interested in a custom commission...") Confirmed via inspector: #content_module carries no rule of ours below 769px, so it sat flush under the Sort/checkbox row with no breathing room. margin-bottom 50px is Artlogic's own native value (layout.css, .content_module.content_below) — not previously set by us — scoped down here so the works grid isn't held away from the text by that much space on a narrow screen. ============================================= */ @media screen and (max-width: 767px) { #content_module.content_below.clearwithin.prose { margin-top: 20px !important; margin-bottom: 20px !important; } } /* ============================================= FILTER SORT CHECKBOX — square indicator ============================================= */ .filters_panel .fp-checkbox-item label::before { font-family: initial !important; content: '' !important; display: inline-block !important; width: 8px !important; height: 8px !important; font-size: 0 !important; border: 1px solid #999 !important; background: transparent !important; margin: 0 10px 0 0 !important; vertical-align: middle !important; position: relative !important; top: -2px !important; } .filters_panel .fp-checkbox-item input.fp-checkbox:checked + label::before { background: black !important; border-color: black !important; } .filters_panel .fp-checkbox-item label .checkmark { display: none !important; }