How to put text on second line of Grid Overlay hover that's different on specified pages?

My client wants his portfolio to have hover titles which show the client on one line and the director on a second line. I've customized the text size and figured out how to make it look the way he wants in css. He has multiple portfolio categories (commercial, work, shorts) and I know they are all linked but I thought using the page or section ID to add the directors individually for each page would work. Unfortunately, it hasn't and the same directors end up being repeated on all the portfolio pages (which is incorrect). 

How can I make this work?

Here is the current code I've got in there for Commercial (but it's showing the directors for Automotive):
 

.portfolio-title:after{
 white-space:pre; 
 content:"\A Second Line";
 text-transform:uppercase;
 font-size: 1.5rem 
}
#collection-669afebe90bae63ebf312da9 {

.target-here {

.grid-item:nth-of-type(1) .portfolio-title:after{ white-space:pre; content:"\A JOANN LEMOINE" }

.grid-item:nth-of-type(2) .portfolio-title:after{ white-space:pre; content:"\A Dave Laden" }

     etc. etc. for each director...

Can this be done? Hellllp!

@Lynnster I'm not exactly sure what you're trying to achieve here. Can you share your site URL for context, assuming you've already added the custom code you mentioned in your post?

@Lesum I included the site url when I created this. I didn't realize it wouldn't include it. 

Here it is.

Maybe I didn't explain it right...?

Each portfolio has different categories of video work, and thumbnails are featured in the Grid Overlay Portfolio. I added a dark hover and the titles of the videos appear in white. He wanted the director of the piece to be on a second line in smaller text. I accomplished this by putting each director's name in css (see code above). I tested it on the "Commercial" category. It looked perfect!

The problem happened when I went to the second category ("Automotive") and put css in, because the directors then appeared the same for the videos on Commercial and Automotive. So I tried to call out each specific page to say "These directors only appear on this page" basically. I thought it would work and it did not.

I need the directors to be correct for each video.

ALSO... I now realize the css does not work on the mobile view and the directors aren't showing up at all.

Does that make more sense???

Nevermind on the mobile comment. I fixed that! 

Now I just need to get the right directors credited for their videos! 🙂

That worked! Thank you!!! 

I'm glad there was a way the director and title could be linked better, I was worried about things getting mixed up if the order had to change.