<div class="step__list">
	<div class="row"></li>
		<div class="col-xl-4 {{#if step1Checked }}step--checked{{/if}} {{#if step1Active}}step--active{{/if}} step step--1 no-padding-left">
			<div class="step__icon">
				{{#if orderingOfPrintBrochures }}
					{{#if step1Active }}
						{{ render "atoms/icons/svg-icon" catalogActive=true }}
						{{ render "atoms/icons/svg-icon" checkMark=true cssClass="check-mark" }}
					{{/if }}
				{{/if }}
				{{#if style2 }}
					{{ render "atoms/icons/svg-icon" formList=true }}
					{{ render "atoms/icons/svg-icon" checkMark=true cssClass="check-mark" }}
				{{/if }}
				{{#if style3 }}
					{{ render "atoms/icons/svg-icon" formList=true }}
					{{ render "atoms/icons/svg-icon" checkMark=true cssClass="check-mark" }}
				{{/if}}
			</div>
		</div>
		<div class="col-xl-4 {{#if step2Checked }}step--checked{{/if}} {{#if step2Active}}step--active{{/if}} step step--2">
			<div class="step__icon">
				{{#if orderingOfPrintBrochures }}
					{{ render "atoms/icons/svg-icon" formList=true }}
					{{#if step2Active }}
						{{ render "atoms/icons/svg-icon" checkMark=true cssClass="check-mark" }}
					{{/if }}
				{{/if }}
				{{#if style2 }}
					{{ render "atoms/icons/svg-icon" confirmCheckBox=true }}
				{{/if }}
				{{#if style3 }}
					{{ render "atoms/icons/svg-icon" confirmCheckBox=true }}
				{{/if }}
			</div>
		</div>
		<div class="col-xl-4 {{#if step3Checked }}step--checked{{/if}} {{#if step3Active}}step--active{{/if}} step step--3">
			<div class="step__icon">
				{{#if orderingOfPrintBrochures }}
					{{ render "atoms/icons/svg-icon" download=true }}
					{{#if step3Active }}
						{{ render "atoms/icons/svg-icon" checkMark=true cssClass="check-mark" }}
					{{/if }}
				{{/if }}
				{{#if style2 }}
					{{ render "atoms/icons/svg-icon" emailOpened=true }}
				{{/if }}
				{{#if style3 }}
					{{ render "atoms/icons/svg-icon" profileInformation=true }}
				{{/if }}
			</div>
		</div>
	</div>

	<div class="row">
		<div class="col-xl-4 step no-padding-left">
			<div class="step__desc">
				{{#if orderingOfPrintBrochures }}
					Select<br>Brochures
				{{/if }}

				{{#if style2 }}
					Fill out form
				{{/if }}

				{{#if style3 }}
					Fill out form
				{{/if }}
			</div>
		</div>
		<div class="col-xl-4 step">
			<div class="step__desc">
				{{#if orderingOfPrintBrochures }}
					Fill out<br>form
				{{/if }}

				{{#if style2 }}
					Confirm
				{{/if }}

				{{#if style3 }}
					Confirm e-mail<br>address
				{{/if }}
			</div>
		</div>
		<div class="col-xl-4 step">
			<div class="step__desc">
				{{#if orderingOfPrintBrochures }}
					Recive brochure(s)<br>per Mail
				{{/if }}

				{{#if style2 }}
					Stay up-to-date
				{{/if }}

				{{#if style3 }}
					Get personalized<br>information
				{{/if }}
			</div>
		</div>
	</div>
</div>
