/* CSS imports ------------------- */ /* Forced mobile nav on all sizes ------------------- */ @import url('/lib/g/2.0/styles/responsive_topnav.css') screen and (max-width: 1023px); @import url('/lib/g/themes/aperture/2.0/styles/responsive_topnav.css') screen and (max-width: 1023px); /* Font imports ------------------- */ @import url(https://fonts.googleapis.com/css?family=Montserrat:300,600); /* Background colour --------------*/ #header.header_transparent .dropdown-mask { background-color: transparent !important; } /* Feature popup colours ------------------- */ /* Fonts----------------------------- */ /* Main body font ------------------- */ body, input, select, textarea { font-family: 'Montserrat', Sans-Serif; } /* 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: 'Montserrat', Sans-Serif; } /* Navigation font ------------------- */ #top_nav.navigation ul li a, #top_nav #full_nav .dropdown-btn { font-family: 'Montserrat', Sans-Serif; } /* User custom html-font sizing ------------------- */ html { font-size: 10.0px; } /* Title - Heading spacing and transform ------------------- */ /* Dynamically adjust font sizes so that headings and titles look larger (as lowercase appears smaller than uppercase) while the body size remains the same -------------------------- */ html { font-size: 14.5px; } body { font-size: 1.0rem; line-height: 2.48rem; } h1, h2, h3, h4, h5, h6, #hero_header .title, .fullscreen_slideshow .hero_splash_text, #logo a, .navigation ul li a, #slide_nav_reveal, #header_quick_search .inputField, #header_quick_search input, #header_quick_search select, #header_quick_search textarea, #header_quick_search #header_quicksearch_btn, #footer #artlogic, #footer #copyright, #footer #copyright .copyright-text, #footer .small-links-container, .page-artists h1 #artist_years, .page-artists h1 .artist_years, .event-details-wrapper .event-details span, .subsection-press .records_list .content .link a, .section-press .records_list .content .link a, #store_cart_widget, .fullscreen_slideshow .hero_splash_text, .fullscreen_slideshow .hero_splash_text .title, .fullscreen_slideshow ul li .content h2, .fullscreen_slideshow ul li .content h2 a, .fullscreen_slideshow ul li .content h2 a:visited, .fullscreen_slideshow ul li .content h2 a .separator, .fullscreen_slideshow ul li .content h2 a .h1_subtitle, #image_gallery #content_module h3, .records_list .content h2, .records_list .content .subtitle, .records_list .content .date, .records_list .content .location , .records_list ul li .content .title, .records_list ul li .content .artist, .feature_panels .panel_image_text_adjacent .content h2, .feature_list ul li .content h2, .feature_list ul li .content .subtitle, .feature_list ul li .content .date, .feature_list ul li .content .location, .full_list ul li .content h2, .full_list ul li .content .subtitle, .full_list ul li .content .date, .records_list.detail_expand_grid .expander_detail #image_gallery #content_module .subtitle, .link, .button, .simple_list ul li, #social_links_list ul li, .page_stats .ps_item, .page_stats .ps_pages, #protected_path_login #container h1, #protected_path_login #container label, .subheading, .poster, .subtitle, .h1_subtitle, .location , .date, .price, #fancybox-title-main .artist strong, #mc_embed_signup input.button, #home_splash .content, #hero_header .subtitle, .feature_panels .panel_hero .hero_heading .subtitle, #hero_header .inner, .feature_panels .panel_hero .hero_heading > h2, .feature_panels .panel_hero .hero_heading > a > h2, #cover_page_slideshow_pager, #artists-browser, .artists-browser , .exhibition-header .h1_subtitle, #top_nav #full_nav .has_dropdown_items .dropdown-btn, #top_nav #full_nav .has_dropdown_items_mobile .dropdown-btn{ text-transform: none; } /* Text colours----------------------------- */ /* Heading and emphasis text colour ------------------- */ /* Colour 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:25.0% }} .records_list.feature_list.grid_dynamic_layout_artfairs:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_artfairs:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_artfairs ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_artfairs ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_artfairs ul li .image::after {display:none;} .records_list.grid_dynamic_layout_artfairs ul li .image > span {position: static;} /* 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%; } @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_instagram > ul { margin-right: -50px; } .records_list.grid_dynamic_layout_instagram > ul > li { padding-right: 50px; } } /* 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 {display:none;} .records_list.grid_dynamic_layout_artworks ul li .image > span {position: static;} @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_artworks > ul { margin-right: -50px; } .records_list.grid_dynamic_layout_artworks > ul > li { padding-right: 50px; } } /* default image grid - flow_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.flow_list.grid_dynamic_layout_default_image_grid:not(.feature_list) ul li { width:25.0% }} @media screen and (min-width:1023px) { #content .records_list.grid_dynamic_layout_default_image_grid .flow_list_formatted ul li { margin-right: 50px; } } /* 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.feature_list.grid_dynamic_layout_default_grid:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_default_grid:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_default_grid ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_default_grid ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_default_grid ul li .image::after {display:none;} .records_list.grid_dynamic_layout_default_grid ul li .image > span {position: static;} /* artists - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_artists:not(.feature_list) > ul > li { width:25.0% }} .records_list.feature_list.grid_dynamic_layout_artists:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_artists:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_artists ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_artists ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_artists ul li .image::after {display:none;} .records_list.grid_dynamic_layout_artists ul li .image > span {position: static;} /* video featured - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_video_featured:not(.feature_list) > ul > li { width:50.0% }} .records_list.feature_list.grid_dynamic_layout_video_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_video_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_video_featured ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_video_featured ul li .image > span { -webkit-justify-content:flex-end; justify-content: flex-end; -webkit-align-items:flex-start; -ms-flex-align: flex-start; align-items: flex-start; } .records_list.grid_dynamic_layout_video_featured ul li .image::after {display:none;} .records_list.grid_dynamic_layout_video_featured ul li .image > span {position: static;} /* artist works categories - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_artist_works_categories:not(.feature_list) > ul > li { width:33.33% }} .records_list.feature_list.grid_dynamic_layout_artist_works_categories:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_artist_works_categories:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_artist_works_categories ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_artist_works_categories ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_artist_works_categories ul li .image::after {display:none;} .records_list.grid_dynamic_layout_artist_works_categories ul li .image > span {position: static;} /* exhibitions - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_exhibitions:not(.feature_list) > ul > li { width:20.0% }} .records_list.feature_list.grid_dynamic_layout_exhibitions:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_exhibitions:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_exhibitions ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_exhibitions 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 ul li .image::after {display:none;} .records_list.grid_dynamic_layout_exhibitions ul li .image > span {position: static;} /* 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.feature_list.grid_dynamic_layout_events:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_events:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_events ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_events ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_events ul li .image::after {display:none;} .records_list.grid_dynamic_layout_events ul li .image > span {position: static;} /* exhibitions installation - flow_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.flow_list.grid_dynamic_layout_exhibitions_installation:not(.feature_list) ul li { width:25.0% }} @media screen and (min-width:1023px) { #content .records_list.grid_dynamic_layout_exhibitions_installation .flow_list_formatted ul li { margin-right: 50px; } } /* artist installation - flow_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.flow_list.grid_dynamic_layout_artist_installation:not(.feature_list) ul li { width:25.0% }} @media screen and (min-width:1023px) { #content .records_list.grid_dynamic_layout_artist_installation .flow_list_formatted ul li { margin-right: 50px; } } /* blog - reading_list-------------------------------------- */ .records_list.feature_list.grid_dynamic_layout_blog:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_blog:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_blog ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_blog 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_blog ul li .image::after { padding-top:150.0%; } /* store featured - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_store_featured:not(.feature_list) > ul > li { width:50.0% }} .records_list.feature_list.grid_dynamic_layout_store_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_store_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_store_featured ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_store_featured ul li .image > span { -webkit-justify-content:flex-end; justify-content: flex-end; -webkit-align-items:flex-start; -ms-flex-align: flex-start; align-items: flex-start; } .records_list.grid_dynamic_layout_store_featured ul li .image::after {display:none;} .records_list.grid_dynamic_layout_store_featured ul li .image > span {position: static;} /* events featured - feature_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.feature_list.grid_dynamic_layout_events_featured ul { width:100%;}} .records_list.feature_list.grid_dynamic_layout_events_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_events_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_events_featured ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_events_featured ul li .image > span { -webkit-justify-content:flex-end; justify-content: flex-end; -webkit-align-items:flex-start; -ms-flex-align: flex-start; align-items: flex-start; } .records_list.grid_dynamic_layout_events_featured ul li .image::after {display:none;} .records_list.grid_dynamic_layout_events_featured ul li .image > span {position: static;} /* artwork categories landing - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_artwork_categories_landing:not(.feature_list) > ul > li { width:33.33% }} .records_list.feature_list.grid_dynamic_layout_artwork_categories_landing:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_artwork_categories_landing:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_artwork_categories_landing ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_artwork_categories_landing ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_artwork_categories_landing ul li .image::after {display:none;} .records_list.grid_dynamic_layout_artwork_categories_landing ul li .image > span {position: static;} /* events - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_events:not(.feature_list) > ul > li { width:25.0% }} .records_list.feature_list.grid_dynamic_layout_events:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_events:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_events ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_events ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_events ul li .image::after {display:none;} .records_list.grid_dynamic_layout_events ul li .image > span {position: static;} /* store - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_store:not(.feature_list) > ul > li { width:33.33% }} .records_list.feature_list.grid_dynamic_layout_store:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_store:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_store ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_store ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_store ul li .image::after {display:none;} .records_list.grid_dynamic_layout_store ul li .image > span {position: static;} /* default feature grid - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_default_feature_grid:not(.feature_list) > ul > li { width:50.0% }} .records_list.feature_list.grid_dynamic_layout_default_feature_grid:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_default_feature_grid:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_default_feature_grid ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_default_feature_grid ul li .image > span { -webkit-justify-content:flex-end; justify-content: flex-end; -webkit-align-items:flex-start; -ms-flex-align: flex-start; align-items: flex-start; } .records_list.grid_dynamic_layout_default_feature_grid ul li .image::after {display:none;} .records_list.grid_dynamic_layout_default_feature_grid ul li .image > span {position: static;} /* 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.feature_list.grid_dynamic_layout_feature_panels:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_feature_panels:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_feature_panels ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_feature_panels ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_feature_panels ul li .image::after {display:none;} .records_list.grid_dynamic_layout_feature_panels ul li .image > span {position: static;} /* exhibitions works - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_exhibitions_works:not(.feature_list) > ul > li { width:25.0% }} .records_list.feature_list.grid_dynamic_layout_exhibitions_works:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_exhibitions_works:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_exhibitions_works ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_exhibitions_works ul li .image > span { -webkit-justify-content: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 {display:none;} .records_list.grid_dynamic_layout_exhibitions_works ul li .image > span {position: static;} @media screen and (min-width:1023px) { .records_list.grid_dynamic_layout_exhibitions_works > ul { margin-right: -50px; } .records_list.grid_dynamic_layout_exhibitions_works > ul > li { padding-right: 50px; } } /* publications featured - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_publications_featured:not(.feature_list) > ul > li { width:50.0% }} .records_list.feature_list.grid_dynamic_layout_publications_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_publications_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_publications_featured ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_publications_featured ul li .image > span { -webkit-justify-content:flex-end; justify-content: flex-end; -webkit-align-items:flex-start; -ms-flex-align: flex-start; align-items: flex-start; } .records_list.grid_dynamic_layout_publications_featured ul li .image::after {display:none;} .records_list.grid_dynamic_layout_publications_featured ul li .image > span {position: static;} /* press featured - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_press_featured:not(.feature_list) > ul > li { width:50.0% }} .records_list.feature_list.grid_dynamic_layout_press_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_press_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_press_featured ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_press_featured ul li .image > span { -webkit-justify-content:flex-end; justify-content: flex-end; -webkit-align-items:flex-start; -ms-flex-align: flex-start; align-items: flex-start; } .records_list.grid_dynamic_layout_press_featured ul li .image::after {display:none;} .records_list.grid_dynamic_layout_press_featured ul li .image > span {position: static;} /* news featured - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_news_featured:not(.feature_list) > ul > li { width:50.0% }} .records_list.feature_list.grid_dynamic_layout_news_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_news_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_news_featured ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_news_featured ul li .image > span { -webkit-justify-content:flex-end; justify-content: flex-end; -webkit-align-items:flex-start; -ms-flex-align: flex-start; align-items: flex-start; } .records_list.grid_dynamic_layout_news_featured ul li .image::after {display:none;} .records_list.grid_dynamic_layout_news_featured ul li .image > span {position: static;} /* artfairs featured - feature_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.feature_list.grid_dynamic_layout_artfairs_featured ul { width:100%;}} .records_list.feature_list.grid_dynamic_layout_artfairs_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_artfairs_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_artfairs_featured ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_artfairs_featured ul li .image > span { -webkit-justify-content:flex-end; justify-content: flex-end; -webkit-align-items:flex-start; -ms-flex-align: flex-start; align-items: flex-start; } .records_list.grid_dynamic_layout_artfairs_featured ul li .image::after {display:none;} .records_list.grid_dynamic_layout_artfairs_featured ul li .image > span {position: static;} /* exhibitions featured - feature_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.feature_list.grid_dynamic_layout_exhibitions_featured ul { width:100%;}} .records_list.feature_list.grid_dynamic_layout_exhibitions_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_exhibitions_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_exhibitions_featured ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_exhibitions_featured ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:flex-start; -ms-flex-align: flex-start; align-items: flex-start; } .records_list.grid_dynamic_layout_exhibitions_featured ul li .image::after { padding-top:66.6666666667%; } /* press - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_press:not(.feature_list) > ul > li { width:25.0% }} .records_list.feature_list.grid_dynamic_layout_press:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_press:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_press ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_press ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_press ul li .image::after {display:none;} .records_list.grid_dynamic_layout_press ul li .image > span {position: static;} /* news - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_news:not(.feature_list) > ul > li { width:25.0% }} .records_list.feature_list.grid_dynamic_layout_news:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_news:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_news ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_news 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_news ul li .image::after {display:none;} .records_list.grid_dynamic_layout_news ul li .image > span {position: static;} /* viewing rooms featured forthcoming - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_viewing_rooms_featured_forthcoming:not(.feature_list) > ul > li { width:100.0% }} .records_list.feature_list.grid_dynamic_layout_viewing_rooms_featured_forthcoming:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_viewing_rooms_featured_forthcoming:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_viewing_rooms_featured_forthcoming ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_viewing_rooms_featured_forthcoming ul li .image > span { -webkit-justify-content:flex-end; justify-content: flex-end; -webkit-align-items:flex-start; -ms-flex-align: flex-start; align-items: flex-start; } .records_list.grid_dynamic_layout_viewing_rooms_featured_forthcoming ul li .image::after {display:none;} .records_list.grid_dynamic_layout_viewing_rooms_featured_forthcoming ul li .image > span {position: static;} /* 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.feature_list.grid_dynamic_layout_search:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_search:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_search ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_search ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_search ul li .image::after {display:none;} .records_list.grid_dynamic_layout_search ul li .image > span {position: static;} /* viewing rooms featured - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_viewing_rooms_featured:not(.feature_list) > ul > li { width:100.0% }} .records_list.feature_list.grid_dynamic_layout_viewing_rooms_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_viewing_rooms_featured:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_viewing_rooms_featured ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_viewing_rooms_featured ul li .image > span { -webkit-justify-content:flex-end; justify-content: flex-end; -webkit-align-items:flex-start; -ms-flex-align: flex-start; align-items: flex-start; } .records_list.grid_dynamic_layout_viewing_rooms_featured ul li .image::after {display:none;} .records_list.grid_dynamic_layout_viewing_rooms_featured ul li .image > span {position: static;} /* viewing rooms works - flow_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.flow_list.grid_dynamic_layout_viewing_rooms_works:not(.feature_list) ul li { width:25.0% }} @media screen and (min-width:1023px) { #content .records_list.grid_dynamic_layout_viewing_rooms_works .flow_list_formatted ul li { margin-right: 50px; } } /* artist works - flow_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.flow_list.grid_dynamic_layout_artist_works:not(.feature_list) ul li { width:25.0% }} @media screen and (min-width:1023px) { #content .records_list.grid_dynamic_layout_artist_works .flow_list_formatted ul li { margin-right: 50px; } } /* 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.feature_list.grid_dynamic_layout_exhibitors:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_exhibitors:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_exhibitors ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_exhibitors ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_exhibitors ul li .image::after {display:none;} .records_list.grid_dynamic_layout_exhibitors ul li .image > span {position: static;} /* feature panels image grid - flow_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.flow_list.grid_dynamic_layout_feature_panels_image_grid:not(.feature_list) ul li { width:25.0% }} @media screen and (min-width:1023px) { #content .records_list.grid_dynamic_layout_feature_panels_image_grid .flow_list_formatted ul li { margin-right: 50px; } } /* publications - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_publications:not(.feature_list) > ul > li { width:25.0% }} .records_list.feature_list.grid_dynamic_layout_publications:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_publications:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_publications ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_publications ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_publications ul li .image::after {display:none;} .records_list.grid_dynamic_layout_publications ul li .image > span {position: static;} /* team - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_team:not(.feature_list) > ul > li { width:25.0% }} .records_list.feature_list.grid_dynamic_layout_team:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_team:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_team ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_team ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_team ul li .image::after {display:none;} .records_list.grid_dynamic_layout_team ul li .image > span {position: static;} /* viewing rooms - image_list-------------------------------------- */ @media screen and (min-width:1023px) {.records_list.grid_dynamic_layout_viewing_rooms:not(.feature_list) > ul > li { width:25.0% }} .records_list.feature_list.grid_dynamic_layout_viewing_rooms:not(.grid_dynamic_layout_exhibitions_featured) ul li .image::after { display:none; } .records_list.feature_list.grid_dynamic_layout_viewing_rooms:not(.grid_dynamic_layout_exhibitions_featured) ul li .image > span { display:block; position: static } .records_list.grid_dynamic_layout_viewing_rooms ul li .image > span.objectfit-fallback-bg { background-size:contain; } .records_list.grid_dynamic_layout_viewing_rooms ul li .image > span { -webkit-justify-content:center; justify-content: center; -webkit-align-items:center; -ms-flex-align: center; align-items: center; } .records_list.grid_dynamic_layout_viewing_rooms ul li .image::after {display:none;} .records_list.grid_dynamic_layout_viewing_rooms ul li .image > span {position: static;} /* Dynamically created artist list css ------------------- */ .subsection-artist-list-preview-letters .artists_list_dynamic_columns ul { width: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 text color ------------------- */ #logo { background: none; width: 100%; min-width: 180px; max-width: 180px; } #header #logo.user-custom-logo-image::before { padding-top:16.6231505657%; } .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-artlogicwebsite1183/usr/images/preferences/logo-filippo.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-artlogicwebsite1183/usr/images/preferences/logo-filippo.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-artlogicwebsite1183/usr/images/preferences/logo-filippo.png', sizingMethod='scale')"; } #logo a { text-indent: -9999px; padding: 0; } /* Topnav text color ------------------- */ #top_nav.navigation ul li.active a, #top_nav.navigation ul li.active a:visited, #header #store_cart_widget:hover::before, #header #store_cart_widget:hover::after, #top_nav.navigation ul li:hover a, #translations_nav.navigation ul li.active a, #translations_nav.navigation ul li:hover a, #top_nav #full_nav .dropdown-btn:hover { color: #000000; } /* Subnav text color ------------------- */ /* Responsive nav text color ------------------- */ /* Responsive nav active / hover text color ------------------- */ /* Button text color ------------------- */ /* Hero section image opacity ------------------- */ #mirror-slideshow.hero-parallax-element-mirror ul li .image, #mirror-slideshow.hero-parallax-element-mirror ul li .video_container .video_inner, #hero_header #slideshow ul li .image, #hero_header #hero_image_responsive, .parallax-mirror img.parallax-slider { opacity: 0.8 !important; } .parallax-mirror:not(#parallax-hero_header) img.parallax-slider { opacity: 0.8 !important; } /* don't show if opacity = 1 */ /* Hero section image height ------------------- */ ::root { --hero-height: 0vh } /* Home page slideshow / fullscreen video ui buttons ------------------- */ .section-home .slideshow-pagination-controls .slideshow-control, .section-home #slideshow .video_pause_button:after { transform: scale(1) !important; border: none !important; background-color: #FFFFFF !important; } .section-home .slideshow-pagination-controls .btn-prev:after, .section-home .slideshow-pagination-controls .btn-next:after, .section-home #slideshow .video_pause_button .pause_symbol { color: #000000 !important; border-color: #000000 !important; /* Needed for V1 template sites as the arrows are done in css rather than using an artlogic social icon */ } .section-home #slideshow .video_pause_button .pause_symbol.paused { border-color: transparent transparent transparent #000000 !important; } /* Hero header slideshow ui buttons ------------------- */ #hero_header .slideshow-pagination-controls .slideshow-control { transform: scale(1) !important; border: none !important; background-color: #FFFFFF !important; } #hero_header .slideshow-pagination-controls .btn-prev:after, #hero_header .slideshow-pagination-controls .btn-next:after { color: #000000 !important; border-color: #000000 !important; /* Needed for V1 template sites as the arrows are done in css rather than using an artlogic social icon */ } /* 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-artlogicwebsite1183/usr/images/preferences/logo-filippo.png'); } } /* Artlogic preferences custom CSS - entered by Artlogic in the preferences screen ------------------- */ /* Client custom user CSS - entered by the client in the preferences screen ------------------- */ /* ========================================== 1. HERO FULLSCREEN - HOMEPAGE ========================================== */ /* Caricamento Font Montserrat */ @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap'); /* Contenitore Full Screen */ .hero-container-fullscreen { position: relative !important; width: 100vw !important; min-height: 100vh !important; left: 50% !important; right: 50% !important; margin-left: -50vw !important; margin-right: -50vw !important; margin-top: -20px !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; text-align: center !important; background-image: linear-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15)), url('https://website-artlogicwebsite1183.artlogic.net/usr/library/images/main/09_filippo_tincolini_laura_veschi_hcg_gallery_installazione_polo_museale_arca_wonderland_home.jpg') !important; background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important; box-sizing: border-box !important; padding: 40px 20px !important; font-family: 'Montserrat', sans-serif !important; } /* Tipografia Hero */ .hero-subtitle-custom { font-family: 'Montserrat', sans-serif !important; font-size: 0.85rem !important; font-weight: 500 !important; letter-spacing: 4px !important; text-transform: uppercase !important; color: #e0e0e0 !important; margin: 0 0 1.5rem 0 !important; padding: 0 !important; line-height: 1.4 !important; } .hero-title-custom { font-family: 'Montserrat', sans-serif !important; font-size: 3.5rem !important; font-weight: 400 !important; letter-spacing: -1px !important; color: #ffffff !important; margin: 0 0 2.5rem 0 !important; padding: 0 !important; line-height: 1.1 !important; display: block !important; } /* Layout Pulsanti Hero (fullscreen homepage) */ .hero-buttons-wrapper { display: flex !important; flex-direction: row !important; justify-content: center !important; align-items: center !important; gap: 15px !important; flex-wrap: wrap !important; width: 100% !important; margin-top: 10px !important; } /* Stile Base Pulsanti (fullscreen homepage) */ .hero-btn { display: inline-block !important; min-width: 220px !important; text-align: center !important; padding: 10px 20px !important; font-family: 'Montserrat', sans-serif !important; font-size: 0.75rem !important; font-weight: 600 !important; letter-spacing: 2px !important; text-decoration: none !important; text-transform: uppercase !important; box-sizing: border-box !important; cursor: pointer !important; transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important; } .hero-btn-primary, .hero-btn-secondary { background-color: #ffffff !important; color: #111111 !important; border: 1px solid #f2efe9 !important; } .hero-btn-primary:hover, .hero-btn-secondary:hover { background-color: #ffffff !important; border-color: #ffffff !important; color: #000000 !important; transform: translateY(-2px) !important; box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3) !important; } /* Logo Hero */ .hero-logo-custom { max-width: 400px !important; width: 80% !important; height: auto !important; margin-bottom: 1.8rem !important; display: block !important; } /* ========================================== 2. FEATURE PANEL 2 - STATEMENT SECTION ========================================== */ .statement-panel-container { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; text-align: center !important; padding: 80px 20px !important; background-color: #ffffff !important; box-sizing: border-box !important; width: 100% !important; } .statement-text { font-family: 'Montserrat', sans-serif !important; font-size: 1.15rem !important; font-weight: 400 !important; line-height: 1.7 !important; color: #555555 !important; max-width: 780px !important; margin: 0 0 2.5rem 0 !important; padding: 0 !important; } .statement-link { font-family: 'Montserrat', sans-serif !important; font-size: 0.75rem !important; font-weight: 600 !important; letter-spacing: 2px !important; text-transform: uppercase !important; color: #000000 !important; text-decoration: none !important; display: inline-flex !important; align-items: center !important; gap: 8px !important; transition: all 0.3s ease !important; border-bottom: 1px solid transparent !important; padding-bottom: 2px !important; } .statement-link:hover { color: #000000 !important; border-bottom-color: #111111 !important; } .statement-link .arrow { transition: transform 0.3s ease !important; display: inline-block !important; } .statement-link:hover .arrow { transform: translateX(5px) !important; } /* ========================================== FEATURE PANEL: MASONRY, VERTICALI GRANDI ========================================== */ .selected-works-panel { background-color: #ffffff !important; padding: 60px 20px 80px 20px !important; width: 100% !important; box-sizing: border-box !important; font-family: 'Montserrat', sans-serif !important; } .works-container { max-width: 1350px !important; width: 100% !important; margin: 0 auto !important; } .works-header { display: flex !important; justify-content: space-between !important; align-items: flex-end !important; margin-bottom: 30px !important; width: 100% !important; } .works-kicker { font-family: 'Montserrat', sans-serif !important; font-size: 0.65rem !important; letter-spacing: 2.5px !important; color: #777777 !important; text-transform: uppercase !important; display: block !important; margin-bottom: 8px !important; font-weight: 500 !important; } .works-title { font-family: 'Montserrat', sans-serif !important; font-size: clamp(2rem, 3.2vw, 2.8rem) !important; font-weight: 400 !important; letter-spacing: -0.5px !important; color: #111111 !important; margin: 0 !important; line-height: 1.1 !important; } .works-view-all { font-family: 'Montserrat', sans-serif !important; font-size: 0.7rem !important; font-weight: 600 !important; letter-spacing: 2px !important; text-transform: uppercase !important; color: #111111 !important; text-decoration: none !important; transition: opacity 0.2s ease, transform 0.2s ease !important; display: inline-block !important; padding-bottom: 5px !important; } .works-view-all:hover { opacity: 0.6 !important; transform: translateX(3px) !important; } .works-asymmetric-grid { display: flex !important; flex-wrap: wrap !important; width: 100% !important; gap: 24px !important; } .work-item { position: relative !important; overflow: hidden !important; min-width: 0 !important; } .work-item a { display: block !important; width: 100% !important; height: 100% !important; } .work-item img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1) !important; } .work-item:hover img { transform: scale(1.03) !important; } .item-1 { flex: 0 1 36% !important; aspect-ratio: 1080 / 1440 !important; } .item-2 { flex: 1 1 62% !important; aspect-ratio: 1440 / 1080 !important; } .item-3 { flex: 1 1 62% !important; aspect-ratio: 1440 / 1080 !important; } .item-4 { flex: 0 1 36% !important; aspect-ratio: 1080 / 1440 !important; } @media (max-width: 768px) { .works-asymmetric-grid { flex-direction: column !important; } .item-1, .item-2, .item-3, .item-4 { flex: 1 1 100% !important; } } /* ========================================== 3. WONDERLAND HERO — sfondo nero, testo bianco (classi bottone isolate con prefisso wl- per non entrare in conflitto con .hero-btn dell'hero fullscreen) ========================================== */ .wonderland-hero { position: relative !important; width: 100vw !important; left: 50% !important; right: 50% !important; margin-left: -50vw !important; margin-right: -50vw !important; padding: 100px 60px !important; box-sizing: border-box !important; font-family: 'Montserrat', sans-serif !important; background-image: linear-gradient(rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.8)), url('https://website-artlogicwebsite1183.artlogic.net/usr/exhibitions/images/exhibitions/30/17_filippo_tincolini_laura_veschi_hcg_gallery_installazione_polo_museale_arca_wonderland_teramo_ph_laura_veschi_dsf0025.jpg') !important; background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important; } .hero-container { max-width: 1000px !important; margin: 0 auto !important; display: flex !important; align-items: center !important; gap: 60px !important; } .hero-content { flex: 1 1 50% !important; max-width: 600px !important; color: #f5f0e8 !important; } .hero-image { flex: 1 1 50% !important; overflow: hidden !important; } .hero-kicker { display: block !important; font-family: 'Montserrat', sans-serif !important; font-size: 0.7rem !important; letter-spacing: 3px !important; text-transform: uppercase !important; color: #b8a98a !important; margin-bottom: 18px !important; font-weight: 500 !important; } .hero-title { font-family: 'Montserrat', sans-serif !important; font-size: clamp(3rem, 5vw, 5rem) !important; font-weight: 300 !important; color: #ffffff !important; margin: 0 0 20px 0 !important; line-height: 1 !important; letter-spacing: -1px !important; } .hero-artists { font-family: 'Montserrat', sans-serif !important; font-size: 1.2rem !important; color: #ffffff !important; margin: 0 0 8px 0 !important; font-weight: 400 !important; } .hero-meta { font-family: 'Montserrat', sans-serif !important; font-size: 0.85rem !important; color: #999999 !important; margin: 0 0 28px 0 !important; } .hero-description { font-family: 'Montserrat', sans-serif !important; font-size: 0.95rem !important; line-height: 1.7 !important; color: #cccccc !important; max-width: 460px !important; margin: 0 0 36px 0 !important; font-weight: 400 !important; } .wl-buttons { display: flex !important; flex-wrap: nowrap !important; gap: 15px !important; justify-content: flex-start !important; } .wl-btn { display: inline-block !important; flex: 0 0 auto !important; min-width: 0 !important; white-space: nowrap !important; text-align: center !important; padding: 16px 22px !important; font-family: 'Montserrat', sans-serif !important; font-size: 0.75rem !important; font-weight: 600 !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; text-decoration: none !important; box-sizing: border-box !important; background-color: #ffffff !important; color: #0a0a0a !important; border: 1px solid #f5f0e8 !important; transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important; } .wl-btn:hover { background-color: #ffffff !important; border-color: #ffffff !important; color: #000000 !important; transform: translateY(-2px) !important; box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3) !important; } /* Mobile/Tablet: stack verticale, tutto centrato */ @media (max-width: 960px) { .wonderland-hero { padding: 60px 24px !important; } .hero-container { flex-direction: column !important; } .hero-content { text-align: center !important; max-width: 100% !important; } .hero-description { max-width: 100% !important; margin-left: auto !important; margin-right: auto !important; } .wl-buttons { flex-direction: column !important; align-items: center !important; width: 100% !important; } .wl-btn { width: 100% !important; max-width: 320px !important; } .hero-image { flex-basis: 100% !important; width: 100% !important; } .hero-image img { width: 100% !important; } } /* ========================================== 4. STUDIO HERO — specchiato: immagine SX, testo DX ========================================== */ .studio-hero { position: relative !important; width: 100vw !important; left: 50% !important; right: 50% !important; margin-left: -50vw !important; margin-right: -50vw !important; background-color: #ffffff !important; padding: 100px 60px !important; box-sizing: border-box !important; font-family: 'Montserrat', sans-serif !important; } .studio-container { max-width: 1000px !important; margin: 0 auto !important; display: flex !important; flex-direction: row-reverse !important; /* <-- specchia: immagine a sinistra, testo a destra */ align-items: center !important; gap: 60px !important; } .studio-content { flex: 1 1 50% !important; max-width: 600px !important; color: #f5f0e8 !important; } .studio-image { flex: 1 1 50% !important; overflow: hidden !important; } .studio-image img { width: 100% !important; height: auto !important; display: block !important; object-fit: cover !important; } .studio-kicker { display: block !important; font-family: 'Montserrat', sans-serif !important; font-size: 0.7rem !important; letter-spacing: 3px !important; text-transform: uppercase !important; color: #b8a98a !important; margin-bottom: 18px !important; font-weight: 500 !important; } .studio-title { font-family: 'Montserrat', sans-serif !important; font-size: clamp(2.4rem, 4vw, 3.8rem) !important; font-weight: 300 !important; color: #111111 !important; margin: 0 0 24px 0 !important; line-height: 1.1 !important; letter-spacing: -1px !important; } .studio-description { font-family: 'Montserrat', sans-serif !important; font-size: 0.95rem !important; line-height: 1.7 !important; color: #808080 !important; max-width: 460px !important; margin: 0 0 36px 0 !important; font-weight: 400 !important; } .st-buttons { display: flex !important; flex-wrap: nowrap !important; gap: 15px !important; justify-content: flex-start !important; } .st-btn { display: inline-block !important; flex: 0 0 auto !important; min-width: 0 !important; white-space: nowrap !important; text-align: center !important; padding: 16px 22px !important; font-family: 'Montserrat', sans-serif !important; font-size: 0.75rem !important; font-weight: 600 !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; text-decoration: none !important; box-sizing: border-box !important; background-color: #d5d5d5 !important; color: #0a0a0a !important; border: 1px solid #f5f0e8 !important; transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important; } .st-btn:hover { background-color: #ffffff !important; border-color: #ffffff !important; color: #000000 !important; transform: translateY(-2px) !important; box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3) !important; } /* Mobile/Tablet: stack verticale, immagine sopra, testo sotto, tutto centrato */ @media (max-width: 960px) { .studio-hero { padding: 60px 24px !important; } .studio-container { flex-direction: column !important; } .studio-content { text-align: center !important; max-width: 100% !important; } .studio-description { max-width: 100% !important; margin-left: auto !important; margin-right: auto !important; } .st-buttons { flex-direction: column !important; align-items: center !important; width: 100% !important; } .st-btn { width: 100% !important; max-width: 320px !important; } .studio-image { flex-basis: 100% !important; width: 100% !important; } } /* ========================================== 5. PROJECTS PANEL — 3 card, sfondo bianco ========================================== */ .projects-panel { background-color: #ffffff !important; width: 100% !important; padding: 90px 60px !important; box-sizing: border-box !important; font-family: 'Montserrat', sans-serif !important; } .projects-container { max-width: 1400px !important; margin: 0 auto !important; } .projects-header { margin-bottom: 40px !important; } .projects-kicker { display: block !important; font-family: 'Montserrat', sans-serif !important; font-size: 0.7rem !important; letter-spacing: 3px !important; text-transform: uppercase !important; color: #888888 !important; margin-bottom: 14px !important; font-weight: 500 !important; } .projects-title { font-family: 'Montserrat', sans-serif !important; font-size: clamp(2.2rem, 3.5vw, 3.2rem) !important; font-weight: 300 !important; letter-spacing: -1px !important; color: #111111 !important; margin: 0 !important; line-height: 1.1 !important; } /* Griglia 3 colonne */ .projects-grid { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 10px !important; background-color: transparent !important; align-items: stretch !important; } /* Card: occupa tutta l'altezza di riga, niente sottolineato ereditato */ .project-card, .project-card * { text-decoration: none !important; } .project-card { display: flex !important; flex-direction: column !important; height: 100% !important; background-color: #ffffff !important; } .project-image { width: 100% !important; aspect-ratio: 4 / 3 !important; overflow: hidden !important; margin-bottom: 20px !important; } .project-image img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1) !important; } .project-card:hover .project-image img { transform: scale(1.03) !important; } .project-info { flex: 1 1 auto !important; padding: 0 !important; background-color: #ffffff !important; } .project-label { display: block !important; font-family: 'Montserrat', sans-serif !important; font-size: 0.75rem !important; color: #999999 !important; margin: 0 0 6px 0 !important; font-weight: 400 !important; } .project-title { font-family: 'Montserrat', sans-serif !important; font-size: 1.25rem !important; font-weight: 500 !important; color: #111111 !important; margin: 0 0 6px 0 !important; line-height: 1.25 !important; } .project-meta { font-family: 'Montserrat', sans-serif !important; font-size: 0.8rem !important; color: #888888 !important; margin: 0 0 10px 0 !important; } /* Sottolineato SOLO sul titolo, SOLO in hover */ .project-card:hover .project-title { text-decoration: underline !important; text-underline-offset: 4px !important; } /* CTA "View project" */ .project-view { display: inline-flex !important; align-items: center !important; gap: 6px !important; font-family: 'Montserrat', sans-serif !important; font-size: 0.72rem !important; font-weight: 600 !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; color: #111111 !important; margin-top: 4px !important; } .project-view .arrow { transition: transform 0.3s ease !important; display: inline-block !important; } .project-card:hover .project-view .arrow { transform: translateX(5px) !important; } /* Responsive */ @media (max-width: 900px) { .projects-panel { padding: 60px 24px !important; } .projects-grid { grid-template-columns: 1fr !important; } } /* ========================================== 6. PRIVATE ACQUISITIONS — centrata, sfondo panna ========================================== */ .acquisitions-panel { background-color: #ffffff !important; width: 100% !important; padding: 100px 20px !important; box-sizing: border-box !important; font-family: 'Montserrat', sans-serif !important; text-align: center !important; } .acq-container { max-width: 700px !important; margin: 0 auto !important; display: flex !important; flex-direction: column !important; align-items: center !important; } .acq-kicker { display: block !important; font-family: 'Montserrat', sans-serif !important; font-size: 0.7rem !important; letter-spacing: 3px !important; text-transform: uppercase !important; color: #999999 !important; margin-bottom: 18px !important; font-weight: 500 !important; } .acq-title { font-family: 'Montserrat', sans-serif !important; font-size: clamp(2.2rem, 4vw, 3.4rem) !important; font-weight: 300 !important; letter-spacing: -1px !important; color: #111111 !important; margin: 0 0 24px 0 !important; line-height: 1.1 !important; } .acq-description { font-family: 'Montserrat', sans-serif !important; font-size: 1rem !important; line-height: 1.7 !important; color: #808080 !important; max-width: 560px !important; margin: 0 0 40px 0 !important; font-weight: 400 !important; } /* Bottoni affiancati */ .acq-buttons { display: flex !important; flex-wrap: wrap !important; justify-content: center !important; gap: 15px !important; margin-bottom: 24px !important; } .acq-btn { display: inline-block !important; padding: 12px 28px !important; font-family: 'Montserrat', sans-serif !important; font-size: 0.75rem !important; font-weight: 500 !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; text-decoration: none !important; box-sizing: border-box !important; transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important; } .acq-btn-primary { background-color: #111111 !important; color: #ffffff !important; border: 1px solid #111111 !important; } .acq-btn-primary:hover { background-color: #333333 !important; border-color: #333333 !important; transform: translateY(-2px) !important; } .acq-btn-secondary { background-color: #111111 !important; color: #ffffff !important; border: 1px solid #111111 !important; } .acq-btn-secondary:hover { border-color: #111111 !important; transform: translateY(-2px) !important; } /* Link testuale sotto */ .acq-link { font-family: 'Montserrat', sans-serif !important; font-size: 0.78rem !important; font-weight: 600 !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; color: #111111 !important; text-decoration: none !important; border-bottom: 1px solid transparent !important; padding-bottom: 3px !important; transition: border-color 0.3s ease !important; } .acq-link:hover { border-bottom-color: #111111 !important; } /* Mobile */ @media (max-width: 600px) { .acquisitions-panel { padding: 70px 24px !important; } .acq-buttons { flex-direction: column !important; width: 100% !important; } .acq-btn { width: 100% !important; } } /* ========================================== 7. POPUP ACQUISIZIONI — solo CSS, nessun JS ========================================== */ .acq-modal-overlay { display: none !important; position: fixed !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; background-color: rgba(0, 0, 0, 0.6) !important; z-index: 9999 !important; align-items: center !important; justify-content: center !important; padding: 24px !important; box-sizing: border-box !important; } /* La magia: quando l'URL contiene #acq-modal, il browser applica :target a questo elemento */ .acq-modal-overlay:target { display: flex !important; } .acq-modal { position: relative !important; background-color: #ffffff !important; width: 100% !important; max-width: 720px !important; max-height: 90vh !important; overflow-y: auto !important; padding: 50px 40px !important; box-sizing: border-box !important; font-family: 'Montserrat', sans-serif !important; } .acq-modal-close { position: absolute !important; top: 16px !important; right: 20px !important; font-size: 1.8rem !important; line-height: 1 !important; color: #111111 !important; text-decoration: none !important; padding: 4px 8px !important; } .acq-modal-close:hover { opacity: 0.6 !important; } @media (max-width: 600px) { .acq-modal { padding: 40px 24px !important; } } /* ========================================== 8. PRESS PANEL — rassegna stampa, 2 colonne, compatto ========================================== */ .press-panel { background-color: #ffffff !important; width: 100% !important; padding: 70px 60px !important; box-sizing: border-box !important; font-family: 'Montserrat', sans-serif !important; } .press-container { max-width: 1400px !important; margin: 0 auto !important; } .press-header { margin-bottom: 28px !important; } .press-kicker { display: block !important; font-family: 'Montserrat', sans-serif !important; font-size: 0.7rem !important; letter-spacing: 3px !important; text-transform: uppercase !important; color: #888888 !important; margin-bottom: 14px !important; font-weight: 500 !important; } .press-title { font-family: 'Montserrat', sans-serif !important; font-size: clamp(2.2rem, 3.5vw, 3.2rem) !important; font-weight: 300 !important; letter-spacing: -1px !important; color: #111111 !important; margin: 0 !important; line-height: 1.1 !important; } /* Griglia 2 colonne */ .press-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 0 !important; background-color: #ffffff !important; border-top: 1px solid #e2e2e2 !important; } .press-item { display: block !important; text-decoration: none !important; padding: 18px 24px !important; border-bottom: 1px solid #e2e2e2 !important; background-color: #ffffff !important; transition: background-color 0.25s ease !important; } .press-item:hover { background-color: #f4f4f4 !important; } .press-source { display: block !important; font-family: 'Montserrat', sans-serif !important; font-size: 0.7rem !important; letter-spacing: 1px !important; text-transform: uppercase !important; color: #999999 !important; margin-bottom: 4px !important; font-weight: 500 !important; } .press-headline { font-family: 'Montserrat', sans-serif !important; font-size: 1rem !important; font-weight: 500 !important; color: #111111 !important; margin: 0 0 4px 0 !important; line-height: 1.3 !important; } .press-item:hover .press-headline { text-decoration: underline !important; text-underline-offset: 3px !important; } .press-meta { font-family: 'Montserrat', sans-serif !important; font-size: 0.78rem !important; color: #999999 !important; margin: 0 !important; } /* Link "View all" */ .press-view-all { display: inline-flex !important; align-items: center !important; gap: 8px !important; justify-content: center !important; width: 100% !important; margin-top: 24px !important; font-family: 'Montserrat', sans-serif !important; font-size: 0.75rem !important; font-weight: 600 !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; color: #111111 !important; text-decoration: none !important; } .press-view-all .arrow { transition: transform 0.3s ease !important; display: inline-block !important; } .press-view-all:hover .arrow { transform: translateX(5px) !important; } /* Responsive */ @media (max-width: 768px) { .press-panel { padding: 60px 24px !important; } .press-grid { grid-template-columns: 1fr !important; } .press-item:nth-child(odd) { border-right: none !important; } }