How can I manage custom liquid image sizes on my website?

Hi everyone! I added a photo via custom liquid to my site and it fills the entire page. But I want to add a badge below in the footer but adding another custom liquid the top image shrinks to a tiny version. Is there a possibility to keep the top image full page and the bottom image small?

this my custom liquid code I’m using

.photo { display: block; margin: 0 auto; width: 100%; height: 50%; }

Photo

Hi @Enzymatic
Can you kindly share your store link (with the password, if any) with us? We will check it and suggest you a solution if possible.