ChrisF07

Can you also share how to remove the overlay and text on hover?

Site URL: https://ellipse-gar-5ewa.squarespace.com/ The site is private, so I attached an image for reference. What I'd like to do is reverse the overlay effect so that the grey background and text shows, and then the image is revealed on hover. In the image I have attached, I'm hovering over the second box "WORK", but would like to reverse this effect. Can anyone help? Thanks!

Site URL: https://ellipse-gar-5ewa.squarespace.com I'm using this code to style gallery iamges and captions, however the font size is very small on display and does not change when I change the pixel size (currently set to 40px). Can anyone help? (see attached image for screenshot) Thanks! .gallery-caption { position: absolute !important; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; text-align:center; opacity: 1; transition: all .3s ease; color: white; height: 100%; p {font-size:40px;} } .gallery-masonry-item:hover .gallery-caption { transition: all 1s ease !important; display:none; } .gallery-caption-wrapper { display: flex; place-items: center; justify-content: center; } .gallery-masonry-item { img { -webkit-filter: brightness(50%); filter: brightness(50%); transition: all .7s ease; }} .gallery-masonry-item:hover { img { -webkit-filter: brightness(100%); filter: brightness(100%); transition: all .7s ease; }}