Lightbox size is not responsive on mobile browser

Hello There,

I currently added a feature, which is using link to trigger a lightbox image.I followed the incredible tutorials from "spacetutorials.com" as I know nothing about coding...

The lightbox worked really well but only with a problem, the size is not responsive on mobile browser...

Can anyone tell me how can I fix the problems? Here is the URL of my webpage as your reference:https://andychu.design/test

Thank you very much and looking forward to hearing from any solutions.

Cheers,Andy

try this code

@media only screen and (max-width: 1024px){
.img {
   vertical-align: middle;
   width: 285px;
}}

Sorry, I really don’t know coding... could you let me know where should I put this code to?

1. Code Injection code area

2. The Code Content Block

Thank you very much

@mdhanjal

Not working unfortunately....

@media only screen and (max-width: 640px){ .img { vertical-align: middle; width: 285px; }}