ol.steps {
  list-style: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  font-family: 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', 'DejaVu Sans', 'Bitstream Vera Sans', 'Liberation Sans', Verdana, 'Verdana Ref', sans-serif;
  font-size: 16px;
  line-height: 20px;
  font-weight: bold;
  counter-reset: li;
}
ol.steps li {
  list-style-image: none;
  list-style-type: none;
  margin-left: 0;
  text-align: center;
  color: #3a3a3a;
  background: #dae4eb;
  position: relative;
  margin-left: 43px;
}
ol.steps li:after {
  position: absolute;
  top: 50%;
  left: 100%;
  content: " ";
  height: 0;
  width: 0;
  pointer-events: none;
  border: solid transparent;
  border-left-color: #dae4eb;
  border-width: 19px;
  margin-top: -19px;
}
ol.steps li:first-child {
  margin-left: 0;
}
ol.steps li:first-child span {
  padding: 9px;
}
ol.steps li:first-child span:after {
  border: none;
}
ol.steps li:last-child:after {
  border-width: 0;
}
ol.steps li span {
  display: block;
  padding: 9px 28px 9px 9px;
}
ol.steps li span:after {
  position: absolute;
  top: 50%;
  right: 100%;
  content: " ";
  height: 0;
  width: 0;
  pointer-events: none;
  border: solid #dae4eb;
  border-left-color: transparent;
  border-width: 19px;
  margin-top: -19px;
}
ol.steps li span:before {
  content: counter(li) ") ";
  counter-increment: li;
}
ol.steps > li {
  float: left;
}
ol.steps li.current {
  color: #fff;
  background: #18a689;
}
ol.steps li.current:after {
  border-left-color: #18a689;
}
ol.steps li.current span:after {
  border-color: #18a689;
  border-left-color: transparent;
}
ol.steps li.step1 {
  z-index: 9;
}
ol.steps li.step2 {
  z-index: 8;
}
ol.steps li.step3 {
  z-index: 7;
}
ol.steps li.step4 {
  z-index: 6;
}
ol.steps li.step5 {
  z-index: 5;
}
ol.steps li.step6 {
  z-index: 4;
}
ol.steps li.step7 {
  z-index: 3;
}
ol.steps li.step8 {
  z-index: 2;
}
ol.steps li.step9 {
  z-index: 1;
}
ol.steps li.step10 {
  z-index: 0;
}
