Wizard title

<div id="wizardDialog" class="sb-wizard-dialog sb-wizard-dialog--open" role="dialog" aria-modal="true" aria-labelledby="wizardTitle" data-kss-animation-switch="sb-wizard-dialog--open" data-kss-animation-name="Dialog open/close">
  <div class="sb-wizard-dialog__header">
    <button class="sb-wizard-dialog__back sb-btn sb-btn--s sb-btn--subtle" aria-controls="wizard" aria-label="Back">
      <svg class="sb-icon sb-icon--m sb-icon--arrow" viewBox="0 0 10 10">
        <g fill="none" stroke-linecap="round" stroke-width="2">
          <path stroke-linejoin="round" d="M5 1L1 5l4 4"/>
          <path d="M2 5h7"/>
        </g>
      </svg>
    </button>
    <h1 class="sb-title--l" id="wizardTitle">Wizard title</h1>
    <button class="sb-wizard-dialog__close sb-btn sb-btn--s sb-btn--subtle" aria-controls="wizard" aria-label="Close">
      <svg class="sb-icon sb-icon--m" viewBox="0 0 17 17">
        <path d="M10.784 8.727l5.641 5.641a.75.75 0 0 1 0 1.06l-.996.997a.75.75 0 0 1-1.06 0l-5.642-5.64-5.64 5.64a.75.75 0 0 1-1.061 0l-.997-.996a.75.75 0 0 1 0-1.06L6.67 8.726l-5.64-5.64a.75.75 0 0 1 0-1.061l.996-.997a.75.75 0 0 1 1.06 0L8.727 6.67l5.641-5.64a.75.75 0 0 1 1.06 0l.997.996a.75.75 0 0 1 0 1.06l-5.64 5.641z"/>
      </svg>
    </button>
  </div>
  <div class="sb-wizard-dialog__content">
    <div class="sb-wizard-dialog__step sb-wizard-dialog__step--active" data-kss-animation-switch="sb-wizard-dialog__step--active" data-kss-animation-name="Step change">
       <div class="sb-flex" style="justify-content: center; align-items:center; height:100%;">
         <button class="sb-btn" >Centered button</button>
       </div>
    </div>
  </div>
  <div class="sb-wizard-dialog__footer">
    <span class="sb-title--s sb-text--smallcaps">45 status</span>
    <div class="sb-wizard-dialog__actions">
      <button class="sb-btn sb-margin-right-s" aria-controls="wizard">Secondary</button>
      <button class="sb-btn sb-btn--primary" aria-controls="wizard">Main</button>
    </div>
  </div>
</div>