.tpt-steps{display:flex;flex-wrap:wrap;list-style:none;justify-content:space-between;padding:0;counter-reset:step}.tpt-steps li{flex:1 1;display:flex;flex-direction:column;text-align:center}.tpt-steps li.clickable{cursor:pointer}.tpt-steps li p{margin-top:.1rem;font-size:1rem;color:gray}.tpt-steps li.passed:before{background:#fff;border:1px solid red;color:red}.tpt-steps li:before{--size:3rem;content:counter(step);counter-increment:step;line-height:var(--size);border-radius:50%;width:var(--size);height:var(--size);display:block;text-align:center;margin:.5rem auto 0;position:relative;z-index:1;color:#fff;background:red;border:1px solid red}.tpt-steps li:not(:last-child):after{content:"";position:relative;width:100%;height:2px;background-color:red;left:calc(50% + .5rem + 2px);width:calc(100% - .5rem - 4px);top:-5.6rem;z-index:-1}@media only screen and (min-width:360px)and (max-width:641px){.tpt-steps li p{margin-top:.1rem;font-size:.8rem;color:gray}.tpt-steps li:before{--size:2.6rem}.tpt-steps li:not(:last-child):after{top:-5.2rem}}@media only screen and (min-width:642px)and (max-width:1023px){.tpt-steps li:not(:last-child):after{top:-5.6rem}}