90 lines
		
	
	
		
			1.6 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
			
		
		
	
	
			90 lines
		
	
	
		
			1.6 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
| .column-row {
 | |
|   width: 22.222222em;
 | |
| }
 | |
| 
 | |
| .column-container {
 | |
|   display: flex;
 | |
|   flex-direction: column;
 | |
|   align-items: center;
 | |
| }
 | |
| 
 | |
| .progress-bar {
 | |
|   height: 0;
 | |
|   border: solid 1px #5bc17f;
 | |
|   display: flex;
 | |
|   justify-content: space-between;
 | |
|   align-items: center;
 | |
|   width: 22em;
 | |
|   margin: 1.388888889em auto;
 | |
| }
 | |
| 
 | |
| .greenlock-logo-badge > img {
 | |
|   width: 100%;
 | |
| }
 | |
| 
 | |
| .greenlock-logo-badge {
 | |
|   display: inline-block;
 | |
|   border: solid 1px #d9d9d9;
 | |
|   border-radius: 500px;
 | |
|   width: 5.333333333em;
 | |
|   height: 5.333333333em;
 | |
|   margin-top: 4.277777778em;
 | |
| }
 | |
| 
 | |
| .column-row {
 | |
|   text-align: center;
 | |
| }
 | |
| 
 | |
| .progress-bar-step {position: relative;margin: -0.722222222em -0.166666667em;display: inline-block;background-color: white;/* border-radius: 100%; */padding: 0 0.111111em;}
 | |
| 
 | |
| .progress-bar-step > .circle {
 | |
|   content: "";
 | |
|   display: inline-block;
 | |
|   border: solid 0.111111111em #5bc17f;
 | |
|   width: 0.888888889em;
 | |
|   height: 0.888888889em;
 | |
|   border-radius: 100%;
 | |
|   background: white;
 | |
| }
 | |
| 
 | |
| .progress-step-label {
 | |
|   text-align: center;
 | |
|   position: absolute;
 | |
|   left: 50%;
 | |
|   =: block
 | |
|   font-size:;
 | |
|   top: 139%;
 | |
|   font-size: 0.722222222em;
 | |
|   white-space: nowrap;
 | |
| }
 | |
| 
 | |
| .progress-step-label > div {
 | |
|   position: relative;
 | |
|   right: 50%;
 | |
| }
 | |
| 
 | |
| body {
 | |
|   font-size: 18px;
 | |
|   font-family: Source Sans Pro, sans-serif;
 | |
|   margin: 0;
 | |
|   line-height: 1.33;
 | |
| }
 | |
| 
 | |
| .greenlock-name {
 | |
|   color: #808080;
 | |
| }
 | |
| 
 | |
| .js-progress-step-complete > .circle, .js-progress-step-started > .circle {
 | |
|     background-color: #5bc17f;
 | |
| }
 | |
| 
 | |
| .progress-bar-step.js-progress-step-complete svg {
 | |
|     fill: white;
 | |
|     /* stroke: none; */
 | |
|     display: initial;
 | |
| }
 | |
| 
 | |
| svg {
 | |
| }
 | |
| 
 | |
| .js-progress-step-complete > .circle {} |