.md-stepper-horizontal {
  display: table;
  width: 100%;
  margin: 0 auto;
  background-color: #FFFFFF;
  background: url('https://hrl-fc.webdec.fr/images/logo-ens.png') no-repeat 1% 50%;
  background-size: 70px;
  box-shadow: 0 3px 8px -6px rgba(0, 0, 0, .50);
}

.md-stepper-horizontal .md-step, .md-stepper-horizontal .md-step-subcat {
  display: table-cell;
  position: relative;
  vertical-align: middle;
  text-align: center;
  padding: 24px;
}

.md-stepper-horizontal .md-step-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.md-stepper-horizontal .md-step-subcat {
  padding: 12px;
}

.md-stepper-horizontal .md-step:active, .md-stepper-horizontal .md-step-subcat:active {
  background-color: rgba(0, 0, 0, 0.04);
}

.md-stepper-horizontal .md-step:first-child:active, .md-stepper-horizontal .md-step-subcat:first-child:active {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.md-stepper-horizontal .md-step:last-child:active, .md-stepper-horizontal .md-step-subcat:last-child:active {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.md-stepper-horizontal .md-step:first-child .md-step-bar-left, .md-stepper-horizontal .md-step-subcat:first-child .md-step-bar-left-subcat,
.md-stepper-horizontal .md-step:last-child .md-step-bar-right, .md-stepper-horizontal .md-step-subcat:last-child .md-step-bar-right-subcat {
  display: none;
}

.md-stepper-horizontal .md-step .md-step-circle, .md-stepper-horizontal .md-step-subcat .md-step-circle-subcat {
  margin: 0 auto;
  background-color: #999999;
  border-radius: 50%;
  text-align: center;
  font-weight: 600;
  color: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
}

.md-stepper-horizontal .md-step .md-step-circle {
  width: 30px;
  height: 30px;
  font-size: 16px;
  transform: translateY(15px); /* Adjust this value to move the circles down */
}

.md-step-circle-subcat {
  width: 15px;
  height: 15px;
  font-size: 8px;
}

.md-stepper-horizontal.green .md-step.active .md-step-circle, .md-stepper-horizontal.green .md-step-subcat.active .md-step-circle-subcat {
  background-color: rgba(0, 128, 128, 1);
  transition: background-color 1000ms linear;
}

.md-stepper-horizontal.orange .md-step.active .md-step-circle, .md-stepper-horizontal.orange .md-step-subcat.active .md-step-circle-subcat {
  background-color: #F96302;
}

.md-stepper-horizontal .md-step.active .md-step-circle, .md-stepper-horizontal .md-step-subcat.active .md-step-circle-subcat {
  background-color: rgb(33, 150, 243);
}

.md-stepper-horizontal .md-step.done .md-step-circle:before, .md-stepper-horizontal .md-step-subcat.done .md-step-circle-subcat:before {
  font-family: 'FontAwesome';
  font-weight: 100;
  content: "\f00c";
}

.md-stepper-horizontal .md-step.done .md-step-circle *, .md-stepper-horizontal .md-step-subcat.done .md-step-circle-subcat *,
.md-stepper-horizontal .md-step.editable .md-step-circle *, .md-stepper-horizontal .md-step-subcat.editable .md-step-circle-subcat * {
  display: none;
}

.md-stepper-horizontal .md-step.editable .md-step-circle, .md-stepper-horizontal .md-step-subcat.editable .md-step-circle-subcat {
  transform: scaleX(-1);
}

.md-stepper-horizontal .md-step.editable .md-step-circle:before, .md-stepper-horizontal .md-step-subcat.editable .md-step-circle-subcat:before {
  font-family: 'FontAwesome';
  font-weight: 100;
  content: "\f040";
}

.md-stepper-horizontal .md-step .md-step-title, .md-stepper-horizontal .md-step-subcat .md-step-title {
  font-size: 12px;
  font-weight: 10;
  margin-top: 15px;
}

.md-stepper-horizontal .md-step .md-step-title, .md-stepper-horizontal .md-step-subcat .md-step-title,
.md-stepper-horizontal .md-step .md-step-optional, .md-stepper-horizontal .md-step-subcat .md-step-optional {
  text-align: center;
  color: rgba(0, 0, 0, .26);
}

.md-stepper-horizontal .md-step.active .md-step-title, .md-stepper-horizontal .md-step-subcat.active .md-step-title {
  font-weight: 600;
  color: rgba(0, 0, 0, .87);
}

.md-stepper-horizontal .md-step.active.done .md-step-title, .md-stepper-horizontal .md-step-subcat.active.done .md-step-title,
.md-stepper-horizontal .md-step.active.editable .md-step-title, .md-stepper-horizontal .md-step-subcat.active.editable .md-step-title {
  font-weight: 600;
}

.md-stepper-horizontal .md-step .md-step-optional, .md-stepper-horizontal .md-step-subcat .md-step-optional {
  font-size: 12px;
}

.md-stepper-horizontal .md-step.active .md-step-optional, .md-stepper-horizontal .md-step-subcat.active .md-step-optional {
  color: rgba(0, 0, 0, .54);
}

.md-stepper-horizontal .md-step .md-step-bar-left, .md-stepper-horizontal .md-step-subcat .md-step-bar-left-subcat,
.md-stepper-horizontal .md-step .md-step-bar-right, .md-stepper-horizontal .md-step-subcat .md-step-bar-right-subcat {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  height: 1px;
  border-top: 1px solid #DDDDDD;
}

.md-stepper-horizontal .md-step .md-step-bar-right, .md-stepper-horizontal .md-step-subcat .md-step-bar-right-subcat {
  right: 0;
  left: 60%;
  margin-left: 10px;
}

.md-stepper-horizontal .md-step .md-step-bar-left, .md-stepper-horizontal .md-step-subcat .md-step-bar-left-subcat {
  left: 0;
  right: 60%;
  margin-right: 10px;
}