.stepcontainer {
  width: 100%;
}

.stepstep {
  padding: 10px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}

.stepvstepper {
  position: relative;
  padding-top: 5px;
}


.stepstep .stepcircle {
  background-color: white;
  border: 3px solid gray;
  border-radius: 100%;
  width: 25px;   
  height: 25px;  
  display: inline-block;  
}

.stepstep .stepline {
  top: 25px;
  left: 11px;
  height: 100%;    
  position: absolute;
  border-left: 3px solid gray;
}

.stepstep.stepcompleted .stepcircle {  
  background-color: #605E3E;
  border-color: #605E3E;
}

.stepstep.stepcompleted .stepline {
  border-left: 3px solid #605E3E;
}

.stepstep.stepactive .stepcircle {
visibility: visible;
  border-color: rgb(6,150,215);
}

.stepstep.stepempty .stepcircle {
    visibility: hidden;
}

.stepstep.stepempty .stepline {
  top: 0;
  height: 150%;
}


.stepstep:last-child .stepline {
  border-left: 3px solid white;
  z-index: -1; 
}

.stepcontent {
  margin-left: 20px;
  display: inline-block;
  font-size: 1.25rem;
  font-weight: 300;

}

.stepcontent a.hover,.stepcontent a.visited,.stepcontent a {
	color: #ffffff;
}