Trying to customise gallery for mobile, syntax error

Hi

I am trying to turn my gallery on home page into 1 image per line on mobile (it is 2 on desktop).

I have copied in this code sourced from this forum but I keep getting a syntax error. What I am I doing wrong?

Thanks!

<style>
  @media screen and (max-width:767px) {
	.gallery-masonry-wrapper.gallery-masonry-list--ready {
    height: auto !important;
}
figure.gallery-masonry-item {
    position: relative !important;
    width: 100% !important;
    transform: unset !important;
}
.gallery-masonry-item-wrapper {
    height: auto !important;
}
.gallery-masonry .gallery-masonry-item[data-loaded] img {
    width: 100% !important;
}
.gallery-masonry {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
}
</style>

@JanetPassionfolk Hi! Remove <style> from line 36 and </style> from line 57 in your code.

thanks so much for your reply. It didnt seem to work but I will try again tomorrow!