EliseBB

Yes, of course. https://bitesandbashes.com/newhome However, I don't have text overlaying the images currently because the text is the off-gray color. I just have a period or comma in place so that the overlay comes up.

Hello everyone! I need some assistance. I am trying to change the "Display Caption on Hover" for images so that the hover changes the entirety of the image to a white opacity of .3 and for the text to be black. However, I code everything except the text color seems to be impossible for me to figure out. Please help. You can see the issue with the image attached. This is the code I have so far: .image-caption-wrapper { opacity: 0; text-align: center !important; top: 0 !important; width:100%; height:100; border: 2px solid white; padding: 1px; margin: 0px; position: center !important; pointer-events: none !important; background: rgba(255, 255, 255, 0.5) !important; } &:hover, &:focus { opacity: 1; } .image-caption { left: 50%; position: absolute; top: 50%; width: 100%; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); } .image-caption p { font-size: 24px !important; font-weight: semibold !important; color: #000000 !important; text-transform: uppercase; line-height: 120% !important; letter-spacing: 2px !important; opacity: 1 !important; } .sqs-block.sqs-block-editable:not(.sqs-block-editing) .sqs-dd-invalid-handle { cursor: default; pointer-events: all !important; } .sqs-block-image .image-block-outer-wrapper.layout-caption-overlay .intrinsic .image-caption-wrapper .sqs-block-image .image-block-outer-wrapper.layout-caption-overlay-hover .intrinsic .image-caption-wrapper { background: #ffffff; opacity: .9; } .sqs-block-image .image-block-outer-wrapper:not(.image-block-v2).layout-caption-overlay-hover .image-caption-wrapper { max-height: 100%; } div#block-yui_3_17_2_1_1629151089490_7573 * { transition: 1s !important; } .image-block * { transition: 1s !important; }