How can I edit my banner to avoid overlay on desktop view?

[FabriekStudio]

I’d like to see the banner content beyond the image and not over the image.

When I see by mobile is correct.. but on desktop it is overlay.

How could I edit it as mobile version only?

{{ ‘section-collection-banner.css’ | asset_url | stylesheet_tag }}

{%- assign _section = section.settings -%}
{%- assign is_sub_collection = false -%}

{%- for link in linklists[_section.collections_menu].links -%}
{%- if is_sub_collection -%}
{%- break -%}
{%- endif -%}

{%- for sublink in link.links -%}
{%- if sublink.object.handle != collection.handle -%}
{%- continue -%}
{%- endif -%}

{%- assign is_sub_collection = true -%}

{%- break -%}
{%- endfor -%}
{%- endfor -%}

{%- if settings.show_breadcrumbs -%}
{{- ‘component-breadcrumbs.css’ | asset_url | stylesheet_tag -}}
{%- endif -%}

{%- if settings.show_breadcrumbs -%}

{%- render 'breadcrumbs', mod_page_title: collection.title -%}

{%- endif -%}

{%- if _section.show_collection_image and collection.featured_image != blank -%}

{%- render 'collection-image' with collection as collection_ref, classes: 'collection-banner__media', is_sub_collection: is_sub_collection, image_vertical_position: section.settings.image_vertical_position -%}

{%- endif -%}

{{ 'sections.collection_template.title' | t }}: {{- collection.title | escape -}}

{%- if _section.show_collection_description -%}

{{- collection.description -}}

{%- endif -%}

{%-
liquid
if _section.collections_menu != blank
assign class = ‘’
if section.settings.collections_menu_style != ‘links’
assign class = ‘large-up-hide’
endif
render ‘collections-menu’, class: class
endif
-%}

{%- if _section.collections_menu != blank and section.settings.collections_menu_style != ‘links’ -%}

{%- render 'collections-menu', class: 'small-hide medium-hide' -%}

{%- endif -%}

{% schema %}
{
“name”: “t:sections.main-collection-banner.name”,
“settings”: [
{
“type”: “paragraph”,
“content”: “t:sections.main-collection-banner.settings.paragraph.content”
},
{
“type”: “checkbox”,
“id”: “show_collection_description”,
“default”: true,
“label”: “t:sections.main-collection-banner.settings.show_collection_description.label”
},
{
“type”: “checkbox”,
“id”: “show_collection_image”,
“default”: true,
“label”: “t:sections.main-collection-banner.settings.show_collection_image.label”,
“info”: “t:sections.main-collection-banner.settings.show_collection_image.info”
},
{
“type”: “select”,
“id”: “image_vertical_position”,
“label”: “t:sections.main-collection-banner.settings.image_vertical_position.label”,
“options”: [
{
“value”: “top”,
“label”: “t:sections.main-collection-banner.settings.image_vertical_position.options.top.label”
},
{
“value”: “center”,
“label”: “t:sections.main-collection-banner.settings.image_vertical_position.options.center.label”
},
{
“value”: “bottom”,
“label”: “t:sections.main-collection-banner.settings.image_vertical_position.options.bottom.label”
}
],
“default”: “center”
},
{
“type”: “range”,
“id”: “image_overlay_opacity”,
“min”: 0,
“max”: 100,
“step”: 5,
“unit”: “%”,
“label”: “t:sections.main-collection-banner.settings.image_overlay_opacity.label”,
“default”: 50
},
{
“type”: “header”,
“content”: “t:sections.main-collection-banner.settings.header_menu.content”,
“info”: “t:sections.main-collection-banner.settings.header_menu.info”
},
{
“type”: “link_list”,
“id”: “collections_menu”,
“label”: “t:sections.main-collection-banner.settings.collections_menu.label”,
“info”: “t:sections.main-collection-banner.settings.collections_menu.info”
},
{
“type”: “select”,
“id”: “collections_menu_style”,
“label”: “t:sections.main-collection-banner.settings.collections_menu_style.label”,
“options”: [
{
“value”: “links”,
“label”: “t:sections.main-collection-banner.settings.collections_menu_style.options.option_1.label”
},
{
“value”: “thumbnails-square”,
“label”: “t:sections.main-collection-banner.settings.collections_menu_style.options.option_2.label”
},
{
“value”: “thumbnails-round”,
“label”: “t:sections.main-collection-banner.settings.collections_menu_style.options.option_3.label”
}
],
“default”: “thumbnails-round”
}
],
“blocks”: [
{
“type”: “menu-item”,
“name”: “t:sections.main-collection-banner.blocks.menu-item.name”,
“settings”: [
{
“type”: “text”,
“id”: “title”,
“label”: “t:sections.main-collection-banner.blocks.menu-item.settings.title.label”,
“info”: “t:sections.main-collection-banner.blocks.menu-item.settings.title.info”
},
{
“type”: “image_picker”,
“id”: “image”,
“label”: “t:sections.main-collection-banner.blocks.menu-item.settings.image.label”
}
]
}
]

}
{% endschema %}

[ennovative-it]

Hello, can u send me the url of a page example?

[FabriekStudio]

The theme is not published. I attached the screenshots..

[ennovative-it]

Senza la pagina avanti non posso aiutarti, dovrei vedere le classi degli elementi, dovresti farmi degli screen dell’ispezione elemento, se non hai problemi posso chiederti l’accesso come collaboratore e te lo faccio un secondo