.activity-list>li {
    position: relative;
    padding: 10px 0 10px 25px
}

.activity-list>li:after,
.activity-list>li:before {
    position: absolute;
    content: ""
}

.activity-list>li:before {
    left: 5px;
    top: 0;
    height: 100%;
    border-left: 2px dashed #eff2f7
}

.activity-list>li:after {
    left: 0;
    top: 14px;
    height: 12px;
    width: 12px;
    border-radius: 50%;
    border: 2px solid #9a9a9a;
    background-color: #fff
}

.activity-list>li.activity-purple:after {
    border-color: #8e23e0
}

.activity-list>li.activity-danger:after {
    border-color: #e5343d
}

.activity-list>li.activity-warning:after {
    border-color: #ffb61e
}

.activity-list>li.activity-primary:after {
    border-color: #0667d6
}