Portfolio Hover: Align title to Left & images to Right

Site URL: https://www.maevabac.com/projets

Hello,

I'd love to make 2 changes in my portfolio project page: https://www.maevabac.com/projets

1. Aligning text on the left and images on the right, so they don't hide the text.
And keep the hover feature.

2. Adding a caption to project titles with a smaller font.

Can someone tell me how to do these things?

Thanks!

#1. Like this? https://www.loom.com/share/1bb0e40c784647c59057c67c1eca95b7

#2. Add to Design > Custom CSS

/* Projects page subtitle */
body#collection-61f2abee615c6449c1254291 {
span.portfolio-hover-item-content:after {
    font-size: 16px;
    display: block;
}
a.portfolio-hover-item[href="/projets/etapes"] span:after {
    content: "etapes sub";
}
a.portfolio-hover-item[href="/projets/art-faber"] span:after {
    content: "art faber sub";
}
a.portfolio-hover-item[href="/projets/yazoue"] span:after {
    content: "yazoue sub";
}
a.portfolio-hover-item[href="/projets/hprints"] span:after {
    content: "hpprints sub";
}
a.portfolio-hover-item[href="/projets/celadon"] span:after {
    content: "celadon sub";
}
}

Hi @tuanphan, are you able to share the solution to #1? I can't identify the class for the image that appears on hover.

#1 Do you mean something like this?