{% include 'quarks/_loadCssComponent' with { 
    name: '_videoBulletsSliderAndText'
  } only %}
<section {{ dataComponent }} id="{{ id }}" class="vBSAT bg-{{ index.index0 }}  {{ separation }}">
	<div class="container py-3">
		{% include 'components/_setHeadTitles' %} 

		{% set invert = component.invertContent ?? false %}
		<section class="row row-cols-1 row-cols-lg-2 {{
												      invert
												        ? 'flex-row-reverse'
												        : null
												      }}">
			<div class="col px-lg-3">
				{% set videoOrSlider = component.videoOrSlider.one() ?? null %}
				{% if videoOrSlider %}
					<section class="contentStycky">
						{% include 'components/_videoBulletsSliderAndText-'
              ~ videoOrSlider.type with {
              _block: videoOrSlider
            } only %}
					</section>
				{% endif %}
			</div>
			<div class="col py-4 py-lg-0">
				{% set bodyComponents = component.bodycomponents.all() ?? null %}
				{% if bodyComponents %}
					{% for children in bodyComponents %}
						{% include 'components/_' ~ children.type with {
              _block: children
            } only %}
					{% endfor %}
				{% endif %}
			</div>
		</section>
	</div>
    {% include 'quarks/_loadJsComponent' with {
        name: '_videoBulletsSliderAndText'
      } only %}
</section>