Adding hover overlay (colour and additional text) to Simple List

Site URL: https://expressmedicals.squarespace.com/meet-the-team

I have a "meet the team" page on the new site I'm building, and used the Simple List format to lay them out, it looks great but now I'm looking to have an overlay when you hover over the images (50% opaque, #FD5001) where I can put a little bit of bio about each person. 

Not sure what colour or weight for the font until I see it. Can anyone help?

Site is https://expressmedicals.squarespace.com/meet-the-team

Thank you, by the way, this forum has been enormously helpful to get a beginner going on SS. 

What is password?

@tuanphan squarespace1

On 2/14/2022 at 4:19 PM, jackiemclintock said:

@tuanphan squarespace1

Try adding to Design > Custom CSS

/* Meet the team */
.user-items-list-item-container[data-section-id="6182c49d2a72a734bd254ccc"] {
.list-item-media-inner:after {
    content: '';
    background-color: #FD5001;
    opacity: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    transition: all 0.3s;
}

.list-item-media-inner:hover:after {
    opacity: 0.5;
}}