Lightbox code is turning my row of three images into a single column

Hello! I'm working a team page for a client's website. The client has requested lightboxes linked below each team member's image and name to pull up their full bio. I followed the instructions for setting up a lightbox that I found here: https://www.spacetutorials.com/squarespace-lightbox/text and it is working exactly how I want it to.

The problem is that I have their images in "Stack" format with their name and title. Then the lightbox is a code block added below the stack. I want three bios per row. I have three images (or "stacks") lined up, but as soon as I add the code below the stack, it shifts the row of three image/code columns into a single column of three rows on the lefthand side. I can't figure out what about the code is doing this. 

I have this code in my page header code:

<link href="//cdn.jsdelivr.net/npm/featherlight@1.7.14/release/featherlight.min.css" type="text/css" rel="stylesheet" />

I have this in my page footer code:

<script src="//code.jquery.com/jquery-latest.js"></script>
<script src="//cdn.jsdelivr.net/npm/featherlight@1.7.14/release/featherlight.min.js" type="text/javascript" charset="utf-8"></script>

And this as a code block underneath image:

<a href="#" data-featherlight="#bio-sarah"<p style="font-family:brandon-grotesque; font-weight:500; font-style:normal; font-size: 25px; text-align:left; color:#022346;">Read More...</a>

<div style="display:none;">
<div id="bio-sarah"<p style="font-family:brandon-grotesque; font-weight:500; font-style:normal; font-size: 20px; text-align:center; color:#000000;">Sarah is from Washington, D.C. She received her BA in Biochemistry and Molecular Biology from Boston University. She is currently enrolled as a premedical student at Harvard Medical School.</div>

The page is private so I can't share the direct link, but I've included screenshots below. The first image is how I structure it when I'm editing. This is how I want it to look. As soon as I click save and look at the published version, it looks like the second image.

Does anyone have any thoughts as to what in the code would be causing this shift?

Difficult to help without checking url.

You can use Lightbox Plugin to add lightbox, it will be easier.

See how this plugin works

Unfortunately, it's not in our budget to purchase an additional plugin. I was hoping someone might have a guess as to what part of the code is causing a shift in the format.

On 2/19/2021 at 11:44 PM, beccaj11 said:

Unfortunately, it's not in our budget to purchase an additional plugin. I was hoping someone might have a guess as to what part of the code is causing a shift in the format.

Can you share link to page in screenshot? We can check easier