.fishbone-container{overflow:auto;padding:20px 0}.fishbone-container .fishbone-content{position:relative;min-width:300px}.fishbone-container .fishbone-content.fishbone--horizontal{white-space:nowrap}.fishbone-container .fishbone-content.fishbone--horizontal .fishbone-backbone--inner{height:2px;top:0;left:0;right:10px}.fishbone-container .fishbone-content.fishbone--horizontal .fishbone-backbone--inner .fishbone-backbone--progress{height:2px}.fishbone-container .fishbone-content .fishbone-backbone{position:relative}.fishbone-container .fishbone-content .fishbone-backbone .fishbone-backbone--inner{position:absolute;border-color:inherit;background-color:#c0c4cc}.fishbone-container .fishbone-content .fishbone-backbone .fishbone-backbone--inner:before{content:" ";position:absolute;height:20px;width:20px;top:-9px;border-radius:50%;background:teal}.fishbone-container .fishbone-content .fishbone-backbone .fishbone-backbone--inner:after{content:" ";position:absolute;right:-1px;top:-19px;border-bottom:20px solid transparent;border-top:20px solid transparent;border-left:20px solid #c0c4cc}.fishbone-container .fishbone-content .fishbone-backbone .fishbone-backbone--inner.is-finish:after{border-left-color:teal}.fishbone-container .fishbone-content .fishbone-backbone .fishbone-backbone--inner .fishbone-backbone--progress{background-color:teal}.fishbone{position:absolute}.fishbone.is-horizontal{display:inline-block}.fishbone .fishbone-branch{position:relative;height:100%;box-sizing:border-box}.fishbone .fishbone-branch .fishbone-branch--label{height:36px;line-height:36px;text-align:center}.fishbone .fishbone-branch .fishbone-branch--label .fishbone-branch--text{display:inline-block;box-sizing:border-box;border:1px solid #c0c4cc;border-radius:4px;padding:0 5px;height:36px;line-height:36px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fishbone .fishbone-branch .fishbone-branch--line{position:relative;height:calc(100% - 36px);width:2px;margin-left:50%;background-color:#c0c4cc}.fishbone .fishbone-branch .fishbone-branch--description{position:absolute;bottom:10px;left:55%}.fishbone .fishbone-branch:not(.is-bottom) .fishbone-branch--line:after{content:" ";position:absolute;z-index:9;bottom:-6px;height:10px;width:10px;border-radius:50%;margin-left:-4px;background:#c0c4cc}.fishbone .fishbone-branch:not(.is-bottom) .fishbone-branch--description{bottom:5px}.fishbone .fishbone-branch.is-bottom .fishbone-branch--line:before{content:" ";position:absolute;z-index:9;top:-4px;height:10px;width:10px;border-radius:50%;margin-left:-4px;background:#c0c4cc}.fishbone .fishbone-branch.is-bottom .fishbone-branch--description{top:5px}.fishbone .fishbone-branch.is-warning .fishbone-branch--text{border-color:#f78c1b;background-color:#f78c1b;color:#fff}.fishbone .fishbone-branch.is-warning .fishbone-branch--line,.fishbone .fishbone-branch.is-warning .fishbone-branch--line:after,.fishbone .fishbone-branch.is-warning .fishbone-branch--line:before{background-color:#f78c1b}.fishbone .fishbone-branch.is-warning .fishbone-branch--description{color:#f78c1b}.fishbone .fishbone-branch.is-danger .fishbone-branch--text{border-color:#d33f3f;background-color:#d33f3f;color:#fff}.fishbone .fishbone-branch.is-danger .fishbone-branch--line,.fishbone .fishbone-branch.is-danger .fishbone-branch--line:after,.fishbone .fishbone-branch.is-danger .fishbone-branch--line:before{background-color:#d33f3f}.fishbone .fishbone-branch.is-danger .fishbone-branch--description{color:#d33f3f}.fishbone .fishbone-branch.is-finish .fishbone-branch--text{border-color:teal;background-color:teal;color:#f1f1f1}.fishbone .fishbone-branch.is-finish .fishbone-branch--line,.fishbone .fishbone-branch.is-finish .fishbone-branch--line:after,.fishbone .fishbone-branch.is-finish .fishbone-branch--line:before{background-color:teal}.fishbone .fishbone-branch.is-finish .fishbone-branch--description{color:teal}.fishbone-module-container .refresh-tag{position:absolute;right:10px}.fishbone-module-container .fishbone-item-slot-demo{transform:translateX(-49px)}.fishbone-module-container .fishbone-item-slot-demo>div{display:inline-block}.fishbone-module-container .fishbone-item-slot-demo>div:first-child{text-align:right;margin-left:0;padding-right:5px}.fishbone-module-container .fishbone-item-slot-demo>div:not(:first-child){padding-left:5px}.fishbone-module-container .fishbone-item-slot-demo>div>div{font-size:14px;direction:rtl;width:36px}.fishbone-module-container .fishbone-item-slot-demo>div>div.is-empty{text-align:center}