.steps-horizontal {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;

      position: relative;
      padding: 0;
  }

  .steps-horizontal::before {
      content: '';
      position: absolute;
      top: 24px;
      left: 10%;
      right: 0;
      height: 2px;
      background: #343434;
      z-index: 1;
      width: 80%;
  }

  .step-horizontal {
      flex: 1;
      text-align: center;
      position: relative;
      z-index: 2;
  }

  .step-icon {
      width: 50px;
      height: 50px;
      border-radius: 0;
      background: #121212;
      border: 2px solid #343434;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 10px;
      font-size: 20px;
      color: #ffffff;
      transition: all 0.3s ease;
  }

  .step-title {
      font-size: 14px;
      color: #6c757d;
      margin-bottom: 5px;
  }

  .step-description {
      font-size: 12px;
      color: #adb5bd;
      max-width: 150px;
      margin: 0 auto;
  }

  .step-horizontal.active .step-icon {
      background: var(--bs-primary);
      border-color: var(--bs-primary);
      color: white;
      transition: all 0.5s ease-in-out;
      box-shadow: 0 0 0 5px var(--bs-primary-rgb);
  }

  .step-horizontal.complete .step-icon {
      background: #121212;
      border-color: #121212;
      color: white;
      transition: all 0.5s ease-in-out;
  }

  .option-box {
      position: relative;
      margin-bottom: 30px;
      padding: 20px;
      background: #121212;
      color: #fff;
  }

  .heading_text {
      font-size: 42px;
      font-weight: 700;
      line-height: 55px;
      margin-bottom: 18px;
  }

  .outline_text {
      font-size: 66px;
      line-height: 73px;
      margin-bottom: -44px;
  }

  .outline_text {
      -webkit-text-stroke-color: rgba(255, 255, 255, 0.3) !important;
  }

  .outline_text {
      font-weight: 700;
      text-transform: uppercase;
      -webkit-text-fill-color: transparent;
      -webkit-text-stroke-width: 1px;
      -webkit-text-stroke-color: #343434;
      font-family: var(--bs-font-heading);
  }

  /*
    Common 
*/

  .wizard,
  .tabcontrol {
      display: block;
      width: 100%;
      overflow: hidden;
  }

  .wizard a,
  .tabcontrol a {
      outline: 0;
  }

  .wizard ul,
  .tabcontrol ul {
      list-style: none !important;
      padding: 0;
      margin: 0;
  }

  .wizard ul>li,
  .tabcontrol ul>li {
      display: block;
      padding: 0;
  }

  /* Accessibility */
  .wizard>.steps .current-info,
  .tabcontrol>.steps .current-info {
      position: absolute;
      left: -999em;
  }

  .wizard>.content>.title,
  .tabcontrol>.content>.title {
      position: absolute;
      left: -999em;
  }



  /*
    Wizard
*/

  .wizard>.steps {
      position: relative;
      display: block;
      width: 100%;
  }

  .wizard.vertical>.steps {
      display: inline;
      float: left;
      width: 30%;
  }

  .wizard>.steps .number {
      font-size: 1.429em;
  }

  .wizard>.steps>ul>li {
      width: 25%;
  }

  .wizard>.steps>ul>li,
  .wizard>.actions>ul>li {
      float: left;
  }

  .wizard.vertical>.steps>ul>li {
      float: none;
      width: 100%;
  }

  .wizard>.steps a,
  .wizard>.steps a:hover,
  .wizard>.steps a:active {
      display: block;
      width: auto;
      margin: 0;
      padding: 1em 1em;
      text-decoration: none;

      
  }

  .wizard>.steps .disabled a,
  .wizard>.steps .disabled a:hover,
  .wizard>.steps .disabled a:active {
      
      color: #aaa;
      cursor: default;
  }

  .wizard>.steps .current a,
  .wizard>.steps .current a:hover,
  .wizard>.steps .current a:active {
      
      color: #fff;
      cursor: default;
  }

  .wizard>.steps .done a,
  .wizard>.steps .done a:hover,
  .wizard>.steps .done a:active {
      background: #9dc8e2;
      color: #fff;
  }

  .wizard>.steps .error a,
  .wizard>.steps .error a:hover,
  .wizard>.steps .error a:active {
      background: #ff3111;
      color: #fff;
  }

  .wizard>.content {
     
      display: block;
      margin: 0.5em;
      min-height: 50vh;
      overflow: hidden;
      position: relative;
      width: auto;

     
  }

  .wizard.vertical>.content {
      display: inline;
      float: left;
      margin: 0 2.5% 0.5em 2.5%;
      width: 65%;
  }

  .wizard>.content>.body {
      float: left;
      position: absolute;
      width: 95%;
      height: 95%;
      padding: 2.5%;
  }

  .wizard>.content>.body ul {
      list-style: disc !important;
  }

  .wizard>.content>.body ul>li {
      display: list-item;
  }

  .wizard>.content>.body>iframe {
      border: 0 none;
      width: 100%;
      height: 100%;
  }

  .wizard>.content>.body input {
      display: block;
      border: 1px solid #ccc;
  }

  .wizard>.content>.body input[type="checkbox"] {
      display: inline-block;
  }

  .wizard>.content>.body input.error {
      background: rgb(251, 227, 228);
      border: 1px solid #fbc2c4;
      color: #8a1f11;
  }

  .wizard>.content>.body label {
      display: inline-block;
      margin-bottom: 0.5em;
  }

  .wizard>.content>.body label.error {
      color: #8a1f11;
      display: inline-block;
      margin-left: 1.5em;
  }

  .wizard>.actions {
      position: relative;
      display: block;
      text-align: right;
      width: 100%;
  }

  .wizard.vertical>.actions {
      display: inline;
      float: right;
      margin: 0 2.5%;
      width: 95%;
  }

  .wizard>.actions>ul {
      display: inline-block;
      text-align: right;
  }

  .wizard>.actions>ul>li {
      margin: 0 0.5em;
  }

  .wizard.vertical>.actions>ul>li {
      margin: 0 0 0 1em;
  }

  .wizard>.actions a,
  .wizard>.actions a:hover,
  .wizard>.actions a:active {
      
      color: #fff;
      display: block;
      padding: 0.5em 1em;
      text-decoration: none;

     
  }

  .wizard>.actions .disabled a,
  .wizard>.actions .disabled a:hover,
  .wizard>.actions .disabled a:active {
    
      color: #aaa;
  }

  .wizard>.loading {}

  .wizard>.loading .spinner {}



  /*
    Tabcontrol
*/

  .tabcontrol>.steps {
      position: relative;
      display: block;
      width: 100%;
  }

  .tabcontrol>.steps>ul {
      position: relative;
      margin: 6px 0 0 0;
      top: 1px;
      z-index: 1;
  }

  .tabcontrol>.steps>ul>li {
      float: left;
      margin: 5px 2px 0 0;
      padding: 1px;

      -webkit-border-top-left-radius: 5px;
      -webkit-border-top-right-radius: 5px;
      -moz-border-radius-topleft: 5px;
      -moz-border-radius-topright: 5px;
      border-top-left-radius: 5px;
      border-top-right-radius: 5px;
  }

  .tabcontrol>.steps>ul>li:hover {
      background: #edecec;
      border: 1px solid #bbb;
      padding: 0;
  }

  .tabcontrol>.steps>ul>li.current {
      background: #fff;
      border: 1px solid #bbb;
      border-bottom: 0 none;
      padding: 0 0 1px 0;
      margin-top: 0;
  }

  .tabcontrol>.steps>ul>li>a {
      color: #5f5f5f;
      display: inline-block;
      border: 0 none;
      margin: 0;
      padding: 10px 30px;
      text-decoration: none;
  }

  .tabcontrol>.steps>ul>li>a:hover {
      text-decoration: none;
  }

  .tabcontrol>.steps>ul>li.current>a {
      padding: 15px 30px 10px 30px;
  }

  .tabcontrol>.content {
      position: relative;
      display: inline-block;
      width: 100%;
      height: 35em;
      overflow: hidden;
      border-top: 1px solid #bbb;
      padding-top: 20px;
  }

  .tabcontrol>.content>.body {
      float: left;
      position: absolute;
      width: 95%;
      height: 95%;
      padding: 2.5%;
  }

  .tabcontrol>.content>.body ul {
      list-style: disc !important;
  }

  .tabcontrol>.content>.body ul>li {
      display: list-item;
  }