:root{--step_border_width:1px;--step_border_color:#d3d3d3;--step_active_color:#f5ebe1;--step_default_color:#fff;--step_border_parent_width:30px}.progress-container{display:flex;align-items:center;justify-content:center}.step-container{display:flex;align-items:center;position:relative;z-index:1;background-size:100% 100%;margin-right:-5px;height:100px;width:auto}.step-progress{min-height:28px;position:relative;padding:18px 30px;background-color:var(--step_default_color);border:var(--step_border_width) solid var(--step_border_color);text-align:center;z-index:2}.step-progress-wrap{display:flex;flex-direction:row;align-items:center;justify-content:center;margin-left:20px}.step-progress.active{border-color:var(--step_border_color)}.step-progress .step-icon{color:#f0ad4e;margin-right:10px}.step-progress .step-icon,.step-progress .step-label{font-size:16px;font-weight:700}.step-container:not(:last-child) .step-progress{border-right:0}.triangle-wrapper{position:relative;height:100%;width:var(--step_border_parent_width);display:flex;justify-content:center;align-items:center}.triangle-wrapper svg{height:100%;width:100%}.step-number{padding:5px;width:20px;height:20px;background-color:#fff;color:#000;font-weight:700;font-size:16px;border-radius:50%;margin-right:10px;display:flex;justify-content:center;align-items:center}.step_one{z-index:3}.step_two{z-index:2;left:calc(-1 * var(--step_border_parent_width))}.step_two .step-progress{border-left:0;padding-left:calc(var(--step_border_parent_width))}.step_two .step-icon{margin-left:20px}.step_three{z-index:1;left:calc(-2 * var(--step_border_parent_width))}.step_three .step-progress{border-left:0;border-right:0;padding-left:calc(var(--step_border_parent_width))}.step_three .step-icon{margin-left:20px}.step-container.active_step .step-progress{background-color:var(--step_active_color)}.step-container.active_step svg path{fill:var(--step_active_color)}.step-container svg path{fill:var(--step_default_color)}.step-container .step-icon{display:none}.step-container.completed .step-icon{display:block}.step-container.completed .step-number{display:none}.step-container.need_to_complete .step-number{display:flex}.step-container.need_to_complete .step-icon{display:none}@media (max-width:600px){.progress-container{padding-left:calc(2*var(--step_border_parent_width))}.step-progress .step-label{display:none}.step-icon,.step-number{height:22px}}