{% do jsConfig().add('lazyImg', true) %}
{% if editmode %}
<div class="editmode-box editmode-box--info">
<div class="editmode-box__header">
BG Image
</div>
{{ pimcore_relation('hero2', {'types': ['asset'], 'subtypes': ['image']}) }}
</div>
{% endif %}
<div class="hero-magazine {{ styleModifier | default('content-block') }}">
<figure class="hero-magazine__image embed-responsive hero-magazine__embed--full-width">
{% if not pimcore_relation('hero2').empty %}
{{ pimcore_relation('hero2').element.thumbnail('hero-magazine--full-width').html({
imgAttributes: {
'class': 'embed-responsive-item'
},
'lowQualityPlaceholder': true
})|raw }}
{{ pimcore_relation('hero2').element.thumbnail('hero-magazine--full-width').html({
imgAttributes: {
'class': 'embed-responsive-item'
},
})|raw }}
{% endif %}
</figure>
{% if editmode or not pimcore_input('hero-headline').empty %}
<div class="hero-magazine__headline">
{% do elements_head_title(pimcore_input('hero-headline').frontend) %}
{{ pimcore_input('hero-headline', {'width': 750})}}
</div>
{% endif %}
</div>