.cmv-progress {
    color: white;
    background-color: #333;
    border-bottom: 2px solid #ccc;
}

h5.cmv-title {
    font-size: 1.1em;
    padding: 1em 1em 5px;
}

.cmv-container {
    display:flex;
    position:relative;
    width:90%;
    margin:auto;
    height:100px;
}

.cmv-step {
    position: relative;
    width: 36px;
    height: 36px;
    background-color: #ccc;
    color: black;
    z-index: 5;
    border-radius: 50%;
    line-height: 36px;
    text-align: center;
}

.cmv-step.fait, .cmv-step.active {
    background-color: #06a6b7;
}

.cmv-step.active:before {
    content: "";
    position: absolute;
    display: block;
    background-color: white;
    margin: 15%;
    width: 70%;
    height: 70%;
    border-radius: 50%;
    z-index: -15;
}

.cmv-way {
    position: relative;
    flex: 1;
}

.cmv-way.fait:before {
    background-color: #06a6b7;
}

.cmv-way:before {
    content: "";
    display: block;
    width: 120%; height: 1px;
    margin-left: -10%;
    margin-top: 17px;
    background-color: #eee;
}

.cmv-fixed:before {
    content: "";
    width:1px; height: 7px;
    background-color: white;
    position: absolute;
    top:42px;
    left: 18px;
}

.cmv-fixed {
    color: white;
    width: 100%;
    margin-top: 2px;
}

.cmv-relative {
    content: "52m";
    position: absolute;
    color: white;
    text-align: center;
    width: 100%;
    top: -10px;
}