/* 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://use.typekit.net/onp7xko.css); @import url(https://use.typekit.net/onp7xko.css); /* Background colour --------------*/ #header.header_transparent .dropdown-mask { background-color: transparent !important; } /* Feature popup colours ------------------- */ /* Fonts----------------------------- */ /* Main body font ------------------- */ body, input, select, textarea { font-family: "elza-text"; font-weight: 400; font-style: 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: "scotch-text"; font-weight: 300; font-style: normal; } /* Navigation font ------------------- */ #top_nav.navigation ul li a, #top_nav #full_nav .dropdown-btn { font-family: "elza-text"; font-weight: 400; font-style: normal; } /* User custom html-font sizing ------------------- */ html { font-size: 10.0px; } /* Title - Heading spacing and transform ------------------- */ 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: uppercase; letter-spacing: 0; } /* Text colours----------------------------- */ /* Heading and emphasis text colour ------------------- */ /* Colour None */ /* Subheading and secondary emphasis text colour ------------------- */ /* Body/main text colour ------------------- */ /* Link text color ------------------- */ /* 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:33.33% }} .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 { padding-top:100.0%; } /* 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:100.0%; } /* artworks - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_artworks:not(.feature_list) > ul > li { width:25.0% }} .records_list.feature_list.grid_dynamic_layout_artworks:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_artworks:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_artworks ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_artworks 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_artworks ul li .image::after { padding-top:100.0%; } /* 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:100.0%; } /* 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%; } /* 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:100.0%; } /* 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:100.0%; } /* 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:100.0%; } /* 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:100.0%; } /* exhibitions - feature_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.feature_list.grid_dynamic_layout_exhibitions ul { width:100%;}} .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:100.0%; } /* 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:100.0%; } /* exhibitions installation - slider-------------------------------------- */ @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:100.0%; } /* 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:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_artist_installation ul li .image::after { padding-top:100.0%; } /* 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:100.0%; } /* 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:100.0%; } /* 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:100.0%; } /* 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:100.0%; } /* 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.grid_dynamic_layout_store ul li img { object-fit: cover; width: 100%; height: 100%; } .records_list.grid_dynamic_layout_store ul li .image > span.objectfit-fallback-bg { background-size:cover; } .records_list.grid_dynamic_layout_store ul li .image > span > a { height: 100%; } .browser-msie .records_list.grid_dynamic_layout_store ul li img { font-family:object-fit; } .browser-msie .records_list.grid_dynamic_layout_store ul li img:first-letter { font-family:object-fit; } .records_list.grid_dynamic_layout_store ul li .image::after { padding-top:100.0%; } /* 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:100.0%; } /* 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:100.0%; } /* 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: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:100.0%; } /* 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:100.0%; } /* 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:100.0%; } /* 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:100.0%; } /* 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:100.0%; } /* 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:100.0%; } /* 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:100.0%; } /* 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:100.0%; } /* 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:100.0%; } /* 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:100.0%; } /* 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:100.0%; } /* 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:100.0%; } /* 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.feature_list.grid_dynamic_layout_artist_works:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_artist_works:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_artist_works ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_artist_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_artist_works ul li .image::after { padding-top:100.0%; } /* 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:100.0%; } /* 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:25.0% }} .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:100.0%; } /* 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.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:100.0%; } /* 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:100.0%; } /* 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:100.0%; } /* Dynamically created artist list css ------------------- */ .subsection-artist-list-preview-letters .artists_list_dynamic_columns ul { width:25.0% } .subsection-artist-list-standard .artists_list_dynamic_columns ul { width:25.0% } .subsection-artist-list-preview .artists_list_dynamic_columns ul { width:25.0% } /* Light and dark logo variants css ------------------- */ #logo .logo-variant-light { content:''; background-image:url(/usr/images/preferences/logo-galerie-boquet-blanc.png)} #logo .logo-variant-dark { content:''; background-image:url(/usr/images/preferences/logo-galerie-boquet-noir.png)} /* Logo text color ------------------- */ #logo { background: none; width: 100%; min-width: 160px; max-width: 160px; } #header #logo.user-custom-logo-image::before { padding-top:41.5%; } .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-artlogicwebsite3057/usr/images/preferences/logo-galerie-boquet-noir.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-artlogicwebsite3057/usr/images/preferences/logo-galerie-boquet-noir.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-artlogicwebsite3057/usr/images/preferences/logo-galerie-boquet-noir.png', sizingMethod='scale')"; } #logo a { text-indent: -9999px; padding: 0; } /* Topnav text color ------------------- */ /* Subnav text color ------------------- */ /* Responsive nav text color ------------------- */ /* Responsive nav active / hover text color ------------------- */ /* Button text color ------------------- */ /* 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) !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) !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: 40vh } #hero_header.hero-fixed-aspect-ratio::after { padding-top:33.3333333333%; } /* 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-artlogicwebsite3057/usr/images/preferences/logo-galerie-boquet-noir.png'); } } /* Artlogic preferences custom CSS - entered by Artlogic in the preferences screen ------------------- */ /* Client custom user CSS - entered by the client in the preferences screen ------------------- */ .feature_list .lazyload_wrapper { width: 350px !important; max-width: 100% !important; } .feature_list .lazyload_wrapper img { width: 100% !important; height: auto !important; aspect-ratio: 1 / 1 !important; object-fit: cover !important; } /* Artwork titles: sentence case + italic (artist and year unchanged) */ .records_list .title .title, .artwork_details_wrapper .subtitle .title { text-transform: none !important; font-style: italic !important; } .records_list .title .title .title_comma, .artwork_details_wrapper .subtitle .title .title_comma { font-style: normal !important; } /* Exhibition detail page: much larger title, flush left */ .page-exhibitions .exhibition-header h1 .h1_heading { display: block; font-size: clamp(32px, 6.2vw, 60px) !important; line-height: 1.02 !important; letter-spacing: -0.015em !important; text-align: left !important; margin: 0 0 0.28em 0 !important; max-width: 18em; } /* Artist dates under the artist name */ h1.artist #artist_years { display: block !important; padding-left: 0 !important; margin-top: 0.4em !important; font-size: 0.62em !important; letter-spacing: 0.03em; } h1.artist #artist_years .nationality { display: none !important; } /* Artist dates and artwork year in Elza */ h1.artist #artist_years, .artwork_details_wrapper .subtitle .comma, .artwork_details_wrapper .subtitle .year, .records_list .title .comma, .records_list .title .year { font-family: "elza-text", sans-serif !important; font-weight: 400 !important; font-style: normal !important; } /* Exhibition detail page: artist list in sentence case (not uppercase) */ .page-exhibitions .exhibition-header h1 .h1_subtitle { text-transform: none !important; } /* Exhibition detail page: breathing room between artist list and dates */ .page-exhibitions .exhibition-header h1 .h1_subtitle { line-height: 1.55 !important; } .page-exhibitions .exhibition-header .subtitle { margin-top: 1.6em !important; } /* Artwork detail: caption text and Enquire in black */ .artwork_details_wrapper .detail_view_module_artwork_caption, .artwork_details_wrapper .detail_view_module_artwork_caption .medium, .artwork_details_wrapper .detail_view_module_artwork_caption .dimensions, .artwork_details_wrapper .detail_view_module_artwork_caption .edition_details, .enquire a, .enquire_button_container a { color: #010101 !important; } /* Header: hide cart icon and Contact from the menu */ #store_cart_widget.empty.active, #store_cart_widget { width: 0 !important; height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; visibility: hidden !important; pointer-events: none !important; } #top_nav li.topnav-filepath-contact { display: none !important; } /* Menu in black, current page underlined */ #top_nav.navigation ul li a, #top_nav #full_nav .dropdown-btn { color: #010101 !important; } #top_nav.navigation ul li.active > a { text-decoration: underline !important; text-underline-offset: 0.28em; } /* Section subheadings: remove the grey rule line */ .subheading::after { display: none !important; } /* Disable the slow fade-in / rise-from-below entrance animation */ body.layout-animation-enabled *, body.layout-animation-enabled *::before, body.layout-animation-enabled *::after { transition-duration: 0s !important; transition-delay: 0s !important; animation-duration: 0s !important; animation-delay: 0s !important; } body.layout-animation-enabled .inview_element { opacity: 1 !important; transform: none !important; } /* Exhibition list: rebalance image / text columns so titles do not wrap */ @media (min-width: 1000px) { .records_list.feature_list .image { width: 350px !important; } .records_list.feature_list .content { width: calc(100% - 350px) !important; } } /* Exhibition titles: as typed in the CMS (no forced CAPS) */ .section-exhibitions .records_list h2, .section-exhibitions .records_list h2 a, .exhibition-header h1, .exhibition-header h1 .h1_heading { text-transform: none !important; } /* Helper: wrap any title text in to opt out of CAPS */ .nocaps, .nocaps * { text-transform: none !important; } /* Footer: text as typed in the CMS (no forced CAPS) */ #footer, #footer * { text-transform: none !important; } /* Dates: as typed, never forced to CAPS (lists, headers, private views, artwork years) */ .date, .subtitle_date, .event-details-wrapper .event-details span, .records_list .title .year, .artwork_details_wrapper .subtitle .year, h1.artist #artist_years { text-transform: none !important; } /* Artist list: single column + small square hover image, pinned top */ /* Change --preview-size to resize the hover image. Nothing else to touch. */ .subsection-artist-list-preview { --preview-size: 300px; } .subsection-artist-list-preview > div:first-child ul { width: 100% !important; float: none !important; } @media (min-width: 1024px) { .subsection-artist-list-preview .content_follow { width: var(--preview-size) !important; height: var(--preview-size) !important; position: relative !important; overflow: hidden !important; } .subsection-artist-list-preview__image { width: var(--preview-size) !important; height: var(--preview-size) !important; aspect-ratio: auto !important; position: absolute !important; top: 0 !important; left: 0 !important; overflow: hidden !important; } .subsection-artist-list-preview__image img { position: absolute !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; max-height: none !important; min-height: 0 !important; object-fit: cover !important; } } /* Mobile and tablet: names only. No hover on touch, so no preview image. */ @media (max-width: 1023px) { .subsection-artist-list-preview .content_follow_sticky { display: none !important; } .subsection-artist-list-preview > div:first-child { width: 100% !important; float: none !important; } } /* Overview : l'image dicte sa largeur, la légende s'aligne dessus */ #scroll_section_overview .sidebar { width: fit-content !important; max-width: 50% !important; } #scroll_section_overview .prose { float: none !important; width: auto !important; overflow: hidden !important; } #scroll_section_overview .sidebar .image { width: fit-content !important; height: fit-content !important; aspect-ratio: auto !important; min-height: 0 !important; padding: 0 !important; display: block !important; font-size: 0 !important; line-height: 0 !important; } /* Neutralise le padding-hack qui réservait un carré autour de l'image */ #scroll_section_overview .sidebar .image::before, #scroll_section_overview .sidebar .image::after { display: none !important; content: none !important; padding: 0 !important; } #scroll_section_overview .sidebar .image a, #scroll_section_overview .sidebar .image .object-fit-container { display: contents !important; position: static !important; } #scroll_section_overview .sidebar .image img { position: static !important; display: block !important; margin: 0 !important; object-fit: initial !important; } @media (min-width: 1024px) { #scroll_section_overview .sidebar .image img { height: clamp(360px, 58vh, 620px) !important; width: auto !important; max-width: 100% !important; } } @media (max-width: 1023px) { #scroll_section_overview .sidebar .image img { width: 100% !important; height: auto !important; } } /* Légende : largeur de l'image, en gris */ #scroll_section_overview .sidebar .caption { width: 0 !important; min-width: 100% !important; margin-top: 10px !important; font-size: 13px !important; line-height: 1.4 !important; } #scroll_section_overview .sidebar .caption, #scroll_section_overview .sidebar .caption * { color: #767676 !important; } /* Artist list: hover image only while hovering a linked artist name. */ /* Only artists whose detail page is enabled are links, so only they trigger it. */ .subsection-artist-list-preview .content_follow_sticky { opacity: 0 !important; } .subsection-artist-list-preview:has(li a:hover) .content_follow_sticky { opacity: 1 !important; } /* Exhibition list: subtitle (artist list) as typed, no forced CAPS */ .section-exhibitions .records_list .content .subtitle, .section-exhibitions .records_list .content .subtitle a { text-transform: none !important; } /* Exhibition detail: date block always on its own line, flush left */ .page-exhibitions .exhibition-header .subtitle { clear: left !important; float: none !important; display: block !important; } /* Menu mobile : fond blanc au lieu du voile noir */ #responsive_slide_nav_wrapper::before { background: #ffffff !important; } #responsive_slide_nav_wrapper #top_nav a { color: #010101 !important; } #responsive_slide_nav_wrapper #top_nav_reveal a { color: #010101 !important; } /* Menu mobile : le header (logo + burger) reste visible au-dessus du menu */ #header { z-index: 10001 !important; } body.slide-nav-open #header { background: #ffffff !important; } /* Overview quote (liste d'artistes) : sans barre verticale, corps réduit */ .page-exhibitions .subsection-overview blockquote.quote { border-left: none !important; padding-left: 0 !important; font-size: 20px !important; line-height: 1.45 !important; } /* Header transparent : menu et logo en blanc quand le bandeau est sombre */ body.fullscreen-slide-dark #logo, body.fullscreen-slide-dark #logo a, body.fullscreen-slide-dark #top_nav.navigation ul li a, body.fullscreen-slide-dark #top_nav.navigation ul li.active > a, body.fullscreen-slide-dark #top_nav #full_nav .dropdown-btn, body.fullscreen-slide-dark #slide_nav_reveal { color: #ffffff !important; } /* Header transparent : menu blanc sur bandeau sombre */ body.fullscreen-slide-dark:not(.slide-nav-open) #responsive_slide_nav_wrapper #top_nav ul li a, body.fullscreen-slide-dark:not(.slide-nav-open) #responsive_slide_nav_wrapper #top_nav ul li.active > a { color: #ffffff !important; } /* Header transparent : le logo suit le menu et ne bascule plus au scroll. Sans ces deux regles, le JS d'Artlogic reevalue la luminosite pendant le defilement et permute les deux calques du logo, alors que le menu reste fige en blanc — d'ou le logo qui vire au noir sur quelques pixels. */ body.fullscreen-slide-dark #logo .logo-variant-light { opacity: 1 !important; } body.fullscreen-slide-dark #logo .logo-variant-dark { opacity: 0 !important; } /* Overview quote: smaller body */ .page-exhibitions .subsection-overview blockquote.quote { font-size: 17px !important; line-height: 1.5 !important; } /* Mobile: image and caption below the text, full width */ @media (max-width: 1023px) { #scroll_section_overview .subsection-overview { display: flex !important; flex-direction: column !important; } #scroll_section_overview .subsection-overview .prose { order: 1 !important; float: none !important; width: 100% !important; } #scroll_section_overview .subsection-overview .sidebar { order: 2 !important; float: none !important; width: 100% !important; max-width: 100% !important; padding-left: 0 !important; margin-top: 30px !important; } #scroll_section_overview .sidebar .image { width: 100% !important; max-width: 100% !important; } #scroll_section_overview .sidebar .image img { width: 100% !important; height: auto !important; } } /* Mobile: centred logo, burger stays on the right */ @media (max-width: 1023px) { #header .inner .header-ui-wrapper { position: absolute !important; right: 0 !important; top: 50% !important; transform: translateY(-50%) !important; } /* Exhibition pages: hero about twice as tall on mobile */ body.page-param-type-exhibition_id #hero_header { height: min(66vw, 420px) !important; } } /* Overview quote: smaller still */ .page-exhibitions .subsection-overview blockquote.quote { font-size: 15px !important; line-height: 1.55 !important; } /* FIX mobile burger: la regle precedente posait un transform sur .header-ui-wrapper, qui contient le menu mobile en position:fixed. Un transform sur un ancetre casse le fixed et rendait le menu inutilisable. Le positionnement passe sur .header-icons-wrapper, qui ne contient que le burger. */ @media (max-width: 1023px) { #header .inner .header-ui-wrapper { position: static !important; transform: none !important; top: auto !important; right: auto !important; width: 0 !important; min-width: 0 !important; flex: 0 0 0 !important; } #header .inner .header-icons-wrapper { position: absolute !important; right: 0 !important; top: 50% !important; transform: translateY(-50%) !important; } } /* Menu burger ouvert : logo TOUJOURS en noir, au-dessus du voile blanc. Le voile #responsive_slide_nav_wrapper::before (z-index 9998) recouvrait le logo (z-index auto) : il faut le remonter, pas seulement forcer le calque sombre. */ body.slide-nav-open.slide-nav-active #logo { position: relative !important; z-index: 10000 !important; } body.slide-nav-open.slide-nav-active #logo .logo-variant-dark { opacity: 1 !important; } body.slide-nav-open.slide-nav-active #logo .logo-variant-light { opacity: 0 !important; } body.slide-nav-open.slide-nav-active #logo, body.slide-nav-open.slide-nav-active #logo a { color: #010101 !important; } /* Mobile : les vignettes de la liste d'expositions prennent toute la largeur. La regle desktop .feature_list .lazyload_wrapper { width: 350px } les laissait ferrees a gauche, 10px trop etroites, sur un ecran de 390px. Desktop inchange. */ @media (max-width: 1023px) { .records_list.feature_list .image, .records_list.feature_list .lazyload_wrapper { width: 100% !important; max-width: 100% !important; } .records_list.feature_list .lazyload_wrapper img { width: 100% !important; } } /* Hero des pages exposition : exactement la hauteur de l'ecran, desktop ET mobile. Remplace la regle mobile min(66vw, 420px) plus haut (meme specificite, celle-ci est plus bas dans le fichier, donc elle gagne). La hauteur du hero vient du padding-hack du theme #hero_header.hero-fixed-aspect-ratio::after { padding-top: 33.3333% } (ratio 3:1) : il faut le neutraliser, sinon il s'ajoute a la hauteur imposee. 100svh (small viewport height) et non 100vh en mobile : la barre d'adresse d'iOS/Android ne fait plus deborder ni sauter le bandeau. 100vh reste en repli pour les navigateurs anterieurs a 2022. */ body.page-param-type-exhibition_id #hero_header, body.page-param-type-exhibition_id #hero_header.hero-fixed-aspect-ratio { height: 100vh !important; min-height: 100vh !important; max-height: 100vh !important; overflow: hidden !important; } body.page-param-type-exhibition_id #hero_header.hero-fixed-aspect-ratio::after { padding-top: 0 !important; height: 0 !important; } @supports (height: 100svh) { body.page-param-type-exhibition_id #hero_header, body.page-param-type-exhibition_id #hero_header.hero-fixed-aspect-ratio { height: 100svh !important; min-height: 100svh !important; max-height: 100svh !important; } } /* Pages exposition : boutons de section (Overview / Works / Installation Views) masques. #sub_nav est un simple div flotte a droite dans .exhibition-header, pas un composant du theme : display:none suffit et n'affecte rien d'autre. Limite a page-param-type-exhibition_id : le meme #sub_nav sert sur les pages artiste et foires, laissees intactes. Pour reafficher, supprimer ce bloc. */ body.page-param-type-exhibition_id #sub_nav { display: none !important; } body.page-param-type-exhibition_id .exhibition-header .subtitle.has_subnav { margin-right: 0 !important; } /* Dates des expositions : +30% (12,5px -> 16,25px) et en noir. Grille de la page Exhibitions ET en-tete de la page detail. Dans la grille la date etait en gris #585858 ; sur la page detail elle etait deja en #010101, la couleur y est reaffirmee pour que les deux ne divergent plus. */ .section-exhibitions .records_list .content .date, .page-exhibitions .exhibition-header .subtitle, .page-exhibitions .exhibition-header .subtitle .subtitle_date, .page-exhibitions .exhibition-header .subtitle span { font-size: 16.25px !important; line-height: 1.35 !important; color: #010101 !important; } /* Liste d'artistes : deux colonnes, toujours ferrees a gauche pour laisser la place au carre de survol a droite. Le theme a son propre systeme (gd_no_of_columns_4 + ul.dynamic-column genere en JS) mais notre regle plus haut force ces ul a 100%, ce qui les empile. On passe donc par les colonnes CSS sur le conteneur : le decoupage est equilibre par le navigateur, sans dependre du JS du theme. */ @media (min-width: 1024px) { .subsection-artist-list-preview #list_preview_navigation { column-count: 2 !important; column-gap: 50px !important; } .subsection-artist-list-preview #list_preview_navigation ul.dynamic-column { width: 100% !important; float: none !important; } .subsection-artist-list-preview #list_preview_navigation li { break-inside: avoid !important; -webkit-column-break-inside: avoid !important; } } /* CORRECTION du bloc precedent : les colonnes doivent etre POSEES PAR SECTION, pas sur le conteneur, sinon les deux groupes (Gallery artists / Artists exhibited) se melangent d'une colonne a l'autre. Structure : #list_preview_navigation > .artist_list_section_wrapper (une par groupe) > .subheading + .artists-list-formatted-wrapper > ul.dynamic-column Resultat : chaque intertitre reste sur toute la largeur, sa liste se repartit sous lui. Gallery artists (2 noms) -> Marcel Jean a gauche, Dora Maar a droite. */ @media (min-width: 1024px) { .subsection-artist-list-preview #list_preview_navigation { column-count: auto !important; column-gap: normal !important; } .subsection-artist-list-preview #list_preview_navigation ul.dynamic-column { width: 100% !important; float: none !important; column-count: 2 !important; column-gap: 50px !important; } /* margin-bottom -> padding-bottom : la marge de fin de colonne fait deborder le dernier nom dans une 3e colonne. Avec le padding, l'equilibrage tombe juste. Teste de 50 a 56 artistes : toujours 2 colonnes. */ .subsection-artist-list-preview #list_preview_navigation ul.dynamic-column > li { margin-bottom: 0 !important; padding-bottom: 3px !important; break-inside: avoid !important; -webkit-column-break-inside: avoid !important; } } /* Bandeau des pages exposition : suppression du voile de lisibilite en BAS de l'image. Le theme pose deux degrades sur la diapositive : li::before -> en haut (20% de blanc sur image claire, 30% de noir sur image sombre) li::after -> en bas (60% de blanc sur image claire, 30% de noir sur image sombre) Le voile du bas ne sert a rien ici : le titre est place SOUS l'image, pas dessus. Celui du haut est conserve, il aide le menu a rester lisible. Les deux selecteurs sont necessaires : le parallax clone la diapositive dans #mirror-slideshow, place hors de #hero_header (directement sous le body), et met #slideshow a opacity 0. Ne viser que #slideshow ne change donc rien a l'ecran. */ body.page-param-type-exhibition_id #slideshow ul li::after, body.page-param-type-exhibition_id #mirror-slideshow ul li::after { background-image: none !important; background: none !important; } /* PAGE D'ACCUEIL — bandeau plein ecran de l'exposition a venir. Le plein ecran, le lien et le texte en bas a gauche viennent des reglages natifs (Settings > Homepage : slideshow type = Fullscreen ; l'exposition 9 est cochee "Show on home page"). Ne restent en CSS que la mention "a venir" et l'aeration. */ body.section-home #slideshow li .content { bottom: 60px !important; } body.section-home #slideshow li .content .inner h2::before { content: "Forthcoming"; display: block; font-family: "scotch-text", serif; font-size: 12.5px; letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 1.4em; opacity: 0.8; } body.language-fr #slideshow li .content .inner h2::before { content: "\00c0 venir"; } body.section-home #slideshow li .content .inner h2 { margin-bottom: 0.35em !important; } body.section-home #slideshow li .content .inner .date { font-size: 14px !important; letter-spacing: 0.02em; } /* Correctif : en CSS, une sequence d'echappement absorbe l'espace qui la suit. "\00c0 venir" donnait "Avenir" colle. Deux espaces retablissent le mot. */ body.language-fr #slideshow li .content .inner h2::before { content: "\00c0 venir"; } /* PAGE D'ACCUEIL — ajustements du 29/08 (suite). 1. Voile de lisibilite retire en HAUT ET EN BAS (contrairement aux pages expo ou seul le bas est neutralise) : ici le texte est deja gere par la bascule automatique clair/sombre du theme. Les deux selecteurs sont necessaires, le parallax clonant la diapositive dans #mirror-slideshow. */ body.section-home #slideshow ul li::before, body.section-home #slideshow ul li::after, body.section-home #mirror-slideshow ul li::before, body.section-home #mirror-slideshow ul li::after { background-image: none !important; background: none !important; } /* 2. Mention "Forthcoming" : interlettrage au minimum. */ body.section-home #slideshow li .content .inner h2::before { letter-spacing: 0 !important; } /* 3. Titre tel que saisi dans le CMS, pas de capitales forcees. */ body.section-home #slideshow li .content .inner h2, body.section-home #slideshow li .content .inner h2 a { text-transform: none !important; } /* 4. "Learn more" sous les dates, calque sur celui de la grille d'expositions (scotch-text 12,5px, graisse 200, capitales, sans interlettrage). */ body.section-home #slideshow li .content .inner::after { content: "Learn more"; display: block; margin-top: 1.7em; font-family: "scotch-text", serif; font-weight: 200; font-size: 12.5px; letter-spacing: normal; text-transform: uppercase; } body.language-fr #slideshow li .content .inner::after { content: "En savoir plus"; } /* PAGE D'ACCUEIL — supprimer le clignotement du logo au chargement. Diagnostic (echantillonnage toutes les 60ms) : le menu ne bouge jamais, il est noir du debut a la fin. Ce qui saute, c'est le LOGO, blanc jusqu'a ~2,5 s puis noir — le temps qu'Artlogic telecharge l'image et en mesure la luminosite. Et comme le theme pose un fond #222222 sous le slideshow pendant ce temps, on voit un ecran sombre avec un logo blanc, puis tout bascule d'un coup. Deux corrections qui suppriment la bascule au lieu de l'adoucir : 1. le fond d'attente prend la teinte moyenne de l'image (#d2c5aa, mesuree au canvas sur la vignette 60px : luminosite 192, donc "claire") ; 2. avant que la detection ait eu lieu (aucune classe fullscreen-slide-* sur le body), on force deja l'etat final : logo noir. ATTENTION : ces deux valeurs sont liees a l'image actuelle. Si l'image de la page d'accueil est remplacee par une image SOMBRE, il faut repasser le fond en #222222 et rendre le logo clair, sinon le clignotement revient a l'envers. */ body.section-home #slideshow, body.section-home #slideshow li { background-color: #d2c5aa !important; } body.section-home:not(.fullscreen-slide-light):not(.fullscreen-slide-dark) #logo .logo-variant-dark { opacity: 1 !important; } body.section-home:not(.fullscreen-slide-light):not(.fullscreen-slide-dark) #logo .logo-variant-light { opacity: 0 !important; } /* Texte courant (style "Paragraph" de l'editeur) : interligne 1,45. Le theme pose line-height: 31px sur le BODY, en pixels, donc herite par tout le site — soit un ratio de 2,14 pour un corps de 14,5px, tres au-dessus de la plage habituelle (1,5 a 1,7). Aucun reglage d'admin ne le gouverne et la valeur n'est pas dans ce fichier : elle vient de la feuille du theme. On ne touche PAS au body (cela deplacerait menus, legendes et sous-navigation, deja regles) : on ne vise que les blocs de texte riche. La citation (overview quote) garde son 1,55 : sa regle est plus specifique. */ .prose, .prose p, .prose li, .prose span, .description, .description p, .description li, .description span, .content_module, .content_module p, .content_module li, .biography, .biography p, .biography li { line-height: 1.45 !important; } /* Overview : l'image n'est plus cliquable. Le theme enveloppe l'image dans un — verifie identique sur les expos 9, 10, 11, 12 et 17, un seul lien par page, toujours dans .image (jamais dans la legende). pointer-events est une propriete HERITEE : la poser sur le suffit, l'img la recupere. Le clic tombe alors sur .image, et le handler jQuery du lien ne recoit plus rien. On remet le curseur par defaut, sinon la main reste affichee. */ #scroll_section_overview .sidebar .image a { pointer-events: none !important; cursor: default !important; } /* Overview quote : pleine largeur, alignee sur le texte de description. Le theme lui impose width: 85% (mesure : 617px pour une colonne de 726px, ratio 0,850 exactement). C'est cette regle, et non une marge, qui la faisait finir plus tot que le paragraphe juste dessous. */ .page-exhibitions .subsection-overview blockquote.quote { width: 100% !important; max-width: 100% !important; } /* Texte courant justifie dans TOUTES les langues. Constat : les paragraphes anglais portent un style="text-align: justify" en ligne (herite du texte colle a l'origine), les traductions francaises non — elles tombaient donc au fer a gauche. Plutot que de rajouter le style a la main dans chaque champ Translate, on le pose en CSS : c'est valable pour les traductions existantes comme pour celles a venir. */ .prose p, .prose li, .description, .description p, .description li, .biography p, .biography li { text-align: justify !important; } /* Publications : titres tels que saisis, plus de capitales forcees. Meme principe que pour les expositions le 26/08 — text-transform: none, JAMAIS capitalize, qui casserait "Marcel Jean. Les traces de pas" en "Les Traces De Pas". Couvre la liste (h2) et la page detail (h1). Le titre de section "PUBLICATIONS" reste en capitales, comme EXHIBITIONS et ARTISTS : ce sont les intitules de rubrique, pas des titres de contenu. */ .section-publications .records_list .content h2, .section-publications .records_list .content h2 a, .section-publications .records_list .content .title, .section-publications .records_list .content .title a, body.page-param-type-publication_id .heading_wrapper h1 { text-transform: none !important; } /* Fiche artiste : mention "Browse artists" masquee, expositions sur deux colonnes. 1. "Browse artists" est un place entre les liens Previous / Next artist. On ne masque QUE le libelle, la navigation precedent/suivant reste en place. Present dans #sub_nav et #sticky_sub_nav, d'ou le selecteur non prefixe. 2. Structure reelle de la liste : div.records_list > ul > li — la grille doit donc etre posee sur le UL, pas sur le div (piege : sur le div, les cartes passent bien a 50% de largeur mais restent empilees). Chaque li est un feature_list en flex (image a gauche, texte a droite) : a 595px cela serait illisible, on repasse donc en bloc, image au-dessus. */ .artists-browser .artists-browser-label { display: none !important; } @media (min-width: 1024px) { .subsection-exhibitions .records_list.feature_list > ul { display: grid !important; grid-template-columns: repeat(2, 1fr) !important; column-gap: 50px !important; } .subsection-exhibitions .records_list.feature_list > ul > li { width: auto !important; float: none !important; display: block !important; } .subsection-exhibitions .records_list.feature_list > ul > li > * { display: block !important; } .subsection-exhibitions .records_list.feature_list .image, .subsection-exhibitions .records_list.feature_list .lazyload_wrapper { width: 100% !important; max-width: 100% !important; } .subsection-exhibitions .records_list.feature_list .content { width: 100% !important; float: none !important; margin-top: 20px !important; } } /* Fiche artiste — expositions : 3 par ligne (remplace le 2 par ligne ci-dessus). minmax(0,1fr) et non 1fr : avec 1fr, un titre long elargit sa colonne et les cartes cessent d'etre egales (mesure : une carte a 311px contre 280px). 30/08/2026 : passe de 4 a 3 colonnes a la demande de Jules, et le palier a 1280px disparait — 3 colonnes tiennent des 1024px (mesure : 394px par carte a 1401px de large). La description reste masquee : 335 caracteres dans une carte de 394px donnent encore des hauteurs de cartes tres inegales. */ @media (min-width: 1024px) { .subsection-exhibitions .records_list.feature_list > ul { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; column-gap: 30px !important; } .subsection-exhibitions .records_list.feature_list .description, .subsection-exhibitions .records_list.feature_list .link { display: none !important; } } /* Fiche artiste — titres d'expositions et de catalogues. 1. Capitales forcees retirees : ailleurs sur le site les titres sont deja en casse normale (regle du 26/08 pour les expos, du 30/08 pour les publications), mais ces deux regles sont limitees a .section-exhibitions / .section-publications. Sur la fiche artiste on est dans .section-artists, d'ou l'oubli. 2. Le titre n'etait pas ferre a gauche : .content garde un padding-left de 60px, vestige de la mise en page horizontale (texte a droite de l'image). 3. float: none sur l'image — SANS CELA le h2 demarre a cote du flottant et sa boite atteint 328px de haut pour deux lignes de texte. Le titre s'affichait bien sous l'image mais tout l'espacement en dessous etait fausse. 4. Corps ramene de 30px a 16px : 30px etait dimensionne pour une carte de 1340px sur la page Exhibitions, pas pour une carte de 288px. */ .section-artists .subsection-exhibitions .records_list .content h2, .section-artists .subsection-exhibitions .records_list .content h2 a, .section-artists .subsection-publications .records_list .content h2, .section-artists .subsection-publications .records_list .content h2 a { text-transform: none !important; } @media (min-width: 1024px) { .subsection-exhibitions .records_list.feature_list .image { float: none !important; } .subsection-exhibitions .records_list.feature_list .content { padding-left: 0 !important; margin-top: 16px !important; } .subsection-exhibitions .records_list.feature_list .content h2 { font-size: 16px !important; line-height: 1.25 !important; margin-bottom: 10px !important; } } /* Fiche artiste — publications : 4 par ligne (01/09/2026 ; 2 par ligne au depart). Piege : la classe de la liste change selon le nombre de fiches. Avec une seule publication Artlogic rend un .feature_list (li en flex, pleine largeur) ; a partir de deux, un .image_list (li en inline-block, gd_no_of_columns_3). La regle vise donc .records_list tout court, sans qualifier la variante, et remet le li en bloc pour que image et texte s'empilent. Portee limitee a .section-artists : la page /publications/ garde ses 3 colonnes natives. Passe de 2 a 4 colonnes : a 2 par ligne les couvertures faisaient ~600px de large contre 394px pour les vignettes d'exposition juste au-dessus, elles ecrasaient visuellement la section. A 4 colonnes elles retombent a ~290px. */ @media (min-width: 1024px) { .section-artists .subsection-publications .records_list > ul { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; column-gap: 30px !important; } .section-artists .subsection-publications .records_list > ul > li { width: auto !important; max-width: none !important; float: none !important; display: block !important; margin-left: 0 !important; margin-right: 0 !important; } .section-artists .subsection-publications .records_list > ul > li > * { display: block !important; } .section-artists .subsection-publications .records_list .image, .section-artists .subsection-publications .records_list .lazyload_wrapper { width: 100% !important; max-width: 100% !important; float: none !important; } .section-artists .subsection-publications .records_list .content { width: 100% !important; float: none !important; padding-left: 0 !important; margin-top: 16px !important; } .section-artists .subsection-publications .records_list .content h2 { font-size: 16px !important; line-height: 1.25 !important; margin-bottom: 10px !important; } } /* ============================================================ PIED DE PAGE — mise en page inspiree de crousel.com (30/08/2026) Contenu : reglages natifs Settings > Layout > Footer columns 1 a 3 + Copyright custom format (« © Galerie Boquet #year# »). Les colonnes contenaient encore du balisage colle depuis l'ancien site Wix (classes font_2 / wixui-rich-text__text / color_15) : reecrites proprement en h4 + p, donc le CSS ci-dessous ne s'appuie que sur la structure. Bandeau gris pleine largeur sans debordement horizontal : box-shadow etale + clip-path, et non width:100vw qui provoque une barre de defilement horizontale sur les systemes a ascenseur non superpose (Windows). #social_links (icone Instagram alignee a droite par le theme) est masque : le lien Instagram est repris en toutes lettres dans la colonne 3. Revision du 30/08 au soir : intitules en Scotch, lignes courantes en Elza bas de casse, colonne 3 sans intitule (bouton newsletter a la place de « Follow »). ============================================================ */ #footer.advanced_footer { background: #efefef !important; box-shadow: 0 0 0 100vmax #efefef; clip-path: inset(0 -100vmax); padding: 55px 0 40px !important; margin-top: 60px !important; font-family: "elza-text", sans-serif !important; } #footer.advanced_footer > .inner { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; column-gap: 40px !important; row-gap: 0 !important; align-items: start !important; } #footer.advanced_footer .clear { display: none !important; } #footer.advanced_footer #social_links { display: none !important; } #footer.advanced_footer .advanced_footer_item { display: block !important; width: auto !important; padding: 0 !important; margin: 0 !important; } #footer.advanced_footer h4, #footer.advanced_footer p, #footer.advanced_footer a, #footer.advanced_footer span, #footer.advanced_footer div { font-family: "elza-text", sans-serif !important; letter-spacing: 0.06em !important; } /* intitules de colonne : Scotch capitales, comme les titres de section du site */ #footer.advanced_footer .advanced_footer_item h4 { font-family: "scotch-text", serif !important; font-size: 13.5px !important; font-weight: 400 !important; line-height: 1.6 !important; letter-spacing: 0.05em !important; text-transform: uppercase !important; color: #111111 !important; margin: 0 0 22px 0 !important; } /* lignes courantes : Elza, casse saisie (pas de capitales forcees) */ #footer.advanced_footer .advanced_footer_item p { font-size: 12.5px !important; font-weight: 300 !important; line-height: 1.85 !important; text-transform: none !important; color: #111111 !important; margin: 0 0 22px 0 !important; text-align: left !important; } #footer.advanced_footer .advanced_footer_item p:last-child { margin-bottom: 0 !important; } #footer.advanced_footer .advanced_footer_item a { color: #111111 !important; text-transform: none !important; font-size: inherit !important; font-weight: inherit !important; letter-spacing: inherit !important; text-decoration: none !important; border-bottom: 1px solid transparent !important; } #footer.advanced_footer .advanced_footer_item a:hover { border-bottom-color: #111111 !important; } /* Bouton newsletter (colonne 3). Cible par l'URL et non par une classe : TinyMCE nettoie les attributs class des colonnes de pied de page a l'enregistrement. */ #footer.advanced_footer .advanced_footer_item a[href*="mailing-list"] { display: inline-block !important; margin-top: 6px !important; padding: 11px 20px !important; border: 1px solid #111111 !important; border-bottom: 1px solid #111111 !important; font-size: 11.5px !important; line-height: 1 !important; letter-spacing: 0.08em !important; color: #111111 !important; background: transparent !important; transition: background-color 0.2s ease, color 0.2s ease !important; } #footer.advanced_footer .advanced_footer_item a[href*="mailing-list"]:hover { background: #111111 !important; color: #efefef !important; } /* ligne du bas : copyright a gauche, liens legaux a droite (ordre DOM inverse) */ #footer.advanced_footer .copyright { grid-column: 1 / -1 !important; display: flex !important; justify-content: space-between !important; align-items: flex-start !important; margin-top: 90px !important; padding: 0 !important; width: auto !important; } #footer.advanced_footer .copyright #copyright { order: 1; } #footer.advanced_footer .copyright .small-links-container { order: 2; text-align: right !important; } #footer.advanced_footer .copyright, #footer.advanced_footer .copyright * { font-size: 11px !important; font-weight: 300 !important; line-height: 1.7 !important; text-transform: none !important; color: #555555 !important; } #footer.advanced_footer .copyright a { text-decoration: none !important; } #footer.advanced_footer .copyright a:hover { text-decoration: underline !important; } @media (max-width: 1023px) { #footer.advanced_footer > .inner { grid-template-columns: 1fr !important; row-gap: 34px !important; } #footer.advanced_footer .copyright { display: block !important; margin-top: 45px !important; } #footer.advanced_footer .copyright .small-links-container { text-align: left !important; margin-top: 8px !important; } } /* ============================================================ PAGE D'ACCUEIL — sections sous le bandeau (31/08/2026, revu le soir) Cinq sections + le bandeau. Panneaux rattaches a la page Home (record 1) : 34 Past exhibitions (Records grid) 38 About us (Text panel) 40 Discover our gallery artists (Image/Text adjacent — Marcel Jean) 36 Publications (Records grid) 37 Past fairs (Records grid) 39 Visit the gallery (Image/Text adjacent) Le panneau 35 est le premier essai de la section artistes : il reste rattache a la page mais DECOCHE. Ne pas le reactiver — voir l'avertissement plus bas. ⚠️ Artlogic ne propose AUCUN carrousel de fiches : les dispositions du Records grid sont toutes des grilles fixes et le panneau « Image carousel » ne prend que des images televersees, sans lien vers les pages du site. Le defilement est donc obtenu ici en CSS : flex nowrap + overflow-x + snap. Aucun champ de JavaScript personnalise dans l'admin, donc pas de fleches. ⚠️ Ne PAS ajouter scrollbar-width/scrollbar-color : ces proprietes standard neutralisent ::-webkit-scrollbar et, sur macOS, l'ascenseur redevient superpose donc invisible — plus rien n'indique que la rangee defile. ⚠️ L'ORDRE DES SECTIONS EST PILOTE PAR CSS (propriete order), pas par l'admin. Raison : le tableau des panneaux de la page se reordonne uniquement par glisser-deposer (SortableJS). Ni le deplacement du dans le DOM, ni l'echange des valeurs des champs, ni un glisser simule ne sont enregistres, et le glisser reel n'est pas reproductible par automatisation sur ce tableau. Si un panneau est ajoute plus tard, il faut lui donner un order ici, sinon il se placera avant tous les autres (order:0 par defaut). ============================================================ */ body.section-home .feature_panels { margin-top: 60px !important; } body.section-home .feature_panels_inner > ul { list-style: none !important; margin: 0 !important; padding: 0 !important; display: flex !important; flex-direction: column !important; } body.section-home li.panel_id_34 { order: 1 !important; } body.section-home li.panel_id_38 { order: 2 !important; } body.section-home li.panel_id_41 { order: 3 !important; } body.section-home li.panel_id_36 { order: 4 !important; } body.section-home li.panel_id_37 { order: 5 !important; } body.section-home li.panel_id_39 { order: 6 !important; } /* espacement entre sections + filet separateur */ body.section-home .feature_panels_inner > ul > li.panel { margin-bottom: 45px !important; padding-bottom: 45px !important; border-bottom: 1px solid #e4e4e4 !important; } /* pas de filet sous la derniere section (order 6) */ body.section-home li.panel_id_39 { border-bottom: 0 !important; padding-bottom: 0 !important; margin-bottom: 10px !important; } /* intitules de section : taille et interlettrage NATIFS du theme (16px, normal) */ body.section-home .feature_panels_inner > ul > li.panel .panel_header h2 { font-family: "scotch-text", serif !important; font-size: 16px !important; letter-spacing: normal !important; text-transform: uppercase !important; margin: 0 0 30px 0 !important; } /* « Forthcoming » du bandeau : meme taille que les intitules de section */ body.section-home #slideshow li .content .inner h2::before { font-size: 16px !important; letter-spacing: normal !important; } /* rangees defilantes */ body.section-home li.panel_type_7 .records_list > ul { display: flex !important; flex-wrap: nowrap !important; overflow-x: auto !important; overflow-y: hidden !important; gap: 30px !important; margin: 0 !important; padding: 0 0 20px 0 !important; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; } body.section-home li.panel_type_7 .records_list > ul::-webkit-scrollbar { height: 3px; } body.section-home li.panel_type_7 .records_list > ul::-webkit-scrollbar-thumb { background: #c4c4c4; } body.section-home li.panel_type_7 .records_list > ul::-webkit-scrollbar-track { background: #ececec; } body.section-home li.panel_type_7 .records_list > ul > li { flex: 0 0 300px !important; width: 300px !important; max-width: 300px !important; display: block !important; float: none !important; margin: 0 !important; padding: 0 !important; scroll-snap-align: start; } body.section-home li.panel_type_7 .records_list > ul > li > * { display: block !important; } body.section-home li.panel_type_7 .records_list .image, body.section-home li.panel_type_7 .records_list .lazyload_wrapper { width: 100% !important; max-width: 100% !important; float: none !important; } body.section-home li.panel_type_7 .records_list .content { width: 100% !important; float: none !important; padding-left: 0 !important; margin-top: 16px !important; } body.section-home li.panel_type_7 .records_list .content h2 { font-size: 15px !important; line-height: 1.25 !important; margin-bottom: 8px !important; text-transform: none !important; } body.section-home li.panel_type_7 .records_list .content .description { display: none !important; } /* les feature panels n'emettent pas de lien « Learn more » : on le pose en ::after */ body.section-home li.panel_id_34 .records_list .content::after { content: "Learn more"; display: block; margin-top: 14px; font-family: "scotch-text", serif; font-weight: 200; font-size: 12.5px; text-transform: uppercase; letter-spacing: normal; color: #737373; } body.language-fr li.panel_id_34 .records_list .content::after { content: "En savoir plus"; } /* bloc About us (Text panel) */ body.section-home li.panel_type_2 .content { max-width: 820px !important; } body.section-home li.panel_type_2 .description.prose p { margin-bottom: 1.1em !important; } body.section-home li.panel_type_2 .description.prose p:last-of-type { margin-bottom: 0 !important; } body.section-home li.panel_type_2 .content .link { display: block !important; margin-top: 1.6em !important; } /* blocs image + texte (artiste, visite) : titre moins imposant */ body.section-home li.panel_type_4 .content h2.fp_title { font-size: 20px !important; line-height: 1.2 !important; margin-bottom: 12px !important; } @media (max-width: 767px) { body.section-home li.panel_type_7 .records_list > ul > li { flex: 0 0 78vw !important; width: 78vw !important; max-width: 78vw !important; } body.section-home .feature_panels_inner > ul > li.panel { margin-bottom: 32px !important; padding-bottom: 32px !important; } } /* ============================================================ PIED DE PAGE — interlettrage ramene a la valeur du theme (01/09/2026) Jules : « meme remarque sur l'espacement des lettres pour le footer ». Le 0,06em pose la veille elargissait visiblement le texte par rapport au reste du site, dont les titres de section sont en letter-spacing: normal. Seul le bouton newsletter garde un leger interlettrage, comme tout bouton. ============================================================ */ #footer.advanced_footer h4, #footer.advanced_footer p, #footer.advanced_footer a, #footer.advanced_footer span, #footer.advanced_footer div, #footer.advanced_footer .advanced_footer_item h4 { letter-spacing: normal !important; } #footer.advanced_footer .advanced_footer_item a[href*="mailing-list"] { letter-spacing: 0.04em !important; } /* ============================================================ EN-TETE — menu reparti de part et d'autre du logo (01/09/2026) Structure du theme : #header > .inner (position:relative, display:flex) ├ #logo ├ #skiplink-container └ .header-ui-wrapper ├ #responsive_slide_nav_wrapper > … > ul.topnav ├ .header-icons-wrapper (position:absolute — contient #slide_nav_reveal, │ le burger, et le panier) └ #translations_nav (EN/FR) ⚠️ PIEGE : .inner porte la classe .clearwithin, dont le ::before de clearfix devient un ITEM FLEX puisque .inner est en display:flex. Mesure : ce ::before prend flex:1 1 0% et 680px de large, ce qui pousse le logo contre le bord droit des que le menu passe en burger. D'ou la neutralisation sous 1200px. La loupe de recherche a ete RETIREE le 01/09 a la demande de Jules : l'index d'Artlogic ne renvoyait aucun resultat. Pour la remettre : Settings > Search, « Enable search » = oui et « Search bar position » = Header. Le theme rend alors #header_quick_search dans .header-icons-wrapper, avec un formulaire GET vers /search/ (champ nomme « search »). Ne pas dessiner une icone maison. ⚠️ Palier a 1200px et non 1024px. Chevauchement mesure en reduisant le conteneur : a 960px il reste 4px entre la fin du groupe de gauche et le logo, a 880px les deux se recouvrent. ⚠️ L'item « Publications » sert de CHARNIERE : son margin-left:auto rejette les items suivants a droite du logo. Aucune largeur n'est codee en dur. Si l'ordre du menu change dans l'admin, deplacer ce selecteur sur le nouvel item median. ============================================================ */ @media (min-width: 1200px) { #header .inner { position: relative !important; display: block !important; } #header #logo { position: absolute !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%) !important; margin: 0 !important; z-index: 4 !important; } #header .header-ui-wrapper { display: flex !important; align-items: center !important; width: 100% !important; margin: 0 !important; /* 01/09 : hauteur reduite (118 -> 108) et padding-top du theme neutralise, pour degager l'espace au-dessus du logo (en-tete 204px -> 156px). */ min-height: 108px !important; padding-top: 0 !important; } #header .inner { padding-top: 24px !important; padding-bottom: 24px !important; } #header #responsive_slide_nav_wrapper { flex: 1 1 auto !important; min-width: 0 !important; } #header #responsive_slide_nav_wrapper_inner, #header #top_nav { width: 100% !important; } #header #top_nav ul.topnav { display: flex !important; align-items: center !important; justify-content: flex-start !important; width: 100% !important; margin: 0 !important; padding: 0 !important; gap: 30px !important; } #header #top_nav ul.topnav > li { margin: 0 !important; float: none !important; } #header #top_nav ul.topnav > li.topnav-label-publications { margin-left: auto !important; } #header #translations_nav { position: static !important; order: 3 !important; flex: 0 0 auto !important; display: flex !important; align-items: center !important; margin-left: 36px !important; top: auto !important; right: auto !important; } #header .header-icons-wrapper { order: 4 !important; flex: 0 0 auto !important; margin-left: 20px !important; } /* EN/FR sur la meme ligne de base que le menu : on reconstruit exactement la boite d'un lien de menu (padding 8px + line-height 18px = 34px de haut). Sans cela le texte remonte de 2px (li a 7px de padding, ul a line-height 0). */ #header #translations_nav ul { display: flex !important; align-items: center !important; line-height: normal !important; margin: 0 !important; padding: 0 !important; } #header #translations_nav li { display: flex !important; align-items: center !important; padding: 0 !important; margin: 0 0 0 14px !important; float: none !important; } #header #translations_nav li:first-child { margin-left: 0 !important; } #header #translations_nav a { display: block !important; line-height: 18px !important; padding: 8px 0 !important; } } /* Sous le palier : le logo doit rester au centre malgre le ::before de clearfix */ @media (max-width: 1199px) { #header .inner::before { display: none !important; } #header .inner { justify-content: center !important; } #header .inner { padding-top: 18px !important; padding-bottom: 18px !important; } } /* Burger a gauche (tablette et mobile) */ @media (max-width: 1023px) { #header .header-icons-wrapper { left: 0 !important; right: auto !important; margin-left: 0 !important; justify-content: flex-start !important; /* centrage vertical maitrise ici plutot que par le calcul JS du theme : c'est ce qui permet de poser la croix exactement au meme endroit. */ top: 50% !important; transform: translateY(-50%) !important; /* le conteneur s'etire sur toute la largeur et avalait les clics sur le logo */ pointer-events: none !important; } #header .header-icons-wrapper > * { pointer-events: auto !important; } /* 01/09 : le burger colle a la marge de contenu (il avait 10px + 10px de margin-left, l'un sur le conteneur, l'autre sur le bouton). */ #header #slide_nav_reveal { margin-left: 0 !important; } /* La croix de fermeture, ramenee exactement sur le burger. #top_nav_reveal est en position:fixed, ancre en haut a droite par le theme. 34px = marge de contenu (30) + 4 pour centrer la croix de 22px sur le bouton de 30px ; 44px = 55 (centre vertical de l'en-tete a 110px de haut) - 11. ⚠️ Le 30px de marge laterale est MESURE (identique de 614px a 1023px), il n'est pas lisible en CSS : le theme le pose depuis une feuille externe inaccessible. Si la marge change sur tres petit ecran, ajuster ces 34px. */ #header #top_nav_reveal { left: 0 !important; right: auto !important; top: 0 !important; width: auto !important; text-align: left !important; padding: 44px 0 0 34px !important; } } /* EN/FR en Elza comme le reste du menu, a toutes les largeurs */ #header #translations_nav a { font-family: "elza-text", sans-serif !important; font-size: 12.5px !important; text-transform: uppercase !important; letter-spacing: normal !important; } /* ============================================================ ACCUEIL — retouches du 01/09/2026 (soir) 1. Section artistes : panneau 41 (Records grid) remplace le 40 (Image/Text adjacent), qui reste rattache a la page mais DECOCHE. Raison : il fallait DEUX artistes visibles un par un, ce qu'un panneau Image/Text ne sait pas faire (son diaporama natif n'a pas de champ texte par diapositive). ⚠️ Le texte de chaque fiche ne vient PAS de la fiche artiste : les colonnes Title / Subtitle / Dates / Link URL / Link Label de chaque « grid item » surchargent l'enregistrement. Elles ne sont accessibles qu'en ouvrant le crayon de la ligne (fenetre EDIT ITEM, champs prefixes replica_...), pas dans le tableau. La colonne « Content » (index 11), elle, n'a PAS de champ dans cette fenetre : la phrase de biographie est donc posee dans SUBTITLE, d'ou la remise a plat de son style plus bas (le theme l'affiche sinon en petites capitales grises avec un filet en dessous). 2. Photos des blocs image + texte reduites de 20% : 640px -> 512px. 3. Separateurs retires sous les panneaux type_7 (les sliders : leur barre de defilement fait deja une ligne) et sous la derniere section. ⚠️ La regle du 31/08 sur panel_id_39 ne s'appliquait pas : la regle generique (body.section-home .feature_panels_inner > ul > li.panel) a une specificite de (0,3,3) contre (0,2,2) pour l'exception. Corrige en qualifiant l'exception avec le meme chemin complet. ============================================================ */ /* --- section artistes : une fiche a la fois --- */ body.section-home li.panel_id_41 .records_list > ul { scroll-snap-type: x mandatory !important; gap: 0 !important; } body.section-home li.panel_id_41 .records_list > ul > li { flex: 0 0 100% !important; width: 100% !important; max-width: 100% !important; } body.section-home li.panel_id_41 .records_list .content .description { display: none !important; } /* la phrase de biographie est dans SUBTITLE : on annule le style « petites capitales grises + filet » que le theme applique a cette classe */ body.section-home li.panel_id_41 .records_list .content .subtitle { display: block !important; font-family: "elza-text", sans-serif !important; font-size: 14.5px !important; line-height: 1.45 !important; color: #010101 !important; text-transform: none !important; border: 0 !important; padding: 0 !important; margin: 0 !important; } @media (min-width: 1024px) { body.section-home li.panel_id_41 .records_list > ul > li > a { display: flex !important; align-items: center !important; gap: 60px !important; } body.section-home li.panel_id_41 .records_list .image { flex: 0 0 512px !important; width: 512px !important; max-width: 512px !important; } body.section-home li.panel_id_41 .records_list .content { display: flex !important; flex-direction: column !important; flex: 1 1 auto !important; margin-top: 0 !important; } /* ordre d'affichage : nom, dates, biographie, lien */ body.section-home li.panel_id_41 .records_list .content h2 { order: 1; font-size: 20px !important; line-height: 1.2 !important; margin-bottom: 10px !important; } body.section-home li.panel_id_41 .records_list .content .date { order: 2; margin-bottom: 22px !important; } body.section-home li.panel_id_41 .records_list .content .subtitle { order: 3; } body.section-home li.panel_id_41 .records_list .content .link { order: 4; margin-top: 22px !important; } /* --- photo de « Visit the gallery » reduite de 20% --- */ body.section-home li.panel_id_39 .image { flex: 0 0 512px !important; width: 512px !important; max-width: 512px !important; } /* --- pas de filet sous les sliders : la barre de defilement en fait deja office --- */ body.section-home .feature_panels_inner > ul > li.panel.panel_type_7 { border-bottom: 0 !important; } } /* --- pas de filet sous la derniere section, toutes largeurs --- */ body.section-home .feature_panels_inner > ul > li.panel.panel_id_39 { border-bottom: 0 !important; padding-bottom: 0 !important; margin-bottom: 10px !important; } /* =================================================================== ZONES CLIQUABLES + PIED DE PAGE - 01/09/2026 =================================================================== */ /* Accueil - bandeau forthcoming : seuls le titre et "Learn more" sont cliquables. Le plein cadre du slide (z-index 106) est reduit a la zone du "Learn more" (pseudo-element .content .inner::after, hauteur 31px, cale sur le padding lateral du theme : 30px < 1024, 40px < 1300, 80px au-dela). Le lien du titre (dans .content, z 102) redevient de ce fait cliquable ; le reste de l'image ne l'est plus. */ body.section-home #slideshow li > a { top: auto !important; right: auto !important; bottom: 60px !important; left: 30px !important; width: 130px !important; height: 31px !important; z-index: 107 !important; } @media (min-width: 1024px) { body.section-home #slideshow li > a { left: 40px !important; width: 150px !important; } } @media (min-width: 1300px) { body.section-home #slideshow li > a { left: 80px !important; width: 130px !important; } } /* Accueil - "Discover our gallery artists" (41) et "Visit the gallery" (39) : seuls l'image et "Learn more" sont cliquables. Le qui enveloppe toute la ligne passe en pointer-events:none, l'image et le span du "Learn more" repassent en auto (le span est mis en inline-block pour que la zone cliquable s'arrete au texte et ne coure pas sur toute la largeur). */ body.section-home li.panel_id_41 .records_list > ul > li > a, body.section-home li.panel_id_39 > a { pointer-events: none !important; } body.section-home li.panel_id_41 .records_list > ul > li > a > .image, body.section-home li.panel_id_39 > a > .image { pointer-events: auto !important; } body.section-home li.panel_id_41 .records_list .content .link, body.section-home li.panel_id_39 .content .link { pointer-events: none !important; } body.section-home li.panel_id_41 .records_list .content .link > span, body.section-home li.panel_id_39 .content .link > span { pointer-events: auto !important; display: inline-block !important; } /* Pied de page - suppression de la bande blanche sous le footer : le theme laisse un margin-bottom de 30px sous #footer, hors du fond gris (le box-shadow est clippe verticalement sur la boite). */ #footer.advanced_footer { margin-bottom: 0 !important; } /* Pied de page - iOS : les data detectors de Safari mobile enveloppent "Galerie Boquet" dans un vers Plans, ce qui faisait passer le titre en minuscules (la regle .advanced_footer_item a impose text-transform:none) et le rendait cliquable. On reimpose la casse et on neutralise le lien. */ #footer.advanced_footer .advanced_footer_item h4, #footer.advanced_footer .advanced_footer_item h4 a, #footer.advanced_footer .advanced_footer_item h4 span { font-family: "scotch-text", serif !important; font-size: 13.5px !important; font-weight: 400 !important; letter-spacing: normal !important; text-transform: uppercase !important; color: #111111 !important; text-decoration: none !important; } #footer.advanced_footer .advanced_footer_item h4 a { pointer-events: none !important; -webkit-touch-callout: none !important; } #footer.advanced_footer a[x-apple-data-detectors], #footer.advanced_footer a[x-apple-data-detectors] * { color: inherit !important; font-size: inherit !important; font-weight: inherit !important; text-transform: inherit !important; text-decoration: none !important; } /* ------------------------------------------------------------------- Accueil - panneau artistes (41) : noms en majuscules, date sous le nom 01/09/2026 (suite) Les regles d ordre etaient dans le bloc @media (min-width:1024px) ; en mobile l ordre du DOM reprenait la main et la date passait sous la bio. On sort donc flex + order de la media query. ------------------------------------------------------------------- */ body.section-home li.panel_id_41 .records_list .content { display: flex !important; flex-direction: column !important; } body.section-home li.panel_id_41 .records_list .content h2 { order: 1 !important; text-transform: uppercase !important; } body.section-home li.panel_id_41 .records_list .content .date { order: 2 !important; } body.section-home li.panel_id_41 .records_list .content .subtitle { order: 3 !important; } body.section-home li.panel_id_41 .records_list .content .link { order: 4 !important; } body.section-home li.panel_id_41 .records_list .content .date { font-family: "elza-text", sans-serif !important; font-size: 13px !important; font-weight: 300 !important; letter-spacing: normal !important; text-transform: none !important; margin: 6px 0 20px 0 !important; } /* En-tete - survol du menu : soulignement (01/09/2026) */ #header #top_nav ul.topnav > li > a:hover, #header #translations_nav a:hover { text-decoration: underline !important; text-underline-offset: 4px !important; text-decoration-thickness: 1px !important; } /* Survol : soulignement de tous les "Learn more" du site (01/09/2026) */ /* 1. cas general du theme : de la fiche > .content > span.link > span */ a:hover span.link, a:hover span.link > span, span.link > a:hover { text-decoration: underline !important; text-underline-offset: 4px !important; text-decoration-thickness: 1px !important; } /* 2. accueil, past exhibitions : le "Learn more" est un pseudo-element */ body.section-home li.panel_id_34 .records_list > ul > li > a:hover .content::after { text-decoration: underline !important; text-underline-offset: 4px !important; text-decoration-thickness: 1px !important; } /* 3. bandeau forthcoming : le reduit est un frere precedent de .content, le texte est porte par .content .inner::after */ body.section-home #slideshow li > a:hover ~ .content .inner::after { text-decoration: underline !important; text-underline-offset: 4px !important; text-decoration-thickness: 1px !important; } /* Liste des expositions - seuls l image, le titre et "Learn more" sont cliquables (01/09/2026). Le h2 passe en width:max-content pour que la zone cliquable s arrete au texte et ne coure pas sur toute la colonne. */ body.section-exhibitions .records_list > ul > li > a { pointer-events: none !important; } body.section-exhibitions .records_list > ul > li > a > .image { pointer-events: auto !important; } body.section-exhibitions .records_list > ul > li > a .content h2 { pointer-events: auto !important; width: max-content !important; max-width: 100% !important; } body.section-exhibitions .records_list > ul > li > a .content .link { pointer-events: none !important; } body.section-exhibitions .records_list > ul > li > a .content .link > span { pointer-events: auto !important; display: inline-block !important; } /* Accueil - panneau About : texte centre, en Scotch, sans titre de section (01/09/2026). Le texte du site est justifie par defaut, il faut donc forcer text-align sur .description ET sur ses

. */ body.section-home li.panel_id_38 .content > h2.fp_title { display: none !important; } body.section-home li.panel_id_38 .content { max-width: 820px !important; margin-left: auto !important; margin-right: auto !important; text-align: center !important; } body.section-home li.panel_id_38 .content .description, body.section-home li.panel_id_38 .content .description p, body.section-home li.panel_id_38 .content .link, body.section-home li.panel_id_38 .content .link a { text-align: center !important; } body.section-home li.panel_id_38 .content .description, body.section-home li.panel_id_38 .content .description p { font-family: "scotch-text", serif !important; font-size: 17px !important; line-height: 1.6 !important; } /* Accueil - Publications passe sous Visit the gallery (01/09/2026). Ordre final : 34 past exhibitions, 38 about, 41 artistes, 37 foires, 39 visit the gallery, 36 publications. */ body.section-home li.panel_id_37 { order: 4 !important; } body.section-home li.panel_id_39 { order: 5 !important; } body.section-home li.panel_id_36 { order: 6 !important; } /* 39 n est plus la derniere section : elle reprend son filet ; 36 devient la derniere et perd le sien. */ body.section-home .feature_panels_inner > ul > li.panel.panel_id_39 { border-bottom: 1px solid #e4e4e4 !important; padding-bottom: 45px !important; margin-bottom: 45px !important; } body.section-home .feature_panels_inner > ul > li.panel.panel_id_36 { border-bottom: 0 !important; padding-bottom: 0 !important; margin-bottom: 10px !important; } /* Tous les "Learn more" du site en Elza et non en Scotch (01/09/2026). Deux familles de cas : les vrais elements du theme (span.link et ses variantes read_more) et les pseudo-elements que nous avons ajoutes (accueil : past exhibitions, et bandeau forthcoming). */ span.link, span.link a, span.link > span, .read_more, .read_more_label { font-family: "elza-text", sans-serif !important; font-weight: 300 !important; } body.section-home li.panel_id_34 .records_list .content::after, body.section-home #slideshow li .content .inner::after { font-family: "elza-text", sans-serif !important; font-weight: 300 !important; } /* Accueil - espace entre le titre de section et le contenu du panneau : 30px -> 24px (-20%, 01/09/2026) */ body.section-home .feature_panels_inner > ul > li.panel .panel_header h2 { margin-bottom: 24px !important; } /* Accueil - panneau About : plus d air autour du texte en mobile (01/09/2026). Le texte occupait toute la gouttiere de 30px du theme. */ @media (max-width: 1023px) { body.section-home li.panel_id_38 .content { box-sizing: border-box !important; padding-left: 20px !important; padding-right: 20px !important; } body.section-home .feature_panels_inner > ul > li.panel.panel_id_38 { padding-top: 18px !important; padding-bottom: 50px !important; } } /* Accueil - air au-dessus du "Learn more" des fiches artistes et de Visit the gallery, a toutes les largeurs (01/09/2026). Le margin-top etait dans le bloc @media (min-width:1024px) : en mobile le lien se collait a la bio. */ body.section-home li.panel_id_41 .records_list .content .link, body.section-home li.panel_id_39 .content .link { margin-top: 22px !important; } /* Page contact - respiration entre les blocs (adresse / horaires / contact). Le theme met les

du contenu de page a margin 0 (01/09/2026). */ body.section-contact .contact_page_content .page_content h3 { margin-bottom: 22px !important; } body.section-contact .contact_page_content .page_content p { margin-bottom: 20px !important; } /* Accueil - le panneau Publications (36) est desactive : Visit the gallery redevient la derniere section et reperd son filet (01/09/2026). */ body.section-home .feature_panels_inner > ul > li.panel.panel_id_39 { border-bottom: 0 !important; padding-bottom: 0 !important; margin-bottom: 10px !important; } /* Accueil FR - le "Learn more" des fiches artistes (panneau 41) n est pas traduisible : les colonnes de la grille d un panneau n ont pas de bouton FR. On masque le texte et on le reecrit en pseudo-element (01/09/2026). */ body.language-fr li.panel_id_41 .records_list .content .link > span { font-size: 0 !important; } body.language-fr li.panel_id_41 .records_list .content .link > span::after { content: "En savoir plus"; font-size: 12.5px; font-family: "elza-text", sans-serif; font-weight: 300; text-transform: uppercase; letter-spacing: normal; } /* Accueil - les biographies ont ete retirees du panneau artistes (01/09) : l espace prevu pour elles entre la date et le lien est resserre. */ body.section-home li.panel_id_41 .records_list .content .link { margin-top: 6px !important; } /* ============================================================ POP-UP NEWSLETTER — carte compacte sur mobile et tablette Le thème pose min-height:100% sur #mailing_list_popup_box : c'est lui qui faisait un pop-up plein écran. min-height:0 est indispensable, sinon height:auto et max-height sont ignorés (min gagne toujours sur max). ============================================================ */ @media (max-width: 1023px) { body #mailing_list_popup_inner { display: flex !important; align-items: center !important; justify-content: center !important; min-height: 100% !important; padding: 20px !important; box-sizing: border-box !important; } body #mailing_list_popup_box { position: relative !important; top: auto !important; left: auto !important; right: auto !important; bottom: auto !important; width: 100% !important; max-width: 400px !important; height: auto !important; min-height: 0 !important; max-height: calc(100vh - 40px) !important; overflow-y: auto !important; margin: 0 auto !important; padding: 34px 22px 26px !important; box-sizing: border-box !important; } body #mailinglist_signup_close_popup_link { top: 10px !important; right: 12px !important; } } /* ============================================================ NEWS retiré de la navigation (03/09/2026) La section reste EN LIGNE : 42 entrées publiées et quatre redirections Wix (/journal/, /press/, /blog/, /en/journal/) pointent dessus. On masque seulement l'entrée de menu. La classe topnav-id-15 sert le menu desktop et le menu mobile. ============================================================ */ #header #top_nav ul.topnav > li.topnav-id-15, #header nav li.topnav-id-15, li.topnav-id-15 { display: none !important; }