How can I fix the Dawn theme image banner for desktop view?

Store Design
1

Hi, my website is Dawn theme v12.0, i have copied the code from a discussion to split the image to desktop and mobile.

.banner__media:first-child {
width: 100%;
}
.banner__media+.banner__media {
display: none;
}
@media screen and (max-width: 749px) {
.banner__media:first-child {
display: none;
}
.banner__media+.banner__media {
width: 100%;
display: block !important;
}
.banner__media + .banner__media {
padding-bottom: 85% !important;
padding-left: 60% !important;
}
}

The image banner on mobile (2048 x 2048 px) works well, but the one on desktop doesnt work well, no matter 4000 x 2438px or 1092px. I have also tried to change the code according to the previous discussion solution, but it still doesnt work for me. Can anyone please help? https://danganumkoleksi.com/

section.settings.image_2
| image_url: width: 1500
| image_tag:
loading: ‘lazy’,
width: section.settings.image_2.width,
height: image_height_2,
class: image_class_2,
sizes: sizes,
widths: ‘375, 550, 750, 1100, 1500, 1700, 2000, 3000, 3840’,
alt: section.settings.image_2.alt | escape

2

Hi @Weitingmomo
Remove width until 1500, Check the below code

section.settings.image_2
| image_url: width: 1500
| image_tag:
loading: 'lazy',
width: section.settings.image_2.width,
height: image_height_2,
class: image_class_2,
sizes: sizes,
widths: '1500, 1700, 2000, 3000, 3840',
alt: section.settings.image_2.alt | escape
3

OMG it works! Thank you!!!

4

Where would I put this line of code? I don’t have any coding experience. Thank you, this has bugging me fo days.