Reduce Height of homepage gallery on mobile

Hello all. I am having some trouble with some custom CSS. I want to resize the gallery block height on mobile display that is on my website. I have tried loads of different code from other forum posts but none of them seem to work. I am using the brine template on 7.0 Squarespace. 

If anyone can help I'd really appreciate it. 

James

Hi James, can you share your website URL?

Hi it's breneresoflondon.com 

Thank you!

11 minutes ago, James42B said:

breneresoflondon.com 

This doesn't work, can you check it and reshare please?

So Sorry just noticed a typo! brenersoflondon.com

Try this Custom CSS:

@media only screen and (max-width:767px) {
  .Index-gallery-item {
    height:30vh;
  }
}

I have tried that but it doesn't seem to work... I put it in the header page injection code section for the gallery I want to resize ... Am I doing something wrong?

51 minutes ago, James42B said:

I put it in the header page injection code section for the gallery I want to resize ... Am I doing something wrong?

Wrong place, put it in Custom CSS, under Website -> Website Tools

I have put the code in there, but it still doesn't work...