Make a lightbox with CSS code only

Site URL: https://preludefilm.squarespace.com/?p

Hello everyone!
I'm new to post here but I've been using the forum a lot lately. It's been really handy when it comes to code.
Anyways, there's something that requires much more experience than I have and I keep failing whatever I tried.

On the front page of my (under contruction) website, there's a botton in the middle of the page saying "watch teaser". By clicking on it you are redirected to vimeo. I wish to open the video in a lightbox to stay on my website but couldn't find the appropriate CSS code. Does it exists to begin with?

Code to access my website is "youarewelcome".

Thanks for the help guys!

Hi @JordanUrgin, I have a tutorial covering two ways to accomplish this - one free and one paid plugin. I recommend checking it out as it should answer your question!

Since gallery blocks are no longer available on 7.1 without a plugin, I recommend using the lightbox video plugin which I cover at 9:15 in the video: https://youtu.be/9OvjPYi5yvw?t=555

That will do exactly what you are looking for!

Hello Chris! Thank you for the tip and help, you're one of the first one I saw when I was trying to accomplish that but the thing is "code injection" requires at least a business membership and I have the membership right below sadly.
Si I'm still looking for some CSS coding, without code injection and Java, to create my lightbox. If it's possible but I think it is.

EDIT: After verification my membership "business" actually allows the code injection! Thank you Chris, I'll try your method!

Do you still need help with CSS?