Ubuntu

­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­ .multi-steps > li.is-active:before, .multi-steps > li.is-active ~ li:before { /*content: counter(stepNum);*/ content:"\00a0\00a0"; font-family: inherit; font-weight: 700; } .multi-steps > li.is-active:after, .multi-steps > li.is-active ~ li:after { background-color: #ededed; } .multi-steps { display: table; table-layout: fixed; width: 100%; } .multi-steps > li { counter-increment: stepNum; text-align: center; display: table-cell; position: relative; color: #245ba5; font-weight: 700; font-size: 0.9em; } .multi-steps > li:before { content: '\f00c'; content: '\2713;'; content: '\10003'; content: '\10004'; content: '\2713'; display: block; margin: 0 auto 4px; background-color: #fff; width: 28px; height: 28px; line-height: 32px; text-align: center; font-weight: bold; border-width: 4px; border-style: solid; border-color: #245ba5; background-color: #245ba5; border-radius: 50%; } .multi-steps > li:after { content: ''; height: 4px; width: 100%; background-color: #245ba5; position: absolute; top: 13px; left: 50%; z-index: -1; } .multi-steps > li:last-child:after { display: none; } .multi-steps > li.is-active:before { background-color: #fff; border-color: #245ba5; } .multi-steps > li.is-active ~ li { color: #245ba5; } .multi-steps > li.is-active ~ li:before { border-width: 4px; background-color: #fff; border-color: #ededed; }